新增ET86黑名单页面

@@ -4,7 +4,7 @@
       <el-col>
         <el-button
           v-for="item in attrs.btnCofig.btnGroup"
-          :key="item.icon"
+          :key="item.btnName"
           :type="item.type"
           :icon="item.icon"
           :round="item.round"

@@ -72,13 +72,6 @@ export const constantRoutes = [
     component: Layout,
     hidden: true,
     children: [
-      // {
-      //   path: "/et86",
-      //   component: (resolve) => require(["@/views/et86Config/et86RuleConfig"], resolve),
-      //   name: "et86",
-      //   meta: { title: "ET86", icon: "user" },
-      //   children: [],
-      // },
       {
         path: "/edit",
         component: (resolve) =>
@@ -87,6 +80,13 @@ export const constantRoutes = [
         meta: { title: "ET86规则", icon: "user", noCache: false },
       },
       {
+        path: "/errorInfo",
+        component: (resolve) =>
+          require(["@/views/et86Config/et86HsCodeBlack/errorInfo"], resolve),
+        name: "errorInfo",
+        meta: { title: "错误信息提示", icon: "user" },
+      },
+      {
         path: "/info/:handle/id=:id;routeStatus=:routeStatus;fltNo=:fltNo;route=:route;fltDate=:fltDate;status=:status",
         component: (resolve) =>
           require(["@/views/allocationConfig/flightAllocConfig/info"], resolve),

+<template>
+  <div class="form-header container">
+    <yl-table
+      :attrs="tableAttr"
+      :loadingTable="tableAttr.loadingTable"
+      :columns="columns"
+      :tableData="tableData"
+      :pageConfig="pageConfig"
+      @sizeChange="handleSizeChange"
+      @currentChange="handleCurrentChange"
+    >
+    </yl-table>
+  </div>
+</template>
+
+<script>
+import YlTable from "@/components/YlTable";
+import { tableAttr, columnHeader } from "./tableConfig";
+export default {
+  name: "ErrorInfo",
+  components: {
+    YlTable,
+  },
+  data() {
+    return {
+      pageConfig: {
+        // 分页配置项
+        isPagination: false,
+        total: 0,
+        pageData: {
+          page: 1,
+          size: 10,
+        },
+      },
+      tableAttr: tableAttr, // table配置项
+      columns: columnHeader(this.deleteRow), // 表头
+      tableData: [], // 表格数据
+    };
+  },
+  created() {},
+  methods: {
+    //条数变化
+    handleSizeChange(e) {
+      this.pageConfig.pageData.size = e;
+      this.pageConfig.pageData.page = 1;
+      this.searchBtn();
+    },
+    //页码变化
+    handleCurrentChange(e) {
+      this.pageConfig.pageData.page = e;
+      this.searchBtn();
+    },
+    // table勾选
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+  },
+};
+</script>
+<style lang="scss" scoped></style>

+export const tableAttr = {
+  border: true,
+  loadingTable: false,
+  isDragSort: false, // 拖拽tableData数据一定要加id字段
+  maxHeight: 300,
+  btnCofig: {
+    isBtn: false,
+    btnGroup: [],
+  },
+};
+export const columnHeader = (deleteRow) => [
+  {
+    type: "index",
+    label: "序号",
+    prop: "id",
+    align: "center",
+    width: "70",
+  },
+  {
+    label: "运单号",
+    prop: "waybillNo",
+    align: "center",
+    width: 150,
+  },
+  {
+    label: "错误信息",
+    prop: "errorMessage",
+    align: "center",
+    minWidth: 150,
+  },
+];

@@ -5,6 +5,7 @@ export const formConfig = [
     name: "skuCode",
     prop: "skuCode",
     placeholder: "根据Hscode查询",
+    span: 6,
     trigger: "blur", // 事件名
   },
 ];

 <template>
-  <div style="margin: 20px">
-    <el-form :inline="true" :model="form" class="demo-form-inline" size="small">
-      <el-form-item label="商品名">
-        <el-input
-          v-model="form.skuCode"
-          placeholder="根据Hscode查询"
-        ></el-input>
-      </el-form-item>
-      <el-form-item>
-        <el-upload
-          action="/flightInfoImport/importFlight"
-          name="file"
-          :http-request="uploadExcel"
-          :on-remove="handleRemove"
-          :limit="1"
-          :on-exceed="handleExceed"
-          :file-list="fileList"
-          accept=".xlsx"
-          class="upload-demo"
-          v-hasPermi="['base:flightImport:importFlight']"
-        >
-          <el-button icon="el-icon-upload2" type="primary">点击上传</el-button>
-        </el-upload>
-      </el-form-item>
-      <el-form-item>
-        <el-button
-          type="primary"
-          icon="el-icon-download"
-          @click="downloadTempleate"
-          v-hasPermi="['base:flightImport:exportExcel']"
-          >下载模板
-        </el-button>
-      </el-form-item>
-    </el-form>
-    <div style="font-size: 12px; font-weight: 700; margin-bottom: 15px">
-      提示：<span style="color: #1890ff">以下为所提交的数据或出错信息</span>
-    </div>
-    <div class="btn-wrap">
-      <el-button
-        type="danger"
-        size="mini"
-        icon="el-icon-delete"
-        @click="deleteRow"
-        >删除</el-button
-      >
-    </div>
-    <el-table
-      ref="filterTable"
-      class="mt10"
-      :data="tableData"
-      size="small"
-      border
-      @selection-change="handleSelectionChange"
+  <div class="form-header container">
+    <el-row>
+      <el-col>
+        <yl-form
+          ref="ruleForm"
+          :formConfig="formConfig"
+          :queryForm="queryForm"
+          :inline="false"
+          formWidth="auto"
+          @blur="blurEvent"
+        />
+      </el-col>
+    </el-row>
+    <yl-table
+      :attrs="tableAttr"
+      :loadingTable="tableAttr.loadingTable"
+      :columns="columns"
+      :tableData="tableData"
+      :pageConfig="pageConfig"
+      @search="searchBtn"
+      @download="downloadTemplate"
+      @upLoad="upLoadTemplate"
+      @export="exportTemplate"
+      @delete="deleteData"
+      @sizeChange="handleSizeChange"
+      @currentChange="handleCurrentChange"
     >
-      <el-table-column type="selection" width="55"></el-table-column>
-      <el-table-column label="行号" prop="line" width="50" align="center">
-      </el-table-column>
-      <el-table-column label="错误信息" prop="errorMessage" width="200">
-        <template slot-scope="scope">
-          <div v-for="(m, key) in scope.row.errorMessage" :key="key">
-            {{ m }}
-          </div>
-        </template>
-      </el-table-column>
-      <el-table-column v-if="tableData.length == 0"></el-table-column>
-      <template v-for="(value, key) in this.tableData[0]">
-        <el-table-column
-          :key="key"
-          v-if="key != 'errorMessage' && key != 'line'"
-          :label="key"
-          :prop="key"
-        ></el-table-column>
-      </template>
-    </el-table>
-    <ModleView ref="modleView" />
+    </yl-table>
   </div>
 </template>
 
 <script>
-import {
-  filghtKindData,
-  downLoadTemplate,
-  importFlight,
-} from "@/api/flightInfoImport";
-import ModleView from "./components/ModleView";
+import YlForm from "@/components/YlForm";
+import YlTable from "@/components/YlTable";
+import { formConfig } from "./formConfig";
+import { tableAttr, columnHeader } from "./tableConfig";
 export default {
-  name: "FlightInformationImport",
+  name: "Et86HsCodeBlack",
   components: {
-    ModleView,
+    YlForm,
+    YlTable,
   },
   data() {
     return {
-      flightType: [],
-      form: {
-        skuCode: "",
+      formConfig: formConfig, // 表单配置项
+      queryForm: {}, // 表单参数
+      pageConfig: {
+        // 分页配置项
+        isPagination: true,
+        total: 0,
+        pageData: {
+          page: 1,
+          size: 10,
+        },
       },
-      fileList: [],
-      tableData: [],
+      tableAttr: tableAttr, // table配置项
+      columns: columnHeader(this.deleteRow), // 表头
+      tableData: [], // 表格数据
       multipleSelection: [],
     };
   },
+  created() {},
   methods: {
-    typeData() {
-      filghtKindData().then((response) => {
-        if (response.code != 200) {
-          this.msgError(response.msg);
-        }
-        this.flightType = response.data;
-        this.form.type = response.data[0].code;
-      });
-    },
-    downloadTempleate() {
-      let downloadType = "";
-      let fileName = "";
-      switch (this.form.type) {
-        case "flightKind20":
-          downloadType = "whiteTail";
-          fileName = "航班信息导入模板WhiteTail.xlsx";
-          break;
-        case "flightKind30":
-          downloadType = "purpleTail";
-          fileName = "航班信息导入模板PurpleTail.xlsx";
-          break;
-        default:
-          this.$confirm("此类航班暂无模板，请选择其他类型航班", "提示", {
-            confirmButtonText: "确定",
-            showCancelButton: false,
-            type: "warning",
-          });
-      }
-      if (downloadType != "") {
-        downLoadTemplate(downloadType).then((res) => {
-          if (res) {
-            const blob = new Blob([res]);
-            const link = document.createElement("a"); //创建a标签
-            link.download = fileName; //a标签添加属性
-            link.style.display = "none";
-            link.href = URL.createObjectURL(blob);
-            document.body.appendChild(link);
-            link.click(); //执行下载
-            URL.revokeObjectURL(link.href); //释放url
-            document.body.removeChild(link); //释放标签
-          } else {
-            this.$message.error("下载失败");
-          }
-        });
-      }
+    // 失焦事件
+    blurEvent() {
+
     },
-    uploadExcel(option) {
-      //上传excel
-      const file = option.file;
-      importFlight(file, this.form.type).then((res) => {
-        if (res.code != 200) {
-          if (res.code == 603) {
-            this.$alert(res.msg, "提示", {
-              confirmButtonText: "确定",
-              type: "warning",
-            });
-          } else {
-            this.$confirm("是否查看错误信息列表？", "提示", {
-              confirmButtonText: "确定",
-              cancelButtonText: "取消",
-              type: "warning",
-              center: true,
-            }).then(() => {
-                console.log(this.$refs.modleView);
-                this.$refs.modleView.dialogOpenEvent(res.data)
-              })
-              .catch(() => {});
-            this.$message.warning(res.msg);
-            this.tableData = res.data;
-          }
-        } else {
-          this.$message.success("导入成功");
-          this.tableData = res.data;
-        }
-      });
+    // 搜索
+    searchBtn() {
+      this.$refs.ruleForm.handleSearch("ruleForm", (val) => {});
     },
-    handleRemove(file, fileList) {
-      //清掉上传的文件
-      this.tableData = [];
-      this.fileList = [];
+    // 下载
+    downloadTemplate() {},
+    // 上传
+    upLoadTemplate() {},
+    // 导出
+    exportTemplate() {},
+    // 删除
+    deleteData() {},
+    //条数变化
+    handleSizeChange(e) {
+      this.pageConfig.pageData.size = e;
+      this.pageConfig.pageData.page = 1;
+      this.searchBtn();
     },
-    handleExceed(files) {
-      //重复上传文件
-      let file = {};
-      file.file = files[0];
-      file.name = files[0].name;
-      this.fileList = [];
-      this.fileList.push(file);
-      this.uploadExcel(file);
+    //页码变化
+    handleCurrentChange(e) {
+      this.pageConfig.pageData.page = e;
+      this.searchBtn();
     },
+    // table勾选
     handleSelectionChange(val) {
       this.multipleSelection = val;
     },
+    // 删除
     deleteRow() {
       this.$confirm("是否确认删除？", "提示", {
         confirmButtonText: "确定",
@@ -207,22 +107,6 @@ export default {
         .catch(() => {});
     },
   },
-  created() {
-    this.typeData();
-  },
-  activated() {
-    this.typeData();
-  },
 };
 </script>
-<style rel="stylesheet/scss" lang="scss">
-.upload-demo {
-  float: right;
-}
-
-.el-upload-list {
-  display: inline-block;
-  margin-left: 10px;
-  vertical-align: top;
-}
-</style>
+<style lang="scss" scoped></style>

-const state = {
-  1: "有效",
-  0: "无效",
-};
 export const tableAttr = {
   border: true,
   loadingTable: false,
@@ -21,6 +17,15 @@ export const tableAttr = {
       },
       {
         type: "primary",
+        icon: "el-icon-download",
+        btnName: "下载模板",
+        size: "mini",
+        round: false,
+        loading: false,
+        event: "download",
+      },
+      {
+        type: "primary",
         icon: "el-icon-upload",
         btnName: "导入",
         size: "mini",
@@ -35,7 +40,7 @@ export const tableAttr = {
         size: "mini",
         round: false,
         loading: false,
-        event: "download",
+        event: "export",
       },
       {
         type: "danger",
@@ -49,7 +54,7 @@ export const tableAttr = {
     ],
   },
 };
-export const columnHeader = (viewRow, editRow, deleteRow) => [
+export const columnHeader = (deleteRow) => [
   {
     type: "selection",
     align: "center",
@@ -64,64 +69,34 @@ export const columnHeader = (viewRow, editRow, deleteRow) => [
     width: "50",
   },
   {
-    label: "原航班号",
-    prop: "originOfFlightNo",
+    label: "货站名称",
+    prop: "portName",
     align: "center",
     minWidth: 100,
   },
   {
-    label: "顺位航班",
-    prop: "rankFltNoStr",
+    label: "品名",
+    prop: "goodsName",
     align: "center",
     minWidth: 100,
   },
   {
-    label: "URSA包含",
-    prop: "includeUrsa",
-    align: "center",
-    minWidth: 100,
-  },
-  {
-    label: "URSA不包含",
-    prop: "notIncludeUrsa",
+    label: "操作人",
+    prop: "updateUserName",
     align: "center",
     minWidth: 100,
   },
   {
-    label: "状态",
-    prop: "status",
+    label: "操作时间",
+    prop: "updateTime",
     align: "center",
     minWidth: 100,
-    render: (h, params) => {
-      const { row } = params;
-      return h("div", `${state[row.status]}`);
-    },
   },
   {
     label: "创建时间",
     prop: "createTime",
     align: "center",
     minWidth: 100,
-    sortable: true,
-    "sort-method": (a, b) => b.createTime - a.createTime,
-  },
-  {
-    label: "创建人",
-    prop: "createUserName",
-    align: "center",
-    minWidth: 100,
-  },
-  {
-    label: "修改时间",
-    prop: "updateTime",
-    align: "center",
-    minWidth: 100,
-  },
-  {
-    label: "修改人",
-    prop: "updateUserName",
-    align: "center",
-    minWidth: 100,
   },
   {
     label: "操作",
@@ -134,38 +109,6 @@ export const columnHeader = (viewRow, editRow, deleteRow) => [
         h(
           "el-button",
           {
-            props: {
-              type: "text",
-              size: "mini",
-              icon: "el-icon-view",
-            },
-            on: {
-              click() {
-                viewRow(params);
-              },
-            },
-          },
-          "查看"
-        ),
-        h(
-          "el-button",
-          {
-            props: {
-              type: "text",
-              size: "mini",
-              icon: "el-icon-edit",
-            },
-            on: {
-              click() {
-                editRow(params);
-              },
-            },
-          },
-          "修改"
-        ),
-        h(
-          "el-button",
-          {
             style: {
               color: "#ff4949",
             },

@@ -72,32 +72,29 @@ export default {
     // ET86查询
     queryFindAllEtesRules(params) {
       this.tableAttr.loadingTable = true;
-      findAllEtesRules(params).then((res) => {
+      findAllEtesRules(params)
+        .then((res) => {
           this.tableAttr.loadingTable = false;
           const { code, data } = res;
           if (code == 200) {
             this.tableData = data.list;
             this.pageConfig.total = data.total;
           }
-        }).catch(() => {});
+        })
+        .catch(() => {});
     },
-    //条数变化
-    handleSizeChange(e) {
-      this.pageConfig.pageData.size = e;
-      this.pageConfig.pageData.page = 1;
-      this.searchBtn();
-    },
-    //页码变化
-    handleCurrentChange(e) {
-      this.pageConfig.pageData.page = e;
-      this.searchBtn();
+    // 失焦事件
+    blurEvent({ originOfFlightNo }) {
+      this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo);
     },
     // 搜索
     searchBtn() {
       const { page, size } = this.pageConfig.pageData;
       let params = {
         originOfFlightNo: this.queryForm.originOfFlightNo,
-        updateTimeStart: this.queryForm.startTime ? this.queryForm.startTime : "",
+        updateTimeStart: this.queryForm.startTime
+          ? this.queryForm.startTime
+          : "",
         updateTimeEnd: this.queryForm.endTime ? this.queryForm.endTime : "",
         limitStart: (page - 1) * size,
         limitSize: size,
@@ -110,9 +107,16 @@ export default {
         this.queryFindAllEtesRules(params);
       });
     },
-    // 重置表单
-    restForm() {
-      this.$refs.ruleForm.resetFields("ruleForm");
+    //条数变化
+    handleSizeChange(e) {
+      this.pageConfig.pageData.size = e;
+      this.pageConfig.pageData.page = 1;
+      this.searchBtn();
+    },
+    //页码变化
+    handleCurrentChange(e) {
+      this.pageConfig.pageData.page = e;
+      this.searchBtn();
     },
     // 添加
     addBtn(item) {
@@ -123,6 +127,10 @@ export default {
         },
       });
     },
+    // 重置表单
+    restForm() {
+      this.$refs.ruleForm.resetFields("ruleForm");
+    },
     // 查看
     viewRow({ row }) {
       this.$router.push({
@@ -152,7 +160,8 @@ export default {
         cancelButtonText: "取消",
         type: "warning",
         center: true,
-      }).then(() => {
+      })
+        .then(() => {
           deleteEtesRuleById({ id: row.id }).then((res) => {
             const { code, msg } = res;
             if (code == 200) {
@@ -162,12 +171,9 @@ export default {
               this.msgError(msg || "删除失败");
             }
           });
-        }).catch(() => {});
+        })
+        .catch(() => {});
     },
-    // 失焦事件
-    blurEvent({ originOfFlightNo }){
-      this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo)
-    }
   },
 };
 </script>

@@ -19,15 +19,6 @@ export const tableAttr = {
         loading: false,
         event: "search",
       },
-      // {
-      //   type: "info",
-      //   icon: "",
-      //   btnName: "重置",
-      //   size: "mini",
-      //   round: false,
-      //   loading: false,
-      //   event: "restForm",
-      // },
       {
         type: "primary",
         icon: "el-icon-plus",