emis-frontend/src/views/emis/emisTmsScanRecord/signAndRecord.vue

571 lines
19 KiB
Vue
Raw Normal View History

<template>
<div class="app-container">
<el-row :gutter="0">
<el-form ref="form" size="mini" :model="form" :rules="rules" label-width="80px">
<el-col :span="8">
<el-form-item :label="$t('派件员')" prop="dispatchOrSendManCode">
<EmisUserSimplePicker v-model="form.dispatchOrSendManCode" postCode="RSD" @onChange="onSendStaffSelect" ></EmisUserSimplePicker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="签收人" prop="xxxxx" label-width="60px">
<EmisUserSimplePicker v-model="form.xxx" postCode="RSD" @onChange="onSignStaffSelect" ></EmisUserSimplePicker>
<!-- <el-input v-model="form.xxxxx" placeholder="请输入" /> -->
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="图片签收" prop="xxx">
<ImageOneUpload v-model="form.picUrl" @input="handleInput" ></ImageOneUpload>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="扫描单号" prop="billCode" label-width="70px">
<span slot="label">
<span style="color: red">扫描单号</span>
</span>
<el-input v-model="form.billCode" clearable="" placeholder="单号输入后按回车" @keyup.enter.native="handleScanInput" >
<i slot="suffix" class="iconfont">&#xe656;</i>
</el-input>
<span style="color: gray">提示:回车保存本地</span>
</el-form-item>
</el-col>
</el-form>
</el-row>
<el-row>
<el-col class="line" :span="24">
<sapn >运单信息</sapn>
</el-col>
</el-row>
<el-row :gutter="0">
<el-form ref="form" size="mini" :model="res" :rules="rules" label-width="80px">
<el-col :span="6">
<el-form-item label="寄件日期" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="寄件网点" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="录单重量" prop="weight" label-width="80px">
<el-input v-model="weight" placeholder="请输入" disabled >
<span slot="suffix">KG</span>
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="回单编号" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="派件日期" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="派件网点" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="代收货款" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="到付款" prop="xxx" label-width="80px">
<el-input v-model="xxx" placeholder="请输入" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="客户名称" prop="xxx" label-width="80px">
<el-input v-model="customerName" placeholder="" disabled >
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-form>
</el-row>
<div slot="toolbar">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
:disabled="multiple"
@click="handleScanUpload"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>上传</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="clearSelectionBatch"
v-hasPermi="['emis:emisTmsScanRecord:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleBatchScan"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>批量扫描</el-button>
</el-col>
</el-row>
</div>
<el-table ref="multipleTable" border stripe v-loading="loading" :data="emisTmsScanRecordList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column :label="$t('运单号')" align="center" prop="billCode" min-width="150" />
<el-table-column :label="$t('派件员')" align="center" prop="dispatchOrSendMan" min-width="100" />
<el-table-column :label="$t('签收人')" align="center" prop="signMan" min-width="100" />
<el-table-column :label="$t('签收网点')" align="center" prop="signSite" min-width="100" />
<el-table-column :label="$t('签收时间')" align="center" prop="signDate" min-width="170" >
<template slot-scope="scope">
<span>{{ parseTime(scope.row.scanDate) }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('寄件日期')" align="center" prop="xxx" min-width="170" >
<template slot-scope="scope">
<span>{{ parseTime(scope.row.xxx) }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('寄件网点')" align="center" prop="signSite" min-width="100" />
<el-table-column :label="$t('到付转月结用户编号')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('到付转月结用户名称')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('派件日期')" align="center" prop="xxx" min-width="170" >
<template slot-scope="scope">
<span>{{ parseTime(scope.row.xxx) }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('派件网点')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('录件重量')" align="center" prop="weight" min-width="100" />
<el-table-column :label="$t('到付款')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('代收付款')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('备注')" align="center" prop="remark" min-width="100" />
<el-table-column :label="$t('签收图片')" align="center" prop="scanWeight" min-width="100">
<el-table-column :label="$t('保存目录')" align="center" prop="xxxx" min-width="100" />
<el-table-column :label="$t('上传网点')" align="center" prop="xxxx" min-width="100" />
<el-table-column :label="$t('上传人')" align="center" prop="xxxx" min-width="100" />
<el-table-column :label="$t('文件大小(KB)')" align="center" prop="xxxx" min-width="120" />
</el-table-column>
</el-table>
<!-- <div style="text-align: center;margin-bottom: 10px;">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div> -->
<el-dialog :title="titleBatch" :visible.sync="openBatch" width="50%" v-dialogDrag :close-on-click-modal="false" append-to-body>
<el-form ref="formBatch" :model="formBatch" :rules="rulesBatch" size="mini" label-width="60px">
<el-row>
<el-col :span="24">
<el-form-item :label="$t('运单号')" prop="billCode">
<el-input v-model="formBatch.billCode" type="textarea" :rows="8" placeholder="运单号" />
</el-form-item>
</el-col>
<el-col :span="24">
<div style="padding-left: 60px;font-size: 12px;"> T0123219321 有问题</div>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align:center">
<el-button type="primary" @click="submitFormBatch">确 定</el-button>
<el-button @click="cancelBatch">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listEmisWaybill, getWaybillDetail,getEmisWaybill } from "@/api/emis/emisWaybill";
import { doScan } from "@/api/emis/emisTmsScanRecord";
import CustomerPicker from '@/views/emis/EmisBaseTools/CustomerPicker.vue';
import CustomerAddressSimplePicker from '@/views/emis/EmisBaseTools/CustomerAddressSimplePicker.vue';
import EmisUserSimplePicker from '@/views/emis/EmisBaseTools/EmisUserSimplePicker.vue';
// import FileUpload from '@/components/FileUpload/index.vue';
export default {
name: "SignAndRecord",
props:{
id:undefined
},
components: { EmisUserSimplePicker, CustomerPicker, CustomerAddressSimplePicker },
dicts: ['emis_scan_type'],
data() {
return {
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
checkedDetail:[],
// 遮罩层
loading: false,
// 表单参数
form: {},
titleBatch: "",
formBatch: {},
openBatch:false,
dataMap:new Map(),
emisTmsScanRecordList: [],
// 是否显示弹出层
open: false,
// 表单校验
rules: {
// billCode: [
// { required: true, message: "billCode不能为空", trigger: "blur" }
// ],
// id: [
// { required: true, message: "id不能为空", trigger: "blur" }
// ],
},
rulesBatch: {
// id: [
// { required: true, message: "id不能为空", trigger: "blur" }
// ],
},
//查询信息展示
res:{
xxx:"xxx"
}
};
},
watch: {
"id": {
handler (newValue, oldValue) {
this.id = newValue;
this.initData();
},
deep: true
}
},
created() {
this.reset();
this.form.scanSiteCode=this.$store.getters.ownerSiteCode;
this.form.scanSite=this.$store.getters.ownerSiteName;
this.form.scanMan=this.$store.getters.empName;
this.form.scanManCode=this.$store.getters.empCode;
this.form.recordMan=this.$store.getters.empName;
this.form.recordManCode=this.$store.getters.empCode;
this.form.dispatchOrSendMan=this.$store.getters.empName;
this.form.dispatchOrSendManCode=this.$store.getters.empCode;
// this.form.scanWeight = "1.0";
console.log(this.form)
},
methods: {
getRowSelect(row, column, event) {
// dosomething
},
handleInput(item){
debugger;
},
handleCustomerSelect(item){
// debugger
this.form.customerCode=item.customerCode;
this.form.customerName=item.name;
},
// onStaffSelect(item){
// this.form.dispatchOrSendMan=item.empName || this.$store.getters.empName;
// this.form.dispatchOrSendManCode=item.empCode || this.$store.getters.empCode;
// },
onSendStaffSelect(item){
this.form.dispatchOrSendMan=item.empName || this.$store.getters.empName;
this.form.dispatchOrSendManCode=item.empCode || this.$store.getters.empCode;
},
onSignStaffSelect(item){
this.form.dispatchOrSendMan=item.empName || this.$store.getters.empName;
this.form.dispatchOrSendManCode=item.empCode || this.$store.getters.empCode;
},
getRowsSelect(arr) {
this.form.ids= arr.map(item=>item.id)
},
handleBatchScan(){
this.formBatch = {
billCode: null,
}
this.titleBatch="批量扫描";
this.openBatch=true;
},
clearSelectionBatch(){
let newList =[];
console.log(this.ids)
this.emisTmsScanRecordList.forEach(item=>{
if(this.ids.indexOf(item.billCode) == -1){
newList.push(item);
}else{
this.dataMap[item.billCode]=null;
}
});
this.emisTmsScanRecordList = newList;
},
cancelBatch(){
this.openBatch=false;
},
submitFormBatch(){
if(this.formBatch.billCode==null || this.formBatch.billCode==''){
this.$message.error("输入单号后回车");
return;
}
let bcList=this.formBatch.billCode.split(/[;\;\,\,\n]/)||[];
let scanWeight = this.form.scanWeight
let dispatchOrSendManCode = this.form.dispatchOrSendManCode;
let scList=bcList.map(function(code) {
return {
billCode:code,
scanWeight:scanWeight,
// scanWeight:null,
dispatchOrSendManCode: dispatchOrSendManCode
}
}
)
let scanInfo = {
scanType:"50",
opType:1,
scanData:scList
};
doScan(scanInfo).then(response => {
if(!response.data.scanResult || response.data.scanResult.length == 0){
this.$message.error("未查到单号");
return;
}
for (let index = 0; index < response.data.scanResult.length; index++) {
let scanRstItem = response.data.scanResult[index];
console.log(scanRstItem);
if(scanRstItem.result != 'success'){
this.$modal.msgError(scanRstItem.message);
return;
}
this.form.scanType = '50';
this.form.scanDate = new Date();
let record =Object.assign({}, this.form)
record.billCode=scanRstItem.billCode;
console.log(record)
let indexBillCode=record.billCode;
this.dataMap[indexBillCode]=record;
this.emisTmsScanRecordList.push(record);
}
});
this.openBatch=false;
},
// 表单重置
reset() {
this.form = {
id: null,
billCode: null,
scanType: null,
preOrNextStation: null,
preOrNextStationCode: null,
preOrNextStationPhone: null,
preOrNextManCode: null,
preOrNextManPhone: null,
scanDate: null,
scanManCode: null,
scanManPhone: null,
scanMan: null,
preOrNextMan: null,
scanSite: null,
scanSiteCode: null,
scanSitePhone: null,
scanWeight: null,
weight: null,
dispatchOrSendMan: null,
dispatchOrSendManCode: null,
dispatchOrSendManPhone: null,
signDate: null,
signMan: null,
signSite: null,
signSiteCode: null,
recordMan: null,
recordManCode: null,
recordManPhone: null,
recordSiteCode: null,
truckMan: null,
truckCode: null,
dataFrom: null,
picUrl: null,
status: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
updateSite: null,
createSite: null,
customerCode:null,
customerName:null
};
this.resetForm("form");
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.billCode)
this.single = selection.length!==1
this.multiple = !selection.length
// this.checkedDetail = selection;
// if (selection.length > 1) {
// this.$refs.multipleTable.clearSelection();
// this.$refs.multipleTable.toggleRowSelection(selection.pop());
// } else {
// //将选中行存入缓存中
// this.checkedDetail = selection;
// }
},
// 扫描上传
handleScanUpload(){
var selData = this.$refs.multipleTable.selection;
console.log(selData);
let scanData=[];
selData.forEach(item=>{
scanData.push(
{
billCode:item.billCode,
scanWeight:item.scanWeight,
dispatchOrSendManCode:item.dispatchOrSendManCode,
scanDate:item.scanDate
}
);
});
// 检查
let scanInfo = {scanType:"50",opType:2,scanData:scanData}
console.log(scanInfo)
doScan(scanInfo).then(response => {
console.log(response);
let scanRstItem = response.data.scanResult[0];
console.log(scanRstItem);
if(scanRstItem.result != 'success'){
this.$modal.msgError(scanRstItem.message);
return;
}
this.$modal.msgSuccess(scanRstItem.message);
// this.form.scanType = '10';
// this.form.scanDate = new Date();
// let record =Object.assign({}, this.form);
// console.log(record)
// let indexBillCode=record.billCode;
// this.dataMap[indexBillCode]=record;
// this.emisTmsScanRecordList.push(record);
// this.form.billCode =null;
});
},
handleScanInput(){
if(this.form.billCode==null || this.form.billCode==''){
this.$message.error("输入单号后回车");
return;
}
if(this.dataMap[this.form.billCode]){
this.$message.error("重复扫描");
this.playNoticeTone(1);
return;
}
// 检查
let scanInfo = {
scanType:"50",
opType:1,
scanData:[
{
billCode:this.form.billCode,
scanWeight:this.form.scanWeight,
dispatchOrSendManCode:this.form.dispatchOrSendManCode
}
]
};
doScan(scanInfo).then(response => {
console.log(response);
let scanRstItem = response.data.scanResult[0];
console.log(scanRstItem);
if(scanRstItem.result != 'success'){
this.$modal.msgError(scanRstItem.message);
return;
}
this.form.scanType = '50';
this.form.scanDate = new Date();
let record =Object.assign({}, this.form)
record.billCode=scanRstItem.billCode;
console.log(record)
let indexBillCode=record.billCode;
this.dataMap[indexBillCode]=record;
this.emisTmsScanRecordList.push(record);
});
this.form.billCode =null;
},
}
};
</script>
<style rel="stylesheet/scss" lang="scss">
.line{
line-height: 28px;
font-size: 16px;
color: black;
font-weight: 700;
margin-left: 10px;
margin-bottom: 20px;
border-bottom-color: gray;
border-bottom-style: solid;
border-bottom-width: 0.5px;
}
</style>