huoran
/
FE_middlePlatform_server
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 15 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
378 Commits
13 Branches
21 Tags
18 MiB
 
 
 
 
 
Tag: Branch: Tree: 3e17c1b5bd
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '3e17c1b5bd'
${ noResults }
FE_middlePlatform_server/src/views/order/AddOrder.vue

3143 lines
133 KiB
Raw Blame History

<template>
<div v-loading="loading">
<!-- 订单详情 -->
<div v-show="!showSelectClient">
<el-row :gutter="20">
<el-col :span="24">
<el-card shadow="hover"
class="mgb20">
<div class="flex-between">
<div class="per_title"
v-preventReClick
@click="goBack()">
<i class="el-icon-arrow-left"></i>
<span class="per_back">返回</span>
<span class="per_school">{{ titlesw }}</span>
</div>
<el-button v-if="!viewDisabled"
type="primary"
round
class="mag"
v-preventReClick
@click="submitOrder">确定
</el-button>
</div>
</el-card>
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-center mgb20 user_header">
<p class="addhr_tag"></p>
<span>基本信息</span>
</div>
<div>
<el-form class="info"
ref="form"
:model="form"
:rules="rules"
label-width="120px">
<el-col :span="6"
:offset="5">
<el-form-item label="订单编号">
<el-input v-model="form.orderNumber"
disabled
placeholder="自动生成"></el-input>
</el-form-item>
<el-form-item label="订单时间"
prop="createTime">
<el-date-picker disabled
style="width:100%"
v-model="form.createTime"
type="date"
placeholder="自动生成">
</el-date-picker>
</el-form-item>
<el-form-item label="省份">
<el-select disabled
v-model="form.provinceId"
clearable
placeholder="请选择省份"
@change="getCity"
@clear="clearprovince()">
<el-option v-for="(item,index) in provinceList"
:key="index"
:label="item.provinceName"
:value="item.provinceId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="联系人">
<el-input disabled
v-model="form.orderContact"
placeholder="请输入联系人姓名"></el-input>
</el-form-item>
<el-form-item label="邮箱">
<el-input disabled
v-model="form.email"
placeholder="请输入邮箱地址"></el-input>
</el-form-item>
<el-form-item label="团队">
<el-select :disabled="viewDisabled"
v-model="form.teamId"
filterable
placeholder="请选择团队"
@change="teamChange">
<el-option v-for="(item, i) in teams"
:key="i"
:label="item.partnerClassificationName"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6"
:offset="2">
<el-form-item prop="customerName"
label="订单客户">
<div v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
@click="gotoClient"
style="cursor: pointer">
<el-input v-model="form.customerName"
placeholder="请选择客户"></el-input>
</div>
<el-input v-if="viewDisabled||editDisabled||renewDisabled"
disabled
v-model="form.customerName"
placeholder="请选择客户"></el-input>
</el-form-item>
<el-form-item prop="orderType"
label="订单类型">
<el-select :disabled="viewDisabled"
v-model="form.orderType"
clearable
placeholder="请选择订单类型"
@change="updateOrderType">
<el-option v-for="(item,index) in orderTypeList"
:key="index"
:label="item.name"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="城市">
<el-select disabled
v-model="form.cityId"
placeholder="请选择">
<el-option v-for="(item,index) in cityList"
:key="index"
:label="item.cityName"
:value="item.cityId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="电话">
<el-input disabled
v-model="form.phone"
placeholder="请输入电话号码"
maxlength="11"></el-input>
</el-form-item>
<el-form-item label="订单金额(元)"
prop="orderAmount">
<el-input disabled
oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
type="number"
v-model="form.orderAmount"
placeholder="请输入订单金额"></el-input>
</el-form-item>
<el-form-item label="商务经理">
<el-input v-if="form.businessManagerName"
disabled
v-model="form.businessManagerName"></el-input>
<el-select v-else
:disabled="viewDisabled || !form.teamId"
v-model="form.businessManagerId"
clearable
filterable
placeholder="请选择商务经理">
<el-option v-for="(item, i) in bmList"
:key="i"
:label="item.userName"
:value="item.partnerId"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-form>
</div>
</div>
</el-card>
<!-- 课程 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实训课程产品权限</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && coursePermissions.length))">
<el-button v-if="coursePermissions.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 0)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 0)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
@click="addCourseJurisdiction(1)">添加</el-button>
</div>
</div>
<el-table :data="coursePermissions"
class="orderTable"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="150"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="110">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.marketValue"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="折扣率 "
align="center"
min-width="110">
<template slot-scope="scope">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"
size="small"
style="width: 100%"></el-input>
</template>
</el-table-column>
<el-table-column label="成交价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
@change="[allAmount($event,scope.row),calculateDiscountCourse($event,scope.row)]"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="端口地址 "
align="center"
min-width="100">
<template slot-scope="scope">
<el-button @click="configure(scope.row)">配置</el-button>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="180">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delCourseForm(scope.$index, scope.row)"
style="margin-right:10px;">删除</el-button>
<!-- 1: 未生效，2：生效中，3：已过期 -->
<!--
1、查看时不可操作
2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
3、处理中的订单显示发货，不显示禁用
-->
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd "
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
:disabled="viewDisabled"
@change="handleDeliver($event,scope.row,0)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,0)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 理论课程 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>理论课程产品权限</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && theoryCourseList.length))">
<el-button v-if="theoryCourseList.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 5)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 5)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
@click="addCourseJurisdiction(2)">添加</el-button>
</div>
</div>
<el-table :data="theoryCourseList"
class="orderTable"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="150"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="110">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.marketValue"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="折扣率 "
align="center"
min-width="110">
<template slot-scope="scope">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"
size="small"
style="width: 100%"></el-input>
</template>
</el-table-column>
<el-table-column label="成交价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
@change="[allAmount($event,scope.row),calculateDiscountCourse($event,scope.row)]"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="端口地址 "
align="center"
min-width="100">
<template slot-scope="scope">
<el-button @click="configure(scope.row)">配置</el-button>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="180">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delCourseDataForm(scope.$index, scope.row)"
style="margin-right:10px;">删除</el-button>
<!-- 1: 未生效，2：生效中，3：已过期 -->
<!--
1、查看时不可操作
2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
3、处理中的订单显示发货，不显示禁用
-->
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd "
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
:disabled="viewDisabled"
@change="handleDeliver($event,scope.row,5)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,5)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 数据平台权限 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>数据前瞻产品权限</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && dataPlatformPermissions.length))">
<el-button v-if="dataPlatformPermissions.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 1)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 1)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
class="mag"
@click="addCourseJurisdiction(5)">添加</el-button>
</div>
</div>
<!--:summary-method="getSummaries"-->
<el-table :data="dataPlatformPermissions"
class="orderTable orderTables"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="100">
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<span style="margin-left:5px">
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</span>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="120">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场单价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.marketValue"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">元&nbsp;/&nbsp;账号</span>
</div>
</template>
</el-table-column>
<el-table-column label="成交单价"
align="center"
min-width="180">
<template slot-scope="scope">
<div class="small">
<el-input :class="scope.row.finalValue === '' && whetherSubmit?'red':''"
:disabled="viewDisabled"
@input="scope.row.finalValue = scope.row.finalValue.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
@change="[dealComputers($event,scope.row),calculateDiscount($event,scope.row)]"
v-model="scope.row.finalValue"
type="text"></el-input>
<span style="margin-left:5px">元&nbsp;/&nbsp; 账号</span>
</div>
</template>
</el-table-column>
<el-table-column label="折扣率"
align="center"
min-width="140">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"></el-input>
</div>
</template>
</el-table-column>
<el-table-column label="账号数"
align="center"
min-width="120">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', !scope.row.accountNum&&whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.accountNum = scope.row.accountNum.replace(/[^0-9.]/g,'')"
v-model="scope.row.accountNum"
@change="[dealComputers($event,scope.row)]"
type="text"></el-input>
</div>
</template>
</el-table-column>
<!-- 金额自动计算，计算方式：账号数*成交价，且可以手动修改，保留两位小数 -->
<el-table-column label="成交价"
align="center"
min-width="160">
<template slot-scope="scope">
<div class="small">
<el-input style="width: 80%"
:class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@blur="[allAmount($event,scope.row),dealFinalValue($event,scope.row)]"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="160">
<template slot-scope="scope">
<div class="small">
<el-input style="width: 80%"
:class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="180">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delDataForm(scope.$index, scope.row)"
style="margin-right:10px;">删除</el-button>
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd"
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
@change="handleDeliver($event,scope.row,1)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,1)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 职站增值模块权限 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>职站增值应用产品权限</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && valuePermissions.length))">
<el-button v-if="valuePermissions.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 2)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 2)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
class="mag"
@click="addCourseJurisdiction(3)">添加</el-button>
</div>
</div>
<!--:summary-method="getSummaries"-->
<el-table :data="valuePermissions"
class="orderTable orderTables"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="100">
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<span style="margin-left:5px">
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</span>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="120">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.marketValue"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="折扣率 "
align="center"
min-width="110">
<template slot-scope="scope">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"
size="small"
style="width: 100%"></el-input>
</template>
</el-table-column>
<el-table-column label="成交价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="180">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delDataFormList(scope.$index, scope.row)"
style="margin-right:10px;">删除</el-button>
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd"
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
@change="handleDeliver($event,scope.row,2)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,2)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 实训课程 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实训课程（非集成）</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && practicalCourses.length))">
<el-button v-if="practicalCourses.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 3)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 3)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
class="mag"
@click="addCourseJurisdiction(4)">添加</el-button>
</div>
</div>
<!--:summary-method="getSummaries"-->
<el-table :data="practicalCourses"
class="orderTable orderTables"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="150"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="110">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.marketValue"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="折扣率 "
align="center"
min-width="110">
<template slot-scope="scope">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"
size="small"
style="width: 100%"></el-input>
</template>
</el-table-column>
<el-table-column label="成交价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
@change="[allAmount($event,scope.row),calculateDiscountCourse($event,scope.row)]"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="250">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button style="margin-right: 10px;"
type="text"
@click="showShip(scope.row)">{{ viewDisabled ? '' : '编辑' }}发货内容</el-button>
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delPracticalCourses(scope.$index, scope.row)"
style="margin: 0 10px;">删除</el-button>
<!-- 1: 未生效，2：生效中，3：已过期 -->
<!--
1、查看时不可操作
2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
3、处理中的订单显示发货，不显示禁用
-->
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd "
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
:disabled="viewDisabled"
@change="handleDeliver($event,scope.row,3)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,3)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 实验工具 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-between mgb20 user_header">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验工具</span>
</div>
<div>
<!-- 处理中 || 有未生效的课程 || （新增订单 && 有课程） -->
<template v-if="!viewDisabled && (dispose || (isAdd && expTools.length))">
<el-button v-if="expTools.find(e => !e.ship)"
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(1, 4)">一键发货</el-button>
<el-button v-else
v-auth="'/order:发货'"
type="primary"
round
@click="batchDeliver(0, 4)">取消全部发货</el-button>
</template>
<el-button v-if="!viewDisabled&&!editDisabled&&!renewDisabled"
type="primary"
round
class="mag"
@click="addCourseJurisdiction(6)">添加</el-button>
</div>
</div>
<!--:summary-method="getSummaries"-->
<el-table :data="expTools"
class="orderTable orderTables"
stripe
header-align="center">
<el-table-column type="index"
width="60"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"
min-width="150"
show-overflow-tooltip>
</el-table-column>
<el-table-column label="使用期限"
align="center"
min-width="190">
<template slot-scope="scope">
<div class="small">
<el-input class="time-input"
:class="!scope.row.periodOfUse&&whetherSubmit?'red':''"
:disabled="viewDisabled||editDisabled"
maxlength="4"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
@input="scope.row.periodOfUse = scope.row.periodOfUse.replace(/[^0-9.]/g,'')"
v-model="scope.row.periodOfUse"
placeholder="输入时间"></el-input>
<el-select class="time-select"
v-model="scope.row.options"
:disabled="viewDisabled||editDisabled"
placeholder="请选择"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)">
<el-option label="日"
:value="0"></el-option>
<el-option label="月"
:value="1"></el-option>
<el-option label="年"
:value="2"></el-option>
</el-select>
</div>
</template>
</el-table-column>
<el-table-column label="起止日期"
align="center"
min-width="240">
<template slot-scope="scope">
<p v-if="!scope.row.startTime">
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
</p>
<p v-else>
<el-date-picker :class="orderRepeat.includes(scope.row.dataOrCourseId) ? 'red' : ''"
style="width:130px"
v-model="scope.row.startTime"
type="date"
:disabled="viewDisabled||editDisabled"
@change="deadLine(scope.row.periodOfUse,scope.row,scope.row.options, 1)"
placeholder="请选择使用日期">
</el-date-picker>
<span v-if="scope.row.startTime"><span v-if='scope.row.endTime'> - </span>{{ scope.row.endTime }}</span>
</p>
</template>
</el-table-column>
<el-table-column label="剩余期限"
align="center"
min-width="110">
<template slot-scope="scope">
<div class="small">
<el-input disabled
v-model="scope.row.remainingPeriod"
placeholder=""
type="text"></el-input>
<span style="margin-left:5px">天</span>
</div>
</template>
</el-table-column>
<el-table-column label="市场价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input class="normal"
disabled
v-model="scope.row.marketValue"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="折扣率 "
align="center"
min-width="110">
<template slot-scope="scope">
<el-input class="normal"
disabled
v-model="scope.row.discountRate"
placeholder=""
type="text"
size="small"
style="width: 100%"></el-input>
</template>
</el-table-column>
<el-table-column label="成交价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.finalPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.finalPrice = scope.row.finalPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
@change="[allAmount($event,scope.row),calculateDiscountCourse($event,scope.row)]"
v-model="scope.row.finalPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="结算价"
align="center"
min-width="170">
<template slot-scope="scope">
<div class="small">
<el-input :class="['normal', scope.row.settlementPrice === '' && whetherSubmit?'red':'']"
:disabled="viewDisabled"
@input="scope.row.settlementPrice = scope.row.settlementPrice.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="scope.row.settlementPrice"
type="text"></el-input> 元
</div>
</template>
</el-table-column>
<el-table-column label="操作"
align="center"
width="250">
<template slot-scope="scope">
<div class="flex-c-c">
<el-button style="margin-right: 10px;"
type="text"
@click="showShip(scope.row)">{{ viewDisabled ? '' : '编辑' }}发货内容</el-button>
<el-button v-if="!editDisabled&&!viewDisabled"
type="text"
@click="delExpTool(scope.$index, scope.row)"
style="margin-right:10px;">删除</el-button>
<!-- 1: 未生效，2：生效中，3：已过期 -->
<!--
1、查看时不可操作
2、发货和启用不要同时出现，生效前只会显示发货不发货按钮，生效后只显示禁启用按钮
3、处理中的订单显示发货，不显示禁用
-->
<el-switch v-if="scope.row.ship === 0 || dispose || isAdd "
v-auth="'/order:发货'"
style="margin-right:10px;"
v-model="scope.row.ship"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.ship ? '已发货' : '未发货'"
:disabled="viewDisabled"
@change="handleDeliver($event,scope.row,4)">
</el-switch>
<el-switch v-else
:disabled="viewDisabled"
v-model="scope.row.isEnable"
:active-value="1"
:inactive-value="0"
:active-text="scope.row.isEnable ? '启用' : '禁用'"
@change="handleEnable($event,scope.row,4)">
</el-switch>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-card>
<!-- 合同 -->
<el-card shadow="hover"
class="mgb20">
<div>
<div class="flex-center mgb20 user_header">
<p class="addhr_tag"></p>
<span>合同信息</span>
</div>
<div>
<el-form :disabled="viewDisabled"
ref="contract"
:model="contract"
:rules="rules"
label-width="80px">
<el-col :span="8"
:offset="4">
<el-form-item label="合同名称">
<el-input v-model="contract.contractName"
placeholder="请输入合同名称"></el-input>
</el-form-item>
<el-form-item label="合同金额"
prop="contractInformationSum">
<el-input oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"
v-model="contract.contractMoney"
placeholder="请输入合同金额"></el-input>
</el-form-item>
</el-col>
<el-col :span="8"
:offset="2">
<el-form-item label="合同编号">
<el-input v-model="contract.contractNumber"
placeholder="请输入合同编号"></el-input>
</el-form-item>
<el-form-item label="合同期限">
<div class="contractDate">
<el-date-picker v-model="contractTime"
style="wifth:100%"
type="daterange"
value-format="yyyy-MM-dd"
@change="contractTimeChange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
</el-col>
<el-col :span="24"
:offset="4"
class="flex-start">
<el-form-item label="上传合同">
<el-upload class="contract"
:headers="{token}"
:on-remove="handleRemove"
:on-error="uploadError"
:on-success="uploadSuccess"
:before-upload="beforeAvatarUpload"
:before-remove="beforeRemove"
:limit="1"
:on-exceed="handleExceed"
:action="api.fileupload"
:file-list="uploadList">
<el-button size="medium"
type="plain"
class="uploadTitle">上传</el-button>
</el-upload>
</el-form-item>
<!-- <el-form-item>
<el-button size="medium" type="plain" style="height:40px">重新上传</el-button>
</el-form-item> -->
</el-col>
</el-form>
</div>
</div>
</el-card>
</el-col>
</el-row>
<!-- 选择课程弹框-->
<el-dialog :visible.sync="practicalCourseVisible"
width="50%"
center
:close-on-click-modal="false"
@close="closeJCourse">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>{{ classificationId | dialogTitle}}</span>
</div>
<div>
<el-input placeholder="请输入产品名称"
prefix-icon="el-icon-search"
v-model.trim="practicalCourseName"
clearable></el-input>
</div>
</div>
<el-table v-loading="dataLoading"
:data="practicalCourseList"
stripe
header-align="center"
@selection-change="practicalCoursesSelection"
row-key="mallId">
<el-table-column type="selection"
:selectable="practicalCoursesSelectable"
width="55"
align="center"></el-table-column>
<el-table-column type="index"
width="100"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="productName"
label="产品名称"
align="center"></el-table-column>
<el-table-column prop="typeName"
label="产品类型"
align="center"></el-table-column>
<el-table-column prop="supplierName"
label="厂商"
align="center"></el-table-column>
<el-table-column prop="professionalClassName"
label="专业类"
align="center"></el-table-column>
<el-table-column prop="professionalName"
label="专业"
align="center"></el-table-column>
</el-table>
<div class="pagination">
<el-pagination background
layout="total, prev, pager, next"
:total="practicalCourseTotals"
@current-change="practicalCoursesChange"
:current-page="practicalCoursePage">
</el-pagination>
</div>
<span slot="footer"
class="dialog-footer">
<el-button @click="practicalCourseVisible = false">取 消</el-button>
<el-button type="primary"
v-preventReClick
@click="practicalCourseSubmit">确 定</el-button>
</span>
</el-dialog>
<!-- 选择IP -->
<el-dialog :visible.sync="ipVisible"
width="70%"
center>
<div class="flex-center mgb20">
<p class="hr_tag"></p>
<span>地址列表</span>
</div>
<el-table :data="IPData"
stripe
header-align="center">
<el-table-column type="index"
width="100"
label="序号"
align="center">
</el-table-column>
<el-table-column prop="age"
label="服务器名称"
align="center">
</el-table-column>
<el-table-column label="IP"
align="center">
<template slot-scope="scope">
<div class="tab_temp">
<div class="flex-center">
<label>内网:</label>
<el-input v-model="scope.row.Intranet"
placeholder="请输入IP地址"></el-input>
</div>
<div class="flex-center mar10">
<label>外网:</label>
<el-input v-model="scope.row.extranet"
placeholder="请输入端口号"></el-input>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="端口"
align="center">
<template slot-scope="scope">
<div class="tab_temp">
<div class="flex-center">
<label>内网:</label>
<el-input v-model="scope.row.Intranet"
placeholder="请输入内网IP地址"></el-input>
</div>
<div class="flex-center mar10">
<label>外网:</label>
<el-input v-model="scope.row.extranet"
placeholder="请输入外网IP地址"></el-input>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="选择"
align="center">
<template slot-scope="scope">
<i class="el-icon-success radio_icon"></i>
</template>
</el-table-column>
</el-table>
<span slot="footer"
class="dialog-footer">
<el-button @click="ipVisible = false">取 消</el-button>
<el-button type="primary"
@click="IPSure()">确 定</el-button>
</span>
</el-dialog>
</div>
<!-- 选择客户 -->
<select-client ref="client"
@back="backToOrder"
v-show="showSelectClient"
:refresh="showSelectClient"></select-client>
<el-dialog title="发货信息填写"
:visible.sync="shipVisible"
width="380px"
class="ship-dia"
:close-on-click-modal="false">
<el-input :disabled="viewDisabled"
v-model="shipContent"
placeholder="请填写需交付的产品登录地址、账号、密码等内容...（300个字以内）"
type="textarea"
:rows="10"
maxlength="300"></el-input>
<span slot="footer"
class="dialog-footer">
<el-popover v-if="curRow.mallNonAssociatedLinks"
placement="bottom"
width="200"
trigger="click">
<div class="cursor"
v-html="shipInfo"
title="点击复制到文本框"
@click="copyLink"></div>
<el-button type="text"
slot="reference">产品链接</el-button>
</el-popover>
<el-button style="margin-left: 10px"
@click="shipVisible = false">取消</el-button>
<el-button v-if="!viewDisabled"
type="primary"
@click="submitShip">确定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import selectClient from "./selectClient.vue";
export default {
components: {
selectClient
},
data () {
return {
// authority: 权限。0数据平台，1为课程，2职站增值模块，3实训课程（非集成），4实验工具
deliverShow: ['pageTypes', 'dataPageTypes', 'modelPageTypes', 'practiceCourseTypes', 'expToolTypes', 'theoryCourse'],
listName: [
{
id: 1,
name: 'coursePermissions'
},
{
id: 2,
name: 'theoryCourseList'
},
{
id: 3,
name: 'valuePermissions'
},
{
id: 4,
name: 'practicalCourses'
},
{
id: 5,
name: 'dataPlatformPermissions'
},
{
id: 6,
name: 'expTools'
},
],
pageTypes: false,
dataPageTypes: false,
modelPageTypes: false,
practiceCourseTypes: false,
expToolTypes: false,
theoryCourse: false,
loading: false,// 页面加载
isAdd: false, // 是否添加
viewDisabled: false,// 查看禁用
editDisabled: false,// 编辑禁用
renewDisabled: false,// 续费禁用
dataLoading: false,// 产品弹框加载
whetherSubmit: false,/* 提交否 */
dispose: false,
showSelectClient: false,// 切换展示选择客户页
form: {// 基本信息
// orderNumber: '',// 编号
provinceId: "",// 省份id
orderContact: "",// 联系人
email: "",
customerId: "",// 客户id
orderType: "",
cityId: "",
phone: "",
orderAmount: 0,
// orderId: this.$store.state.orderId,
customerName: "",// 客户名称
teamId: '',
businessManagerId: '',
profit: 0, // 利润
purchaseCost: 0, // 采购成本
},
coursePermissions: [],// 课程权限
dataPlatformPermissions: [],// 数据平台权限
valuePermissions: [],
practicalCourses: [],
expTools: [],
contract: { // 合同信息
contractName: "", // 合同名称
contractFile: "", // 合同文件
contractMoney: "", // 合同金额
contractNumber: "",// 合同编号
startTime: "", // 期限-头
endTime: "" // 期限-尾
// orderId: '', // 绑定订单id
},
value1: '',
contractTime: [],// 合同起止日期绑定值
token: "",
orderOther: {// 订单其他数据
},
uploadList: [],
rules: {
orderNumber: [
{ required: true, message: "请输入订单编号", trigger: "blur" }
],
customerName: [
{ required: true, message: "请选择订单客户", trigger: "change" }
],
orderContact: [
{ required: true, message: "请输入联系人姓名", trigger: "blur" }
],
orderType: [
{ required: true, message: "请选择订单类型", trigger: "change" }
],
phone: [
{ required: true, message: "请输入手机号", trigger: "blur" },
{
pattern: /^(?:(?:\+|00)86)?1[3-9]\d{9}$/,
message: "请输入正确的手机号",
trigger: "blur"
}
],
email: [
{ required: true, message: "请输入邮箱地址", trigger: "blur" },
{
pattern: /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
message: "请输入正确的邮箱",
trigger: "blur"
}
],
orderAmount: [
// { pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' }
{ required: true, message: "请输入订单金额", trigger: "blur" }
// { pattern: /(?:^[1-9]([0-9]+)?(?:\.[0-9]{1,2})?$)|(?:^(?:0)$)|(?:^[0-9]\.[0-9](?:[0-9])?$)/, message: '请输入正确金额格式,可保留两位小数', trigger: 'blur'}
]
},
orderTypeList: [{
name: "正式",
value: 1
},
{
name: "试用",
value: 2
}],
provinceList: this.$store.state.provinceList,
cityList: [],
schoolList: [],
teams: [],
bmList: [],
yearList: [
{ name: "1个月", value: 30 },
{ name: "2个月", value: 60 },
{ name: "3个月", value: 90 },
{ name: "1年", value: 365 },
{ name: "2年", value: 730 },
{ name: "3年", value: 1095 }
],
// 课程权限弹框
courseVisible: false,
courseTotals: 0,
coursePage: 1,
courseList: [],
courseSelection: [],
curriculumName: "",
curriculumTypeKeys: {
0: "理论",
1: "实训"
}, // 课程类别
ipVisible: false,
IPData: [
{
id: 1,
age: "小额贷系统",
storeName: "1个月",
total: "2019.01.02 11:00",
payamount: "2019.01.02 11:00",
swtich: true,
Intranet: "10.20.202.1",
extranet: "10.20.202.1"
},
{
id: 2,
age: "小额贷系统",
storeName: "1个月",
total: "2019.01.02 11:00",
payamount: "2019.01.02 11:00",
swtich: true,
Intranet: "",
extranet: ""
}
],
curArr: "",
test: [],
// 数据平台权限弹框
showPlatform: false,// 弹框显示
platfromTotals: 0,// 列表条目
platfromPage: 1,// 页码
platformList: [],// 数据平台列表
platformSelect: [],// 数据平台弹框选中
productName: "",// 搜索产品名称
valueVisible: false,
valueCheck: [],
// 实训课程弹框
practicalCourseVisible: false,// 弹框显示
practicalCourseTotals: 0,// 列表条目
practicalCoursePage: 1,// 页码
practicalCourseList: [],
practicalCourseSelect: [],
practicalCourseName: '',
// 实验工具弹框
expToolVisible: false,// 弹框显示
expToolTotals: 0,// 列表条目
expToolPage: 1,// 页码
expToolList: [],
expToolSelect: [],
expToolName: '',
searchTimer: null,
titlesw: '',
orderRepeat: [],
repeatMsg: '',
clients: [],
valueList: [],
rate: '',
shipVisible: false,
shipContent: '',
shipInfo: '',
curRow: {},
// 用于区分栏目 1实训课程 2理论课程 3职站增值应用 4实训课程（非集成）5数据前瞻 6实验工具
classificationId: 0,
// 理论课程数据
theoryCourseList: []
};
},
watch: {
practicalCourseName (n) {
clearTimeout(this.searchTimer);
this.searchTimer = setTimeout(() => {
this.initCourses();
}, 500);
},
},
async created () {
this.getTeam()
this.getClients()
this.token = sessionStorage.getItem("token");
// 处理添加状态
if (this.$route.query.val == 'isAdd') {
this.titlesw = '新建订单'
this.isAdd = true;
this.getCityData();// 取得城市
}
// 处于查看状态
if (this.$route.query.val == 'watch') {
this.titlesw = '查看订单'
this.viewDisabled = true;
await this.getDetail(this.$route.query.orderId);
}
// 处于编辑状态
if (this.$route.query.val == 'edit') {
if (this.$route.query.orderStatus == 0) {
this.titlesw = '处理订单'
this.dispose = true;
} else {
this.titlesw = '修改订单'
}
this.editDisabled = true;
await this.getDetail(this.$route.query.orderId);
}
/* 处于续费状态 */
if (this.$route.query.val == 'renew') {
this.titlesw = '订单续费'
this.renewDisabled = true;
await this.getDetail(this.$route.query.orderId);
}
},
methods: {
// 读取页面详情
getDetail (id) {
this.$get(this.api.orderDetail, { orderId: +id }).then(res => {
let form = res.orderDetails.order;// 基本信息
let contract = res.orderDetails.contractInformation ? res.orderDetails.contractInformation : {}; // 合同
if (this.renewDisabled) { // 续费状态下，清空上个订单合同信息
this.contract = {
contractName: "",
contractFile: "",
contractMoney: "",
contractNumber: "",
startTime: "",
endTime: ""
};
} else {
this.contract = {
contractName: contract.contractName,
contractMoney: contract.contractMoney,
contractNumber: contract.contractNumber,
startTime: contract.startTime ? contract.startTime : "",
endTime: contract.endTime ? contract.endTime : "",
contractId: contract.contractId,
uploadList: {
name: contract.contractFile ? contract.contractFile.split("/").pop() : "",
url: contract.contractFile
}
};
if (contract.startTime && contract.endTime) {
this.contractTime = [contract.startTime, contract.endTime];
}
}
this.form = {
orderNumber: form.orderNumber,
createTime: form.createTime,
provinceId: form.provinceId,
orderContact: form.orderContact,
email: form.email,
customerId: form.customerId,
customerName: form.customerName,
orderType: form.orderType,
cityId: form.cityId,
phone: form.phone,
orderAmount: form.orderType === 2 ? 0 : form.orderAmount, // 如果是试用的订单，则订单金额显示为0
orderId: form.orderId,
options: form.options,
teamId: form.teamId,
profit: form.profit,
purchaseCost: form.purchaseCost,
businessManagerId: form.businessManagerId ? +form.businessManagerId : '',
businessManagerName: form.businessManagerName
};
this.$nextTick(() => {
form.provinceId && this.getCityData()
form.teamId && this.getBm()
});
const { orderOther } = res.orderDetails
const promises = []
const { customerId } = form
const list = []
if (orderOther.find(e => e.authority === 1)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 1,
customerId,
productId: orderOther.filter(e => e.authority === 1).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
if (orderOther.find(e => !e.authority)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 0,
customerId,
productId: orderOther.filter(e => !e.authority).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
if (orderOther.find(e => e.authority === 2)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 2,
customerId,
productId: orderOther.filter(e => e.authority === 2).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
if (orderOther.find(e => e.authority === 3)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 3,
customerId,
productId: orderOther.filter(e => e.authority === 3).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
if (orderOther.find(e => e.authority === 4)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 4,
// authority: 3,
customerId,
productId: orderOther.filter(e => e.authority === 4).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
if (orderOther.find(e => e.authority === 5)) {
promises.push(new Promise((resolve, reject) => {
this.$post(this.api.renew, {
authority: 5,
customerId,
productId: orderOther.filter(e => e.authority === 5).map(e => e.dataOrCourseId)
}).then(({ orderOthers }) => {
list.push(...orderOthers)
resolve()
}).catch(err => { })
}))
}
Promise.all(promises).then(_ => {
this.setStartDate(list, orderOther)
})
});
},
/**
* 订单类型更改触发的事件
* type 正式为1
* 试用为2
*/
updateOrderType (type) {
console.log('options=>', type)
if (type == 1) {
this.coursePermissions.forEach(item => {
this.dealSettlePrice(item)
})
} else {
this.coursePermissions.forEach(item => {
item.finalPrice = 0
item.settlementPrice = 0
})
}
},
setStartDate (renewList, orderOther) {
let list = orderOther.map(e => {
e.settlementPriceUnit = e.settlementPrice
const now = Date.now()
const item = renewList.find(n => n.dataOrCourseId == e.dataOrCourseId && n.authority == e.authority) // 匹配renew接口返回的数据
console.log("🚀 ~ file: AddOrder.vue ~ line 946 ~ list ~ item", item)
// if (item) {
// 处于续费
const cur = item || e
if (this.renewDisabled) {
let end = Date.parse(cur.endTime);
if (now < end) {
let time = new Date(cur.endTime.split(" ")[0])
time = new Date(time.setDate(time.getDate() + 1))
e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
} else {
const date = new Date()
// 过期
e.startTime = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`
}
e.endTime = "";
e.periodOfUse = "";
} else if (!this.viewDisabled) { // 如果不是查看
e.startTime = cur.startTime.split(" ")[0];
e.endTime = cur.endTime.split(" ")[0];
}
// }
if (item && this.renewDisabled) {
e.marketValue = item.marketValue
}
const startTime = new Date(e.startTime)
const endTime = new Date(e.endTime)
// 1: 未生效，2：生效中，3：已过期
e.status = now < startTime ?
1 :
now > startTime && now < endTime ?
2 :
3
if (e.status === 3) e.isEnable = 0 // 已过期的，变成禁用状态，且不能启用
return e;
});// 俩列表
this.coursePermissions = list.filter(i => i.authority === 1 && (i.mallClassificationId == 1 || !i.mallClassificationId));
this.theoryCourseList = list.filter(i => i.authority === 1 && i.mallClassificationId == 2);
this.dataPlatformPermissions = list.filter(i => i.authority === 0);
this.valuePermissions = list.filter(i => i.authority === 2);
this.practicalCourses = list.filter(i => i.authority === 3);
this.expTools = list.filter(i => i.authority === 4);
},
// 获取费率
getRate () {
this.$post(this.api.getPartnerTeamRates, {
teamId: this.form.teamId
}).then(({ teamRates }) => {
this.rate = teamRates.annualMarketingFee || 0
}).catch(res => { })
},
// 获取全部客户
getClients () {
// const sid = this.$store.state.dataPer.find(e => e.permissionName === '客户管理')
this.$post(this.api.queryCustomer, {
countries: this.form.countries,
provinceId: '',
cityId: '',
searchContent: '',
page: 1,
size: 1000,
// supplierId: sid ? sid.supplierId : ''
}).then(res => {
this.clients = res.message.list
}).catch(res => { })
},
// 刷新缓存
refreshCache () {
const { customerId } = this.form
const curClient = this.clients.find(e => e.customerId == customerId)
this.$post(`${this.api.refreshCache}?schoolId=${curClient ? curClient.schoolId : ''}`).then(res => { }).catch(res => { })
},
// 新增订单
submitOrder () {
let purchase = 0 // 总采购成本
let profit = 0 // 总利润
if (!this.coursePermissions.length && !this.theoryCourseList.length && !this.dataPlatformPermissions.length && !this.valuePermissions.length && !this.practicalCourses.length && !this.expTools.length) {
return this.$message.error("请选择产品权限后再确认订单");
} else {
// 课程权限参数校验
if (this.coursePermissions.length) {
let courseVerify =
this.coursePermissions.some(e => {
// if (!e.periodOfUse || e.finalPrice === '') {
if (!e.periodOfUse || e.finalPrice === '' || !e.startTime) {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!courseVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把课程参数输入完整");
}
}
if (this.theoryCourseList.length) {
let courseVerify =
this.theoryCourseList.some(e => {
// if (!e.periodOfUse || e.finalPrice === '') {
if (!e.periodOfUse || e.finalPrice === '' || !e.startTime) {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!courseVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把课程参数输入完整");
}
}
// 数据平台权限参数校验
if (this.dataPlatformPermissions.length) {
let dataVerify =
this.dataPlatformPermissions.some(e => {
if (!e.periodOfUse || e.finalPrice === '' || !e.accountNum || e.settlementPrice === '') {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!dataVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把产品参数输入完整");
}
}
if (this.valuePermissions.length) {
let courseVerify =
this.valuePermissions.some(e => {
if (!e.periodOfUse || e.finalPrice === '') {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!courseVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把课程参数输入完整");
}
}
if (this.practicalCourses.length) {
let courseVerify =
this.practicalCourses.some(e => {
if (!e.periodOfUse || e.finalPrice === '') {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!courseVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把课程参数输入完整");
}
}
if (this.expTools.length) {
let courseVerify =
this.expTools.some(e => {
if (!e.periodOfUse || e.finalPrice === '') {
return false;
} else {
const curPurchase = +e.settlementPrice + (e.settlementPrice * (this.rate / 100))
purchase += curPurchase
profit += +e.finalPrice - curPurchase
return true;
}
});
if (!courseVerify) {
this.whetherSubmit = true;
setTimeout(() => {
this.whetherSubmit = false;
}, 4000);
return this.$message.error("请把课程参数输入完整");
}
}
}
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.orderRepeat.length) return this.$message.error(this.repeatMsg)
let tempArr = [...this.dataPlatformPermissions, ...this.coursePermissions, ...this.valuePermissions, ...this.practicalCourses, ...this.expTools, ...this.theoryCourseList];
console.log('tempArr=>', tempArr)
let renew = tempArr.some(e => e.renew);
if (this.renewDisabled || renew) {/* 续费状态下 */
this.form.orderNature = 2;
if (renew) {
tempArr.forEach(e => {
if (e.renew) delete e.renew
});
}
}
tempArr.forEach(e => {
const time = new Date(e.startTime)
e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
})
const { form } = this
form.purchaseCost = Math.round(purchase)
form.profit = Math.round(profit)
let param = {
contractInformation: this.contract,//合同信息
order: form,// 订单基本数据
orderOther: tempArr//俩列表
};
this.loading = true;
console.log(param)
if (this.editDisabled) {
this.$post(this.api.orderUpdate, param).then(res => {
this.refreshCache()
this.$message.success("修改成功");
this.loading = false;
this.$router.back();
}).catch(err => {
this.loading = false;
});
} else {
this.$post(this.api.orderAdd, param).then(res => {
this.refreshCache()
this.$message.success("添加订单成功");
this.loading = false;
this.renewDisabled ? this.$router.push('/order') : this.$router.back();
}).catch(err => {
this.loading = false;
});
}
} else {
this.$message("请填上必填项");
return false;
}
});
},
// 处理orderRepeat里的id
handleOrderRepeat (id) {
this.orderRepeat.includes(id) && this.orderRepeat.splice(this.orderRepeat.findIndex(e => e == id), 1)
},
/* 处理0开头的期限 */
zero (e, row) {
if (e[0] == "0") {
row.periodOfUse = e.substring(1);
this.zero(row.periodOfUse, row);
}
},
// 订单客户框触发选择页面
gotoClient () {
this.showSelectClient = !this.showSelectClient;
},
// 选择客户返回传值
backToOrder (val) {
this.showSelectClient = !this.showSelectClient;
if (val.customerId) {
this.form.customerName = val.customerName;
this.form.customerId = val.customerId;
this.form.phone = val.phone;
this.form.email = val.email;
this.form.orderContact = val.name;
this.$get(this.api.queryCustomerDetails, { customerId: val.customerId }).then(res => {
this.form.provinceId = res.result.customer.provinceId;
this.form.cityId = res.result.customer.cityId;
this.getCityData();
this.getSettlemennt()
});
this.$forceUpdate();
}
},
// 更换了订单客户后重新获取结算价
getSettlemennt () {
const list = []
this.listName.map(e => e.name).forEach(e => {
list.push(...this[e])
})
console.log("🚀 ~ file: AddOrder.vue:1954 ~ getSettlemennt ~ list:", list)
list.map(e => {
this.$post(`${this.api.queryCitySettlementPrice}?mallId=${e.mallId}&provinceId=${this.form.provinceId}&cityId=${this.form.cityId}`).then(res => {
const mall = res.mallPrice
if (mall) {
e.settlementPrice = mall.discountRate
}
}).catch((res) => { })
})
},
closeJCourse () { // 关闭课程选择对话框
this.curriculumName = "";
this.courseVisible = false;
},
// 删除课程权限
delCourseForm (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.coursePermissions.length === 1) {
return this.$message.warning("续费至少保留一条课程权限");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.coursePermissions.splice(index, 1);
}
});
},
//删除理论课程
delCourseDataForm (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.theoryCourseList.length === 1) {
return this.$message.warning("续费至少保留一条课程权限");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.theoryCourseList.splice(index, 1);
}
});
},
// 删除数据平台权限
delDataForm (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.dataPlatformPermissions.length === 1) {
return this.$message.warning("续费至少保留一条产品信息");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.dataPlatformPermissions.splice(index, 1);
}
});
},
// 删除职站增值应用产品权限
delDataFormList (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.valuePermissions.length === 1) {
return this.$message.warning("续费至少保留一条产品信息");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.valuePermissions.splice(index, 1);
}
});
},
// 获取选择课程弹框列表
getPracticalCourses () {
this.dataLoading = true;
this.$post(this.api.listOfGoods, {
pageNum: this.practicalCoursePage,
productClassification: this.classificationId,
pageSize: 10,
isShelves: 0,
productName: this.practicalCourseName,
hotTag: 1
}).then(({ page }) => {
this.practicalCourseList = page.records;
this.practicalCourseTotals = page.total;
this.dataLoading = false;
}).catch(err => {
this.dataLoading = false;
});
},
// 初始化选择课程列表
initCourses () {
this.practicalCoursePage = 1
this.getPracticalCourses()
},
practicalCoursesSelectable (row, index) { // 禁止勾选已经选过的数据平台
let boolean = true;
const { name } = this.listName.find(e => e.id == this.classificationId)
this[name].length && this[name].some(e => {
if (e.mallId == row.mallId) {
boolean = false;
}
});
return boolean;
},
// 课程--弹框列表选中
practicalCoursesSelection (val) {
this.practicalCoursesSelect = val;
},
// 课程弹框--确定
async practicalCourseSubmit () {
if (this.practicalCoursesSelect.length > 0) {
let that = this;
let authority
switch (that.classificationId) {
case 1:
authority = 1
break;
case 2:
authority = 1
break;
case 3:
authority = 2
break;
case 4:
authority = 3
break;
case 5:
authority = 0
break;
case 6:
authority = 4
break;
default:
break;
}
const { orderType } = this.form
const { name } = this.listName.find(e => e.id == that.classificationId)
let fn = function (e) {
that[name].push({
dataOrCourseId: e.associatedProduct,// id
mallId: e.mallId,
productName: e.productName,// 名称
periodOfUse: "",// 使用期限
startTime: new Date(),// 开始
endTime: "", // 终止
remainingPeriod: "",// 剩余期限
marketValue: '', // 市场价
marketPrice: e.marketUnitPrice, // 市场单价
finalPrice: orderType === 2 ? 0 : '',// 成交价
finalValue: orderType === 2 ? 0 : '', // 成交单价
discountRate: "",// 折扣率
accountNum: "",// 账号数
totalAmount: "",// 总价
isEnable: 0, // 启用否：1启用，0禁用
ship: 0,// 发货否（0未发货，1已发货，默认不发货）
authority, // 区分权限
options: 1,
settlementPrice: orderType === 2 ? 0 : '', // 结算价
settlementPriceUnit: e.settlementPrice || 0, // 结算单价
mallNonAssociatedLinks: e.mallNonAssociatedLinks // 产品链接
})
};
const productId = []
this.practicalCoursesSelect.map(e => {// 取得选中的值，进行赋值
e.associatedProduct && productId.push(+e.associatedProduct);
let find = this[name].some(i => e.mallId === i.mallId);// 判断已有的相同的id不进行处理
if (!find) {
this.$post(`${this.api.queryCitySettlementPrice}?mallId=${e.mallId}&provinceId=${this.form.provinceId}&cityId=${this.form.cityId}`).then(res => {
const mall = res.mallPrice
if (mall) {
e.settlementPrice = mall.discountRate
}
fn(e);
}).catch((res) => { })
}
});
this.practicalCourseVisible = false;
this.practicalCourseName = "";
this.practicalCoursesSelect = [];
/* 调接口，判断是否为客户已有的产品功能 */
productId.length && await this.$post(this.api.renew, {
authority,
customerId: this.form.customerId,
productId
}).then(res => {
this[name].map(e => {
res.orderOthers.map(el => {
if (el.dataOrCourseId == e.dataOrCourseId && el.authority == authority) {
let time = new Date(el.endTime)
time = new Date(time.setDate(time.getDate() + 1))
e.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
e.endTime = "";
e.periodOfUse = "";
e.renew = true;
}
});
});
});
} else {
return this.$message.warning("请选择数据");
}
},
// 实训课程弹框--页数变更
practicalCoursesChange (val) {
this.practicalCoursePage = val;
this.getPracticalCourses();
},
// 删除实训课程权限
delPracticalCourses (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.practicalCourses.length === 1) {
return this.$message.warning("续费至少保留一条产品信息");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.practicalCourses.splice(index, 1);
}
});
},
// 删除实训课程权限
delExpTool (index, row) {
this.$confirm("确定要删除吗？", "提示", {
type: "warning"
}).then(() => {
if (this.renewDisabled && this.expTools.length === 1) {
return this.$message.warning("续费至少保留一条产品信息");
} else {
this.handleOrderRepeat(row.dataOrCourseId)
this.expTools.splice(index, 1);
}
});
},
// 启用
handleEnable (e, row, type) {
this[this.deliverShow[type]] = !this[this.deliverShow[type]]
},
// 一键发货
batchDeliver (ship, data) {
this[this.deliverShow[data]] = !this[this.deliverShow[data]]
// data即各个课程的分类id，详见data里的注释
const list = data == 1 ?
this.dataPlatformPermissions :
data == 2 ?
this.valuePermissions :
data == 3 ?
this.practicalCourses :
data == 4 ?
this.expTools :
data === 5 ?
this.theoryCourseList :
this.coursePermissions
list.map(e => {
e.ship = ship
if (e.ship === 1) {
e.isEnable = 1
}
})
if (this.editDisabled) {
// this.refreshCache()
// this.$post(this.api.bulkShipping, {
// orderOthers: list
// }).then(res => {})
}
},
// 发货
handleDeliver (e, row, type) {
this[this.deliverShow[type]] = row.ship === 1
if (row.ship === 1) {
row.isEnable = 1
}
if ((type == 3 || type == 4) && row.ship) this.showShip(row) // 非集成课程发货了后显示填写发货信息弹框
},
// 如果非数字，则返回0
handleNaN (val) {
return isNaN(val) ? 0 : val
},
// 课程计算折扣率
calculateDiscountCourse (val, row) {
const { finalPrice, marketValue } = row
// (原价-现价)÷原价 x100%
if (finalPrice) row.discountRate = marketValue == 0 ? '0%' : ((marketValue - finalPrice) / marketValue * 100).toFixed(2) + "%";
},
// 数据计算折扣率
calculateDiscount (val, row) {
const { finalValue, marketValue } = row
// (原价-现价)÷原价 x100%
if (finalValue) row.discountRate = marketValue == 0 ? '0%' : ((marketValue - finalValue) / marketValue * 100).toFixed(2) + "%";
},
// 合同起止日期选择
contractTimeChange (val) {
if (val.length > 0) {
this.contract.startTime = val[0];
this.contract.endTime = val[1];
}
},
// 计算订单总额
allAmount ($event, row) {
this.dealSettlePrice(row)
let total = 0
const list = [...this.coursePermissions, ...this.dataPlatformPermissions, ...this.practicalCourses, ...this.expTools]
list.map(e => total += +e.finalPrice)
this.form.orderAmount = total
},
// 成交价修改后，计算成交单价 计算规则：成交价/账号数/时间（成交单价为元/账号/年，所以时间要换算成年的单位去计算）
dealFinalValue (val, row) {
const { periodOfUse, options, accountNum, finalPrice } = row
if (periodOfUse && accountNum && finalPrice) {
row.finalValue = (finalPrice / accountNum / periodOfUse).toFixed(2)
this.calculateDiscount(val, row)
}
},
// 计算成交价。计算规则：成交单价*账号数*时间（成交单价为元/账号/年，所以时间要换算成年的单位去计算）
dealComputers (e, row) {
const { finalValue, accountNum, periodOfUse, finalPrice } = row
if (periodOfUse) {
if (accountNum) {
// 有成交单价，则成交价=成交单价*账号数*时间
if (finalValue) {
row.finalPrice = Math.round(finalValue * periodOfUse * accountNum)
} else if (!finalValue && finalPrice) {
// 有成交价，没有成交单价，则成交单价=成交价/账号数/时间
row.finalValue = (finalPrice / periodOfUse / accountNum).toFixed(2)
this.calculateDiscount(e, row)
}
} else if (finalValue && finalValue) {
// 有成交价、成交单价，没有数量，则数量=成交价/时间/成交单价
row.accountNum = Math.floor(finalPrice / periodOfUse / finalValue)
}
}
this.dealSettlePrice(row)
this.allAmount(e, row)
},
// 计算结算价
dealSettlePrice (row) {
const unit = row.options // 使用期限单位
const useUnit = row.periodOfUse // 使用期限
if (this.form.orderType !== 2) {
// 结算单价。计算规则：结算单价（**元/年）*购买时长（单位年）*数量(课程为1，数据为账号数量)（单位是万）
const priceUnit = row.settlementPriceUnit
const sPrice = ((!unit ?
priceUnit / 365 * useUnit :
unit === 1 ?
priceUnit / 12 * useUnit :
priceUnit * useUnit) * (row.authority ?
1 :
row.accountNum)).toFixed(2)
console.log("🚀 ~ file: AddOrder.vue:2287 ~ dealSettlePrice ~ sPrice:", row, sPrice)
row.settlementPrice = this.handleNaN(sPrice)
}
},
// 使用期限转换以及计算剩余天数
deadLine (e, row, options, isDate) {
let optionsData = ''
if (e > 0) {
if (options == 1) {
optionsData = e === '12' ? 31536000000 : e * 30 * 24 * 60 * 60 * 1000
} else if (options == 2) {
optionsData = e * 365 * 24 * 60 * 60 * 1000
} else {
optionsData = e * 24 * 60 * 60 * 1000
}
} else {
optionsData = 0
}
let time = new Date(row.startTime).getTime();
let endTime = time + optionsData
row.endTime = time + optionsData
var timestamp = endTime;
var dt = new Date(timestamp); //根据时间戳生成的时间对象
row.endTime = (dt.getFullYear()) + "-" + (dt.getMonth() + 1) + "-" + (dt.getDate())
let endYear = timestamp - time
let endYears = endYear / 1000 / 60 / 60 / 24
row.remainingPeriod = endYears
const unit = row.options // 使用期限单位
const useUnit = row.periodOfUse // 使用期限
let price = row.marketPrice // 市场单价
// 结算单价是元/年，所以如果选择的不是年，要进行换算（日：/365,月：/12)
if (useUnit && price) row.marketValue = ((!unit ?
price / 365 * useUnit :
unit === 1 ?
price / 12 * useUnit :
price * useUnit)).toFixed(2)
this.dealComputers(e, row)
row.authority ? this.calculateDiscountCourse(e, row) : this.calculateDiscount(e, row)
// 只有改变了起止日期才需要调接口查询订单，该接口作用是把开始时间传过去，会返回一个提示或者时间，如果是时间，则把时间+1天，如果是提示，则无法保存
if (isDate) {
const cId = row.dataOrCourseId
const date = new Date(row.startTime)
const orderRepeat = this.orderRepeat
this.$post(this.api.getOrderOtherTime, {
customerId: this.form.customerId,
id: row.dataOrCourseId,
startTime: date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(),
endTime: row.endTime,
authority: row.authority
}).then(res => {
orderRepeat.includes(cId) && orderRepeat.splice(orderRepeat.findIndex(e => e === cId), 1)
if (res.endTime) {
let time = new Date(res.endTime)
time = new Date(time.setDate(time.getDate() + 1))
row.startTime = `${time.getFullYear()}-${time.getMonth() + 1}-${time.getDate()}`
}
}).catch(res => {
this.repeatMsg = res.message
orderRepeat.includes(cId) || orderRepeat.push(cId)
})
}
},
// 打开填写发货信息弹框
showShip (row) {
this.curRow = row
let val = ''
// 产品管理那里设置了链接的则要显示到发货内容输入框里
row.mallNonAssociatedLinks && row.mallNonAssociatedLinks.forEach(e => {
val += e.urlName + '：' + e.url + '\n'
})
this.shipInfo = val
this.shipContent = row.shipContent || val
this.shipVisible = true
},
copyLink () {
this.shipContent += this.shipInfo
},
// 发货信息弹框提交
submitShip () {
this.curRow.shipContent = this.shipContent
this.shipVisible = false
},
// 清除省份
clearprovince () {
this.form.cityId = "";
this.form.customerId = "";
this.form.orderContact = "";
this.form.phone = "";
this.form.email = "";
},
// 获取城市
getCity () {
this.clearprovince();
this.getCityData();
},
getCityData () {
let data = {
provinceId: this.form.provinceId
};
return this.$get(this.api.queryCity, data).then(res => {
this.cityList = res.list;
}).catch(res => { })
},
// 清除城市
clearcity () {
this.form.customerId = "";
this.form.orderContact = "";
this.form.phone = "";
this.form.email = "";
},
// 获取学校/客户名称
getSchool () {
this.clearcity();
this.getSchoolData();
},
getSchoolData () {
let data = {
provinceId: this.form.provinceId,
cityId: this.form.cityId
};
this.$get(this.api.queryOrderCustomer, data).then(res => {
this.schoolList = res.message;
}).catch(res => {
});
},
// 团队
getTeam () {
this.$get(this.api.getAllTeam).then(({ team }) => {
this.teams = team
}).catch(err => { })
},
// 团队选择回调
teamChange () {
this.form.businessManagerId = ''
this.form.businessManagerName = ''
this.getBm()
this.getRate()
},
// 城市合伙人人员
getBm () {
this.$post(this.api.partnerAccountList, {
type: 1,
partnerClassificationId: this.form.teamId,
keyWord: '',
pageNum: 1,
pageSize: 100000
}).then(({ pageList }) => {
this.bmList = pageList.records
}).catch(err => { })
},
clearcustomer () {
this.form.orderContact = "";
this.form.phone = "";
this.form.email = "";
},
// 获取学校/客户信息
getcustomer () {
let data = {
customerId: this.form.customerId
};
this.$get(this.api.queryOrderCustomerContact, data).then(res => {
this.form.orderContact = res.message[0].adminName;
this.form.phone = res.message[0].adminPhone;
this.form.email = res.message[0].email;
}).catch(res => {
});
},
discountChange (row) {
let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
if (!(reg.test(row.transactionPrice))) {
this.$message.error("请输入正确金额格式,可保留两位小数");
row.transactionPrice = "";
} else {
row.discount = this.Percentage(row.transactionPrice, row.marketPrice);
}
},
getSummaries (param) { // 自定义的合计计算方法
const { columns, data } = param;
var sums = 0;
data.map(e => {
sums += Number(e.transactionPrice);
});
this.form.orderAmount = sums;
return sums;
},
// 上传文件超出
handleExceed (files, fileList) {
this.$message.warning(
`当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择`
);
},
// 上传前
beforeAvatarUpload (file) {
const size = file.size / 1024 / 1024 < 10;
let type = file.name.split(".").pop();
let str = ["jpg", "jpeg", "gif", "png", "doc", "docx", "pdf"].includes(type.toLowerCase());
if (!str) {
this.$message.error("只能上传图片，word文件和pdf文件");
} else if (!size) {
this.$message.error("上传头像图片大小不能超过 10MB!");
}
return str && size;
},
// 上传成功
uploadSuccess (res, file, fileList) {
this.contract.contractFile = res.data.filesResult.fileUrl;
},
// 上传报错
uploadError (err, file, fileList) {
this.$message({
message: "上传出错，请重试",
type: "error",
center: true
});
},
// 删除上传文件前的确认
beforeRemove (file, fileList) {
let type = file.name.split(".").pop();
let str = ["jpg", "jpeg", "gif", "png", "doc", "pdf"].includes(type.toLowerCase());
const size = file.size / 1024 / 1024 < 10;
if (!size || !str) {
return true;
} else {
return this.$confirm(`确定移除 ${file.name}？`);
}
},
// 删除文件钩子
handleRemove (file, fileList) {
this.contract.contractFile = "";
},
configure () {
this.ipVisible = true;
},
IPSure () {
this.ipVisible = false;
},
goBack () {
this.$router.go(-1);
},
/**
* 添加实训课程产品权限,理论课程 ,数据前瞻平台权限,职站增值应用产品权限,实训课程（非集成）,实验工具
* type
*/
addCourseJurisdiction (type) {
if (!this.form.customerId) return this.$message.warning("请先选择客户");
this.classificationId = type
this.practicalCourseVisible = true;
this.initCourses();
},
},
filters: {
dialogTitle (options) {
console.log(options)
switch (options) {
case 1:
return '实训课程产品列表'
case 2:
return '理论课程列表'
case 3:
return '职站增值应用列表'
case 4:
return '实训课程（非集成）列表'
case 5:
return '数据前瞻平台权限列表'
case 6:
return '实验工具列表'
default:
break;
}
}
}
};
</script>
<style lang="scss" scoped>
/deep/ .course-input .el-input__inner {
width: 100px;
}
.time-input {
width: 90px !important;
}
/deep/.time-select {
margin-left: 5px;
.el-input {
width: 70px !important;
}
}
/deep/.orderTables .el-select > .el-input {
width: 35%;
}
/deep/ .course-input .red .el-input__inner,
/deep/ .small .red .el-input__inner,
/deep/ .red .el-input__inner {
border: 1px solid red;
}
/deep/ .small .el-input__inner {
width: 100%;
margin-right: 5px;
}
/deep/ .discountRate .el-input__inner {
width: 85px;
}
/deep/ .contractDate .el-date-editor--daterange.el-input__inner {
width: 100%;
}
.info .el-select {
width: 100%;
}
.mag {
margin-right: 20px;
}
.small {
display: flex;
align-items: center;
.el-input {
margin-right: 5px;
}
}
.uploadTitle {
width: 100%;
height: 40px;
font-size: 16px;
}
.application_input {
width: 250px;
}
.contract .el-upload {
width: 100% !important;
}
.downcol .el-form-item__content {
margin-left: 0 !important;
}
.down {
// margin-top: 60px;
height: 40px;
}
/* 选择IP */
.tab_temp label {
width: 60px;
}
.mar10 {
margin-top: 10px;
}
.radio_icon {
font-size: 26px;
color: #9278ff;
}
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/deep/.ship-dia {
.el-dialog__body {
padding: 0 20px;
}
.ship {
cursor: pointer;
}
}
</style>