Merge branch 'purchaseDev' of http://172.16.100.139/new-business/drp-web into purchaseDev

src/assets/styles/element-ui.scss

@@ -94,4 +94,15 @@
 
 .el-autocomplete-suggestion .el-autocomplete-suggestion__wrap{
   padding: 10px 0 0 0;
+}   
+
+ .el-super-table {
+  width: 100%;
+  margin: 20px 0 0 0;
+}
+ .el-super-table .el-table__cell {
+  height: 50px;
+}
+ .el-super-table td.el-table__cell {
+  border-right: 0;
 }

src/components/DictTag/index.vue

@@ -2,12 +2,14 @@
   <div>
     <template v-for="(item, index) in options">
       <template v-if="values.includes(item.value)">
-        <span
+        <el-tag
           v-if="item.raw.listClass == 'default' || item.raw.listClass == ''"
+          type="primary"
+          :size="size"
           :key="item.value"
           :index="index"
           :class="item.raw.cssClass"
-          >{{ item.label }}</span
+          >{{ item.label }}</el-tag
         >
         <el-tag
           v-else

src/components/draggable/index.vue

@@ -0,0 +1,51 @@
+<template>
+  <draggable
+    v-bind="$attrs"
+    v-on="$listeners"
+    v-model="innerValue"
+    animation="250"
+    forceFallback="true"
+  >
+    <transition-group>
+      <slot></slot>
+    </transition-group>
+  </draggable>
+</template>
+
+<script>
+import draggable from "vuedraggable";
+export default {
+  name: "Draggable",
+  props: {
+    // v-model
+    value: {
+      type: [Array],
+      require: true,
+    },
+    group: {
+      type: [String, Object],
+      require: true,
+    },
+  },
+  components: { draggable },
+  data() {
+    return {};
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+  },
+  watch: {},
+  methods: {},
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<style scoped></style>

src/components/hide-table-column/index.vue

@@ -0,0 +1,79 @@
+<template>
+  <el-button v-bind="$attrs" v-on="$listeners" @click="onOpen">
+    隐藏列
+    <el-drawer size="20%" title="隐藏列" append-to-body :visible.sync="drawer">
+      <el-row :gutter="20" style="margin: 0">
+        <el-draggable
+          v-model="innerValue"
+          :group="{ item: 'key' }"
+          @start="onStart"
+          @end="onEnd"
+        >
+          <el-col
+            v-for="({ item, attr }, index) in innerValue"
+            :key="index"
+            :span="24"
+            style="
+              display: flex;
+              justify-content: space-between;
+              margin: 15px 0;
+            "
+          >
+            <span style="cursor: move">
+              <i class="el-icon-s-grid"></i>
+              {{ item.title }}
+            </span>
+            <el-switch v-model="attr.isHidden"> </el-switch>
+          </el-col>
+        </el-draggable>
+      </el-row>
+    </el-drawer>
+  </el-button>
+</template>
+
+<script>
+export default {
+  name: "HideTableColumn",
+  props: {
+    // v-model
+    value: {
+      type: [Array],
+      require: true,
+    },
+  },
+  components: {
+    ElDraggable: () => import("@/components/draggable/index.vue"),
+  },
+  data() {
+    return {
+      drawer: false,
+    };
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+  },
+  watch: {},
+  methods: {
+    onOpen() {
+      this.drawer = true;
+    },
+    onStart() {
+      console.log("开始拖拽事件", this.innerValue);
+    },
+    onEnd() {
+      console.log("拖拽结束事件", this.innerValue);
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<style scoped></style>

src/components/super-search/index.vue

@@ -0,0 +1,128 @@
+<template>
+  <el-form
+    v-bind="$attrs"
+    v-on="$listeners"
+    :model="innerValue"
+    label-width="auto"
+    label-position="right"
+    @submit.native.prevent
+    style="padding: 20px 20px 0"
+  >
+    <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
+      <el-col
+        v-for="({ item, attr }, index) in columns"
+        :key="index"
+        :span="item.span || 6"
+      >
+        <el-form-item :prop="item.key" :label="item.title">
+          <component
+            v-if="attr.is === 'el-input'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            @keyup.enter.native="$emit('submit')"
+            style="width: 100%"
+          >
+          </component>
+          <component
+            v-if="attr.is === 'el-select'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            @change="$emit('submit')"
+            style="width: 100%"
+          >
+            <template>
+              <el-option
+                v-for="item in dict.type[attr.dictName]"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </template>
+          </component>
+          <component
+            v-if="attr.is === 'el-date-picker'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            @change="$emit('submit')"
+            style="width: 100%"
+          >
+          </component>
+          <component
+            v-if="attr.is === 'el-popover-select-v2'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            :source.sync="innerValue"
+            @change="$emit('submit')"
+            style="width: 100%"
+          >
+          </component>
+          <component
+            v-if="attr.is === 'el-popover-multiple-select-v2'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            :source.sync="innerValue"
+            @change="$emit('submit')"
+            style="width: 100%"
+          >
+          </component>
+          <component
+            v-if="attr.is === 'el-popover-tree-select'"
+            v-bind="attr"
+            v-model="innerValue[item.key]"
+            :source.sync="innerValue"
+            @change="$emit('submit')"
+            style="width: 100%"
+          >
+          </component>
+        </el-form-item>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+export default {
+  name: "SuperSearch",
+  props: {
+    value: {
+      type: [Object],
+      require: true,
+    },
+    dict: {
+      type: [Object],
+      require: true,
+    },
+    columns: {
+      type: [Array],
+      require: true,
+    },
+  },
+  components: {
+    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
+    ElPopoverMultipleSelectV2: () =>
+      import("@/components/popover-select-v2/multiple.vue"),
+    ElPopoverTreeSelect: () =>
+      import("@/components/popover-tree-select/index.vue"),
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+  },
+  watch: {},
+  methods: {},
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<style scoped></style>

src/components/super-table/index.vue

@@ -0,0 +1,95 @@
+<template>
+  <el-table
+    v-if="innerValue.length"
+    v-bind="$attrs"
+    v-on="$listeners"
+    :data="innerValue"
+    border
+    stripe
+    highlight-current-row
+    class="el-super-table"
+  >
+    <slot></slot>
+    <el-table-column
+      v-for="({ item, attr }, index) in showColumns"
+      :key="index"
+      :prop="item.key"
+      :label="item.title"
+      :width="item.width || 225"
+      show-overflow-tooltip
+    >
+      <template slot-scope="scope">
+        <component
+          v-if="attr.is === 'el-dict-tag'"
+          v-bind="attr"
+          :size="$attrs.size"
+          :value="scope.row[item.key]"
+          :options="dict.type[attr.dictName]"
+        ></component>
+        <component
+          v-else-if="attr.is === 'el-file-preview'"
+          v-bind="attr"
+          v-model="scope.row[item.key]"
+        ></component>
+        <component
+          v-else-if="attr.is === 'el-computed-input-v2'"
+          v-bind="attr"
+          v-model="scope.row[item.key]"
+        ></component>
+        <component v-else is="span">{{
+          scope.row[item.key] || "--"
+        }}</component>
+      </template>
+    </el-table-column>
+  </el-table>
+  <el-empty v-else :image-size="200"></el-empty>
+</template>
+
+<script>
+export default {
+  name: "SuperTable",
+  props: {
+    value: {
+      type: [Array],
+      require: true,
+    },
+    dict: {
+      type: [Object],
+      require: true,
+    },
+    columns: {
+      type: [Array],
+      require: true,
+    },
+  },
+  components: {
+    ElDictTag: () => import("@/components/DictTag/index.vue"),
+    ElFilePreview: () => import("@/components/file-preview/index.vue"),
+    ElComputedInputV2: () => import("@/components/computed-input-v2/index.vue"),
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+    showColumns: {
+      get() {
+        return this.columns.filter(({ attr }) => attr.isHidden);
+      },
+    },
+  },
+  watch: {},
+  methods: {},
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<style scoped></style>

src/utils/request.js

@@ -92,10 +92,7 @@ service.interceptors.response.use(
     // 未设置状态码则默认成功状态
     const code = res.data.code || 200;
     // 获取错误信息
-    const msg =
-      errorCode[code] ||
-      res.data.msg.replaceAll(/(\n|\r|\r\n|↵)/g, "<br/>") ||
-      errorCode["default"];
+    const msg = errorCode[code] || res.data.msg || errorCode["default"];
     // 二进制数据则直接返回
     if (
       res.request.responseType === "blob" ||
@@ -127,15 +124,26 @@ service.interceptors.response.use(
       }
       return Promise.reject("无效的会话，或者会话已过期，请重新登录。");
     } else if (code === 500) {
-      Notification.error({ title: "error", message: msg });
+      Notification.error({
+        title: "error",
+        message: msg.replaceAll(/(\n|\r|\r\n|↵)/g, "<br/>"),
+        dangerouslyUseHTMLString: true,
+      });
       // Message({ message: msg, type: "error" });
       return Promise.reject(new Error(msg));
     } else if (code === 601) {
-      Notification.warning({ title: "error", message: msg });
+      Notification.warning({
+        title: "error",
+        message: msg.replaceAll(/(\n|\r|\r\n|↵)/g, "<br/>"),
+        dangerouslyUseHTMLString: true,
+      });
       // Message({ message: msg, type: "warning" });
       return Promise.reject("error");
     } else if (code !== 200) {
-      Notification.error({ title: msg });
+      Notification.error({
+        title: msg.replaceAll(/(\n|\r|\r\n|↵)/g, "<br/>"),
+        dangerouslyUseHTMLString: true,
+      });
       return Promise.reject("error");
     } else {
       return res.data;

src/views/purchase/apply/column.js

@@ -1,28 +1,37 @@
 export const TableColumns = [
-  { item: { key: "priceName", title: "价格名称" }, attr: {} },
-  { item: { key: "priceCode", title: "价格编码" }, attr: {} },
+  { item: { key: "priceName", title: "价格名称" }, attr: { isHidden: true } },
+  { item: { key: "priceCode", title: "价格编码" }, attr: { isHidden: true } },
   {
     item: { key: "status", title: "状态" },
-    attr: { dictName: "sys_status" },
+    attr: { is: "el-dict-tag", dictName: "sys_status", isHidden: true },
   },
-  { item: { key: "supplierName", title: "供应商" }, attr: {} },
-  { item: { key: "currencyName", title: "币种" }, attr: {} },
-  { item: { key: "explainStr", title: "价格合理性说明" }, attr: {} },
-  { item: { key: "buyerName", title: "采购员" }, attr: {} },
-  { item: { key: "puDeptName", title: "采购部门" }, attr: {} },
+  { item: { key: "supplierName", title: "供应商" }, attr: { isHidden: true } },
+  { item: { key: "currencyName", title: "币种" }, attr: { isHidden: true } },
+  {
+    item: { key: "explainStr", title: "价格合理性说明" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "buyerName", title: "采购员" }, attr: { isHidden: true } },
+  { item: { key: "puDeptName", title: "采购部门" }, attr: { isHidden: true } },
   {
     item: { key: "file", title: "附件" },
-    attr: { component: "dr-file-preview" },
+    attr: { is: "el-file-preview", isHidden: true },
   },
-  { item: { key: "createByName", title: "创建人" }, attr: {} },
+  { item: { key: "createByName", title: "创建人" }, attr: { isHidden: true } },
   {
     item: { key: "isEffective", title: "是否已推价格" },
-    attr: { dictName: "is_effective" },
+    attr: { is: "el-dict-tag", dictName: "is_effective", isHidden: true },
+  },
+  {
+    item: { key: "effectiveDate", title: "生效日期" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "id", title: "来源单据id" }, attr: { isHidden: true } },
+  { item: { key: "source", title: "来源单据号" }, attr: { isHidden: true } },
+  {
+    item: { key: "sourceType", title: "来源单据类型" },
+    attr: { isHidden: true },
   },
-  { item: { key: "effectiveDate", title: "生效日期" }, attr: {} },
-  { item: { key: "id", title: "来源单据id" }, attr: {} },
-  { item: { key: "source", title: "来源单据号" }, attr: {} },
-  { item: { key: "sourceType", title: "来源单据类型" }, attr: {} },
 ];
 
 export const SearchColumns = [

src/views/purchase/apply/index.vue

@@ -11,18 +11,21 @@ export default {
     EditModel: () => import("./edit/index.vue"),
     SubmitModel: () => import("./submit/index.vue"),
     DeleteModel: () => import("./delete/index.vue"),
-    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
+    ElHideTableColumnButton: () =>
+      import("@/components/hide-table-column/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElSuperSearch: () => import("@/components/super-search/index.vue"),
   },
   data() {
     return {
       size: "mini",
       loading: false,
       batching: false,
-      searchColumns: SearchColumns,
+      SearchColumns: SearchColumns,
       params: initParams(SearchColumns),
       tableData: [],
       selectData: [],
-      tableColumns: TableColumns,
+      TableColumns: TableColumns,
       page: { pageNum: 1, pageSize: 10, total: 0 },
     };
   },
@@ -41,19 +44,15 @@ export default {
         const rule1 = selectData.length === 1;
         const rule2 = selectData.length > 1;
         const rule3 = status === "0" || status === "3";
-        const copy = rule1;
-        const edit = rule1 && rule3;
-        const delt = rule1 ? rule1 && rule3 : rule2;
-        const subm = rule1 ? rule1 && rule3 : rule2;
         return {
           // 复 制
-          copy: copy,
+          copy: rule1,
           // 修 改
-          edit: edit,
+          edit: rule1 && rule3,
           // 删 除
-          delt: delt,
+          delt: rule1 ? rule1 && rule3 : rule2,
           // 审 核
-          subm: subm,
+          subm: rule1 ? rule1 && rule3 : rule2,
         };
       },
     },
@@ -133,24 +132,11 @@ export default {
       const { open } = this.$refs.AddModel;
       await open(id);
     },
-    hasPowerCopy(prop) {
-      return prop.length === 1;
-    },
     // 删 除
     async useDelete(prop) {
       const { open } = this.$refs.DeleteModel;
       await open(prop);
     },
-    hasPowerDelete(prop) {
-      if (prop.length === 1) {
-        const [{ status }] = prop;
-        if (status === "1") return false;
-        else if (status === "2") return false;
-        else return true;
-      } else {
-        return !!prop.length;
-      }
-    },
     // 编 辑
     async useEdit(prop) {
       const [{ id }] = prop;
@@ -168,16 +154,6 @@ export default {
       const { open } = this.$refs.SubmitModel;
       await open(prop, done);
     },
-    hasPowerSubmit(prop) {
-      if (prop.length === 1) {
-        const [{ status }] = prop;
-        if (status === "1") return false;
-        else if (status === "2") return false;
-        else return true;
-      } else {
-        return !!prop.length;
-      }
-    },
   },
 };
 </script>
@@ -195,48 +171,20 @@ export default {
       ref="DeleteModel"
       @success="useQuery(params, page)"
     ></delete-model>
-    <el-form
+    <el-super-search
+      v-model="params"
       :size="size"
-      :model="params"
-      label-width="auto"
-      label-position="right"
-      @submit.native.prevent
-    >
-      <el-row :gutter="20">
-        <el-col
-          v-for="column in searchColumns"
-          :key="column.item.title"
-          :span="column.item.span || 6"
-        >
-          <el-form-item :prop="column.item.key" :label="column.item.title">
-            <component
-              v-bind="column.attr"
-              v-model="params[column.item.key]"
-              :source.sync="params"
-              @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
-              style="width: 100%"
-            >
-              <template v-if="column.attr.dictName">
-                <el-option
-                  v-for="item in dict.type[column.attr.dictName]"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
-                >
-                </el-option>
-              </template>
-            </component>
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
+      :dict="dict"
+      :columns="SearchColumns"
+      @submit="useQuery(params, page)"
+    ></el-super-search>
     <div style="padding: 0 20px; display: flex; justify-content: space-between">
       <div>
         <el-button :size="size" @click="useQuery(params, page)">
           查 询
         </el-button>
         <el-button :size="size" @click="useReset">重 置</el-button>
+        <el-divider direction="vertical"></el-divider>
         <el-button :size="size" @click="useAdd">新 增</el-button>
         <el-button
           v-show="$power.copy"
@@ -251,13 +199,6 @@ export default {
           @click="useEdit(selectData)"
           >编 辑</el-button
         >
-        <!-- <el-button
-        v-show="$power.delt"
-        :size="size"
-        @click="useDelete(selectData)"
-      >
-        删 除
-      </el-button> -->
         <el-button
           v-show="$power.delt"
           :size="size"
@@ -272,22 +213,19 @@ export default {
         >
       </div>
       <div>
-        <el-button
+        <el-button :size="size" @click="useBatch"> 批 量 </el-button>
+        <el-divider direction="vertical"></el-divider>
+        <el-hide-table-column-button
+          v-model="TableColumns"
           :size="size"
-          :icon="batching ? 'el-icon-close' : 'el-icon-check'"
-          @click="useBatch"
-        >
-          批 量
-        </el-button>
+        ></el-hide-table-column-button>
       </div>
     </div>
-    <el-table
-      v-if="tableData.length"
+    <el-super-table
+      v-model="tableData"
       :size="size"
-      :data="tableData"
-      border
-      stripe
-      highlight-current-row
+      :dict="dict"
+      :columns="TableColumns"
       @row-dblclick="useSee"
       @selection-change="useSelect"
       @row-click="useRowClick([$event])"
@@ -301,40 +239,7 @@ export default {
         :selectable="setSelectable"
       >
       </el-table-column>
-      <el-table-column width="55" align="center" type="index">
-        <template slot-scope="scope">
-          {{ scope.row.$index }}
-        </template>
-      </el-table-column>
-      <el-table-column
-        v-for="(column, index) in tableColumns"
-        :key="index"
-        :prop="column.item.key"
-        :label="column.item.title"
-        :width="column.item.width || 200"
-        show-overflow-tooltip
-      >
-        <template slot-scope="scope">
-          <dict-tag
-            v-if="column.attr.dictName"
-            :size="size"
-            :value="scope.row[column.item.key]"
-            :options="dict.type[column.attr.dictName]"
-          />
-          <dr-file-preview
-            v-else-if="
-              column.attr.component === 'dr-file-preview' &&
-              scope.row[column.item.key]
-            "
-            v-model="scope.row[column.item.key]"
-          ></dr-file-preview>
-          <component is="span" v-else>{{
-            scope.row[column.item.key]
-          }}</component>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-empty v-else :image-size="200"></el-empty>
+    </el-super-table>
     <pagination
       v-if="tableData.length"
       :total="page.total"
@@ -350,24 +255,5 @@ export default {
   height: 100%;
   margin: 10px;
   padding: 0 0 20px 0;
-  .el-form {
-    padding: 20px 0 0;
-  }
-  .el-row {
-    display: flex;
-    flex-wrap: wrap;
-    padding: 0 20px;
-  }
-  ::v-deep .el-table--mini {
-    width: 100%;
-    margin: 20px 0 0 0;
-    .el-table__cell {
-      height: 50px;
-    }
-    td.el-table__cell {
-      border-right: 0;
-      // border-bottom: 0;
-    }
-  }
 }
 </style>

src/views/purchase/contract/add/index.vue

@@ -175,6 +175,7 @@ export default {
     :title="title"
     :show-close="false"
     :visible.sync="visible"
+    destroy-on-close
   >
     <template slot="title">
       <span>{{ title }}</span>

src/views/purchase/contract/column.js

@@ -1,11 +1,11 @@
 import CONFIG from "@/config";
 
 export const TableColumns = [
-  { item: { key: "puOrgName", title: "采购组织" }, attr: {} },
-  { item: { key: "code", title: "合同编码" }, attr: {} },
+  { item: { key: "puOrgName", title: "采购组织" }, attr: { isHidden: true } },
+  { item: { key: "code", title: "合同编码" }, attr: { isHidden: true } },
   {
     item: { key: "status", title: "状态" },
-    attr: { is: "el-dict-tag", dictName: "documents_status" },
+    attr: { is: "el-dict-tag", dictName: "documents_status", isHidden: true },
   },
   {
     item: { key: "lastPuMoney", title: "上年度采购额" },
@@ -14,13 +14,18 @@ export const TableColumns = [
       formatter: (prop) => {
         return (prop * 1).toFixed(CONFIG.precision);
       },
+      isHidden: true,
     },
   },
-  { item: { key: "buyerName", title: "采购员" }, attr: {} },
-  { item: { key: "supplierName", title: "供应商" }, attr: {} },
+  { item: { key: "buyerName", title: "采购员" }, attr: { isHidden: true } },
+  { item: { key: "supplierName", title: "供应商" }, attr: { isHidden: true } },
   {
     item: { key: "contractType", title: "合同类型" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_contract_type" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_contract_type",
+      isHidden: true,
+    },
   },
   {
     item: { key: "puMoneyYear", title: "本年度采购额" },
@@ -29,14 +34,22 @@ export const TableColumns = [
       formatter: (prop) => {
         return (prop * 1).toFixed(CONFIG.precision);
       },
+      isHidden: true,
     },
   },
-  { item: { key: "puDeptName", title: "采购部门" }, attr: {} },
+  { item: { key: "puDeptName", title: "采购部门" }, attr: { isHidden: true } },
   {
     item: { key: "supplierTier", title: "供应商层级" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_supplier_tier" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_supplier_tier",
+      isHidden: true,
+    },
+  },
+  {
+    item: { key: "contractName", title: "合同名称" },
+    attr: { isHidden: true },
   },
-  { item: { key: "contractName", title: "合同名称" }, attr: {} },
   {
     item: { key: "grossRateAverage", title: "平均毛利率 (%)" },
     attr: {
@@ -44,20 +57,29 @@ export const TableColumns = [
       formatter: (prop) => {
         return (prop * 1).toFixed(CONFIG.precision);
       },
+      isHidden: true,
     },
   },
   {
     item: { key: "approveFlow", title: "审批流程" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_approve_flow" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_approve_flow",
+      isHidden: true,
+    },
   },
   {
     item: { key: "consumableClass", title: "耗材类别" },
     attr: {
       is: "el-dict-tag",
       dictName: "puarchase_contract_consumable_class",
+      isHidden: true,
     },
   },
-  { item: { key: "effectiveDate", title: "合同生效日期" }, attr: {} },
+  {
+    item: { key: "effectiveDate", title: "合同生效日期" },
+    attr: { isHidden: true },
+  },
   {
     item: { key: "brandGrossRate", title: "同类品牌及毛利率 (%)" },
     attr: {
@@ -65,14 +87,22 @@ export const TableColumns = [
       formatter: (prop) => {
         return (prop * 1).toFixed(CONFIG.precision);
       },
+      isHidden: true,
     },
   },
   {
     item: { key: "contractFormat", title: "合同格式" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_contract_format" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_contract_format",
+      isHidden: true,
+    },
   },
-  { item: { key: "productName", title: "产品类别&名称" }, attr: {} },
-  { item: { key: "endDate", title: "合同终止日期" }, attr: {} },
+  {
+    item: { key: "productName", title: "产品类别&名称" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "endDate", title: "合同终止日期" }, attr: { isHidden: true } },
   {
     item: { key: "invoiceTax", title: "发票税率 (%)" },
     attr: {
@@ -80,6 +110,7 @@ export const TableColumns = [
       formatter: (prop) => {
         return (prop * 1).toFixed(CONFIG.precision);
       },
+      isHidden: true,
     },
   },
   {
@@ -87,62 +118,107 @@ export const TableColumns = [
     attr: {
       is: "el-dict-tag",
       dictName: "puarchase_contract_emergency_degree",
+      isHidden: true,
     },
   },
-  { item: { key: "project", title: "项目医院" }, attr: {} },
+  { item: { key: "project", title: "项目医院" }, attr: { isHidden: true } },
   {
     item: { key: "deliveryType", title: "交货方式" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_delivery_type" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_delivery_type",
+      isHidden: true,
+    },
+  },
+  { item: { key: "source", title: "合同来源" }, attr: { isHidden: true } },
+  {
+    item: { key: "contractPartycName", title: "合同丙方" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "guaranteePeriodEnd", title: "质保期限" },
+    attr: { isHidden: true },
   },
-  { item: { key: "source", title: "合同来源" }, attr: {} },
-  { item: { key: "contractPartycName", title: "合同丙方" }, attr: {} },
-  { item: { key: "guaranteePeriodEnd", title: "质保期限" }, attr: {} },
   {
     item: { key: "freightMethods", title: "运费承担方式" },
-    attr: { is: "el-dict-tag", dictName: "puarchase_contract_freight_methods" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "puarchase_contract_freight_methods",
+      isHidden: true,
+    },
+  },
+  {
+    item: { key: "signDate", title: "合同创建时间" },
+    attr: { isHidden: true },
   },
-  { item: { key: "signDate", title: "合同创建时间" }, attr: {} },
   {
     item: { key: "isTarget", title: "是否有指标" },
-    attr: { is: "el-dict-tag", dictName: "sys_yes_no" },
+    attr: { is: "el-dict-tag", dictName: "sys_yes_no", isHidden: true },
+  },
+  {
+    item: { key: "contractTarget", title: "合同指标" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "exemptionPostageCondtion", title: "包邮条件" },
+    attr: { isHidden: true },
   },
-  { item: { key: "contractTarget", title: "合同指标" }, attr: {} },
-  { item: { key: "exemptionPostageCondtion", title: "包邮条件" }, attr: {} },
   {
     item: { key: "isRebate", title: "是否有返利" },
-    attr: { is: "el-dict-tag", dictName: "sys_yes_no" },
+    attr: { is: "el-dict-tag", dictName: "sys_yes_no", isHidden: true },
+  },
+  {
+    item: { key: "rebatePolicy", title: "返利政策" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "externalContract", title: "外部合同号" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "rollbackPolicy", title: "退换货政策" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "enquiryCode", title: "询价单号" }, attr: { isHidden: true } },
+  {
+    item: { key: "contractContent", title: "合同主要内容" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "refusalReasons", title: "拒绝理由" },
+    attr: { isHidden: true },
   },
-  { item: { key: "rebatePolicy", title: "返利政策" }, attr: {} },
-  { item: { key: "externalContract", title: "外部合同号" }, attr: {} },
-  { item: { key: "rollbackPolicy", title: "退换货政策" }, attr: {} },
-  { item: { key: "enquiryCode", title: "询价单号" }, attr: {} },
-  { item: { key: "contractContent", title: "合同主要内容" }, attr: {} },
-  { item: { key: "refusalReasons", title: "拒绝理由" }, attr: {} },
   {
     item: { key: "pigeonhole", title: "是否归档" },
-    attr: { is: "el-dict-tag", dictName: "sys_yes_no" },
+    attr: { is: "el-dict-tag", dictName: "sys_yes_no", isHidden: true },
   },
   {
     item: { key: "pigeonholeFile", title: "归档附件" },
-    attr: { is: "el-file-preview" },
+    attr: { is: "el-file-preview", isHidden: true },
   },
   {
     item: { key: "externalFile", title: "对外附件" },
-    attr: { is: "el-file-preview" },
+    attr: { is: "el-file-preview", isHidden: true },
   },
   {
     item: { key: "puFile", title: "采购商盖章合同附件" },
-    attr: { is: "el-file-preview" },
+    attr: { is: "el-file-preview", isHidden: true },
   },
   {
     item: { key: "supplierFile", title: "供应商盖章合同附件" },
-    attr: { is: "el-file-preview" },
+    attr: { is: "el-file-preview", isHidden: true },
+  },
+  { item: { key: "projectCode", title: "项目编号" }, attr: { isHidden: true } },
+  { item: { key: "projectName", title: "项目名称" }, attr: { isHidden: true } },
+  { item: { key: "area", title: "区域" }, attr: { isHidden: true } },
+  {
+    item: { key: "consigneePhone", title: "收货人联系方式" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "paymentAgreement", title: "付款协议" },
+    attr: { isHidden: true },
   },
-  { item: { key: "projectCode", title: "项目编号" }, attr: {} },
-  { item: { key: "projectName", title: "项目名称" }, attr: {} },
-  { item: { key: "area", title: "区域" }, attr: {} },
-  { item: { key: "consigneePhone", title: "收货人联系方式" }, attr: {} },
-  { item: { key: "paymentAgreement", title: "付款协议" }, attr: {} },
   {
     item: { key: "taxPrice", title: "价税合计" },
     attr: {
@@ -150,10 +226,14 @@ export const TableColumns = [
       formatter: (prop) => {
         return prop ? (prop * 1).toFixed(CONFIG.precision) : "0.000000";
       },
+      isHidden: true,
     },
   },
-  { item: { key: "currencyName", title: "币种" }, attr: {} },
-  { item: { key: "guaranteePeriod", title: "质保期" }, attr: {} },
+  { item: { key: "currencyName", title: "币种" }, attr: { isHidden: true } },
+  {
+    item: { key: "guaranteePeriod", title: "质保期" },
+    attr: { isHidden: true },
+  },
 ];
 export const FormColumns = [
   {

src/views/purchase/contract/index.vue

@@ -1,11 +1,11 @@
 <script>
-import { TableColumns, FormColumns } from "./column";
+import { TableColumns, FormColumns as SearchColumns } from "./column";
 import { LIST } from "@/api/business/purchase/contract";
 import { initDicts, initParams } from "@/utils/init.js";
 export default {
   name: "PuchaseContract",
   dicts: [
-    ...initDicts(FormColumns),
+    ...initDicts(SearchColumns),
     ...initDicts(TableColumns),
     "puarchase_contract_origin",
   ],
@@ -19,17 +19,18 @@ export default {
     TerminationModel: () => import("./termination/index.vue"),
     PigeonholeModel: () => import("./pigeonhole/index.vue"),
     SubmitModel: () => import("./submit/index.vue"),
-    ElDictTag: () => import("@/components/DictTag/index.vue"),
-    ElFilePreview: () => import("@/components/file-preview/index.vue"),
-    ElComputedInputV2: () => import("@/components/computed-input-v2/index.vue"),
+    ElHideTableColumnButton: () =>
+      import("@/components/hide-table-column/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElSuperSearch: () => import("@/components/super-search/index.vue"),
   },
   data() {
     return {
       size: "mini",
       loading: false,
       batching: false,
-      FormColumns: FormColumns,
-      params: initParams(FormColumns),
+      SearchColumns: SearchColumns,
+      params: initParams(SearchColumns),
       tableData: [],
       selectData: [],
       TableColumns: TableColumns,
@@ -107,7 +108,7 @@ export default {
     useReset() {
       this.page.pageNum = 1;
       this.page.pageSize = 10;
-      this.params = initParams(FormColumns);
+      this.params = initParams(SearchColumns);
       this.useQuery(this.params, this.page);
     },
     // 选 择
@@ -202,47 +203,14 @@ export default {
       ref="PigeonholeModel"
       @success="useQuery(params, page)"
     ></pigeonhole-model>
-
-    <el-form
+    <el-super-search
+      v-model="params"
       :size="size"
-      :model="params"
-      label-width="auto"
-      label-position="right"
-      @submit.native.prevent
-    >
-      <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
-        <el-col
-          v-for="{ item, attr } in FormColumns"
-          :key="item.key"
-          :span="item.span || 6"
-        >
-          <el-form-item :prop="item.key" :label="item.title">
-            <component
-              v-if="attr.is === 'el-input'"
-              v-bind="attr"
-              v-model="params[item.key]"
-              @keyup.enter.native="useQuery(params, page)"
-            ></component>
-            <component
-              v-if="attr.is === 'el-select'"
-              v-bind="attr"
-              v-model="params[item.key]"
-              style="width: 100%"
-              @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
-            >
-              <el-option
-                v-for="option in $dicts[attr.dictName]"
-                :key="option.value"
-                :label="option.label"
-                :value="option.value"
-              >
-              </el-option>
-            </component>
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
+      :dict="dict"
+      :columns="SearchColumns"
+      @submit="useQuery(params, page)"
+    ></el-super-search>
+
     <div style="padding: 0 20px; display: flex; justify-content: space-between">
       <div>
         <el-button :size="size" @click="useQuery(params, page)">
@@ -292,22 +260,19 @@ export default {
       </div>
       <!-- <el-button :size="size" @click="useImport"> 导 入 </el-button> -->
       <div>
-        <el-button
+        <el-button :size="size" @click="useBatch"> 批 量 </el-button>
+        <el-divider direction="vertical"></el-divider>
+        <el-hide-table-column-button
+          v-model="TableColumns"
           :size="size"
-          :icon="batching ? 'el-icon-close' : 'el-icon-check'"
-          @click="useBatch"
-        >
-          批 量
-        </el-button>
+        ></el-hide-table-column-button>
       </div>
     </div>
-    <el-table
-      v-if="tableData.length"
+    <el-super-table
+      v-model="tableData"
       :size="size"
-      :data="tableData"
-      border
-      stripe
-      highlight-current-row
+      :dict="dict"
+      :columns="TableColumns"
       @row-dblclick="useSee"
       @selection-change="useSelect"
       @row-click="useRowClick([$event])"
@@ -321,44 +286,7 @@ export default {
         :selectable="setSelectable"
       >
       </el-table-column>
-      <el-table-column width="55" align="center" type="index">
-        <template slot-scope="scope">
-          {{ scope.row.$index }}
-        </template>
-      </el-table-column>
-      <el-table-column
-        v-for="{ item, attr } in TableColumns"
-        :key="item.key"
-        :prop="item.key"
-        :label="item.title"
-        :width="item.width || 200"
-        show-overflow-tooltip
-      >
-        <template slot-scope="scope">
-          <component
-            v-if="attr.is === 'el-dict-tag'"
-            v-bind="attr"
-            v-model="scope.row[item.key]"
-            :size="size"
-            :options="dict.type[attr.dictName]"
-          ></component>
-          <component
-            v-else-if="attr.is === 'el-file-preview'"
-            v-bind="attr"
-            v-model="scope.row[item.key]"
-          ></component>
-          <component
-            v-else-if="attr.is === 'el-computed-input-v2'"
-            v-bind="attr"
-            v-model="scope.row[item.key]"
-          ></component>
-          <component is="span" v-else>{{
-            scope.row[item.key] || "--"
-          }}</component>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-empty v-else :image-size="200"></el-empty>
+    </el-super-table>
     <pagination
       :total="page.total"
       :page.sync="page.pageNum"

src/views/purchase/task/column.js

@@ -1,41 +1,78 @@
 export const TableColumns = [
-  { item: { key: "code", title: "订单生成单号" }, attr: {} },
+  { item: { key: "code", title: "订单生成单号" }, attr: { isHidden: true } },
   {
     item: { key: "status", title: "状态" },
-    attr: { is: "el-dict-tag", dictName: "purchase_task_status" },
+    attr: {
+      is: "el-dict-tag",
+      dictName: "purchase_task_status",
+      isHidden: true,
+    },
+  },
+  { item: { key: "demandCode", title: "需求单号" }, attr: { isHidden: true } },
+  { item: { key: "materialName", title: "物料" }, attr: { isHidden: true } },
+  {
+    item: { key: "materialCode", title: "物料编码" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "materialDesc", title: "物料描述" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "manufacturerName", title: "生产厂家" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "puQty", title: "采购数量" }, attr: { isHidden: true } },
+  {
+    item: { key: "executeQty", title: "已执行数量" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "residueQty", title: "未执行数量" },
+    attr: { isHidden: true },
   },
-  { item: { key: "demandCode", title: "需求单号" }, attr: {} },
-  { item: { key: "materialName", title: "物料" }, attr: {} },
-  { item: { key: "materialCode", title: "物料编码" }, attr: {} },
-  { item: { key: "materialDesc", title: "物料描述" }, attr: {} },
-  { item: { key: "manufacturerName", title: "生产厂家" }, attr: {} },
-  { item: { key: "puQty", title: "采购数量" }, attr: {} },
-  { item: { key: "executeQty", title: "已执行数量" }, attr: {} },
-  { item: { key: "residueQty", title: "未执行数量" }, attr: {} },
   {
     item: { key: "priceType", title: "价格类型" },
-    attr: { is: "el-dict-tag", dictName: "sys_price_type" },
-  },
-  { item: { key: "puUnitName", title: "采购单位" }, attr: {} },
-  { item: { key: "buyerName", title: "采购员" }, attr: {} },
-  { item: { key: "supplierName", title: "建议供应商" }, attr: {} },
-  { item: { key: "puOrgName", title: "采购组织" }, attr: {} },
-  { item: { key: "currencyName", title: "币种" }, attr: {} },
-  { item: { key: "source", title: "需求来源" }, attr: {} },
-  { item: { key: "customerName", title: "收货客户" }, attr: {} },
-  { item: { key: "assignSupplierName", title: "指定供应商" }, attr: {} },
-  { item: { key: "demandDate", title: "需求时间" }, attr: {} },
-  { item: { key: "projectName", title: "项目名称" }, attr: {} },
-  { item: { key: "demandPersonalName", title: "需求人" }, attr: {} },
-  { item: { key: "demandOrgName", title: "需求组织" }, attr: {} },
-  { item: { key: "demandDeptName", title: "需求部门" }, attr: {} },
+    attr: { is: "el-dict-tag", dictName: "sys_price_type", isHidden: true },
+  },
+  { item: { key: "puUnitName", title: "采购单位" }, attr: { isHidden: true } },
+  { item: { key: "buyerName", title: "采购员" }, attr: { isHidden: true } },
+  {
+    item: { key: "supplierName", title: "建议供应商" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "puOrgName", title: "采购组织" }, attr: { isHidden: true } },
+  { item: { key: "currencyName", title: "币种" }, attr: { isHidden: true } },
+  { item: { key: "source", title: "需求来源" }, attr: { isHidden: true } },
+  {
+    item: { key: "customerName", title: "收货客户" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "assignSupplierName", title: "指定供应商" },
+    attr: { isHidden: true },
+  },
+  { item: { key: "demandDate", title: "需求时间" }, attr: { isHidden: true } },
+  { item: { key: "projectName", title: "项目名称" }, attr: { isHidden: true } },
+  {
+    item: { key: "demandPersonalName", title: "需求人" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "demandOrgName", title: "需求组织" },
+    attr: { isHidden: true },
+  },
+  {
+    item: { key: "demandDeptName", title: "需求部门" },
+    attr: { isHidden: true },
+  },
   {
     item: { key: "isBack", title: "是否退回" },
-    attr: { is: "el-dict-tag", dictName: "sys_yes_no" },
+    attr: { is: "el-dict-tag", dictName: "sys_yes_no", isHidden: true },
   },
-  { item: { key: "baskCause", title: "退回原因" }, attr: {} },
-  { item: { key: "backDate", title: "退回日期" }, attr: {} },
-  { item: { key: "unitName", title: "单位" }, attr: {} },
+  { item: { key: "baskCause", title: "退回原因" }, attr: { isHidden: true } },
+  { item: { key: "backDate", title: "退回日期" }, attr: { isHidden: true } },
+  { item: { key: "unitName", title: "单位" }, attr: { isHidden: true } },
 ];
 
 export const SearchColumns = [
@@ -45,7 +82,7 @@ export const SearchColumns = [
       title: "物料分类",
     },
     attr: {
-      is: "dr-popover-tree-select",
+      is: "el-popover-tree-select",
       referName: "MATERIALCLASSIFY_PARAM",
       multiple: true,
       valueKey: "id",

src/views/purchase/task/index.vue

@@ -13,20 +13,20 @@ export default {
     ShiftModel: () => import("./modify-buyer/index.vue"),
     DirectModel: () => import("./first-direct/index.vue"),
     ReturnModel: () => import("./documents-return/index.vue"),
-    ElDictTag: () => import("@/components/DictTag/index.vue"),
-    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
-    ElPopoverMultipleSelectV2: () =>
-      import("@/components/popover-select-v2/multiple.vue"),
+    ElHideTableColumnButton: () =>
+      import("@/components/hide-table-column/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElSuperSearch: () => import("@/components/super-search/index.vue"),
   },
   data() {
     return {
       size: "mini",
       loading: false,
-      searchColumns: SearchColumns,
+      SearchColumns: SearchColumns,
       params: initParams(SearchColumns),
       tableData: [],
       selectData: [],
-      tableColumns: TableColumns,
+      TableColumns: TableColumns,
       page: { pageNum: 1, pageSize: 10, total: 0 },
     };
   },
@@ -177,76 +177,56 @@ export default {
       ref="ReturnModel"
       @success="useQuery(params, page)"
     ></return-model>
-    <el-form
+    <el-super-search
+      v-model="params"
       :size="size"
-      :model="params"
-      label-width="auto"
-      label-position="right"
-      @submit.native.prevent
-    >
-      <el-row :gutter="20">
-        <el-col
-          v-for="(column, index) in searchColumns"
-          :key="index"
-          :span="column.item.span || 6"
+      :dict="dict"
+      :columns="SearchColumns"
+      @submit="useQuery(params, page)"
+    ></el-super-search>
+    <div style="padding: 0 20px; display: flex; justify-content: space-between">
+      <div>
+        <el-button :size="size" @click="useQuery(params, page)">
+          查 询
+        </el-button>
+        <el-button :size="size" @click="useReset"> 重 置 </el-button>
+        <el-divider direction="vertical"></el-divider>
+        <el-button
+          v-show="hasPowerShift(selectData)"
+          :size="size"
+          @click="useShift(selectData[0])"
         >
-          <el-form-item :prop="column.item.key" :label="column.item.title">
-            <component
-              v-bind="column.attr"
-              v-model="params[column.item.key]"
-              :source.sync="params"
-              @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
-              style="width: 100%"
-            >
-              <template v-if="column.attr.dictName">
-                <el-option
-                  v-for="item in $dicts[column.attr.dictName]"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
-                >
-                </el-option>
-              </template>
-            </component>
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
-    <el-row>
-      <el-button :size="size" @click="useQuery(params, page)">
-        查 询
-      </el-button>
-      <el-button :size="size" @click="useReset"> 重 置 </el-button>
-      <el-button
-        v-show="hasPowerShift(selectData)"
-        :size="size"
-        @click="useShift(selectData[0])"
-      >
-        转 派
-      </el-button>
-      <el-button
-        v-show="hasPowerReturn(selectData)"
-        :size="size"
-        @click="useReturn(selectData)"
-      >
-        退回需求
-      </el-button>
-      <el-button
-        v-show="hasPowerDirect(selectData)"
-        :size="size"
-        @click="useDirect(selectData)"
-      >
-        协议直采
-      </el-button>
-    </el-row>
-    <el-table
-      :data="tableData"
-      size="mini"
-      highlight-current-row
+          转 派
+        </el-button>
+        <el-button
+          v-show="hasPowerReturn(selectData)"
+          :size="size"
+          @click="useReturn(selectData)"
+        >
+          退回需求
+        </el-button>
+        <el-button
+          v-show="hasPowerDirect(selectData)"
+          :size="size"
+          @click="useDirect(selectData)"
+        >
+          协议直采
+        </el-button>
+      </div>
+      <div>
+        <el-hide-table-column-button
+          v-model="TableColumns"
+          :size="size"
+        ></el-hide-table-column-button>
+      </div>
+    </div>
+    <el-super-table
+      v-model="tableData"
+      :size="size"
+      :dict="dict"
+      :columns="TableColumns"
       @row-dblclick="useSee"
       @selection-change="useSelect"
-      @row-click="useSelect([$event])"
     >
       <el-table-column
         fixed
@@ -256,30 +236,7 @@ export default {
         :selectable="setSelectable"
       >
       </el-table-column>
-      <el-table-column width="55" align="center" type="index">
-        <template slot-scope="scope">
-          {{ scope.row.$index }}
-        </template>
-      </el-table-column>
-      <el-table-column
-        v-for="({ item, attr }, index) in tableColumns"
-        :key="index"
-        :prop="item.key"
-        :label="item.title"
-        :width="item.width || 250"
-        show-overflow-tooltip
-      >
-        <template slot-scope="scope">
-          <dict-tag
-            v-if="attr.dictName"
-            :size="size"
-            :value="scope.row[item.key]"
-            :options="$dicts[attr.dictName]"
-          />
-          <component is="span" v-else>{{ scope.row[item.key] }}</component>
-        </template>
-      </el-table-column>
-    </el-table>
+    </el-super-table>
     <pagination
       :total="page.total"
       :page.sync="page.pageNum"