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.

570 lines
22 KiB

<template>
<basic-container>
<div class="avue-crud">
<el-row :hidden="!search" style="padding:6px 18px">
<!-- 查询模块 -->
<el-form :inline="true" :model="query">
<el-form-item label="异常类型:">
<!-- <el-input v-model="query.workOrderType" placeholder="请输入工单异常类型;货损,少货,窜货,加急,其他"></el-input>-->
<el-select v-model="query.workOrderType" placeholder="请输入工单异常类型;货损,少货,窜货,加急,其他" >
<el-option
v-for="item in this.workOrder"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="发现节点:">
<!-- <el-input v-model="query.discoveryNode" placeholder="请输入发现节点;提货,发货,干线,库内,配送,其他,签收(PC),安装(PC)"></el-input>-->
<el-select v-model="query.discoveryNode" placeholder="请输入发现节点;提货,发货,干线,库内,配送,其他,签收(PC),安装(PC)" >
<el-option
v-for="item in this.discoveryNode"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="异常工单号:">
<el-input v-model="query.workOrderNumber" placeholder="请输入异常工单号"></el-input>
</el-form-item>
<el-form-item label="订单自编号:">
<el-input v-model="query.orderCode" placeholder="请输入订单自编号"></el-input>
</el-form-item>
<!-- 查询按钮 -->
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="searchChange"> </el-button>
<el-button icon="el-icon-delete" @click="searchReset()"> </el-button>
</el-form-item>
</el-form>
</el-row>
<el-row>
<div class="avue-crud__header">
<!-- 头部左侧按钮模块 -->
<div class="avue-crud__left">
<!-- <el-button v-if="this.permissionList.addBtn" type="primary" icon="el-icon-plus" @click="handleAdd"> </el-button>-->
<!-- <el-button v-if="this.permissionList.delBtn" type="danger" icon="el-icon-delete" @click="handleDelete" plain> </el-button>-->
<el-button type="primary" icon="el-icon-plus" @click="handleAdd"> </el-button>
<el-button type="danger" icon="el-icon-delete" @click="handleDelete" plain> </el-button>
<el-button type="danger" icon="el-icon-delete" @click="handleProcessor" plain>处理方信息</el-button>
</div>
<!-- 头部右侧按钮模块 -->
<div class="avue-crud__right">
<el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
<el-button icon="el-icon-search" @click="searchHide" circle></el-button>
</div>
</div>
</el-row>
<el-row>
<!-- 列表模块 -->
<el-table ref="table" v-loading="loading"
@selection-change="selectionChange"
:data="data"
:height="height"
style="width: 100%"
:border="option.border">
<el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>
<el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>
<el-table-column v-if="option.index" label="#" type="index" width="50" align="center">
</el-table-column>
<template v-for="(item,index) in option.column">
<!-- table字段 -->
<el-table-column v-if="item.hide!==true"
:prop="item.prop"
:label="item.label"
:width="item.width"
:key="index">
</el-table-column>
</template>
<!-- 操作栏模块 -->
<el-table-column prop="menu" label="操作" :width="220" align="center">
<template #default="{row}">
<!--<el-button v-if="this.permissionList.viewBtn" type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>
<el-button v-if="this.permissionList.editBtn" type="primary" text icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
<el-button v-if="this.permissionList.editBtn" type="primary" text icon="el-icon-edit" @click="handleReply(row)">回复</el-button>
<el-button v-if="this.permissionList.delBtn" type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>-->
<el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>
<el-button type="primary" text icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
<el-button type="primary" text icon="el-icon-edit" @click="handleReply(row)">回复</el-button>
<el-button type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
<el-row>
<div class="avue-crud__pagination" style="width:100%">
<!-- 分页模块 -->
<el-pagination align="right"
background
@size-change="sizeChange"
@current-change="currentChange"
:current-page="page.currentPage"
:page-sizes="[10, 20, 30, 40, 50, 100]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.total">
</el-pagination>
</div>
</el-row>
<!-- 表单模块 -->
<el-dialog :title="title"
v-model="box"
width="50%"
:before-close="beforeClose"
append-to-body>
<el-form :disabled="view" ref="form" :model="form" label-width="120px">
<!-- 表单字段 -->
<el-form-item label="异常类型 " prop="workOrderType">
<el-select v-model="form.workOrderType" clearable placeholder="请选择工单异常类型;货损,少货,窜货,加急,其他">
<el-option
v-for="item in workOrder"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="发现节点 " prop="discoveryNode">
<el-select v-model="form.discoveryNode" clearable placeholder="请选择发现节点;提货,发货,干线,库内,配送,其他,签收(PC),安装(PC)">
<el-option
v-for="item in discoveryNode"
:key="item.dictKey"
:label="item.dictValue"
:value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="异常工单号" prop="workOrderNumber">
<el-input v-model="form.workOrderNumber" placeholder="请输入异常工单号"/>
</el-form-item>
<el-form-item label="运单号" prop="waybillNumber">
<el-input v-model="form.waybillNumber" placeholder="请输入运单号"/>
</el-form-item>
<el-form-item label="订单自编号" prop="orderCode">
<el-input v-model="form.orderCode" placeholder="请输入订单自编号"/>
</el-form-item>
<el-form-item label="车次号 " prop="trainNumber">
<el-input v-model="form.trainNumber" placeholder="请输入车次号 (干线卸车环节)"/>
</el-form-item>
<el-form-item label="一级品类" prop="first">
<el-input v-model="form.first" placeholder="请输入一级品类"/>
</el-form-item>
<el-form-item label="二级品类" prop="secondary">
<el-input v-model="form.secondary" placeholder="请输入二级品类"/>
</el-form-item>
<el-form-item label="车辆路线 " prop="vehicleRoute">
<el-input v-model="form.vehicleRoute" placeholder="请输入车辆路线;车次号、通过车次号自动带出车辆线路"/>
</el-form-item>
<el-form-item label="送货时间" prop="deliverGoodsTime">
<!-- <el-input v-model="form.deliverGoodsTime" placeholder="请输入送货时间"/> -->
<el-date-picker
v-model="form.deliverGoodsTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="发现时间 " prop="discoveryTime">
<!-- <el-input v-model="form.discoveryTime" placeholder="请输入发现时间 (库内作业环节,配送装车环节)"/> -->
<el-date-picker
v-model="form.discoveryTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="入库时间 " prop="warehousingTime">
<!-- <el-input v-model="form.warehousingTime" placeholder="请输入入库时间(库内作业环节)"/> -->
<el-date-picker
v-model="form.warehousingTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="运单商场" prop="waybillMall">
<el-input v-model="form.waybillMall" placeholder="请输入运单商场"/>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" placeholder="请输入备注"/>
</el-form-item>
<el-form-item label="处理方 " prop="deliveryTime">
<!-- <el-input v-model="form.processor" placeholder="请输入配送时间(配送装车环节)"/> -->
<el-select v-model="processor" placeholder="请选择">
<el-option
v-for="item in warehouseData"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="责任方 " prop="deliveryTime">
<!-- <el-input v-model="form.duty" placeholder="请输入配送时间(配送装车环节)"/> -->
<el-select v-model="duty" placeholder="请选择">
<el-option
v-for="item in warehouseData"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="配送时间 " prop="deliveryTime">
<!-- <el-input v-model="form.deliveryTime" placeholder="请输入配送时间(配送装车环节)"/> -->
<el-date-picker
v-model="form.deliveryTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="配送司机 " prop="deliveryDriver">
<el-input v-model="form.deliveryDriver" placeholder="请输入配送司机(配送装车环节)"/>
</el-form-item>
<!-- <el-form-item label="工单状态" prop="workOrderStatus">
<el-input v-model="form.workOrderStatus" placeholder="请输入工单状态"/>
</el-form-item>-->
<!-- <el-form-item label="归属客服名称" prop="customerServiceName">
<el-input v-model="form.customerServiceName" placeholder="请输入归属客服名称"/>
</el-form-item>-->
<!-- <el-form-item label="完结时间" prop="overTime">
<el-input v-model="form.overTime" placeholder="请输入完结时间"/>
<el-date-picker
v-model="value1"
type="datetime"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item> -->
<el-form-item label="异常问题描述" prop="problemDescription">
<el-input v-model="form.problemDescription" placeholder="请输入异常问题描述"/>
</el-form-item>
<el-form-item label="责任人" prop="personResponsible">
<el-input v-model="form.personResponsible" placeholder="请输入责任人 (库内作业环节)"/>
</el-form-item>
<!-- <el-form-item label="钉钉流程号" prop="processNumber">
<el-input v-model="form.processNumber" placeholder="请输入钉钉流程号"/>
</el-form-item>
<el-form-item label="审核人" prop="reviewedBy">
<el-input v-model="form.reviewedBy" placeholder="请输入审核人"/>
</el-form-item>
<el-form-item label="审核时间" prop="auditTime">
<el-input v-model="form.auditTime" placeholder="请输入审核时间"/>
</el-form-item>
<el-form-item label="财务入账时间" prop="entryTime">
<el-input v-model="form.entryTime" placeholder="请输入财务入账时间"/>
</el-form-item>-->
</el-form>
<!-- 表单按钮 -->
<template #footer>
<span v-if="!view" class="dialog-footer">
<el-button type="primary" icon="el-icon-circle-check" @click="handleSubmit"> </el-button>
<el-button icon="el-icon-circle-close" @click="box = false"> </el-button>
</span>
</template>
</el-dialog>
</div>
</basic-container>
</template>
<script>
import { getList, getDetail, add, update, remove,getProcessor } from "@/api/aftersales/aftersalesWorkOrder";
import option from "@/option/aftersales/aftersalesWorkOrder";
import { getDetailWarehouse,getDeptWarehouse } from "@/api/basicdata/basicdataWarehouse";
import { mapGetters } from "vuex";
import { getDictionaryBiz } from '@/api/system/dict';
export default {
data () {
return {
height: 0,
// 弹框标题
title: '',
// 是否展示弹框
box: false,
// 是否显示查询
search: true,
// 加载中
loading: true,
// 是否为查看模式
view: false,
// 查询信息
query: {},
// 分页信息
page: {
currentPage: 1,
pageSize: 10,
total: 40
},
// 表单数据
form: {},
// 选择行
selectionList: [],
// 表单配置
option: option,
// 表单列表
data: [],
discoveryNode: [], // 发现节点
workOrder: [],// 工单节点0
processor: '',// 处理方
duty: '',// 责任方
warehouseData: [], // 仓库数据
}
},
mounted() {
this.init();
this.onLoad(this.page);
},
computed: {
...mapGetters(["permission"]),
permissionList() {
return {
addBtn: this.validData(this.permission.param_add, false),
viewBtn: this.validData(this.permission.param_view, false),
delBtn: this.validData(this.permission.param_delete, false),
editBtn: this.validData(this.permission.param_edit, false),
};
},
ids() {
let ids = [];
this.selectionList.forEach(ele => {
ids.push(ele.id);
});
return ids.join(",");
}
},
methods: {
init() {
this.height = this.setPx(document.body.clientHeight - 340);
getDictionaryBiz('pc_work_order').then(res => { //异常类型
this.workOrder = res.data.data;
console.log("异常工单字典",this.workOrder);
/*this.$functions.checkcColumnList('typeServerName', this.columnList).checkarr =
res.data.data.map(item => {
item.value = item.dictKey;
item.label = item.dictValue;
return item;
});*/
});
getDictionaryBiz('pc_discovery_node').then(res => { //发现环节
this.discoveryNode = res.data.data;
console.log("发起环节字典",this.discoveryNode);
/*this.$functions.checkcColumnList('typeServerName', this.columnList).checkarr =
res.data.data.map(item => {
item.value = item.dictKey;
item.label = item.dictValue;
return item;
});*/
});
this.getWarehouseInfo();
},
//查询全部仓库信息
getWarehouseInfo(){
let ro ={}
getDeptWarehouse(ro).then(res =>{
this.warehouseData = res.data.data;
console.log("仓库信息",res.data.data);
});
},
//查询当前工单回复数据
handleReply(){
getReply().
},
searchHide() {
this.search = !this.search;
},
searchChange() {
this.onLoad(this.page);
},
searchReset() {
this.query = {};
this.page.currentPage = 1;
this.onLoad(this.page);
},
handleSubmit() {
if (!this.form.id) {
let processorEntityList =[];
let row= { //处理方
businessName: this.warehouseData.find(q=> q.id === this.processor).name ,
businessId: this.processor ,
conditions: 1,
typesOf:2
}
processorEntityList.push(row);
let row1= { //责任方
businessName: this.warehouseData.find(q=> q.id === this.duty).name ,
businessId: this.duty ,
conditions: 1,
typesOf:1
}
processorEntityList.push(row1);
console.log("数据????>>",processorEntityList);
this.form.processorEntityList = processorEntityList;
add(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
} else {
update(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
})
}
},
handleAdd(){
this.title = '新增'
this.form = {}
this.box = true
},
//查询处理方数据
handleProcessor() {
const {
workOrderType,
discoveryNode,
workOrderNumber,
orderCode,
} = this.query;
let values = {
workOrderType_: workOrderType,
discoveryNode_: discoveryNode,
workOrderNumber_: workOrderNumber,
orderCode_: orderCode,
};
getProcessor(this.page.currentPage, this.page.pageSize, values).then(res => {
const data = res.data.data;
this.page.total = data.total;
this.data = data.records;
this.loading = false;
this.selectionClear();
console.log("处理方数据>>>>",this.data);
});
},
handle(row) {
this.title = '编辑'
this.box = true
getDetail(row.id).then(res => {
this.form = res.data.data;
});
},
handleView(row) {
this.title = '查看'
this.view = true;
this.box = true;
getDetail(row.id).then(res => {
this.form = res.data.data;
});
},
handleDelete() {
if (this.selectionList.length === 0) {
this.$message.warning("请选择至少一条数据");
return;
}
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(this.ids);
})
.then(() => {
this.selectionClear();
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
rowDel(row) {
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(row.id);
})
.then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
beforeClose (done) {
done()
this.form = {};
this.view = false;
},
selectionChange(list) {
this.selectionList = list;
},
selectionClear() {
this.selectionList = [];
this.$refs.table.clearSelection();
},
currentChange(currentPage) {
this.page.currentPage = currentPage;
this.onLoad(this.page);
},
sizeChange(pageSize) {
this.page.pageSize = pageSize;
this.onLoad(this.page);
},
onLoad(page, params = {}) {
this.loading = true;
const {
workOrderType,
discoveryNode,
workOrderNumber,
orderCode,
} = this.query;
let values = {
workOrderType_: workOrderType,
discoveryNode_: discoveryNode,
workOrderNumber_: workOrderNumber,
orderCode_: orderCode,
};
getList(page.currentPage, page.pageSize, values).then(res => {
const data = res.data.data;
this.page.total = data.total;
this.data = data.records;
this.loading = false;
this.selectionClear();
});
}
}
};
</script>