|
|
|
|
@ -83,45 +83,51 @@ |
|
|
|
|
<ul class="filter"> |
|
|
|
|
<li> |
|
|
|
|
<label>产品类型</label> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择产品类型" @change="getCity"> |
|
|
|
|
<el-option v-for="(item,index) in orderTypeList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
<el-select v-model="form2.productType" clearable placeholder="请选择产品类型"> |
|
|
|
|
<el-option v-for="(item,index) in productTypeList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</li> |
|
|
|
|
<li> |
|
|
|
|
<label>订阅状态</label> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择订阅状态" @change="getCity"> |
|
|
|
|
<el-option v-for="(item,index) in subStatusList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
<el-select v-model="form2.status" clearable placeholder="请选择订阅状态" @change="filterForm2"> |
|
|
|
|
<el-option v-for="(item,index) in subStatusList" :key="index" :label="item.name" :value="item.name"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</li> |
|
|
|
|
<li> |
|
|
|
|
<el-input style="width: 250px;" placeholder="请输入产品名称" prefix-icon="el-icon-search" v-model="keyWord" clearable></el-input> |
|
|
|
|
<el-input style="width: 250px;" placeholder="请输入产品名称" prefix-icon="el-icon-search" clearable v-model="form2.keyword"></el-input> |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div> |
|
|
|
|
<el-button type="primary" @click="batchImport">导出列表</el-button> |
|
|
|
|
<el-button type="primary">导出列表</el-button> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<el-table :data="coursePermissionss" class="orderTable" stripe header-align="center" @selection-change="handleSelectionChange" row-key="customerId"> |
|
|
|
|
<el-table :data="products" class="orderTable" stripe header-align="center" @selection-change="handleSelectionChange" row-key="customerId"> |
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
|
|
|
|
<el-table-column type="index" width="100" label="序号" align="center"> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="产品名称" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="产品类型" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="productName" label="产品名称" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="产品类型" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
{{scope.row.authority ? '课程' : '数据'}} |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column label="起止日期" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
{{scope.row.startTime}}~{{scope.row.endTime}} |
|
|
|
|
{{scope.row.status === '已过期' ? '' : scope.row.startTime + ' ~ ' + scope.row.endTime}} |
|
|
|
|
<!-- <el-tooltip class="item" effect="dark" content="Top nbspCenter 提示文字" placement="top"> |
|
|
|
|
<i class="el-icon-warning warning"></i> |
|
|
|
|
</el-tooltip> --> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column label="剩余期限" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
{{scope.row.remainingPeriod}} 天 |
|
|
|
|
{{scope.row.remain}} 天 |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订阅状态" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="status" label="订阅状态" align="center"></el-table-column> |
|
|
|
|
<el-table-column label="产品状态" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-switch v-if="scope.row.ship" v-model="scope.row.isEnable" :active-value="1" :inactive-value="0" :active-text="scope.row.isEnable ? '启用' : '禁用'" :disabled="isDetail" @change="switchOff($event,scope.row,scope.$index)"></el-switch> |
|
|
|
|
<span v-else>未发货</span> |
|
|
|
|
<el-switch v-model="scope.row.isEnable" :active-value="0" :inactive-value="1" :active-text="scope.row.isEnable ? '禁用' : '启用'" :disabled="scope.row.status !== '生效中'" @change="switchOff($event,scope.row,scope.$index)"></el-switch> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
@ -132,13 +138,13 @@ |
|
|
|
|
<ul class="filter"> |
|
|
|
|
<li> |
|
|
|
|
<label>订单类型</label> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择订单类型" @change="getCity"> |
|
|
|
|
<el-option v-for="(item,index) in productTypeList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择订单类型"> |
|
|
|
|
<el-option v-for="(item,index) in customerTypeList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</li> |
|
|
|
|
<li> |
|
|
|
|
<label>订单状态</label> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择订单状态" @change="getCity"> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择订单状态"> |
|
|
|
|
<el-option v-for="(item,index) in orderStatusList" :key="index" :label="item.name" :value="item.id"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</li> |
|
|
|
|
@ -147,19 +153,31 @@ |
|
|
|
|
</li> |
|
|
|
|
</ul> |
|
|
|
|
<div> |
|
|
|
|
<el-input style="width: 250px;" placeholder="请输入订单编号、内容" prefix-icon="el-icon-search" v-model="keyWord" clearable></el-input> |
|
|
|
|
<el-input style="width: 250px;" placeholder="请输入订单编号、内容" prefix-icon="el-icon-search" clearable></el-input> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<el-table :data="coursePermissionss" class="orderTable" stripe header-align="center" @selection-change="handleSelectionChange" row-key="customerId"> |
|
|
|
|
<el-table :data="orders" class="orderTable" stripe header-align="center" @selection-change="handleSelectionChange" row-key="customerId"> |
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
|
|
|
|
<el-table-column type="index" width="100" label="序号" align="center"> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单编号" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单内容" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单金额（元）" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单日期" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单类型" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="courseName" label="订单状态" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="orderNumber" label="订单编号" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="orderContent" label="订单内容" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-popover trigger="hover" placement="top" style='width: 500px' v-if='scope.row.orderContent.length >14'> |
|
|
|
|
<p> {{ scope.row.orderContent }}</p> |
|
|
|
|
<div slot="reference" class="name-wrapper"> |
|
|
|
|
<el-tag size="medium" class='tags'>{{ scope.row.orderContent }}</el-tag> |
|
|
|
|
</div> |
|
|
|
|
</el-popover> |
|
|
|
|
<span v-else> |
|
|
|
|
{{ scope.row.orderContent }} |
|
|
|
|
</span> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="orderAmount" label="订单金额（元）" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="createTime" label="订单日期" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="orderType" label="订单类型" align="center"></el-table-column> |
|
|
|
|
<el-table-column prop="orderStatus" label="订单状态" align="center"></el-table-column> |
|
|
|
|
<el-table-column label="操作" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-button type="text" @click="edit(scope.row)">订单详情</el-button> |
|
|
|
|
@ -171,7 +189,7 @@ |
|
|
|
|
<div v-show="curTab === 'tab4'"> |
|
|
|
|
<div class="tool"> |
|
|
|
|
<div> |
|
|
|
|
<el-input style="width: 350px;" placeholder="请输入订单编号、合同名称、合同编号、产品内容" prefix-icon="el-icon-search" v-model="keyWord" clearable></el-input> |
|
|
|
|
<el-input style="width: 350px;" placeholder="请输入订单编号、合同名称、合同编号、产品内容" prefix-icon="el-icon-search" clearable></el-input> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<el-table :data="contractInformations" class="table" stripe header-align="center"> |
|
|
|
|
@ -205,7 +223,7 @@ |
|
|
|
|
<div v-show="curTab === 'tab5'"> |
|
|
|
|
<div class="tool"> |
|
|
|
|
<div> |
|
|
|
|
<el-input style="width: 300px;" placeholder="请输入商务经理、手机号" prefix-icon="el-icon-search" v-model="keyWord" clearable></el-input> |
|
|
|
|
<el-input style="width: 300px;" placeholder="请输入商务经理、手机号" prefix-icon="el-icon-search" clearable></el-input> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<el-table :data="contractInformations" class="table" stripe header-align="center"> |
|
|
|
|
@ -249,7 +267,8 @@ export default { |
|
|
|
|
tab4: '合同信息', |
|
|
|
|
tab5: '商务经理', |
|
|
|
|
}, |
|
|
|
|
customerData: [], |
|
|
|
|
products: [], |
|
|
|
|
productAll: [], |
|
|
|
|
showFile:false, |
|
|
|
|
pdfVisible:false, |
|
|
|
|
showImg:false, |
|
|
|
|
@ -333,6 +352,12 @@ export default { |
|
|
|
|
name: '到期', |
|
|
|
|
value: 3 |
|
|
|
|
}], |
|
|
|
|
|
|
|
|
|
form2: { |
|
|
|
|
productType: '', |
|
|
|
|
status: '全部', |
|
|
|
|
keyword: '' |
|
|
|
|
}, |
|
|
|
|
// 产品类型 |
|
|
|
|
productTypeList: [ |
|
|
|
|
{ |
|
|
|
|
@ -371,6 +396,11 @@ export default { |
|
|
|
|
name: '待生效' |
|
|
|
|
} |
|
|
|
|
], |
|
|
|
|
|
|
|
|
|
pageOrder: 1, |
|
|
|
|
pageSizeOrder: 10, |
|
|
|
|
orders: [], |
|
|
|
|
|
|
|
|
|
// 订单状态 |
|
|
|
|
orderStatusList: [ |
|
|
|
|
{ |
|
|
|
|
@ -404,8 +434,17 @@ export default { |
|
|
|
|
submiting: false // 新增编辑防抖标识 |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
watch: { |
|
|
|
|
'form2.keyword': function(val) { |
|
|
|
|
clearTimeout(this.searchTimer) |
|
|
|
|
this.searchTimer = setTimeout(() => { |
|
|
|
|
this.filterForm2() |
|
|
|
|
},500) |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
this.getIndustryClass() |
|
|
|
|
this.getProduct() |
|
|
|
|
if(this.customerId){ |
|
|
|
|
this.$get(this.api.queryCustomerDetails,{ |
|
|
|
|
customerId: this.customerId |
|
|
|
|
@ -413,6 +452,7 @@ export default { |
|
|
|
|
let customer = res.result.customer |
|
|
|
|
this.form = { |
|
|
|
|
customerId: customer.customerId, |
|
|
|
|
customerName: customer.customerName, |
|
|
|
|
schoolId: customer.schoolId, |
|
|
|
|
countries: customer.countries, |
|
|
|
|
industryClassId: customer.industryClassId, |
|
|
|
|
@ -427,6 +467,7 @@ export default { |
|
|
|
|
name: customer.name, |
|
|
|
|
position: customer.position, |
|
|
|
|
} |
|
|
|
|
this.getOrder() |
|
|
|
|
this.contractInformations = res.result.contractInformations.filter(e => e.contractNumber || e.contractName); // 必须有合同编号或者名称，否则不展示 |
|
|
|
|
this.coursePermissionss = res.result.coursePermissionss |
|
|
|
|
this.dataPermissionss = res.result.dataPermissionss |
|
|
|
|
@ -439,6 +480,106 @@ export default { |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
// 获取已订阅产品 |
|
|
|
|
getProduct() { |
|
|
|
|
this.$get(this.api.getProductsSubscribedByCustomers, { |
|
|
|
|
customeId: this.customerId |
|
|
|
|
}).then(({ data }) => { |
|
|
|
|
data.map(e => { |
|
|
|
|
const list = e.startAndEndTimeList |
|
|
|
|
let connect = true // 每个订单的开始结束日期是否连续 |
|
|
|
|
list.map((n, i) => { |
|
|
|
|
// 第一个不用计算。用当前订单的开始日期跟上一个订单的结束日期做比较，只差一天，就表示是连续订单 |
|
|
|
|
if (i) { |
|
|
|
|
if (new Date(n.startTime).getTime() - 86400000 !== new Date(list[i - 1].endTime).getTime()) connect = false |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
// 如果是连续订单，则取第一个订单的开始日期和最后一个订单的结束日期 |
|
|
|
|
const now = Date.now() |
|
|
|
|
if (now < list[0].startTime) { |
|
|
|
|
e.startTime = list[0].startTime |
|
|
|
|
e.endTime = connect ? list[list.length - 1].endTime : list[0].endTime |
|
|
|
|
e.status = '未生效' |
|
|
|
|
} else if (now > list[list.length - 1].endTime) { |
|
|
|
|
e.status = '已过期' |
|
|
|
|
} else { |
|
|
|
|
// 连续订单 |
|
|
|
|
if (connect) { |
|
|
|
|
e.startTime = list[0].startTime |
|
|
|
|
e.endTime = list[list.length - 1].endTime |
|
|
|
|
e.status = '生效中' |
|
|
|
|
} else { |
|
|
|
|
for (const i in list) { |
|
|
|
|
const n = list[i] |
|
|
|
|
if (now >= new Date(n.startTime).getTime() && now <= new Date(n.endTime).getTime()) { |
|
|
|
|
// 生效中的订单，直接取该订单的开始结束日期 |
|
|
|
|
e.startTime = n.startTime |
|
|
|
|
e.endTime = n.endTime |
|
|
|
|
e.status = '生效中' |
|
|
|
|
e.orderEnable = n.isEnable |
|
|
|
|
// 如果还有未生效的订单 |
|
|
|
|
if (list[i + 1]) { |
|
|
|
|
e.other = '还有‘’2022-7.01-8.01的订单还未生效' |
|
|
|
|
} |
|
|
|
|
break |
|
|
|
|
} else if (i && now > new Date(list[i - 1].endTime).getTime() && now < new Date(n.startTime).getTime()) { |
|
|
|
|
// 当前时间位于两个订单时间之间，则取次订单的开始结束日期，并且为未生效 |
|
|
|
|
e.startTime = n.startTime |
|
|
|
|
e.endTime = n.endTime |
|
|
|
|
e.status = '未生效' |
|
|
|
|
break |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
e.remain = this.getRemain(e.startTime, e.endTime) // 获取剩余期限 |
|
|
|
|
e.startTime = e.startTime.replace(' 00:00:00', '') |
|
|
|
|
e.endTime = e.endTime.replace(' 00:00:00', '') |
|
|
|
|
e.isEnable = connect ? |
|
|
|
|
1 : |
|
|
|
|
(e.status === '已过期' || !e.orderEnable) ? |
|
|
|
|
0 : |
|
|
|
|
e.status === '生效中' ? |
|
|
|
|
1 : |
|
|
|
|
0 |
|
|
|
|
}) |
|
|
|
|
this.products = data |
|
|
|
|
this.productAll = data |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
// 获取剩余日期 |
|
|
|
|
getRemain(startTime, endTime) { |
|
|
|
|
return (new Date(endTime).getTime() - new Date(startTime).getTime()) / 86400000 |
|
|
|
|
}, |
|
|
|
|
// 已订阅产品筛选 |
|
|
|
|
filterForm2() { |
|
|
|
|
const list = this.productAll |
|
|
|
|
const { productType, status, keyword } = this.form2 |
|
|
|
|
this.products = list.filter(e => e.status === status && e.productName.includes(keyword)) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 订单记录 |
|
|
|
|
getOrder() { |
|
|
|
|
let data = { |
|
|
|
|
cityId: '', |
|
|
|
|
customerName: this.form.customerName, |
|
|
|
|
orderStatus: '', |
|
|
|
|
orderType: '', |
|
|
|
|
pageNo: this.pageOrder, |
|
|
|
|
pageSize: this.pageSizeOrder, |
|
|
|
|
provinceId: '' |
|
|
|
|
}; |
|
|
|
|
this.$post(this.api.orderList, data).then(({ orderPage }) => { |
|
|
|
|
orderPage.orders.forEach(e => { |
|
|
|
|
e.orderType = this.orderTypeFn(e.orderType) |
|
|
|
|
e.orderStatus = this.orderStatusFn(e.orderStatus) |
|
|
|
|
e.orderNature = this.orderNatureFn(e.orderNature) |
|
|
|
|
}); |
|
|
|
|
this.orders = orderPage.orders |
|
|
|
|
this.totals = orderPage.total |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
tabChange(index) { |
|
|
|
|
this.curTab = index |
|
|
|
|
}, |
|
|
|
|
@ -513,12 +654,11 @@ export default { |
|
|
|
|
this.industryList = res.list |
|
|
|
|
}).catch(res => {}); |
|
|
|
|
}, |
|
|
|
|
switchOff(val,row,index) { |
|
|
|
|
this.$get(this.api.updateEnabled,{ |
|
|
|
|
id: row.id, |
|
|
|
|
isEnable: val |
|
|
|
|
switchOff(val, row) { |
|
|
|
|
this.$post(`${this.api.orderBulkDisableEnable}?isOpen=${val}`, { |
|
|
|
|
ids: row.id |
|
|
|
|
}).then(res => { |
|
|
|
|
this.$message.success(val ? '启用成功' : '禁用成功') |
|
|
|
|
this.$message.success(val ? '禁用成功' : '启用成功') |
|
|
|
|
}).catch(res => {}) |
|
|
|
|
}, |
|
|
|
|
phoneChange() { // 切换手机号 |
|
|
|
|
@ -678,4 +818,8 @@ export default { |
|
|
|
|
font-size: 26px; |
|
|
|
|
color: #9278FF; |
|
|
|
|
} |
|
|
|
|
/deep/.warning { |
|
|
|
|
margin-left: 5px; |
|
|
|
|
color: #9278FF; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
