Fedex / EcomWeb

Go to a project
Toggle navigation Toggle navigation pinning
zhanbo.xu
32a408a8 1 parent 281f1a07

feat: 新增PDD

Inline Side-by-side
Showing 2 changed files with 412 additions and 0 deletions
<template>
<div class="entrySreach">
<el-form
class="fedexFormStyle fedexformSreach fedexformSreachBottomBorder"
ref="sreachForm"
:model="sreachFormData"
label-position="top"
size="small"
>
<el-row class="row-border">
<el-col :span="5">
<Formitem label="提运单号" prop="billNo">
<el-input
type="text"
class="inputShadow"
id="inputInner--billNo"
resize="none"
v-model="sreachFormData.billNo"
clearable
placeholder=""
></el-input>
</Formitem>
</el-col>
<el-col :span="5">
<Formitem label="物流运单编号" prop="logisticsNo">
<FormTextareaInput
:formData="sreachFormData"
dataKey="logisticsNo"
@formChange="formChange"
/>
</Formitem>
</el-col>
<el-col :span="5">
<Formitem label="回执状态" prop="returnStatus">
<el-select
type="text"
id="inputInner--returnStatus"
v-model="sreachFormData.returnStatus"
clearable
placeholder=""
>
<el-option
v-for="(item, index) in $store.getters.dict.RECEIPT_STATUS"
:key="index"
:label="item.itemChineseName"
:value="item.itemValue"
></el-option>
</el-select>
</Formitem>
</el-col>
<el-col :span="5">
<Formitem label="电子口岸编号" prop="preNo">
<el-input
type="text"
class="inputShadow"
id="inputInner--preNo"
resize="none"
v-model="sreachFormData.preNo"
clearable
placeholder=""
></el-input>
</Formitem>
</el-col>
<el-col :span="2">
<el-form-item class="textCenter">
<el-button
class="entrySreachButton"
type="text"
icon="el-icon-search"
:loading="loadings.searchLoading"
@click="search(0)"
></el-button>
</el-form-item>
</el-col>
<el-col :span="2">
<el-form-item class="textCenter">
<el-button
type="text"
size="small"
icon="el-icon-refresh"
@click="clear"
>
重置
</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
<Table
class="fedexDetialTable fedexSreachTable"
ref="entryTable"
:data="tableData"
:headerData="headerData"
:maxHeight="tableMaxheight"
:border="true"
:pagination="true"
:order="false"
:loading="loadings.searchLoading"
:page="page.pageIndex"
:totalCount="page.total"
@sizeChange="sizeChange"
@currentChange="currentChange"
:selection="false"
:selectFixed="false"
:rowSelectDataType="false"
>
<template v-slot:returnStatus="scope">
<TablePopover
ref="returnStatusPopover"
dataKey="returnStatus"
:parentDom="$refs.entryTable"
:receiptDataHead="receiptDataHead"
:rowData="scope.row"
:tableData="tableData"
@popoverChange="popoverChange"
@popoverClose="popoverClose"
>
<div slot="title">
<span style="font-weight: 700; color: #515a6e">提运单号：</span
>{{ scope.row.billNo }}
</div>
<div slot="buttonLabel">
{{ scope.row.returnStatus }}
</div>
</TablePopover>
</template>
<template v-slot:billNo="scope">
<el-button type="text" @click="view(scope.row)">{{
scope.row.billNo
}}</el-button>
</template>
</Table>
</div>
</template>
<script>
import {
getExportArrivalInList,
getExportArrivalInReceipt,
} from "@/api/arrivalList-api";
export default {
name: "ArrivalList",
components: {},
data() {
return {
sreachFormData: {
logisticsNo: [],
billNo: "",
returnStatus: "",
preNo: "",
},
page: {
pageIndex: 1,
pageSize: 20,
total: 0,
},
tableData: [],
receiptDataHead: [
{
name: "回执状态",
value: "returnStatus",
width: "120",
align: "left",
},
{
name: "状态时间",
value: "returnTime",
width: "",
align: "left",
},
{
name: "回执描述",
value: "returnInfo",
width: "",
align: "left",
},
],
headerData: [
{
name: "回执状态",
value: "returnStatus",
width: "",
align: "left",
slot: true,
},
{
name: "提运单号",
value: "billNo",
width: "",
align: "left",
slot: true,
},
{
name: "物流运单编号",
value: "logisticsNo",
width: "",
align: "left",
},
{
name: "电商企业代码",
value: "ebccode",
width: "",
align: "left",
},
{
name: "电子口岸编号",
value: "preNo",
width: "",
align: "left",
},
{
name: "监管场所经营人代码",
value: "operatorCode",
width: "",
align: "left",
},
{
name: "监管场所经营人名称",
value: "operatorName",
width: "",
align: "left",
},
{
name: "监管场所代码",
value: "loctNo",
width: "",
align: "left",
},
{
name: "创建时间",
value: "createTime",
width: "",
align: "left",
},
],
loadings: {
searchLoading: false,
},
tableMaxheight: null,
originalLogisticsNo: "", // 用于保存原始的 logisticsNo 字符串
};
},
created() {
this.search(0);
},
mounted() {
this.tableMaxheight = window.innerHeight - 300;
},
methods: {
popoverClose(val) {
this.tableData.forEach((item) => {
item.returnStatusPopoverType = false;
item.popoverData = [];
});
this.$refs.entryTable.$refs.tables.$refs.bodyWrapper.style.overflowY =
"auto";
},
popoverChange(val) {
console.log(val);
this.tableData = val.tableData;
this.receiptApi(val.data.copNo, val.status)
.then((res) => {
val.tableData.forEach((item) => {
if (item.declareId == val.data.declareId) {
item.popoverData = res;
}
});
this.tableData = val.tableData;
})
.finally(() => {
this.$nextTick(() => {
this.$store.dispatch("setLoadingState", false);
this.$refs.returnStatusPopover.tableLoading = false;
});
});
},
//查询回执
receiptApi(id) {
return new Promise((resolve, reject) => {
let obj = { copNo: id };
getExportArrivalInReceipt(obj)
.then((res) => {
if (res.code === "200") {
resolve(res.data);
} else {
reject();
}
})
.catch((err) => {
console.log(err);
reject();
});
});
},
//查询详情
view(val) {
this.$router.push({
name: "ArrivalListDetail",
params: { data: val },
});
},
formChange(val) {
this.sreachFormData = val;
this.originalLogisticsNo = val.logisticsNo; // 保存原始的 logisticsNo 字符串
},
// 清空
clear() {
this.sreachFormData = {
ogisticsNo: [],
billNo: "",
returnStatus: "",
preNo: "",
};
this.originalLogisticsNo = "";
// this.search(0);
},
//查询
search(val) {
this.loadings.searchLoading = true;
if (val == 0) {
this.page.pageIndex = 1;
}
let obj = { ...this.sreachFormData }; // 使用对象展开运算符复制 sreachFormData
obj.pageIndex = this.page.pageIndex;
obj.pageSize = this.page.pageSize;
obj.logisticsNo = this.originalLogisticsNo;
if (obj.logisticsNo != null && obj.logisticsNo != "") {
obj.logisticsNo = obj.logisticsNo.split("\n");
} else {
obj.logisticsNo = [];
}
getExportArrivalInList(obj)
.then((res) => {
if (res.code === "200") {
this.tableData = res.data.value;
this.page.total = res.data.totalItems;
this.tableData.forEach((item, idx) => {
item.index = idx;
});
} else {
this.alertWarningMsg(res.message);
}
this.loadings.searchLoading = false;
})
.catch((err) => {
console.log(err);
this.loadings.searchLoading = false;
});
},
//分页
currentChange(val) {
this.page.pageIndex = val.page;
this.search(1);
},
sizeChange(val) {
this.page.pageSize = val;
this.search(1);
},
input() {
this.$forceUpdate();
},
},
};
</script>
<style scoped lang="scss">
@import "@/assets/styles/variables.scss";
.entrySreach {
height: 100%;
background-color: $menuLightBg;
.entrySreachButton {
display: inline-block;
font-size: 20px;
color: $fedexButton !important;
}
.optionButton {
padding: 10px;
text-align: left;
.el-button {
color: $fedexButton;
border-color: $fedexButton !important;
svg {
display: inline-block;
margin-right: 5px;
fill: $fedexButton;
}
}
.entrySaveButton:hover,
.entrySaveButton:focus {
color: $menuLightBg !important;
background-color: $fedexButton !important;
}
}
}
.texttareaTip {
position: absolute;
top: 52%;
right: 20px;
transform: translate(0, -50%);
z-index: 10;
}
</style>