zhanbo.xu

新增申报数据二次预览

1 +<template>
2 + <el-dialog
3 + class="entryDialog classCUploadDialog"
4 + :title="dataPreviewTitle"
5 + :visible.sync="batchModifyVisible"
6 + :show-close="false"
7 + width="700px"
8 + :close-on-click-modal="false"
9 + >
10 + <div style="margin-bottom: 10px">
11 + <span>
12 + 提运单号 数量:<strong>{{ tableData.length }}</strong>
13 + </span>
14 + <span style="margin-left: 20px">
15 + 物流运单编号 数量:<strong>{{ selectedDatas.length }}</strong>
16 + </span>
17 + </div>
18 + <Table
19 + class="fedexDetialTable fedexSreachTable"
20 + ref="entryTable"
21 + :data="tableData"
22 + :headerData="headerData"
23 + :border="true"
24 + :pagination="false"
25 + :order="false"
26 + >
27 + </Table>
28 + <div class="dialogOption entrySave revokeOperation">
29 + <el-button
30 + class="entrySaveButton entrySaveButton-background revokeSubmitBtn"
31 + type="primary"
32 + @click="formSubmit"
33 + >
34 + 确定
35 + </el-button>
36 + <el-button class="entrySaveButton" @click="cancelModify">关闭</el-button>
37 + </div>
38 + </el-dialog>
39 +</template>
40 +
41 +<script>
42 +export default {
43 + props: {
44 + showDialog: {
45 + type: Boolean,
46 + default: false,
47 + },
48 + dataPreviewTitle: {
49 + type: String,
50 + default: "预览",
51 + },
52 + selectedDatas: {
53 + type: Array,
54 + default: () => [],
55 + },
56 + },
57 + data() {
58 + return {
59 + headerData: [
60 + {
61 + name: "提运单号",
62 + value: "billNo",
63 + width: "180px",
64 + align: "left",
65 + },
66 + {
67 + name: "物流运单编号",
68 + value: "logisticsWaybillNumber",
69 + width: "",
70 + align: "left",
71 + },
72 + ],
73 + tableData: [],
74 + batchModifyVisible: false,
75 + };
76 + },
77 + watch: {
78 + showDialog(val) {
79 + if (val) {
80 + this.batchModifyVisible = val;
81 + this.tableData = this.processWaybills(this.selectedDatas);
82 + }
83 + },
84 + },
85 + created() {},
86 + methods: {
87 + processWaybills(data) {
88 + if (!Array.isArray(data)) {
89 + throw new Error("输入参数必须是数组");
90 + }
91 +
92 + return Array.from(
93 + data.reduce((map, item) => {
94 + const key = item.billNo;
95 + if (!map.has(key)) {
96 + map.set(key, {
97 + billNo: key,
98 + logisticsWaybillNumber: [],
99 + });
100 + }
101 + if (item.logisticsWaybillNumber) {
102 + map
103 + .get(key)
104 + .logisticsWaybillNumber.push(item.logisticsWaybillNumber);
105 + }
106 + return map;
107 + }, new Map()),
108 + ([_, value]) => ({
109 + ...value,
110 + logisticsWaybillNumber: value.logisticsWaybillNumber.join(","),
111 + })
112 + );
113 + },
114 +
115 + formSubmit() {
116 + this.cancelModify(1);
117 + },
118 +
119 + cancelModify(val) {
120 + this.batchModifyVisible = false;
121 + this.$emit("cancelDataPreview", val);
122 + },
123 + },
124 +};
125 +</script>
126 +
127 +<style lang="scss" scoped>
128 +@import "@/assets/styles/variables.scss";
129 +
130 +.revokeOperation {
131 + margin-bottom: 25px;
132 + .revokeSubmitBtn {
133 + margin-right: 30px;
134 + }
135 +}
136 +</style>
...@@ -140,6 +140,14 @@ ...@@ -140,6 +140,14 @@
140 <el-button 140 <el-button
141 class="entrySaveButton" 141 class="entrySaveButton"
142 size="small" 142 size="small"
143 + icon="el-icon-edit"
144 + @click="batchModify"
145 + >
146 + 重量调整
147 + </el-button>
148 + <el-button
149 + class="entrySaveButton"
150 + size="small"
143 icon="el-icon-download" 151 icon="el-icon-download"
144 v-loading="loadings.exportDeclareLoading" 152 v-loading="loadings.exportDeclareLoading"
145 @click="downloadData" 153 @click="downloadData"
...@@ -442,6 +450,13 @@ ...@@ -442,6 +450,13 @@
442 :selected="selected" 450 :selected="selected"
443 @close="dialogClose" 451 @close="dialogClose"
444 /> 452 />
453 + <!-- 数据预览 -->
454 + <DataPreview
455 + :showDialog="dataPreviewVisible"
456 + :dataPreviewTitle="dataPreviewTitle"
457 + :selectedDatas="selected"
458 + @cancelDataPreview="cancelDataPreview"
459 + />
445 </div> 460 </div>
446 </template> 461 </template>
447 462
...@@ -464,6 +479,7 @@ import TemplateDownloadDialog from "./templateDownloadDialog.vue"; ...@@ -464,6 +479,7 @@ import TemplateDownloadDialog from "./templateDownloadDialog.vue";
464 import ExportDialog from "./exportDialog.vue"; 479 import ExportDialog from "./exportDialog.vue";
465 import BatchModify from "./batchModify.vue"; 480 import BatchModify from "./batchModify.vue";
466 import TimeDialog from "./time-dialog.vue"; 481 import TimeDialog from "./time-dialog.vue";
482 +import DataPreview from "./data-preview.vue";
467 export default { 483 export default {
468 name: "ReportingData", 484 name: "ReportingData",
469 components: { 485 components: {
...@@ -473,6 +489,7 @@ export default { ...@@ -473,6 +489,7 @@ export default {
473 ExportDialog, 489 ExportDialog,
474 BatchModify, 490 BatchModify,
475 TimeDialog, 491 TimeDialog,
492 + DataPreview,
476 }, 493 },
477 data() { 494 data() {
478 return { 495 return {
...@@ -650,6 +667,11 @@ export default { ...@@ -650,6 +667,11 @@ export default {
650 datasExportVisible: false, 667 datasExportVisible: false,
651 batchModifyVisible: false, 668 batchModifyVisible: false,
652 timeVisible: false, 669 timeVisible: false,
670 + // 数据预览
671 + dataPreviewVisible: false,
672 + dataPreviewTitle: "",
673 + currentLoadingKey: "",
674 + paramsOjb: {},
653 }; 675 };
654 }, 676 },
655 created() { 677 created() {
...@@ -849,6 +871,39 @@ export default { ...@@ -849,6 +871,39 @@ export default {
849 } 871 }
850 this.timeVisible = true; 872 this.timeVisible = true;
851 }, 873 },
874 + // 申报
875 + postDeclareData(obj, loadingKey) {
876 + // 提交申报数据
877 + declareDataUpload(obj)
878 + .then((res) => {
879 + if (res.code === "200") {
880 + this.alertSuccessMsg("数据已成功提交申报,请等待海关回执。");
881 + } else {
882 + this.alertWarningMsg(res.message);
883 + }
884 + })
885 + .catch((err) => {
886 + console.error(err);
887 + this.alertWarningMsg("申报失败,请稍后重试。");
888 + })
889 + .finally(() => {
890 + // 无论成功或失败,都重置加载状态并刷新数据
891 + this.$set(this.loadings, loadingKey, false);
892 + this.search(0);
893 + });
894 + },
895 +
896 + cancelDataPreview(val) {
897 + this.dataPreviewVisible = false;
898 + this.dataPreviewTitle = "";
899 +
900 + if (val === 1) {
901 + this.postDeclareData(this.paramsOjb, this.currentLoadingKey);
902 + } else {
903 + this.$set(this.loadings, this.currentLoadingKey, false);
904 + this.paramsOjb = {};
905 + }
906 + },
852 907
853 /** 908 /**
854 * 通用申报方法 909 * 通用申报方法
...@@ -861,14 +916,21 @@ export default { ...@@ -861,14 +916,21 @@ export default {
861 this.alertWarningMsg("请选择数据!"); 916 this.alertWarningMsg("请选择数据!");
862 return; 917 return;
863 } 918 }
864 -
865 // 设置加载状态 919 // 设置加载状态
866 this.$set(this.loadings, loadingKey, true); 920 this.$set(this.loadings, loadingKey, true);
921 +
867 // 构造请求参数 922 // 构造请求参数
868 const obj = { 923 const obj = {
869 declareIds: this.selected.map((item) => item.declareId), 924 declareIds: this.selected.map((item) => item.declareId),
870 type: dropdownCode, 925 type: dropdownCode,
871 }; 926 };
927 + if (dropdownName === "一键申报" || dropdownName === "清单总分单申报") {
928 + this.dataPreviewVisible = true;
929 + this.dataPreviewTitle = `预览-${dropdownName}`;
930 + this.currentLoadingKey = loadingKey;
931 + this.paramsOjb = obj;
932 + return;
933 + }
872 934
873 // 如果是撤销单申报,显示弹窗并返回 935 // 如果是撤销单申报,显示弹窗并返回
874 if (dropdownName === "撤销单申报") { 936 if (dropdownName === "撤销单申报") {
...@@ -878,24 +940,7 @@ export default { ...@@ -878,24 +940,7 @@ export default {
878 return; 940 return;
879 } 941 }
880 942
881 - // 提交申报数据 943 + this.postDeclareData(obj, loadingKey);
882 - declareDataUpload(obj)
883 - .then((res) => {
884 - if (res.code === "200") {
885 - this.alertSuccessMsg("数据已成功提交申报,请等待海关回执。");
886 - } else {
887 - this.alertWarningMsg(res.message);
888 - }
889 - })
890 - .catch((err) => {
891 - console.error(err);
892 - this.alertWarningMsg("申报失败,请稍后重试。");
893 - })
894 - .finally(() => {
895 - // 无论成功或失败,都重置加载状态并刷新数据
896 - this.$set(this.loadings, loadingKey, false);
897 - this.search(0);
898 - });
899 }, 944 },
900 //切换申报模式 945 //切换申报模式
901 dropdownChange(val) { 946 dropdownChange(val) {
......
...@@ -21,21 +21,6 @@ ...@@ -21,21 +21,6 @@
21 <el-row :gutter="5"> 21 <el-row :gutter="5">
22 <el-col :span="8"> 22 <el-col :span="8">
23 <Formitem label="离境时间" prop="leaveTime" type="edit"> 23 <Formitem label="离境时间" prop="leaveTime" type="edit">
24 - <!-- <el-select
25 - type="text"
26 - id="inputInner-edit-leaveTime"
27 - v-model="formData.leaveTimel-date-picker"
28 - clearable
29 - filterable
30 - placeholder=""
31 - >
32 - <el-option
33 - v-for="item in operatorCode"
34 - :key="item"
35 - :label="item"
36 - :value="item"
37 - ></el-option>
38 - </el-select> -->
39 <el-date-picker 24 <el-date-picker
40 class="inputInner--leaveTime" 25 class="inputInner--leaveTime"
41 id="inputInner-edit-leaveTime" 26 id="inputInner-edit-leaveTime"
......
1 +<template>
2 + <el-dialog
3 + class="entryDialog classCUploadDialog"
4 + title="重量调整"
5 + :visible.sync="batchModifyVisible"
6 + :show-close="false"
7 + width="60%"
8 + :close-on-click-modal="false"
9 + >
10 + <div>
11 + <el-form
12 + class="fedexFormStyle"
13 + ref="batchModifyForm"
14 + :model="batchModifyFormData"
15 + :rules="batchModifyFormRules"
16 + label-position="left"
17 + size="small"
18 + >
19 + <Formitem label="修改数据" prop="modifyData">
20 + <el-select
21 + type="text"
22 + v-model="batchModifyFormData.modifyData"
23 + clearable
24 + placeholder=""
25 + >
26 + <el-option
27 + v-for="item in modifyDataList"
28 + :key="item.itemValue"
29 + :label="item.itemChineseName"
30 + :value="item.itemValue"
31 + ></el-option>
32 + </el-select>
33 + </Formitem>
34 + <Formitem label="修改内容" prop="modifyContent">
35 + <el-input
36 + type="text"
37 + class="inputShadow"
38 + resize="none"
39 + v-model="batchModifyFormData.modifyContent"
40 + clearable
41 + placeholder="请输入修改内容"
42 + ></el-input>
43 + </Formitem>
44 + </el-form>
45 + </div>
46 + <div class="dialogOption entrySave revokeOperation">
47 + <el-button
48 + class="entrySaveButton entrySaveButton-background revokeSubmitBtn"
49 + type="primary"
50 + @click="formSubmit"
51 + >确定</el-button
52 + >
53 + <el-button class="entrySaveButton" @click="cancelModify">关闭</el-button>
54 + </div>
55 + </el-dialog>
56 +</template>
57 +
58 +<script>
59 +import { bathDeclareDate } from "@/api/declareData-api.js";
60 +import { getDictData } from "@/api/system/dict-api.js";
61 +export default {
62 + props: {
63 + showDialog: {
64 + type: Boolean,
65 + default: false,
66 + },
67 + selectedDatas: {
68 + type: Array,
69 + default: () => [],
70 + },
71 + },
72 + data() {
73 + return {
74 + batchModifyVisible: false,
75 + batchModifyFormData: {
76 + modifyData: "",
77 + modifyContent: "",
78 + },
79 + batchModifyFormRules: {
80 + modifyData: [
81 + { required: true, message: "请选择修改数据", trigger: "change" },
82 + ],
83 + modifyContent: [
84 + { required: true, message: "请输入修改内容", trigger: "blur" },
85 + ],
86 + },
87 + modifyDataList: [
88 + { name: "提运单号", value: "BILLNO" },
89 + { name: "航班航次号", value: "FLIGHT_NUMBER" },
90 + ],
91 + };
92 + },
93 + watch: {
94 + showDialog(val) {
95 + if (val) {
96 + this.batchModifyVisible = val;
97 + this.batchModifyFormData.modifyData = "";
98 + this.batchModifyFormData.modifyContent = "";
99 + }
100 + },
101 + },
102 + created() {
103 + this.getModifyDataList();
104 + },
105 + methods: {
106 + getModifyDataList() {
107 + getDictData({ doctCode: "DATABASE_FIELD" })
108 + .then((res) => {
109 + if (res.code == "200") {
110 + this.modifyDataList = res.data;
111 + }
112 + })
113 + .catch((err) => {
114 + console.error(err);
115 + });
116 + },
117 + formSubmit() {
118 + this.$refs.batchModifyForm.validate((valid) => {
119 + if (valid) {
120 + let obj = {
121 + declareIds: [],
122 + modifyData: this.batchModifyFormData.modifyData,
123 + modifyContent: this.batchModifyFormData.modifyContent,
124 + };
125 + this.selectedDatas.forEach((item) => {
126 + obj.declareIds.push(item.declareId);
127 + });
128 + console.log("datas==", obj);
129 + bathDeclareDate(obj)
130 + .then((res) => {
131 + if (res.code === "200") {
132 + this.msgSuccess("批量修改成功");
133 + this.cancelModify(1);
134 + } else {
135 + this.alertWarningMsg(res.message);
136 + }
137 + })
138 + .catch((err) => {
139 + console.log(err);
140 + this.alertWarningMsg(err.message);
141 + this.cancelModify(1);
142 + });
143 + } else {
144 + return false;
145 + }
146 + });
147 + },
148 +
149 + cancelModify(val) {
150 + this.batchModifyVisible = false;
151 + this.$emit("cancelBatchModify", val);
152 + },
153 + },
154 +};
155 +</script>
156 +
157 +<style lang="scss" scoped>
158 +@import "@/assets/styles/variables.scss";
159 +.modelItem {
160 + width: 100%;
161 + .modelItem-title {
162 + display: flex;
163 + justify-content: space-between;
164 + margin-bottom: 5px;
165 + font-size: 14px;
166 + font-weight: 600;
167 + color: #333;
168 + }
169 +}
170 +.revokeOperation {
171 + margin-bottom: 25px;
172 + .revokeSubmitBtn {
173 + margin-right: 30px;
174 + }
175 +}
176 +</style>