619 lines
21 KiB
Vue
619 lines
21 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-row :gutter="0">
|
||
<el-form ref="form" size="mini" :model="form" :rules="rules" label-width="70px">
|
||
<el-col :span=16>
|
||
<el-col :span="12">
|
||
<el-form-item :label="$t('派件员')" prop="dispatchManCode">
|
||
<EmisUserSimplePicker v-model="form.dispatchManCode" postCode="RSD" @onChange="onSendStaffSelect" ></EmisUserSimplePicker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="签收人" prop="signMan" label-width="70px">
|
||
<!-- <EmisUserSimplePicker v-model="form.signMan" postCode="RSD" @onChange="onSignStaffSelect" ></EmisUserSimplePicker> -->
|
||
<!-- <el-input v-model="form.signMan" clearable="" placeholder="" /> -->
|
||
<span slot="label">
|
||
<span style="color: red">{{ $t('签收人') }}</span>
|
||
</span>
|
||
<el-select
|
||
style="width:100%"
|
||
filterable
|
||
allow-create
|
||
clearable
|
||
v-model="form.signMan"
|
||
default-first-option
|
||
>
|
||
<el-option v-for="item in dict.type.emis_signs_remark" :key="item.value" :label="item.label" :value="item.label" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<!-- <el-col :span="12">
|
||
<el-form-item :label="$t('客户名称')" prop="customerCode" label-width="70px">
|
||
<CustomerSimplePicker v-model="form.customerCode" postCode="RSD" @onChange="onCustomerSelect" ></CustomerSimplePicker>
|
||
</el-form-item>
|
||
</el-col> -->
|
||
<el-col :span="24">
|
||
<el-form-item label="扫描单号" prop="billCode" label-width="70px">
|
||
<span slot="label">
|
||
<span style="color: red">{{ $t('扫描单号') }}</span>
|
||
</span>
|
||
<el-input v-model="form.billCode" clearable="" placeholder="单号输入后按回车" @keyup.enter.native="handleScanInput" >
|
||
<i slot="suffix" class="iconfont"></i>
|
||
</el-input>
|
||
<span style="color: gray">提示：回车保存本地</span>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-col>
|
||
<el-col :span="8">
|
||
<el-form-item label="图片签收" prop="xxx">
|
||
<ImageUpload v-model="form.picUrl" @input="handleInput" ></ImageUpload>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col class="line" :span="24">
|
||
<span >运单信息</span>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="0">
|
||
<el-form ref="form" size="mini" :model="record" :rules="rules" label-width="80px">
|
||
<el-col :span="6">
|
||
<el-form-item label="寄件日期" prop="registerDate" label-width="80px">
|
||
<el-input v-model="record.registerDate" :value="parseTime(record.registerDate)" placeholder="" disabled >
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="寄件网点" prop="sendSiteName" label-width="80px">
|
||
<el-input v-model="record.sendSiteName" placeholder="" disabled >
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="录单重量" prop="volumeWeight" label-width="80px">
|
||
<el-input v-model="record.volumeWeight" placeholder="" disabled >
|
||
<span slot="suffix">KG</span>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="派件日期" prop="dispatchDate" label-width="80px">
|
||
<el-input v-model="record.dispatchDate" :value="parseTime(record.dispatchDate)" placeholder="" disabled >
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="派件网点" prop="dispatchSiteName" label-width="80px">
|
||
<el-input v-model="record.dispatchSiteName" placeholder="" disabled >
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<el-form-item label="客户名称" prop="custName" label-width="80px">
|
||
<el-input v-model="record.custName" placeholder="" disabled >
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="备注" prop="remark">
|
||
<el-input v-model="record.remark" placeholder="" disabled/>
|
||
</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:batchScan']"
|
||
>批量扫描</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="dispatchMan" min-width="100" />
|
||
<el-table-column :label="$t('签收人')" align="center" prop="signMan" min-width="100" />
|
||
<el-table-column :label="$t('签收网点')" align="center" prop="signSiteCode" 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="registerDate" min-width="170" >
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.registerDate) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="$t('寄件网点')" align="center" prop="sendSiteName" min-width="100" />
|
||
<!-- <el-table-column :label="$t('到付转月结用户编号')" align="center" prop="customerCode" min-width="100" />
|
||
<el-table-column :label="$t('到付转月结用户名称')" align="center" prop="customerName" min-width="100" /> -->
|
||
<el-table-column :label="$t('派件日期')" align="center" prop="dispatchDate" min-width="170" >
|
||
<template slot-scope="scope">
|
||
<span>{{ parseTime(scope.row.dispatchDate) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="$t('派件网点')" align="center" prop="dispatchSiteName" min-width="100" />
|
||
<el-table-column :label="$t('录件重量')" align="center" prop="billWeight" min-width="100" />
|
||
<el-table-column :label="$t('备注')" align="center" prop="remark" min-width="100" />
|
||
<el-table-column :label="$t('签收图片')" align="center" min-width="100">
|
||
<el-table-column :label="$t('上传图片')" align="center" prop="picUrls" width="200" >
|
||
<template slot-scope="scope">
|
||
<!-- <span class="ellipsis">{{scope.row.picUrl}}</span> -->
|
||
<ImagePreview height="50px" v-for="pic in scope.row.picUrls" :key="pic" :src="pic" ></ImagePreview>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column :label="$t('上传网点')" align="center" prop="scanSite" min-width="100" >
|
||
</el-table-column>
|
||
<el-table-column :label="$t('上传人')" align="center" prop="scanMan" min-width="100" />
|
||
<!-- <el-table-column :label="$t('文件大小(KB)')" align="center" prop="xxxx" min-width="120" /> -->
|
||
</el-table-column>
|
||
</el-table>
|
||
<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 { getWaybillDetail } from "@/api/emis/emisWaybill";
|
||
import { doScan } from "@/api/emis/emisTmsScanRecord";
|
||
import CustomerSimplePicker from '@/views/emis/EmisBaseTools/CustomerSimplePicker.vue';
|
||
import EmisUserSimplePicker from '@/views/emis/EmisBaseTools/EmisUserSimplePicker.vue';
|
||
|
||
export default {
|
||
name: "SignAndRecord",
|
||
props:{
|
||
id:undefined
|
||
},
|
||
components: { EmisUserSimplePicker, CustomerSimplePicker },
|
||
dicts: ['emis_scan_type', 'emis_signs_remark'],
|
||
data() {
|
||
return {
|
||
// 选中数组
|
||
ids: [],
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
checkedDetail:[],
|
||
// 遮罩层
|
||
loading: false,
|
||
// 表单参数
|
||
form: {},
|
||
titleBatch: "",
|
||
formBatch: {},
|
||
openBatch:false,
|
||
dataMap:new Map(),
|
||
emisTmsScanRecordList: [],
|
||
|
||
|
||
// 是否显示弹出层
|
||
open: false,
|
||
// 表单校验
|
||
rules: {
|
||
|
||
},
|
||
rulesBatch: {
|
||
|
||
},
|
||
|
||
//查询信息展示
|
||
record:{}
|
||
};
|
||
},
|
||
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;
|
||
},
|
||
|
||
methods: {
|
||
handleInput(item){
|
||
this.form.picUrl = item;
|
||
},
|
||
// onCustomerSelect(item){
|
||
// if(item != null){
|
||
// this.form.customerCode=item.customerCode;
|
||
// this.form.customerName=item.customerName;
|
||
// }else{
|
||
// this.form.customerCode=null;
|
||
// this.form.customerName=null;
|
||
// }
|
||
// },
|
||
onSendStaffSelect(item){
|
||
this.form.dispatchMan=item.empName;
|
||
this.form.dispatchManCode=item.empCode;
|
||
},
|
||
onSignStaffSelect(item){
|
||
this.form.signMan=item.empName || this.$store.getters.empName;
|
||
this.form.signManCode=item.empCode || this.$store.getters.empCode;
|
||
},
|
||
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]/)||[];
|
||
bcList.forEach((code) => {
|
||
this.getDetail(code, true)
|
||
})
|
||
this.openBatch=false;
|
||
},
|
||
// 表单重置
|
||
reset() {
|
||
this.form = {
|
||
id: null,
|
||
orderSn: null,
|
||
custOrderId: null,
|
||
billCode: null,
|
||
billCodeSub: null,
|
||
orderStatus: null,
|
||
waybillStatus: null,
|
||
orderType: null,
|
||
orderDate: null,
|
||
userId: null,
|
||
customerCode: null,
|
||
customerName: null,
|
||
receiveCustomerCode: null,
|
||
receiveCustomerName: null,
|
||
thirdCustomerCode: null,
|
||
thirdCustomerName: null,
|
||
openId: null,
|
||
receiveName: null,
|
||
receiveCompany: null,
|
||
receiveMobile: null,
|
||
receiveTel: null,
|
||
receiveCountry: null,
|
||
receiveProvince: null,
|
||
receiveCity: null,
|
||
receiveCounty: null,
|
||
receiveTown: null,
|
||
receiveAddress: null,
|
||
receivePostcode: null,
|
||
receivePcd: null,
|
||
sendName: null,
|
||
sendCompany: null,
|
||
sendMobile: null,
|
||
sendTel: null,
|
||
sendCountry: null,
|
||
sendProvince: null,
|
||
sendCity: null,
|
||
sendCounty: null,
|
||
sendTown: null,
|
||
sendAddress: null,
|
||
sendPostcode: null,
|
||
sendPcd: null,
|
||
paymentType: null,
|
||
calcFeeType: null,
|
||
custNo: null,
|
||
transLineType: null,
|
||
productType: null,
|
||
timeType: null,
|
||
meterType: null,
|
||
customsClear: null,
|
||
customsEclaration: null,
|
||
estimateDate: null,
|
||
packType: null,
|
||
dispatchMethod: null,
|
||
pickupMethod: null,
|
||
pickStartDate: null,
|
||
pickFinishDate: null,
|
||
pickFailReason: null,
|
||
intoWarehouseCode: null,
|
||
intoWarehouseName: null,
|
||
intoWarehouseAddress: null,
|
||
intoWarehouseContact: null,
|
||
intoWarehousePhone: null,
|
||
intoWarehouseBillCode: null,
|
||
warehouseInNo: null,
|
||
customerDeliveryBeginTime: null,
|
||
customerDeliveryEndTime: null,
|
||
goodsType: null,
|
||
goodsInfo: null,
|
||
goodsPics: null,
|
||
blPrepareInFreight: null,
|
||
prepareInEstFee: null,
|
||
prepareInRealFee: null,
|
||
prepareInExpress: null,
|
||
prepareInBillCode: null,
|
||
prepareInRemark: null,
|
||
prepareInSupplier: null,
|
||
totalWeight: null,
|
||
totalVolume: null,
|
||
parcelQty: null,
|
||
billWeight: null,
|
||
volumeWeight: null,
|
||
currency: null,
|
||
settlementWeight: null,
|
||
feeWeight: null,
|
||
freight: null,
|
||
blOverLong: null,
|
||
blBill: null,
|
||
blBillText: null,
|
||
blOverWeight: null,
|
||
overWeightNumber: null,
|
||
feeRemaker: null,
|
||
thirdCode: null,
|
||
realValue: null,
|
||
blInsure: null,
|
||
insureValue: null,
|
||
insureValueCurrency: null,
|
||
insureFeeCurrency: null,
|
||
insureFee: null,
|
||
insureRemark: null,
|
||
insureSiteCode: null,
|
||
insureDate: null,
|
||
blPrint: null,
|
||
printManCode: null,
|
||
printSite: null,
|
||
printDate: null,
|
||
printCount: null,
|
||
blDispFd: null,
|
||
transferCode: null,
|
||
transferBillcode: null,
|
||
dispFdDate: null,
|
||
dispFdReason: null,
|
||
currentSiteCode: null,
|
||
nextSiteCode: null,
|
||
lastSiteCode: null,
|
||
registerSiteCode: null,
|
||
registerDate: null,
|
||
registerManCode: null,
|
||
takePieceEmployeeCode: null,
|
||
sendSiteCode: null,
|
||
sendDate: null,
|
||
dispatchManCode: null,
|
||
dispatchDate: null,
|
||
dispatchSiteCode: null,
|
||
produceBillDate: null,
|
||
produceBillSiteCode: null,
|
||
produceBillManCode: null,
|
||
destinationCode: null,
|
||
destinationProvince: null,
|
||
destinationCity: null,
|
||
destinationCounty: null,
|
||
dispatchUnderlingSiteCode: null,
|
||
destinationCenterCode: null,
|
||
marketManCode: null,
|
||
payee: null,
|
||
salesmen: null,
|
||
operateEmployeeCode: null,
|
||
blIsQuestion: null,
|
||
problemType: null,
|
||
problemCause: null,
|
||
problemDelayDays: null,
|
||
blMessage: null,
|
||
blAcceptMessage: null,
|
||
blGenSubbill: null,
|
||
signMan: null,
|
||
signManCode: null,
|
||
signSiteCode: null,
|
||
signDate: null,
|
||
billPicSendRmk: null,
|
||
billPicDispatchRmk: null,
|
||
timezoneOffset: null,
|
||
delFlag: null,
|
||
createBy: null,
|
||
createTime: null,
|
||
updateBy: null,
|
||
updateTime: null,
|
||
remark: null,
|
||
createSite: null,
|
||
updateSite: null
|
||
};
|
||
this.resetForm("form");
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map(item => item.billCode)
|
||
this.single = selection.length!==1
|
||
this.multiple = !selection.length
|
||
},
|
||
// 扫描上传
|
||
handleScanUpload(){
|
||
var selData = this.$refs.multipleTable.selection;
|
||
console.log(selData);
|
||
let newList = [];
|
||
let scanData=[];
|
||
selData.forEach(item=>{
|
||
scanData.push(
|
||
{
|
||
billCode:item.billCode,
|
||
signMan:item.signMan,
|
||
// signManCode:item.signManCode,
|
||
picUrl:item.picUrl,
|
||
remark:item.remark,
|
||
scanWeight:item.scanWeight,
|
||
dispatchManCode:item.dispatchManCode,
|
||
// customerCode:item.customerCode,
|
||
// customerName:item.customerName,
|
||
// dispatchOrSendManCode:item.dispatchOrSendManCode,
|
||
// scanDate:item.scanDate
|
||
scanDate:item.scanDate || new Date()
|
||
}
|
||
);
|
||
});
|
||
|
||
// 检查
|
||
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;
|
||
}
|
||
|
||
// 删除上传记录
|
||
for(let sd=0;sd<this.emisTmsScanRecordList.length;sd++){
|
||
if( selData.filter(item => {
|
||
return this.emisTmsScanRecordList[sd].billCode == item.billCode
|
||
}).length == 0){
|
||
newList.push(this.emisTmsScanRecordList[sd])
|
||
}
|
||
}
|
||
this.emisTmsScanRecordList = newList
|
||
// 清空数据
|
||
this.record={};
|
||
this.$modal.msgSuccess(scanRstItem.message);
|
||
});
|
||
},
|
||
handleScanInput(){
|
||
if(this.form.billCode==null || this.form.billCode==''){
|
||
this.$message.error("输入单号后回车");
|
||
return;
|
||
}
|
||
if(!this.form.signMan){
|
||
this.$message.error("请先选择签收人");
|
||
return;
|
||
}
|
||
if(this.dataMap[this.form.billCode]){
|
||
this.$message.error("重复扫描");
|
||
this.playNoticeTone(1);
|
||
return;
|
||
}
|
||
this.getDetail(this.form.billCode)
|
||
this.form.billCode =null;
|
||
},
|
||
getDetail(billCode, isBatch){
|
||
getWaybillDetail(billCode).then(response => {
|
||
let scanRstItem = response.data;
|
||
console.log(scanRstItem);
|
||
if(response.code != 200){
|
||
this.$modal.msgError(scanRstItem.msg);
|
||
return;
|
||
}
|
||
if(scanRstItem.waybillStatus == "50"){
|
||
this.$modal.msgError("已扫描");
|
||
return;
|
||
}
|
||
let record =Object.assign({}, scanRstItem);
|
||
record.dispatchMan = this.form.dispatchMan;
|
||
record.dispatchManCode=this.form.dispatchManCode;
|
||
record.signManCode=this.form.signManCode;
|
||
record.signMan=this.form.signMan;
|
||
// record.customerCode=this.form.customerCode;
|
||
// record.customerName=this.form.customerName;
|
||
record.picUrl=this.form.picUrl || "";
|
||
record.picUrls=record.picUrl.split(",");
|
||
record.scanSite=this.form.scanSite;
|
||
record.scanMan=this.form.scanMan;
|
||
let indexBillCode=record.billCode;
|
||
this.dataMap[indexBillCode]=record;
|
||
this.emisTmsScanRecordList.push(record);
|
||
isBatch || this.emisTmsScanRecordList.length > 1 ? this.record = {} : this.record = record;
|
||
this.form.picUrl = "";
|
||
});
|
||
}
|
||
}
|
||
};
|
||
</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;
|
||
}
|
||
|
||
.ellipsis {
|
||
width:200px;
|
||
overflow: hidden; /* 确保超出容器的内容被裁剪 */
|
||
white-space: nowrap; /* 确保文本在一行内显示 */
|
||
text-overflow: ellipsis; /* 超出部分显示省略号 */
|
||
}
|
||
</style> |