254 lines
7.8 KiB
Vue
254 lines
7.8 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-form ref="form" size="mini" :model="form" label-width="80px">
|
||
<!-- <SearchForm :ref="form" :model="picUrl" ref="queryForm" size="small" :maxShow="8" label-width="100px" v-show="showSearch" @search="getList" @reset="resetQuery"> -->
|
||
<el-row :gutter="20">
|
||
<el-col :span="8">
|
||
<el-form-item label="上传图片" prop="xxx" label-width="80px">
|
||
<ImageUpload ref="imageUpload" v-model="form.picUrl" @input="handleInput" ></ImageUpload>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row >
|
||
<!-- </SearchForm> -->
|
||
</el-form>
|
||
|
||
<xd-table v-loading="loading"
|
||
border stripe
|
||
size="small"
|
||
ref="multipleTable"
|
||
:data="emisTmsScanRecordList"
|
||
:showSearch.sync="showSearch"
|
||
:queryParams="queryParams"
|
||
:total="emisTmsScanRecordList.length"
|
||
@queryTable="getList"
|
||
@selection-change="handleSelectionChange"
|
||
v-if="tableHeight" :max-height="tableHeight + 'px'"
|
||
>
|
||
<div slot="toolbar">
|
||
<el-row :gutter="10" class="mb8">
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
size="mini"
|
||
@click="handleScanUpload"
|
||
>上传</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
size="mini"
|
||
@click="handleDelete"
|
||
>删除</el-button>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
<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('图片URL')" align="center" prop="fileUrl" min-width="100" />
|
||
<el-table-column :label="$t('上传网点')" align="center" prop="scanSite" min-width="100" />
|
||
<el-table-column :label="$t('上传人')" align="center" prop="createBy" min-width="100" />
|
||
<el-table-column :label="$t('大小')" align="center" prop="volumeWeight" min-width="100">
|
||
<template slot-scope="scope">
|
||
<span>{{ scope.row.fileSiez + "KB" }}</span>
|
||
</template>
|
||
</el-table-column>/>
|
||
</xd-table>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { addEmisWaybillAttachment } from "@/api/emis/emisWaybillAttachment";
|
||
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
|
||
import emisWaybillView from '@/views/emis/emisWaybill/emisWaybillView';
|
||
import emisWaybillForm from '@/views/emis/emisWaybill/emisWaybillForm';
|
||
// import { doScan } from "@/api/emis/emisTmsScanRecord";
|
||
import { getDateTimeToString } from '@/utils/payutils'
|
||
|
||
export default {
|
||
name: "UploadThePictureOfTheSendWaybillShipment",
|
||
components: { elDateSimplePicker,emisWaybillView,emisWaybillForm },
|
||
dicts: [
|
||
],
|
||
data() {
|
||
return {
|
||
// 遮罩层
|
||
loading: false,
|
||
// 选中数组
|
||
ids: [],
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
// 显示搜索条件
|
||
showSearch: true,
|
||
// 总条数
|
||
total: 0,
|
||
dataMap:new Map(),
|
||
// 运单扫描记录数据
|
||
emisTmsScanRecordList: [],
|
||
// emisTmsScanRecordList: [],
|
||
openForm: false,
|
||
titleForm: "",
|
||
tableHeight: 200,
|
||
|
||
titleEmisWaybill: "",
|
||
openEmisWaybill: false,
|
||
|
||
queryParams:{},
|
||
|
||
// 显示编辑框更多
|
||
moreInputVisible: false,
|
||
|
||
// 表单参数
|
||
form: {
|
||
picUrl:null,
|
||
},
|
||
|
||
};
|
||
},
|
||
created() {
|
||
this.$nextTick(function() {
|
||
let form = this.$refs.form.$el;
|
||
let tableH = form.offsetHeight+265;
|
||
this.tableHeight = window.innerHeight - tableH;
|
||
});
|
||
},
|
||
methods: {
|
||
getList(){
|
||
|
||
},
|
||
handleInput(item, size){
|
||
if(item.trim() == ""){
|
||
return;
|
||
}
|
||
let scList = item.trim().split(/[；\;\,\，\n]/)||[];
|
||
scList.forEach(item=>{
|
||
let billCode = this.extractSubstring(item);
|
||
if(this.dataMap[billCode]) return;
|
||
let record = {};
|
||
record.billCode=billCode;
|
||
record.fileUrl=item;
|
||
record.scanSiteCode=this.$store.getters.ownerSiteCode;
|
||
record.scanSite=this.$store.getters.ownerSiteName;
|
||
record.createBy=this.$store.getters.empName;
|
||
record.signManCode=this.$store.getters.empCode;
|
||
record.createTime=getDateTimeToString(new Date());
|
||
record.remark = "";
|
||
record.fileName="寄件底单";
|
||
record.attachType="2";
|
||
for(let name in size){
|
||
if(name.indexOf(billCode) > -1){
|
||
record.fileSiez = parseFloat((size[name]/1024).toFixed(2));
|
||
break;
|
||
}
|
||
}
|
||
let indexBillCode=billCode;
|
||
this.dataMap[indexBillCode]=record;
|
||
this.emisTmsScanRecordList.push(record);
|
||
// getWaybillDetail(billCode).then(response => {
|
||
// debugger;
|
||
// if(!response || response.code != 200){
|
||
// this.$modal.msgError(response && response.msg || "未知错误");
|
||
// return;
|
||
// }
|
||
|
||
|
||
// })
|
||
});
|
||
// this.$refs.imageUpload.fileList = [];
|
||
this.form.picUrl =[];
|
||
},
|
||
/** 上传按钮操作 */
|
||
handleScanUpload(){
|
||
var selData = this.selection;
|
||
selData.forEach(item=>{
|
||
addEmisWaybillAttachment(item).then(response => {
|
||
if(!response || response.code != 200 ){
|
||
this.$modal.msgError(response && response.msg || "未知错误");
|
||
return;
|
||
}
|
||
|
||
let newList = [];
|
||
this.emisTmsScanRecordList.forEach(item => {
|
||
if(this.ids.indexOf(item.billCode) > -1){
|
||
this.dataMap[item.billCode]=null;
|
||
}else{
|
||
newList.push(item);
|
||
}
|
||
})
|
||
this.ids = [];
|
||
this.selection = null;
|
||
this.emisTmsScanRecordList = newList;
|
||
this.$modal.msgSuccess(response.msg);
|
||
|
||
});
|
||
});
|
||
},
|
||
/** 重置按钮操作 */
|
||
resetQuery() {
|
||
this.resetForm("queryForm");
|
||
this.handleQuery();
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map(item => item.billCode)
|
||
this.selection = selection;
|
||
this.single = selection.length!==1
|
||
this.multiple = !selection.length
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDelete(row) {
|
||
// const ids = row.id || this.ids;
|
||
// this.$modal.confirm('是否确认删除').then(function() {
|
||
// return delEmisWaybill(ids);
|
||
// }).then(() => {
|
||
// this.getList();
|
||
// this.$modal.msgSuccess("删除成功");
|
||
// }).catch(() => {});
|
||
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;
|
||
},
|
||
extractSubstring(str) {
|
||
// 找到最后一个 '-' 的位置
|
||
let lastSlashIndex = str.lastIndexOf('-');
|
||
|
||
// 找到最后一个 '_' 的位置
|
||
let lastDotIndex = str.lastIndexOf('_');
|
||
|
||
// 检查 '-' 和 '_' 是否存在，并且 '-' 在 _' 之前
|
||
if (lastSlashIndex !== -1 && lastDotIndex !== -1 && lastSlashIndex < lastDotIndex) {
|
||
// 提取 '-' 和 '_' 之间的子字符串
|
||
return str.substring(lastSlashIndex + 1, lastDotIndex);
|
||
} else {
|
||
// 返回空字符串或抛出错误，视需求而定
|
||
return '';
|
||
}
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.el-divider{
|
||
margin-top: 0px;
|
||
background: 0 0;
|
||
border-top: 1px solid #E6EBF5;
|
||
}
|
||
.el-divider__text {
|
||
color: #0955ee;
|
||
cursor: pointer;
|
||
}
|
||
</style>
|