<a-form-item label="催单状态：">
<a-select
v-decorator="[
'reminderStatus',
{
initialValue: $store.getters.enterpriseId ? '2' : '0'
}
]"
style="width:100%;"
allowClear
>
<a-select-option value="0">
待处理
</a-select-option>
<a-select-option value="1">
处理中
</a-select-option>
<a-select-option value="2">
处理完成
</a-select-option>
</a-select>
</a-form-item>
<template>
<a-modal v-model="visible" title="催单列表" @ok="handleOk" :width="1200" :footer="null">
<a-card :bordered="false">
<a-form layout="horizontal" :form="form">
<a-row :gutter="30">
<a-col :span="8">
<a-form-item label="订单信息：">
<a-input v-decorator="['orderNo']" placeholder="订单号/原始单号" allowClear />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="客户信息：">
<a-input v-decorator="['clientNameOrPhone']" placeholder="客户姓名/电话" allowClear />
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item label="催单状态：">
<a-select v-decorator="['reminderStatus']" style="width:100%;" allowClear>
<a-select-option value="0">
待处理
</a-select-option>
<a-select-option value="1">
处理中
</a-select-option>
<a-select-option value="2">
处理完成
</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="30">
<a-col :span="8">
<a-form-item label="申请时间：">
<a-range-picker v-decorator="['time']" allowClear @change="onChange" />
</a-form-item>
</a-col>
<a-col :span="8" v-if="!$store.getters.enterpriseId">
<a-form-item label="企业名称：">
<a-select v-decorator="['enterpriseId']" allowClear show-search :filter-option="filterOption">
<a-select-option :value="item.enterpriseId" v-for="(item, i) in enterprise" :key="i">
{
{
item.enterpriseName }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="$store.getters.enterpriseId ? 16 : 8" style="text-align: right;">
<a-button type="primary" html-type="submit" @click="search(1)"> 查询 </a-button>
</a-col>
</a-row>
</a-form>
<a-spin :spinning="spinning" delay="500">
<a-table
@change="handleTableChange"
:pagination="false"
:columns="columns"
:data-source="data"
bordered
style="margin-top: 30px"
>
<span slot="action" slot-scope="text">
<a v-if="$store.getters.enterpriseId" @click="toDetail(text)">查看反馈</a>
<a-divider v-if="$store.getters.enterpriseId && text.reminderStatus == 2" type="vertical" />
<a v-if="$store.getters.enterpriseId && text.reminderStatus == 2" @click="reminderOrder(text)">再次催单</a>
<a v-if="!$store.getters.enterpriseId && text.reminderStatus != 2" @click="toDetail(text, 1)">处理</a>
<a v-if="!$store.getters.enterpriseId && text.reminderStatus == 2" @click="toDetail(text)">查看</a>
</span>
</a-table>
</a-spin>
<a-row type="flex" justify="end" style="margin-top: 50px">
<a-pagination
v-if="data.length != 0"
show-quick-jumper
v-model="page"
:total="pageTotal"
@change="onChangePage"
:show-total="a => `总共 ${a} 条`"
/>
</a-row>
</a-card>
<result ref="result" @update="search(1)"></result>
<a-modal v-model="visibleCuidan" title="催单申请" ok-text="确认" cancel-text="取消" @ok="reminder">
<div class="flex_l mb-20">
<div style="width:80px;text-align:right">订单编号：</div>
<div>{
{
orderNo }}</div>
</div>
<div class="flex_l flex-top">
<div style="width:80px;text-align:right">添加备注：</div>
<a-input class="flex-1" v-model="cuidanRemark" rows="4" placeholder="填写备注..." type="textarea" />
</div>
</a-modal>
</a-modal>
</template>
<script>
import {
getSlectCombox } from '@/api/enterprise/accessory'
import {
cuidanList, cuidan } from '@/api/order/orderList'
const columns = [
{
title: '序号',
dataIndex: 'index',
align: 'center'
},
{
title: '订单号',
dataIndex: 'orderNo',
align: 'center'
},
{
title: '订单状态',
dataIndex: 'orderStatusName',
align: 'center'
},
{
title: '发起时间',
dataIndex: 'createTime',
align: 'center'
},
{
title: '催单状态',
dataIndex: 'reminderStatusName',
align: 'center'
},
{
title: '反馈结果',
dataIndex: 'content',
align: 'center',
width: '20%'
},
{
title: '操作',
align: 'center',
scopedSlots: {
customRender: 'action' }
}
]
export default {
data() {
return {
visible: false,
form: this.$form.createForm(this, {
name: 'advanced_search' }),
enterprise: [],
startTime: '',
endTime: '',
data: [],
columns,
page: 1,
pageTotal: '',
spinning: false,
visibleCuidan: false,
id: '',
orderId: '',
orderNo: '',
cuidanRemark: ''
}
},
components: {
result: () => import('./cuidanResult')
},
methods: {
init() {
this.visible = true
getSlectCombox().then(res => {
this.enterprise = res.data
})
this.search()
},
filterOption(input, option) {
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
},
onChange(date, dateString) {
console.log(date, dateString)
this.startTime = dateString[0]
this.endTime = dateString[1]
},
search(page) {
if (page) {
this.page = 1
}
this.spinning = true
cuidanList(
Object.assign(
this.form.getFieldsValue(),
this.$store.getters.enterpriseId
? {
pageNum: this.page,
pageSize: 10,
startTime: this.startTime,
endTime: this.endTime,
enterpriseId: this.$store.getters.enterpriseId
}
: {
pageNum: this.page,
pageSize: 10,
startTime: this.startTime,
endTime: this.endTime
}
)
).then(data => {
this.spinning = false
if (data.code === 0) {
this.pageTotal = data.total
data.rows.forEach((item, i) => {
this.$set(item, 'index', (this.page * 1 - 1) * 10 + i + 1)
})
this.data = data.rows
} else {
this.$message.error(data.msg)
}
})
},
onChangePage(pageNumber) {
this.page = pageNumber
this.search()
},
toDetail(info, type) {
this.$nextTick(() => {
this.$refs.result.init(info, type)
})
},
reminderOrder(record) {
this.$nextTick(() => {
this.visibleCuidan = true
this.orderId = record.orderId
this.orderNo = record.orderNo
this.id = record.id
})
},
reminder() {
cuidan({
orderId: this.orderId,
orderNo: this.orderNo,
reminderRemark: this.cuidanRemark,
id: this.id
}).then(res => {
this.$message.success('催单成功')
this.visibleCuidan = false
this.cuidanRemark = ''
})
}
}
}
</script>
<style lang="less" scoped>
/deep/.ant-form-item {
display: flex !important;
}
/deep/.ant-form-item-control-wrapper {
flex: 1 !important;
width: 100% !important;
}
</style>