Elements-SY

modify

1 +import request from "@/utils/request";
2 +
3 +// HScode黑名单查询
4 +export function findHsCodeList(data) {
5 + return request({
6 + url: "/etes/findHsCodeList",
7 + method: "post",
8 + data: data,
9 + });
10 +}
11 +
12 +// HScode黑名单删除
13 +export function delHsCodeListList(data) {
14 + return request({
15 + url: "/etes/delHsCodeListList",
16 + method: "post",
17 + data: data,
18 + });
19 +}
20 +
21 +// HScode黑名单下载模板
22 +export function downLoadTemplate(template) {
23 + return request({
24 + url: "/etes/downLoadTemplate?template=" + template,
25 + method: "get",
26 + responseType: "blob",
27 + });
28 +}
29 +
30 +// HScode黑名单导入
31 +export function uploadHsCode(data) {
32 + return request({
33 + url: "/etes/uploadHsCode",
34 + method: "post",
35 + data: data,
36 + });
37 +}
38 +
1 +import request from "@/utils/request";
2 +
3 +// HScode英文品名黑名单查询
4 +export function findShipmentDescList(data) {
5 + return request({
6 + url: "/etes/findShipmentDescList",
7 + method: "post",
8 + data: data,
9 + });
10 +}
11 +
12 +// HScode英文品名黑名单导入
13 +export function uploadShipmentDesc(data) {
14 + return request({
15 + url: "/etes/uploadShipmentDesc",
16 + method: "post",
17 + data: data,
18 + });
19 +}
20 +
21 +// HScode黑名单/英文品名删除
22 +export function delShipmentDescList(data) {
23 + return request({
24 + url: "/etes/delShipmentDescList ",
25 + method: "post",
26 + data: data,
27 + });
28 +}
29 +
30 +
1 -import Vue from 'vue' 1 +import Vue from "vue";
2 -import Router from 'vue-router' 2 +import Router from "vue-router";
3 -import settings from "@/settings" 3 +import settings from "@/settings";
4 4
5 -Vue.use(Router) 5 +Vue.use(Router);
6 6
7 /* Layout */ 7 /* Layout */
8 -import Layout from '@/layout' 8 +import Layout from "@/layout";
9 -import ParentView from '@/components/ParentView'; 9 +import ParentView from "@/components/ParentView";
10 10
11 /** 11 /**
12 * Note: 路由配置项 12 * Note: 路由配置项
...@@ -80,6 +80,13 @@ export const constantRoutes = [ ...@@ -80,6 +80,13 @@ export const constantRoutes = [
80 meta: { title: "ET86规则", icon: "user", noCache: true }, 80 meta: { title: "ET86规则", icon: "user", noCache: true },
81 }, 81 },
82 { 82 {
83 + path: "/errorInfo",
84 + component: (resolve) =>
85 + require(["@/views/et86Config/errorInfo"], resolve),
86 + name: "errorInfo",
87 + meta: { title: "错误信息提示", icon: "user" },
88 + },
89 + {
83 path: "/routeInfo", 90 path: "/routeInfo",
84 component: (resolve) => 91 component: (resolve) =>
85 require([ 92 require([
...@@ -116,8 +123,8 @@ export const constantRoutes = [ ...@@ -116,8 +123,8 @@ export const constantRoutes = [
116 ]; 123 ];
117 124
118 export default new Router({ 125 export default new Router({
119 - mode: 'history', // 去掉url中的# 126 + mode: "history", // 去掉url中的#
120 scrollBehavior: () => ({ y: 0 }), 127 scrollBehavior: () => ({ y: 0 }),
121 routes: constantRoutes, 128 routes: constantRoutes,
122 base: settings.routerBase, 129 base: settings.routerBase,
123 -}) 130 +});
......
1 +<template>
2 + <div class="form-header container">
3 + <yl-table
4 + :attrs="tableAttr"
5 + :loadingTable="tableAttr.loadingTable"
6 + :columns="columns"
7 + :tableData="tableData"
8 + :pageConfig="pageConfig"
9 + @sizeChange="handleSizeChange"
10 + @currentChange="handleCurrentChange"
11 + >
12 + </yl-table>
13 + </div>
14 +</template>
15 +
16 +<script>
17 +import YlTable from "@/components/YlTable";
18 +import { tableAttr, columnHeader } from "./tableConfig";
19 +export default {
20 + name: "ErrorInfo",
21 + components: {
22 + YlTable,
23 + },
24 + data() {
25 + return {
26 + pageConfig: {
27 + // 分页配置项
28 + isPagination: false,
29 + total: 0,
30 + pageData: {
31 + page: 1,
32 + size: 10,
33 + },
34 + },
35 + tableAttr: tableAttr, // table配置项
36 + columns: columnHeader(), // 表头
37 + tableData: [], // 表格数据
38 + };
39 + },
40 + created() {
41 + const { data } = this.$route.query;
42 + this.tableData = JSON.parse(data);
43 + },
44 + methods: {
45 + //条数变化
46 + handleSizeChange(e) {
47 + this.pageConfig.pageData.size = e;
48 + this.pageConfig.pageData.page = 1;
49 + this.searchBtn();
50 + },
51 + //页码变化
52 + handleCurrentChange(e) {
53 + this.pageConfig.pageData.page = e;
54 + this.searchBtn();
55 + },
56 + // 搜索
57 + searchBtn() {},
58 + },
59 +};
60 +</script>
61 +<style lang="scss" scoped></style>
1 +export const tableAttr = {
2 + border: true,
3 + loadingTable: false,
4 + isDragSort: false, // 拖拽tableData数据一定要加id字段
5 + maxHeight: 800,
6 + btnCofig: {
7 + isBtn: false,
8 + btnGroup: [],
9 + },
10 +};
11 +export const columnHeader = () => [
12 + {
13 + type: "index",
14 + label: "序号",
15 + prop: "rowNum",
16 + align: "center",
17 + width: "70",
18 + },
19 + {
20 + label: "错误信息",
21 + prop: "msg",
22 + align: "left",
23 + minWidth: 150,
24 + },
25 +];
1 +<template>
2 + <div class="error-container">
3 + <el-dialog
4 + :width="width"
5 + :title="title"
6 + :center="center"
7 + :visible.sync="dialogVisible"
8 + :close-on-click-modal="onModalClickClose"
9 + @open="dialogOpenEvent"
10 + @close="dialogCloseEvent"
11 + >
12 + <slot></slot>
13 + <span slot="footer" class="dialog-footer">
14 + <el-button @click="cancel">取 消</el-button>
15 + <el-button type="primary" @click="confirm">{{
16 + confirmBtnName
17 + }}</el-button>
18 + </span>
19 + </el-dialog>
20 + </div>
21 +</template>
22 +
23 +<script>
24 +export default {
25 + props: {
26 + width: {
27 + type: String,
28 + default: "50%",
29 + },
30 + title: {
31 + type: String,
32 + default: "标 题",
33 + },
34 + center: {
35 + type: String,
36 + default: "center",
37 + },
38 + confirmBtnName: {
39 + type: String,
40 + default: "确 定",
41 + },
42 + onModalClickClose: {
43 + type: Boolean,
44 + default: false,
45 + },
46 + },
47 + data() {
48 + return {
49 + dialogVisible: false,
50 + };
51 + },
52 + computed: {},
53 + created() {},
54 + mounted() {},
55 + methods: {
56 + dialogOpenEvent(data) {
57 + if (data && data.length) {
58 + console.log(data);
59 + }
60 + this.dialogVisible = true;
61 + this.$emit("open");
62 + },
63 + dialogCloseEvent() {
64 + this.dialogVisible = false;
65 + this.$emit("close");
66 + },
67 + // 确认事件
68 + confirm() {
69 + this.dialogVisible = false;
70 + this.$emit("confirm");
71 + },
72 + // 取消事件
73 + cancel() {
74 + this.dialogVisible = false;
75 + this.$emit("cancel");
76 + },
77 + },
78 +};
79 +</script>
80 +<style lang='scss' scoped>
81 +
82 +</style>
1 +export const formConfig = [
2 + {
3 + label: "HSCODE",
4 + type: "Input",
5 + name: "searchValue",
6 + prop: "searchValue",
7 + placeholder: "根据HSCODE查询",
8 + span: 6,
9 + trigger: "blur", // 事件名
10 + },
11 +];
1 +<template>
2 + <div ref="formHeaderRef" class="form-header container">
3 + <el-row>
4 + <el-col>
5 + <yl-form
6 + ref="ruleForm"
7 + :formConfig="formConfig"
8 + :queryForm="queryForm"
9 + :inline="false"
10 + formWidth="auto"
11 + />
12 + </el-col>
13 + </el-row>
14 + <yl-table
15 + ref="ylTable"
16 + :attrs="tableAttr"
17 + :loadingTable="tableAttr.loadingTable"
18 + :columns="columns"
19 + :tableData="tableData"
20 + :pageConfig="pageConfig"
21 + @search="searchBtn"
22 + @download="downloadTemplate"
23 + @upload="toUpload"
24 + @export="exportTemplate"
25 + @delete="deleteData"
26 + @sizeChange="handleSizeChange"
27 + @currentChange="handleCurrentChange"
28 + @selectionEvent="tableSelectionChange"
29 + >
30 + </yl-table>
31 + </div>
32 +</template>
33 +<script>
34 +import YlForm from "@/components/YlForm";
35 +import YlTable from "@/components/YlTable";
36 +import { formConfig } from "./formConfig";
37 +import { tableAttr, columnHeader } from "./tableConfig";
38 +import { restTableHeight } from "@/utils";
39 +import {
40 + findHsCodeList, // ShipmentDesc查询
41 + delHsCodeListList, // ShipmentDesc删除
42 + downLoadTemplate, // ShipmentDesc下载模板
43 + uploadHsCode, // ShipmentDesc导入
44 +} from "@/api/et86HsCodeBlack";
45 +import { downLoadXlsx } from "@/utils/zipdownload";
46 +export default {
47 + name: "Et86HsCodeBlack",
48 + components: {
49 + YlForm,
50 + YlTable,
51 + },
52 + data() {
53 + return {
54 + formConfig: formConfig, // 表单配置项
55 + queryForm: {
56 + searchValue: "",
57 + }, // 表单参数
58 + pageConfig: {
59 + // 分页配置项
60 + isPagination: true,
61 + total: 0,
62 + pageData: {
63 + page: 1,
64 + size: 10,
65 + },
66 + },
67 + tableAttr: tableAttr, // table配置项
68 + columns: columnHeader(this.indexAdd, this.deleteRow), // 表头
69 + tableData: [], // 表格数据
70 + multipleSelection: [],
71 + };
72 + },
73 + watch: {
74 + $route(to, from) {
75 + if (to.name == this.$options.name) {
76 + this.searchBtn();
77 + }
78 + },
79 + },
80 + created() {
81 + // 黑名单查询
82 + this.$nextTick(() => {
83 + this.searchBtn();
84 + });
85 + },
86 + mounted() {
87 + // window视口的高减去除了Table表格的高;将这个差的结果值作为设置Table的高;
88 + this.$nextTick(() => {
89 + this.tableAttr.maxHeight =
90 + window.innerHeight - restTableHeight(this.$refs);
91 + });
92 + },
93 + methods: {
94 + // HScode黑名单查询
95 + queryFindHsCodeList() {
96 + const { page, size } = this.pageConfig.pageData;
97 + let params = {
98 + limitStart: (page - 1) * size,
99 + limitSize: size,
100 + ...this.queryForm,
101 + };
102 + this.tableAttr.loadingTable = true;
103 + findHsCodeList(params)
104 + .then((res) => {
105 + this.tableAttr.loadingTable = false;
106 + const { code, data } = res;
107 + if (code == 200) {
108 + this.tableData = data.list;
109 + this.pageConfig.total = data.total;
110 + }
111 + })
112 + .catch(() => {});
113 + },
114 + // 删除黑名单
115 + toDelHsCodeListList(params) {
116 + delHsCodeListList(params)
117 + .then((res) => {
118 + const { code, msg } = res;
119 + if (code == 200) {
120 + this.searchBtn();
121 + this.msgSuccess(msg || "删除成功!");
122 + } else {
123 + this.$message.error(msg || "删除失败");
124 + }
125 + })
126 + .catch(() => {});
127 + },
128 + // 选择上传【HScode黑名单导入】
129 + toUpload({ file }) {
130 + const formData = new FormData();
131 + formData.append("file", file);
132 + uploadHsCode(formData)
133 + .then((res) => {
134 + const { code, data, msg } = res;
135 + if (code == 200) {
136 + this.searchBtn();
137 + this.msgSuccess(msg || "导入成功!");
138 + } else {
139 + this.$message.error(msg || "导入失败");
140 + this.$router.push({
141 + path: "/errorInfo",
142 + query: {
143 + name: "errorInfo",
144 + error: code,
145 + data: JSON.stringify(data),
146 + },
147 + });
148 + }
149 + })
150 + .catch(() => {});
151 + },
152 + // 下载【HScode黑名单下载模板】
153 + downloadTemplate() {
154 + downLoadTemplate("hsCode")
155 + .then((res) => {
156 + if (res) {
157 + const blob = new Blob([res]);
158 + const link = document.createElement("a"); //创建a标签
159 + link.download = "HSCODE黑名单模板.xlsx"; //a标签添加属性
160 + link.style.display = "none";
161 + link.href = URL.createObjectURL(blob);
162 + document.body.appendChild(link);
163 + link.click(); //执行下载
164 + URL.revokeObjectURL(link.href); //释放url
165 + document.body.removeChild(link); //释放标签
166 + } else {
167 + this.$message.error("下载失败");
168 + }
169 + })
170 + .catch(() => {});
171 + },
172 + // 导出
173 + exportTemplate(row, i) {
174 + this.tableAttr.btnCofig.btnGroup[i].loading = true;
175 + downLoadXlsx("/etes/exportHsCodeList", this.queryForm, "HSCODE黑名单表")
176 + .then(() => {
177 + this.tableAttr.btnCofig.btnGroup[i].loading = false;
178 + })
179 + .catch(() => {
180 + this.$message.error("导出失败");
181 + });
182 + },
183 + // 删除
184 + deleteData(row) {
185 + if (this.multipleSelection.length) {
186 + this.$confirm("是否确认删除?", "提示", {
187 + confirmButtonText: "确定",
188 + cancelButtonText: "取消",
189 + type: "warning",
190 + center: true,
191 + })
192 + .then(() => {
193 + this.toDelHsCodeListList(this.multipleSelection);
194 + })
195 + .catch(() => {});
196 + } else {
197 + this.$message.error("请勾选一条或者多条数据再操作!");
198 + }
199 + },
200 + // 搜索
201 + searchBtn() {
202 + this.pageConfig.pageData.page = 1;
203 + this.pageConfig.pageData.size = 10;
204 + this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
205 + this.queryFindHsCodeList();
206 + });
207 + },
208 + // 翻页序号递增
209 + indexAdd(index) {
210 + const page = this.pageConfig.pageData.page; // 当前页码
211 + const pagesize = this.pageConfig.pageData.size; // 每页条数
212 + return index + 1 + (page - 1) * pagesize;
213 + },
214 + //条数变化
215 + handleSizeChange(e) {
216 + this.pageConfig.pageData.size = e;
217 + this.pageConfig.pageData.page = 1;
218 + this.queryFindHsCodeList();
219 + },
220 + //页码变化
221 + handleCurrentChange(e) {
222 + this.pageConfig.pageData.page = e;
223 + this.queryFindHsCodeList();
224 + },
225 + // table勾选
226 + tableSelectionChange(val) {
227 + this.multipleSelection = val;
228 + },
229 + // 删除
230 + deleteRow({ row }) {
231 + this.$confirm("是否确认删除?", "提示", {
232 + confirmButtonText: "确定",
233 + cancelButtonText: "取消",
234 + type: "warning",
235 + center: true,
236 + })
237 + .then(() => {
238 + this.toDelHsCodeListList([row]);
239 + })
240 + .catch(() => {});
241 + },
242 + },
243 +};
244 +</script>
245 +<style lang="scss" scoped></style>
1 +export const tableAttr = {
2 + border: true,
3 + loadingTable: false,
4 + isDragSort: false, // 拖拽tableData数据一定要加id字段
5 + maxHeight: 0,
6 + btnCofig: {
7 + isBtn: true,
8 + btnGroup: [
9 + {
10 + type: "primary", // text、primary、danger
11 + icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
12 + btnName: "搜索",
13 + size: "mini", // medium / small / mini
14 + round: false,
15 + loading: false,
16 + event: "search",
17 + },
18 + {
19 + type: "primary",
20 + icon: "el-icon-download",
21 + btnName: "下载模板",
22 + size: "mini",
23 + round: false,
24 + loading: false,
25 + event: "download",
26 + },
27 + {
28 + type: "primary",
29 + icon: "el-icon-upload",
30 + btnName: "导入",
31 + size: "mini",
32 + round: false,
33 + loading: false,
34 + event: "upLoad",
35 + action: "/goods/uploadGoodsExcel",
36 + fileName: "name",
37 + limit: 1,
38 + accept: ".xlsx",
39 + },
40 + {
41 + type: "primary",
42 + icon: "el-icon-download",
43 + btnName: "导出",
44 + size: "mini",
45 + round: false,
46 + loading: false,
47 + event: "export",
48 + },
49 + {
50 + type: "danger",
51 + icon: "el-icon-delete",
52 + btnName: "删除",
53 + size: "mini",
54 + round: false,
55 + loading: false,
56 + event: "delete",
57 + },
58 + ],
59 + },
60 +};
61 +export const columnHeader = (indexAdd, deleteRow) => [
62 + {
63 + type: "selection",
64 + align: "center",
65 + prop: "selection",
66 + width: "50",
67 + },
68 + {
69 + type: "index",
70 + label: "序号",
71 + prop: "id",
72 + align: "center",
73 + width: "50",
74 + index: indexAdd,
75 + },
76 + {
77 + label: "口岸",
78 + prop: "portName",
79 + align: "center",
80 + minWidth: 100,
81 + },
82 + {
83 + label: "HSCODE",
84 + prop: "blackValue",
85 + align: "center",
86 + minWidth: 100,
87 + },
88 + {
89 + label: "创建时间",
90 + prop: "createTime",
91 + align: "center",
92 + minWidth: 100,
93 + },
94 + {
95 + label: "创建人",
96 + prop: "createUserName",
97 + align: "center",
98 + minWidth: 100,
99 + },
100 + {
101 + label: "文件名",
102 + prop: "uploadFileName",
103 + align: "center",
104 + minWidth: 100,
105 + },
106 +
107 + {
108 + label: "操作",
109 + prop: "operate",
110 + align: "center",
111 + minWidth: 120,
112 + fixed: "right",
113 + render: (h, params) => {
114 + return h("div", [
115 + h(
116 + "el-button",
117 + {
118 + style: {
119 + color: "#ff4949",
120 + },
121 + props: {
122 + type: "text",
123 + size: "mini",
124 + icon: "el-icon-delete",
125 + },
126 + on: {
127 + click() {
128 + deleteRow(params);
129 + },
130 + },
131 + },
132 + "删除"
133 + ),
134 + ]);
135 + },
136 + },
137 +];
1 +<template>
2 + <div class="error-container">
3 + <el-dialog
4 + :width="width"
5 + :title="title"
6 + :center="center"
7 + :visible.sync="dialogVisible"
8 + :close-on-click-modal="onModalClickClose"
9 + @open="dialogOpenEvent"
10 + @close="dialogCloseEvent"
11 + >
12 + <slot></slot>
13 + <span slot="footer" class="dialog-footer">
14 + <el-button @click="cancel">取 消</el-button>
15 + <el-button type="primary" @click="confirm">{{
16 + confirmBtnName
17 + }}</el-button>
18 + </span>
19 + </el-dialog>
20 + </div>
21 +</template>
22 +
23 +<script>
24 +export default {
25 + props: {
26 + width: {
27 + type: String,
28 + default: "50%",
29 + },
30 + title: {
31 + type: String,
32 + default: "标题",
33 + },
34 + center: {
35 + type: String,
36 + default: "center",
37 + },
38 + confirmBtnName: {
39 + type: String,
40 + default: "确 定",
41 + },
42 + onModalClickClose: {
43 + type: Boolean,
44 + default: false,
45 + },
46 + },
47 + data() {
48 + return {
49 + dialogVisible: false,
50 + };
51 + },
52 + computed: {},
53 + created() {},
54 + mounted() {},
55 + methods: {
56 + dialogOpenEvent(data) {
57 + if (data && data.length) {
58 + console.log(data);
59 + }
60 + this.dialogVisible = true;
61 + this.$emit("open");
62 + },
63 + dialogCloseEvent() {
64 + this.dialogVisible = false;
65 + this.$emit("close");
66 + },
67 + // 确认事件
68 + confirm() {
69 + this.dialogVisible = false;
70 + this.$emit("confirm");
71 + },
72 + // 取消事件
73 + cancel() {
74 + this.dialogVisible = false;
75 + this.$emit("cancel");
76 + },
77 + },
78 +};
79 +</script>
80 +<style lang='scss' scoped>
81 +
82 +</style>
1 +export const formConfig = [
2 + {
3 + label: "ShipmentDesc",
4 + type: "Input",
5 + name: "searchValue",
6 + prop: "searchValue",
7 + placeholder: "根据ShipmentDesc查询",
8 + span: 7,
9 + trigger: "blur", // 事件名
10 + },
11 +];
1 +<template>
2 + <div ref="formHeaderRef" class="form-header container">
3 + <el-row>
4 + <el-col>
5 + <yl-form
6 + ref="ruleForm"
7 + :formConfig="formConfig"
8 + :queryForm="queryForm"
9 + :inline="false"
10 + formWidth="auto"
11 + />
12 + </el-col>
13 + </el-row>
14 + <yl-table
15 + ref="ylTable"
16 + :attrs="tableAttr"
17 + :loadingTable="tableAttr.loadingTable"
18 + :columns="columns"
19 + :tableData="tableData"
20 + :pageConfig="pageConfig"
21 + @search="searchBtn"
22 + @download="downloadTemplate"
23 + @upload="toUpload"
24 + @export="exportTemplate"
25 + @delete="deleteData"
26 + @sizeChange="handleSizeChange"
27 + @currentChange="handleCurrentChange"
28 + @selectionEvent="tableSelectionChange"
29 + >
30 + </yl-table>
31 + </div>
32 +</template>
33 +<script>
34 +import YlForm from "@/components/YlForm";
35 +import YlTable from "@/components/YlTable";
36 +import { formConfig } from "./formConfig";
37 +import { tableAttr, columnHeader } from "./tableConfig";
38 +import { restTableHeight } from "@/utils";
39 +import {
40 + findShipmentDescList, // HScode英文品名黑名单查询
41 + uploadShipmentDesc, // HScode英文品名黑名单导入
42 + delShipmentDescList, // HScode黑名单/英文品名删除
43 +} from "@/api/et86ShipmentDesc";
44 +import {
45 + downLoadTemplate, // ShipmentDesc/英文品名黑名下载模板
46 +} from "@/api/et86HsCodeBlack";
47 +import { downLoadXlsx } from "@/utils/zipdownload";
48 +export default {
49 + name: "Et86ShipmentDesc",
50 + components: {
51 + YlForm,
52 + YlTable,
53 + },
54 + data() {
55 + return {
56 + formConfig: formConfig, // 表单配置项
57 + queryForm: {
58 + searchValue: "",
59 + }, // 表单参数
60 + pageConfig: {
61 + // 分页配置项
62 + isPagination: true,
63 + total: 0,
64 + pageData: {
65 + page: 1,
66 + size: 10,
67 + },
68 + },
69 + tableAttr: tableAttr, // table配置项
70 + columns: columnHeader(this.indexAdd, this.deleteRow), // 表头
71 + tableData: [], // 表格数据
72 + multipleSelection: [],
73 + };
74 + },
75 + watch: {
76 + $route(to, from) {
77 + if (to.name == this.$options.name) {
78 + this.searchBtn();
79 + }
80 + },
81 + },
82 + created() {
83 + // 黑名单查询
84 + this.$nextTick(() => {
85 + this.searchBtn();
86 + });
87 + },
88 + mounted() {
89 + // window视口的高减去除了Table表格的高;将这个差的结果值作为设置Table的高;
90 + this.$nextTick(() => {
91 + this.tableAttr.maxHeight =
92 + window.innerHeight - restTableHeight(this.$refs);
93 + });
94 + },
95 + methods: {
96 + // HScode黑名单查询
97 + queryFindShipmentDescList() {
98 + const { page, size } = this.pageConfig.pageData;
99 + let params = {
100 + limitStart: (page - 1) * size,
101 + limitSize: size,
102 + ...this.queryForm,
103 + };
104 + this.tableAttr.loadingTable = true;
105 + findShipmentDescList(params)
106 + .then((res) => {
107 + this.tableAttr.loadingTable = false;
108 + const { code, data } = res;
109 + if (code == 200) {
110 + this.tableData = data.list;
111 + this.pageConfig.total = data.total;
112 + }
113 + })
114 + .catch(() => {});
115 + },
116 + // 删除黑名单
117 + toDelShipmentDescList(params) {
118 + delShipmentDescList(params)
119 + .then((res) => {
120 + const { code, msg } = res;
121 + if (code == 200) {
122 + this.searchBtn();
123 + this.msgSuccess(msg || "删除成功!");
124 + } else {
125 + this.$message.error(msg || "删除失败");
126 + }
127 + })
128 + .catch(() => {});
129 + },
130 + // 选择上传【HScode黑名单导入】
131 + toUpload({ file }) {
132 + const formData = new FormData();
133 + formData.append("file", file);
134 + uploadShipmentDesc(formData)
135 + .then((res) => {
136 + const { code, data, msg } = res;
137 + if (code == 200) {
138 + this.searchBtn();
139 + this.msgSuccess(msg || "导入成功!");
140 + } else {
141 + this.$message.error(msg || "导入失败");
142 + this.$router.push({
143 + path: "/errorInfo",
144 + query: {
145 + name: "errorInfo",
146 + error: code,
147 + data: JSON.stringify(data),
148 + },
149 + });
150 + }
151 + })
152 + .catch(() => {});
153 + },
154 + // 下载【英文品名黑名单下载模板】
155 + downloadTemplate() {
156 + downLoadTemplate("shipmentDesc")
157 + .then((res) => {
158 + if (res) {
159 + const blob = new Blob([res]);
160 + const link = document.createElement("a"); //创建a标签
161 + link.download = "英文品名黑名单模板.xlsx"; //a标签添加属性
162 + link.style.display = "none";
163 + link.href = URL.createObjectURL(blob);
164 + document.body.appendChild(link);
165 + link.click(); //执行下载
166 + URL.revokeObjectURL(link.href); //释放url
167 + document.body.removeChild(link); //释放标签
168 + } else {
169 + this.$message.error("下载失败");
170 + }
171 + })
172 + .catch(() => {});
173 + },
174 + // 导出
175 + exportTemplate(row, i) {
176 + this.tableAttr.btnCofig.btnGroup[i].loading = true;
177 + downLoadXlsx(
178 + "/etes/exportShipmentDescList",
179 + this.queryForm,
180 + "英文品名黑名单表"
181 + )
182 + .then(() => {
183 + this.tableAttr.btnCofig.btnGroup[i].loading = false;
184 + })
185 + .catch(() => {
186 + this.$message.error("导出失败");
187 + });
188 + },
189 + // 多选删除
190 + deleteData(row) {
191 + if (this.multipleSelection.length) {
192 + this.$confirm("是否确认删除?", "提示", {
193 + confirmButtonText: "确定",
194 + cancelButtonText: "取消",
195 + type: "warning",
196 + center: true,
197 + })
198 + .then(() => {
199 + // 调用删除黑名单接口
200 + this.toDelShipmentDescList(this.multipleSelection);
201 + })
202 + .catch(() => {});
203 + } else {
204 + this.$message.error("请勾选一条或者多条数据再操作!");
205 + }
206 + },
207 + // 搜索
208 + searchBtn() {
209 + this.pageConfig.pageData.page = 1;
210 + this.pageConfig.pageData.size = 10;
211 + this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
212 + this.queryFindShipmentDescList();
213 + });
214 + },
215 + // 翻页序号递增
216 + indexAdd(index) {
217 + const page = this.pageConfig.pageData.page; // 当前页码
218 + const pagesize = this.pageConfig.pageData.size; // 每页条数
219 + return index + 1 + (page - 1) * pagesize;
220 + },
221 + //条数变化
222 + handleSizeChange(e) {
223 + this.pageConfig.pageData.size = e;
224 + this.pageConfig.pageData.page = 1;
225 + this.queryFindShipmentDescList();
226 + },
227 + //页码变化
228 + handleCurrentChange(e) {
229 + this.pageConfig.pageData.page = e;
230 + this.queryFindShipmentDescList();
231 + },
232 + // table勾选
233 + tableSelectionChange(val) {
234 + this.multipleSelection = val;
235 + },
236 + // 删除行
237 + deleteRow({ row }) {
238 + this.$confirm("是否确认删除?", "提示", {
239 + confirmButtonText: "确定",
240 + cancelButtonText: "取消",
241 + type: "warning",
242 + center: true,
243 + })
244 + .then(() => {
245 + // 调用删除黑名单接口
246 + this.toDelShipmentDescList([row]);
247 + })
248 + .catch(() => {});
249 + },
250 + },
251 +};
252 +</script>
253 +<style lang="scss" scoped></style>
1 +export const tableAttr = {
2 + border: true,
3 + loadingTable: false,
4 + isDragSort: false, // 拖拽tableData数据一定要加id字段
5 + maxHeight: 300,
6 + btnCofig: {
7 + isBtn: true,
8 + btnGroup: [
9 + {
10 + type: "primary", // text、primary、danger
11 + icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
12 + btnName: "搜索",
13 + size: "mini", // medium / small / mini
14 + round: false,
15 + loading: false,
16 + event: "search",
17 + },
18 + {
19 + type: "primary",
20 + icon: "el-icon-download",
21 + btnName: "下载模板",
22 + size: "mini",
23 + round: false,
24 + loading: false,
25 + event: "download",
26 + },
27 + {
28 + type: "primary",
29 + icon: "el-icon-upload",
30 + btnName: "导入",
31 + size: "mini",
32 + round: false,
33 + loading: false,
34 + event: "upLoad",
35 + action: "/goods/uploadGoodsExcel",
36 + fileName: "name",
37 + limit: 1,
38 + accept: ".xlsx",
39 + },
40 + {
41 + type: "primary",
42 + icon: "el-icon-download",
43 + btnName: "导出",
44 + size: "mini",
45 + round: false,
46 + loading: false,
47 + event: "export",
48 + },
49 + {
50 + type: "danger",
51 + icon: "el-icon-delete",
52 + btnName: "删除",
53 + size: "mini",
54 + round: false,
55 + loading: false,
56 + event: "delete",
57 + },
58 + ],
59 + },
60 +};
61 +export const columnHeader = (indexAdd, deleteRow) => [
62 + {
63 + type: "selection",
64 + align: "center",
65 + prop: "selection",
66 + width: "50",
67 + },
68 + {
69 + type: "index",
70 + label: "序号",
71 + prop: "id",
72 + align: "center",
73 + width: "50",
74 + index: indexAdd,
75 + },
76 + {
77 + label: "口岸",
78 + prop: "portName",
79 + align: "center",
80 + minWidth: 100,
81 + },
82 + {
83 + label: "ShipmentDesc",
84 + prop: "blackValue",
85 + align: "center",
86 + minWidth: 100,
87 + },
88 + {
89 + label: "创建时间",
90 + prop: "createTime",
91 + align: "center",
92 + minWidth: 100,
93 + },
94 + {
95 + label: "创建人",
96 + prop: "createUserName",
97 + align: "center",
98 + minWidth: 100,
99 + },
100 + {
101 + label: "文件名",
102 + prop: "uploadFileName",
103 + align: "center",
104 + minWidth: 100,
105 + },
106 +
107 + {
108 + label: "操作",
109 + prop: "operate",
110 + align: "center",
111 + minWidth: 120,
112 + fixed: "right",
113 + render: (h, params) => {
114 + return h("div", [
115 + h(
116 + "el-button",
117 + {
118 + style: {
119 + color: "#ff4949",
120 + },
121 + props: {
122 + type: "text",
123 + size: "mini",
124 + icon: "el-icon-delete",
125 + },
126 + on: {
127 + click() {
128 + deleteRow(params);
129 + },
130 + },
131 + },
132 + "删除"
133 + ),
134 + ]);
135 + },
136 + },
137 +];