update

src/components/popover-select-v2/api/index.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+export function REFER(data, params) {
+  return request({
+    url: "/refer/query",
+    method: "POST",
+    data: data,
+    params: params,
+  });
+}

src/components/popover-select-v2/components/ADDRESS_PARAM.js

@@ -0,0 +1,39 @@
+// 收货地址
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "仓库",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "address",
+    title: "地址",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "contactsName",
+    title: "联系人",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "contactsPhone",
+    title: "电话",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/ALLOCATION_PARAM.js

@@ -0,0 +1,22 @@
+// 货位
+export default [
+  // 树
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "货位",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/BALATYPE_PARAM.js

@@ -0,0 +1,21 @@
+// 结算方式
+export default [
+  // {
+  //   key: "id",
+  //   title: "结算方式ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "结算方式",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/CONTACTS_PARAM.js

@@ -0,0 +1,15 @@
+// 客户部门
+export default [
+  {
+    key: "code",
+    title: "人员编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "人员名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/CURRENCY_PARAM.js

@@ -0,0 +1,30 @@
+export default [
+  {
+    key: "name",
+    title: "币种",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "code",
+    title: "币种简称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "",
+    title: "单价精度",
+  },
+  {
+    key: "",
+    title: "单价舍入规则",
+  },
+  {
+    key: "",
+    title: "金额精度",
+  },
+  {
+    key: "",
+    title: "金额舍入规则",
+  },
+];

src/components/popover-select-v2/components/CUSTOMERDEPT_PARAM.js

@@ -0,0 +1,22 @@
+// 客户部门
+export default [
+  // {
+  //   key: "id",
+  //   title: "客户部门ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "客户部门编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "客户部门名称",
+    type: "Input",
+    search: true,
+  },
+];
+

src/components/popover-select-v2/components/CUSTOMER_PARAM.js

@@ -0,0 +1,21 @@
+// 收货客户
+export default [
+  // {
+  //   key: "id",
+  //   title: "收货客户ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "收货客户编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "收货客户名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/DEPT_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "组织编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "组织名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/MATERIAL_PARAM.js

@@ -0,0 +1,48 @@
+export default [
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "specification",
+    title: "规格",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "manufacturerIdName",
+    title: "生产厂家",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "unitIdName",
+    title: "单位",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "registrationNo",
+    title: "注册证号",
+    type: "ComputedInput",
+    computed: (prop) => {
+      return prop.materialMedcine.registrationNo;
+    },
+  },
+  {
+    key: "isDrug",
+    title: "物料药品属性",
+    type: "ComputedInput",
+    computed: (prop) => {
+      return prop.materialMedcine.isDrug == '0' ? 'Y' : 'N';
+    },
+  },
+];

src/components/popover-select-v2/components/OPERATING_PARAM.js

@@ -0,0 +1,21 @@
+// 经营性项目
+export default [
+  // {
+  //   key: "id",
+  //   title: "经营性项目ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "经营性项目编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "经营性项目名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/ORG_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+    {
+      key: "code",
+      title: "组织编码",
+      type: "Input",
+      search: true,
+    },
+    {
+      key: "name",
+      title: "组织名称",
+      type: "Input",
+      search: true,
+    },
+  ]

src/components/popover-select-v2/components/PAYAGREEMENT_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "付款协议编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "付款协议名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/PROCESSTYPE_PARAM.js

@@ -0,0 +1,21 @@
+// 处理方式
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "处理方式",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/PROJECT_PARAM.js

@@ -0,0 +1,21 @@
+// 在建工程项目
+export default [
+  // {
+  //   key: "id",
+  //   title: "在建工程项目ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "在建工程项目编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "在建工程项目名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/PSNLICENSE_PARAM.js

@@ -0,0 +1,21 @@
+// 人员证照参照
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/RETREASON_PARAM.js

@@ -0,0 +1,21 @@
+// 退换原因
+export default [
+  // {
+  //   key: "id",
+  //   title: "退换原因ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "退换原因编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "退换原因",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/SUPPLIERCONTACTS_PARAM.js

@@ -0,0 +1,27 @@
+// 供应商联系人
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  // {
+  //   key: "code",
+  //   title: "编码",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "cell",
+    title: "电话",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/SUPPLIER_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "供应商编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "供应商名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/TAX_RATE_PARAM.js

@@ -0,0 +1,29 @@
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "ntaxrate",
+    title: "税率",
+    type: "ComputedInput",
+    computed: (prop) => {
+      const { ntaxrate } = prop;
+      return ntaxrate === "0E-8" ? "0.00000000" : ntaxrate;
+    },
+  },
+];

src/components/popover-select-v2/components/UNIT_PARAM.js

@@ -0,0 +1,22 @@
+// 货位
+export default [
+  // 树
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "货位",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select-v2/components/WAREHOUSE_PARAM.js

@@ -0,0 +1,29 @@
+// 收货仓库
+export default [
+  // {
+  //   key: "id",
+  //   title: "仓库ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "仓库编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "仓库名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "",
+    title: "备注",
+  },
+  {
+    key: "",
+    title: "助记码",
+  },
+];

src/components/popover-select-v2/index.vue

@@ -0,0 +1,277 @@
+<script>
+import { REFER } from "./api/index";
+
+export default {
+  name: "PopoverSelectV2",
+  props: {
+    // v-model
+    value: {
+      type: [Array, String],
+      require: true,
+    },
+    // 参照类型 ，对应后端
+    referName: {
+      type: String,
+      require: true,
+    },
+    // 作为 value 唯一标识的键名，绑定值
+    valueKey: {
+      type: String,
+      dafault: () => {
+        return "code";
+      },
+    },
+    // 默认查询参数
+    queryParams: {
+      type: Function,
+      default: () => {},
+    },
+    // 需映射源数据
+    source: {
+      type: Object,
+      default: () => ({}),
+    },
+    // 参照内外映射
+    dataMapping: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  components: {},
+  data() {
+    return {
+      size: "mini",
+      width: "50%",
+      page: { pageNum: 1, pageSize: 10, total: 0 },
+      visible: false,
+      loading: false,
+      model: {
+        search: "",
+        isPage: true,
+      },
+      data: [],
+      selectData: [],
+    };
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+    tableColumns() {
+      const { referName } = this.$props;
+      return require(`./components/${referName}`).default.filter(
+        (document) => document.key
+      );
+    },
+  },
+  watch: {},
+  methods: {
+    // open dialog
+    async open() {
+      this.visible = true;
+      await this.useReset();
+    },
+    // hide dialog
+    async hide() {
+      this.visible = false;
+    },
+    // fetch list
+    async fetchList(prop, page) {
+      try {
+        // try
+        this.loading = true;
+        const { pageNum, pageSize } = page;
+        const { referName: type, source, queryParams } = this.$props;
+        const { code, rows, total } = await REFER(
+          {
+            ...prop,
+            ...queryParams(source),
+            type: type,
+          },
+          {
+            pageNum,
+            pageSize,
+          }
+        );
+        if (code === 200) {
+          this.data = rows;
+          this.page.total = total;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    // reset
+    async useReset() {
+      this.data = [];
+      this.model.search = null;
+      await this.fetchList(this.model, this.page);
+    },
+    // query
+    async useQuery() {
+      await this.fetchList(this.model, this.page);
+    },
+    // auto
+    async useAutocomplete(prop, cb) {
+      if (prop) {
+        this.model.search = prop;
+        await this.fetchList(this.model, this.page);
+        await cb(this.data);
+      } else {
+        cb([]);
+      }
+    },
+    // select
+    useSelect(prop) {
+      this.selectData = prop;
+    },
+    // confirm
+    useConfirm(prop) {
+      this.hide();
+      const {
+        $props: { source, valueKey, dataMapping },
+      } = this;
+      for (let key in dataMapping) {
+        source[key] = prop[dataMapping[key]];
+      }
+      this.$emit("update:source", source);
+      this.$emit("input", prop[valueKey]);
+      this.$emit("change", prop, this.$props);
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<!-- v-on="$listeners" -->
+<template>
+  <div class="popover-select-v2">
+    <el-autocomplete
+      v-bind="$attrs"
+      v-model="innerValue"
+      :value-key="valueKey"
+      :fetch-suggestions="useAutocomplete"
+      @select="useConfirm"
+      style="width: 100%"
+    >
+      <i class="el-icon-search" slot="suffix" @click="open"> </i>
+      <template slot-scope="{ item }">
+        <div
+          style="text-overflow: ellipsis; overflow: hidden; line-height: 16px"
+        >
+          {{ item.name }}
+        </div>
+        <span style="font-size: 12px; color: #b4b4b4">{{ item.code }}</span>
+      </template>
+    </el-autocomplete>
+    <el-dialog
+      :width="width"
+      :show-close="false"
+      :visible.sync="visible"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      append-to-body
+    >
+      <template slot="title">
+        <div
+          style="
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          "
+        >
+          <span>选 择</span>
+          <span>
+            <el-button
+              :size="size"
+              circle
+              icon="el-icon-check"
+              @click="useConfirm(selectData[0])"
+            >
+            </el-button>
+            <el-button
+              :size="size"
+              circle
+              type="danger"
+              icon="el-icon-close"
+              @click="hide"
+            ></el-button>
+          </span>
+        </div>
+      </template>
+      <el-form
+        v-loading="loading"
+        :inline="true"
+        :model="model"
+        :size="size"
+        @submit.native.prevent
+      >
+        <el-form-item prop="search">
+          <el-input
+            v-model="model.search"
+            @change="useQuery"
+            @keydown.enter="useQuery"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button icon="el-icon-refresh" @click="useReset"></el-button>
+        </el-form-item>
+        <el-table
+          :data="data"
+          :size="size"
+          height="45vh"
+          highlight-current-row
+          @row-click="useSelect([$event])"
+          @row-dblclick="useConfirm"
+        >
+          <el-table-column
+            v-for="(column, index) in tableColumns"
+            :key="index"
+            :prop="column.key"
+            :label="column.title"
+            :width="column.width || 200"
+            show-overflow-tooltip
+          >
+            <template slot-scope="scope">
+              <dr-computed-input
+                v-if="column.type === 'ComputedInput'"
+                v-model="scope.row[column.key]"
+                :source="scope.row"
+                :computed="column.computed"
+                :placeholder="column.placeholder"
+                style="width: 100%"
+              ></dr-computed-input>
+              <span v-else> {{ scope.row[column.key] }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="!loading"
+          :total="page.total"
+          :page.sync="page.pageNum"
+          :limit.sync="page.pageSize"
+          @pagination="useQuery"
+        />
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+<style scoped>
+.popover-select-v2 .el-autocomplete {
+  width: inherit;
+}
+.popover-select-v2 .el-autocomplete .el-icon-search {
+  cursor: pointer;
+}
+</style>

src/components/popover-select-v2/multiple.vue

@@ -0,0 +1,312 @@
+<script>
+import { REFER } from "./api/index";
+import deepCopy from "@gby/deep-copy";
+
+export default {
+  name: "PopoverSelectV2",
+  props: {
+    // v-model
+    value: {
+      type: [Array, String],
+      require: true,
+    },
+    // 参照类型 ，对应后端
+    referName: {
+      type: String,
+      require: true,
+    },
+    // 作为 value 唯一标识的键名，绑定值
+    valueKey: {
+      type: [String, Array],
+    },
+    // 默认查询参数
+    queryParams: {
+      type: Function,
+      default: () => {},
+    },
+    // 需映射源数据
+    source: {
+      type: Object,
+      default: () => ({}),
+    },
+    // 参照内外映射
+    dataMapping: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  components: {},
+  data() {
+    return {
+      size: "mini",
+      width: "50%",
+      page: { pageNum: 1, pageSize: 10, total: 0 },
+      visible: false,
+      loading: false,
+      scroll: false,
+      model: {
+        search: "",
+        isPage: true,
+      },
+      data: [],
+      selectData: [],
+      lastSelectData: [],
+    };
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+    tableColumns() {
+      const { referName } = this.$props;
+      return require(`./components/${referName}`).default.filter(
+        (document) => document.key
+      );
+    },
+  },
+  watch: {},
+  methods: {
+    // open dialog
+    async open() {
+      this.visible = true;
+      await this.useReset();
+    },
+    // hide dialog
+    async hide() {
+      this.visible = false;
+    },
+    // fetch list
+    async fetchList(prop, page) {
+      try {
+        // try
+        this.loading = true;
+        const { pageNum, pageSize } = page;
+        const { referName: type, source, queryParams } = this.$props;
+        const { code, rows, total } = await REFER(
+          {
+            ...prop,
+            ...queryParams(source),
+            type: type,
+          },
+          {
+            pageNum,
+            pageSize,
+          }
+        );
+        if (code === 200) {
+          this.data = rows;
+          this.page.total = total;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    // reset
+    async useReset() {
+      this.data = [];
+      this.model.search = null;
+      await this.fetchList(this.model, this.page);
+    },
+    // query
+    async useQuery() {
+      await this.fetchList(this.model, this.page);
+    },
+    // select
+    useSelect(prop) {
+      this.selectData = prop;
+    },
+    // delete
+    useDelete(prop) {
+      this.selectData.splice(prop, 1);
+      this.useConfirm(this.selectData);
+    },
+    // confirm
+    useConfirm(prop) {
+      const {
+        $props: { valueKey },
+      } = this;
+      // string
+      if (typeof valueKey === "string") {
+        this.innerValue = prop.map((item) => item[valueKey]);
+      }
+      // array
+      else if (Array.isArray(valueKey)) {
+        this.innerValue = prop.map((item) => {
+          const object = {};
+          valueKey.forEach((cItem) => {
+            object[cItem] = item[cItem];
+          });
+          return object;
+        });
+      }
+      // null
+      else {
+        this.innerValue = prop;
+      }
+      //
+      this.hide();
+      this.lastSelectData = deepCopy(prop);
+      this.$emit("change", prop, this.$props);
+    },
+    // cancel
+    useCancel() {
+      this.hide();
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <div class="popover-select-v2 popover-select-v2--multiple">
+    <el-input v-bind="$attrs" style="width: 100%">
+      <i class="el-icon-search" slot="suffix" @click="open"> </i>
+    </el-input>
+    <el-dialog
+      :width="width"
+      :show-close="false"
+      :visible.sync="visible"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      append-to-body
+    >
+      <template slot="title">
+        <div
+          style="
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          "
+        >
+          <span>选 择</span>
+          <span>
+            <el-button
+              :size="size"
+              circle
+              icon="el-icon-check"
+              @click="useConfirm(selectData)"
+            >
+            </el-button>
+            <el-button
+              :size="size"
+              circle
+              type="danger"
+              icon="el-icon-close"
+              @click="useCancel"
+            ></el-button>
+          </span>
+        </div>
+      </template>
+      <el-form
+        v-loading="loading"
+        :inline="true"
+        :model="model"
+        :size="size"
+        @submit.native.prevent
+      >
+        <el-form-item prop="search">
+          <el-input
+            v-model="model.search"
+            @change="useQuery"
+            @keydown.enter="useQuery"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button icon="el-icon-refresh" @click="useReset"></el-button>
+        </el-form-item>
+        <el-table
+          ref="multipleTable"
+          :data="data"
+          :size="size"
+          height="45vh"
+          @selection-change="useSelect"
+        >
+          <el-table-column width="55" type="selection" align="center">
+          </el-table-column>
+          <el-table-column
+            v-for="(column, index) in tableColumns"
+            :key="index"
+            :prop="column.key"
+            :label="column.title"
+            :width="column.width || 'auto'"
+            show-overflow-tooltip
+          >
+            <template slot-scope="scope">
+              <dr-computed-input
+                v-if="column.type === 'ComputedInput'"
+                v-model="scope.row[column.key]"
+                :source="scope.row"
+                :computed="column.computed"
+                :placeholder="column.placeholder"
+                style="width: 100%"
+              ></dr-computed-input>
+              <span v-else> {{ scope.row[column.key] }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination
+          v-show="!loading"
+          :total="page.total"
+          :page.sync="page.pageNum"
+          :limit.sync="page.pageSize"
+          @pagination="useQuery"
+        />
+      </el-form>
+    </el-dialog>
+    <el-scrollbar
+      :viewStyle="{
+        display: 'flex',
+        alignItems: 'center',
+        paddingBottom: '10px',
+      }"
+      class="popover-select-v2_tags"
+    >
+      <el-tag
+        v-for="(tag, index) in lastSelectData"
+        :size="size"
+        hit
+        closable
+        @close="useDelete(index)"
+        style="margin-right: 5px"
+      >
+        {{ tag[valueKey] }}
+      </el-tag>
+    </el-scrollbar>
+  </div>
+</template>
+<style scoped>
+.popover-select-v2 .el-input {
+  width: inherit;
+}
+.popover-select-v2 .el-input .el-icon-search {
+  cursor: pointer;
+}
+.popover-select-v2 .popover-select-v2_tags {
+  position: absolute;
+  left: 5px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: calc(100% - 40px);
+}
+::v-deep .popover-select-v2 .popover-select-v2_tags .el-scrollbar__view {
+  display: flex;
+  align-items: center;
+  padding-bottom: 10px;
+}
+/* .popover-select-v2 .popover-select-v2_tags::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+  cursor: pointer;
+} */
+</style>

src/components/popover-tree-select/index.vue

@@ -97,7 +97,6 @@ export default {
   watch: {
     "$props.value": {
       handler: function (newProp) {
-        console.log("newProp", newProp);
         if (!newProp) this.lastSelectData = [];
       },
       immediate: true,

src/components/select-v2/api/index.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+export function REFER(data, params) {
+  return request({
+    url: "/refer/query",
+    method: "POST",
+    data: data,
+    params: params,
+  });
+}

src/components/select-v2/components/ADDRESS_PARAM.js

@@ -0,0 +1,39 @@
+// 收货地址
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "仓库",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "address",
+    title: "地址",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "contactsName",
+    title: "联系人",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "contactsPhone",
+    title: "电话",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/ALLOCATION_PARAM.js

@@ -0,0 +1,22 @@
+// 货位
+export default [
+  // 树
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "货位",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/BALATYPE_PARAM.js

@@ -0,0 +1,21 @@
+// 结算方式
+export default [
+  // {
+  //   key: "id",
+  //   title: "结算方式ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "结算方式",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/CONTACTS_PARAM.js

@@ -0,0 +1,15 @@
+// 客户部门
+export default [
+  {
+    key: "code",
+    title: "人员编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "人员名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/CURRENCY_PARAM.js

@@ -0,0 +1,30 @@
+export default [
+  {
+    key: "name",
+    title: "币种",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "code",
+    title: "币种简称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "",
+    title: "单价精度",
+  },
+  {
+    key: "",
+    title: "单价舍入规则",
+  },
+  {
+    key: "",
+    title: "金额精度",
+  },
+  {
+    key: "",
+    title: "金额舍入规则",
+  },
+];

src/components/select-v2/components/CUSTOMERDEPT_PARAM.js

@@ -0,0 +1,22 @@
+// 客户部门
+export default [
+  // {
+  //   key: "id",
+  //   title: "客户部门ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "客户部门编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "客户部门名称",
+    type: "Input",
+    search: true,
+  },
+];
+

src/components/select-v2/components/CUSTOMER_PARAM.js

@@ -0,0 +1,21 @@
+// 收货客户
+export default [
+  // {
+  //   key: "id",
+  //   title: "收货客户ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "收货客户编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "收货客户名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/DEPT_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "组织编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "组织名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/MATERIAL_PARAM.js

@@ -0,0 +1,48 @@
+export default [
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "specification",
+    title: "规格",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "manufacturerIdName",
+    title: "生产厂家",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "unitIdName",
+    title: "单位",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "registrationNo",
+    title: "注册证号",
+    type: "ComputedInput",
+    computed: (prop) => {
+      return prop.materialMedcine.registrationNo;
+    },
+  },
+  {
+    key: "isDrug",
+    title: "物料药品属性",
+    type: "ComputedInput",
+    computed: (prop) => {
+      return prop.materialMedcine.isDrug == '0' ? 'Y' : 'N';
+    },
+  },
+];

src/components/select-v2/components/OPERATING_PARAM.js

@@ -0,0 +1,21 @@
+// 经营性项目
+export default [
+  // {
+  //   key: "id",
+  //   title: "经营性项目ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "经营性项目编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "经营性项目名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/ORG_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+    {
+      key: "code",
+      title: "组织编码",
+      type: "Input",
+      search: true,
+    },
+    {
+      key: "name",
+      title: "组织名称",
+      type: "Input",
+      search: true,
+    },
+  ]

src/components/select-v2/components/PAYAGREEMENT_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "付款协议编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "付款协议名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/PROCESSTYPE_PARAM.js

@@ -0,0 +1,21 @@
+// 处理方式
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "处理方式",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/PROJECT_PARAM.js

@@ -0,0 +1,21 @@
+// 在建工程项目
+export default [
+  // {
+  //   key: "id",
+  //   title: "在建工程项目ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "在建工程项目编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "在建工程项目名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/PSNLICENSE_PARAM.js

@@ -0,0 +1,21 @@
+// 人员证照参照
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/RETREASON_PARAM.js

@@ -0,0 +1,21 @@
+// 退换原因
+export default [
+  // {
+  //   key: "id",
+  //   title: "退换原因ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "退换原因编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "退换原因",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/SUPPLIERCONTACTS_PARAM.js

@@ -0,0 +1,27 @@
+// 供应商联系人
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  // {
+  //   key: "code",
+  //   title: "编码",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "cell",
+    title: "电话",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/SUPPLIER_PARAM.js

@@ -0,0 +1,14 @@
+export default [
+  {
+    key: "code",
+    title: "供应商编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "供应商名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/TAX_RATE_PARAM.js

@@ -0,0 +1,29 @@
+export default [
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "ntaxrate",
+    title: "税率",
+    type: "ComputedInput",
+    computed: (prop) => {
+      const { ntaxrate } = prop;
+      return ntaxrate === "0E-8" ? "0.00000000" : ntaxrate;
+    },
+  },
+];

src/components/select-v2/components/UNIT_PARAM.js

@@ -0,0 +1,22 @@
+// 货位
+export default [
+  // 树
+  // {
+  //   key: "id",
+  //   title: "ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "货位",
+    type: "Input",
+    search: true,
+  },
+];

src/components/select-v2/components/WAREHOUSE_PARAM.js

@@ -0,0 +1,29 @@
+// 收货仓库
+export default [
+  // {
+  //   key: "id",
+  //   title: "仓库ID",
+  //   type: "Input",
+  //   search: true,
+  // },
+  {
+    key: "code",
+    title: "仓库编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "仓库名称",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "",
+    title: "备注",
+  },
+  {
+    key: "",
+    title: "助记码",
+  },
+];

src/components/select-v2/index.vue

@@ -0,0 +1,41 @@
+<script>
+export default {
+  name: "SelectV2",
+  inject: ["$dicts"],
+  props: {
+    // 参照类型 ，对应后端
+    referName: {
+      type: String,
+      require: true,
+    },
+  },
+  components: {
+    dict: {
+      get() {
+        return this.$dicts().type;
+      },
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {},
+  watch: {},
+  methods: {},
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-select v-bind="$attrs">
+    <el-option
+      v-for="item in dict[referName]"
+      :key="item.value"
+      :label="item.label"
+      :value="item.value"
+    >
+    </el-option>
+  </el-select>
+</template>
+<style scoped></style>

src/utils/dict/index.js

@@ -1,33 +1,40 @@
-import Dict from './Dict'
-import { mergeOptions } from './DictOptions'
+import Dict from "./Dict";
+import { mergeOptions } from "./DictOptions";
 
-export default function(Vue, options) {
-  mergeOptions(options)
+export default function (Vue, options) {
+  mergeOptions(options);
   Vue.mixin({
     data() {
-      if (this.$options === undefined || this.$options.dicts === undefined || this.$options.dicts === null) {
-        return {}
+      if (
+        this.$options === undefined ||
+        this.$options.dicts === undefined ||
+        this.$options.dicts === null
+      ) {
+        return {};
       }
-      const dict = new Dict()
-      dict.owner = this
+      const dict = new Dict();
+      dict.owner = this;
       return {
-        dict
-      }
+        dict,
+      };
     },
     created() {
       if (!(this.dict instanceof Dict)) {
-        return
+        return;
       }
-      options.onCreated && options.onCreated(this.dict)
+      options.onCreated && options.onCreated(this.dict);
       this.dict.init(this.$options.dicts).then(() => {
-        options.onReady && options.onReady(this.dict)
+        options.onReady && options.onReady(this.dict);
         this.$nextTick(() => {
-          this.$emit('dictReady', this.dict)
-          if (this.$options.methods && this.$options.methods.onDictReady instanceof Function) {
-            this.$options.methods.onDictReady.call(this, this.dict)
+          this.$emit("dictReady", this.dict);
+          if (
+            this.$options.methods &&
+            this.$options.methods.onDictReady instanceof Function
+          ) {
+            this.$options.methods.onDictReady.call(this, this.dict);
           }
-        })
-      })
+        });
+      });
     },
-  })
+  });
 }

src/views/purchase/apply/add/column.js

@@ -262,6 +262,7 @@ export const TabColumns = [
         inputType: "InputNumber",
         width: 300,
         require: true,
+        formatter: (prop) => (prop ? (prop * 1).toFixed(6) : null),
       },
       {
         title: "税率%",
@@ -273,6 +274,7 @@ export const TabColumns = [
         },
         width: 300,
         require: true,
+        formatter: (prop) => (prop ? (prop * 1).toFixed(6) : null),
       },
       {
         title: "含税单价",
@@ -280,6 +282,7 @@ export const TabColumns = [
         inputType: "InputNumber",
         width: 300,
         require: true,
+        formatter: (prop) => (prop ? (prop * 1).toFixed(6) : null),
       },
       {
         title: "无税单价",

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

@@ -31,7 +31,8 @@ export default {
         const { rateCode, unitIdName, code: materialCode } = prop;
         // task 1
         fetchTax(rateCode).then(({ ntaxrate }) => {
-          source.tax = ntaxrate === "0E-8" ? "0.00000000" : ntaxrate;
+          source.tax =
+            ntaxrate === "0E-8" ? "0.000000" : (ntaxrate * 1).toFixed(6);
         });
         // task 2
         fetchUnit(unitIdName).then(({ id, code, name }) => {

src/views/purchase/apply/column.js

@@ -68,10 +68,6 @@ export const FormColumns = [
     key: "sourceType",
     title: "来源单据类型",
   },
-  {
-    key: "status",
-    title: "单据状态",
-  },
 ];
 
 export const SearchColumns = [

src/views/purchase/apply/see/index.vue

@@ -214,7 +214,11 @@ export default {
                 :value="scope.row[cColumn.key]"
                 :options="dict.type[cColumn.referName]"
               />
-              <span v-else>{{ scope.row[cColumn.key] }}</span>
+              <span v-else>{{
+                cColumn.formatter
+                  ? cColumn.formatter(scope.row[cColumn.key])
+                  : scope.row[cColumn.key]
+              }}</span>
             </template>
           </el-table-column>
         </el-table>

src/views/purchase/catalogue/column.js

@@ -9,7 +9,7 @@ export const FormColumns = [
   // },
   { key: "materialName", title: "物料" },
   { key: "materialCode", title: "物料编码" },
-  // { key: "materialClassify", title: "物料一级分类" },
+  { key: "materialClassifyName", title: "物料一级分类" },
   { key: "manufacturerName", title: "生产厂家名称" },
   // { key: "manufacturer", title: "生产厂家" },
   { key: "model", title: "物料型号" },
@@ -21,7 +21,11 @@ export const FormColumns = [
   },
   // { key: "customer", title: "客户" },
   { key: "customerName", title: "客户" },
-  { key: "taxPrice", title: "主含税单价" },
+  {
+    key: "taxPrice",
+    title: "主含税单价",
+    formatter: (prop) => (prop ? prop.toFixed(6) : null),
+  },
   // { key: "unit", title: "主单位" },
   { key: "unitName", title: "主单位" },
   { key: "effectiveDate", title: "价格生效日期" },
@@ -29,7 +33,11 @@ export const FormColumns = [
   // { key: "buyer", title: "采购员" },
   { key: "buyerName", title: "采购员" },
   { key: "source", title: "来源单据编号" },
-  { key: "convertRate", title: "换算率" },
+  {
+    key: "convertRate",
+    title: "换算率",
+    formatter: (prop) => (prop ? prop.toFixed(6) : null),
+  },
   {
     key: "status",
     title: "有效状态",
@@ -97,12 +105,14 @@ export const SearchColumns = [
   },
   { key: "source", title: "来源单据编号", inputType: "Input" },
   {
-    key: "material",
+    key: "materialCode",
     title: "物料编码",
     inputType: "PopoverSelect",
-    width: 200,
     referName: "MATERIAL_PARAM",
-    valueKey: "code",
+    dataMapping: {
+      material: "id",
+      materialCode: "code",
+    },
   },
   {
     key: "status",

src/views/purchase/catalogue/index.vue

@@ -142,8 +142,6 @@ export default {
       ref="EnableModel"
       @success="useQuery(params, page)"
     ></enable-model>
-    <!-- <add-drawer ref="AddDrawerFef" @close="resetList"></add-drawer> -->
-    <!-- <edit-model ref="EditModel" @success="resetList"></edit-model> -->
     <el-form
       :size="size"
       :model="params"
@@ -278,7 +276,11 @@ export default {
             v-else-if="column.inputType === 'Upload'"
             v-model="scope.row[column.key]"
           ></dr-file-preview>
-          <span v-else>{{ scope.row[column.key] }}</span>
+          <span v-else>{{
+            column.formatter
+              ? column.formatter(scope.row[column.key])
+              : scope.row[column.key]
+          }}</span>
         </template>
       </el-table-column>
     </el-table>

src/views/purchase/catalogue/see/column.js

@@ -1,5 +1,35 @@
 export const FormColumns = [
   {
+    key: "puOrgName",
+    title: "采购组织",
+  },
+  { key: "materialName", title: "物料" },
+  { key: "materialCode", title: "物料编码" },
+  { key: "materialClassifyName", title: "物料一级分类" },
+  { key: "manufacturerName", title: "生产厂家" },
+  { key: "model", title: "物料型号" },
+  { key: "specification", title: "物料规格" },
+  {
+    key: "supplierName",
+    title: "供应商",
+  },
+  { key: "customerName", title: "客户" },
+  {
+    key: "taxPrice",
+    title: "主含税单价",
+    formatter: (prop) => (prop ? prop.toFixed(6) : null),
+  },
+  { key: "unitName", title: "主单位" },
+  { key: "effectiveDate", title: "价格生效日期" },
+  { key: "endDate", title: "价格失效日期" },
+  { key: "buyerName", title: "采购员" },
+  { key: "source", title: "来源单据编号" },
+  {
+    key: "convertRate",
+    title: "换算率",
+    formatter: (prop) => (prop ? prop.toFixed(6) : null),
+  },
+  {
     key: "status",
     title: "有效状态",
     inputType: "Select",
@@ -14,48 +44,6 @@ export const FormColumns = [
     width: 100,
   },
   {
-    key: "puOrgName",
-    title: "采购组织",
-    inputType: "PopoverSelect",
-    referName: "ORG_PARAM",
-    valueKey: "name",
-    dataMapping: {
-      puOrg: "code",
-      puOrgName: "name",
-    },
-    require: true,
-  },
-  {
-    key: "puOrg",
-    title: "采购组织编码",
-    inputType: "Input",
-    disabled: true,
-    readonly: true,
-  },
-  { key: "materialName", title: "物料名称" },
-  { key: "material", title: "物料编码" },
-  { key: "materialClassify", title: "物料一级分类" },
-  { key: "manufacturerName", title: "生产厂家名称" },
-  { key: "manufacturer", title: "生产厂家" },
-  { key: "model", title: "物料型号" },
-  { key: "specification", title: "物料规格" },
-  { key: "supplier", title: "供应商" },
-  {
-    key: "supplierName",
-    title: "供应商名称",
-  },
-  { key: "customer", title: "客户" },
-  { key: "customerName", title: "客户名称" },
-  { key: "taxPrice", title: "主含税单价" },
-  { key: "unit", title: "主单位" },
-  { key: "unitName", title: "主单位名称" },
-  { key: "effectiveDate", title: "价格生效日期" },
-  { key: "endDate", title: "价格失效日期" },
-  { key: "buyer", title: "采购员" },
-  { key: "buyerName", title: "采购员名称" },
-  { key: "source", title: "来源单据编号" },
-  { key: "convertRate", title: "换算率" },
-  {
     key: "materialStatus",
     title: "物料启用状态",
     inputType: "Select",
@@ -80,53 +68,4 @@ export const FormColumns = [
   { key: "updateByName", title: "更新人名称" },
 ];
 
-export const SearchColumns = [
-  {
-    key: "puOrgName",
-    title: "采购组织",
-    inputType: "PopoverSelect",
-    referName: "ORG_PARAM",
-    dataMapping: {
-      puOrg: "id",
-      puOrgName: "name",
-    },
-  },
-  {
-    key: "manufacturer",
-    title: "生产厂家",
-    inputType: "Input",
-  },
-  {
-    key: "supplierName",
-    title: "供应商",
-    inputType: "PopoverSelect",
-    referName: "SUPPLIER_PARAM",
-    dataMapping: {
-      supplier: "id",
-      supplierName: "name",
-    },
-  },
-  { key: "source", title: "来源单据编号", inputType: "Input" },
-  {
-    key: "material",
-    title: "物料编码",
-    inputType: "PopoverSelect",
-    width: 200,
-    referName: "MATERIAL_PARAM",
-    valueKey: "id",
-  },
-  {
-    key: "status",
-    title: "有效状态",
-    inputType: "Select",
-    referName: "is_effective",
-  },
-  {
-    key: "enableStatus",
-    title: "启用状态",
-    inputType: "Select",
-    referName: "is_effective",
-  },
-];
-
-export default { FormColumns, SearchColumns };
+export default { FormColumns };

src/views/purchase/catalogue/see/index.vue

@@ -173,7 +173,11 @@ export default {
         <span v-else-if="column.inputType === 'Upload'">
           <dr-file-preview v-model="params[column.key]"></dr-file-preview>
         </span>
-        <span v-else>{{ params[column.key] }}</span>
+        <span v-else>{{
+          column.formatter
+            ? column.formatter(params[column.key])
+            : params[column.key]
+        }}</span>
       </el-descriptions-item>
     </el-descriptions>
   </el-drawer>

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

@@ -105,6 +105,7 @@ export default {
     //
     async useRowSubmit(prop, scope) {
       const {
+        row,
         row: { contractId },
       } = scope;
       const { id } = this.params;

src/views/purchase/task/column.js

@@ -1,14 +1,13 @@
 export const TableColumns = [
-  { key: "code", title: "订单生成单号", width: 250 },
+  { key: "code", title: "订单生成单号" },
   {
     key: "status",
     title: "状态",
-    inputType: "Select",
-    referName: "purchase_task_status",
+    dictName: "purchase_task_status",
   },
-  { key: "demandCode", title: "需求单号", width: 250 },
+  { key: "demandCode", title: "需求单号" },
+  { key: "materialName", title: "物料" },
   { key: "materialCode", title: "物料编码" },
-  { key: "materialName", title: "物料名称" },
   // { key: "material", title: "物料" },
   { key: "materialDesc", title: "物料描述" },
   { key: "manufacturerName", title: "生产厂家" },
@@ -18,8 +17,7 @@ export const TableColumns = [
   {
     key: "priceType",
     title: "价格类型",
-    inputType: "Select",
-    referName: "sys_price_type",
+    dictName: "sys_price_type",
   },
   { key: "puUnitName", title: "采购单位" },
   // { key: "id", title: "主键" },
@@ -57,8 +55,7 @@ export const TableColumns = [
   {
     key: "isBack",
     title: "是否退回",
-    inputType: "Select",
-    referName: "sys_yes_no",
+    dictName: "sys_yes_no",
   },
   { key: "baskCause", title: "退回原因" },
   { key: "backDate", title: "退回日期" },
@@ -73,73 +70,124 @@ export const TableColumns = [
 
 export const SearchColumns = [
   {
-    key: "classIds",
-    title: "物料分类",
-    inputType: "PopoverTreeSelect",
-    multiple: true,
-    valueKey: "id",
-    referName: "MATERIALCLASSIFY_PARAM",
-    readonly: true,
-    dataMapping: {},
-  },
-  {
-    key: "materialCodes",
-    title: "物料编码",
-    inputType: "PopoverSelect",
-    multiple: true,
-    valueKey: "code",
-    referName: "MATERIAL_PARAM",
-    readonly: true,
-    dataMapping: {},
-  },
-  { key: "materialDesc", title: "物料描述", inputType: "Input" },
-  { key: "code", title: "单据号", inputType: "Input" },
-  {
-    key: "puOrgIds",
-    title: "采购组织",
-    inputType: "PopoverSelect",
-    multiple: true,
-    valueKey: "id",
-    referName: "ORG_PARAM",
-    readonly: true,
-    dataMapping: {},
+    item: {
+      key: "classIds",
+      title: "物料分类",
+    },
+    attr: {
+      component: "dr-popover-tree-select",
+      referName: "MATERIALCLASSIFY_PARAM",
+      multiple: true,
+      valueKey: "id",
+    },
   },
   {
-    key: "status",
-    title: "状态",
-    inputType: "Select",
-    referName: "purchase_task_status",
-    clearable: true,
-  },
-  {
-    key: "date",
-    title: "创建时间",
-    inputType: "DatePicker",
-    type: "daterange",
-    unlinkPanels: true,
-    rangeSeparator: "至",
-    valueFormat: "yyyy-MM-dd",
-    endPlaceholder: "结束日期",
-    startPlaceholder: "开始日期",
-    pickerOptions: pickerOptions,
-    value: [],
-  },
-  {
-    key: "buyers",
-    title: "采购员",
-    inputType: "PopoverSelect",
-    multiple: true,
-    valueKey: "code",
-    referName: "CONTACTS_PARAM",
-    readonly: true,
-    dataMapping: {},
-  },
-  {
-    key: "documentsCodes",
-    title: "需求来源",
-    inputType: "Input",
-    placeholder: "请输入来源单据号，多个用,分隔",
-    span: 12,
+    item: {
+      key: "materialCodes",
+      title: "物料编码",
+    },
+    attr: {
+      component: "el-popover-multiple-select-v2",
+      valueKey: "code",
+      referName: "MATERIAL_PARAM",
+    },
+  },
+  {
+    item: {
+      key: "materialDesc",
+      title: "物料描述",
+    },
+    attr: {
+      component: "el-input",
+    },
+  },
+  {
+    item: {
+      key: "code",
+      title: "单据号",
+    },
+    attr: {
+      component: "el-input",
+    },
+  },
+  {
+    item: {
+      key: "puOrgIds",
+      title: "采购组织",
+    },
+    attr: {
+      component: "el-popover-multiple-select-v2",
+      referName: "ORG_PARAM",
+      valueKey: "id",
+    },
+  },
+  {
+    item: {
+      key: "status",
+      title: "状态",
+    },
+    attr: {
+      component: "el-select",
+      dictName: "purchase_task_status",
+      clearable: true,
+    },
+  },
+  {
+    item: {
+      key: "date",
+      title: "创建时间",
+    },
+    attr: {
+      component: "el-date-picker",
+      type: "daterange",
+      unlinkPanels: true,
+      rangeSeparator: "至",
+      valueFormat: "yyyy-MM-dd",
+      endPlaceholder: "结束日期",
+      startPlaceholder: "开始日期",
+      pickerOptions: pickerOptions,
+      value: [],
+    },
+  },
+  {
+    item: {
+      key: "buyers",
+      title: "采购员",
+    },
+    attr: {
+      component: "el-popover-multiple-select-v2",
+      referName: "CONTACTS_PARAM",
+      valueKey: "code",
+    },
+  },
+  {
+    item: {
+      key: "manufacturerName",
+      title: "生产厂家",
+    },
+    attr: {
+      component: "el-input",
+    },
+  },
+  {
+    item: {
+      key: "customerName",
+      title: "收货客户",
+    },
+    attr: {
+      component: "el-input",
+    },
+  },
+  {
+    item: {
+      key: "documentsCodes",
+      title: "需求来源",
+      span: 12,
+    },
+    attr: {
+      component: "el-input",
+      placeholder: "请输入来源单据号，多个用,分隔",
+    },
   },
 ];
 

src/views/purchase/task/index.vue

@@ -1,10 +1,37 @@
 <script>
 import { LIST } from "@/api/business/purchase/task";
 import { TableColumns, SearchColumns } from "./column";
-import { initPage, initDicts, initParams } from "@/utils/init";
+
+const initParams = (prop, key = "key", value = "value") => {
+  // get params
+  const object1 = Object.fromEntries(
+    prop.map(({ item, attr }) => [item[key], attr[value]])
+  );
+  // get mapping params
+  const object2 = {};
+  prop
+    .filter((item) => item.attr.dataMapping)
+    .map(({ attr: { dataMapping } }) => {
+      for (let key in dataMapping) {
+        object2[key] = null;
+      }
+    });
+  return { ...object1, ...object2 };
+};
+
+// 初始化字典
+export const initDicts = (prop) =>
+  Array.from(
+    new Set(
+      prop
+        .filter((item) => (item.attr ? item.attr.dictName : item.dictName))
+        .map((item) => (item.attr ? item.attr.dictName : item.dictName))
+    )
+  );
+
 export default {
   name: "PuchaseTask",
-  dicts: [...initDicts(TableColumns), ...initDicts(SearchColumns)],
+  dicts: [...initDicts([...TableColumns, ...SearchColumns])],
   components: {
     SeeModel: () => import("./see/index.vue"),
     CloseModel: () => import("./close/index.vue"),
@@ -12,6 +39,10 @@ export default {
     ShiftModel: () => import("./modify-buyer/index.vue"),
     DirectModel: () => import("./first-direct/index.vue"),
     ReturnModel: () => import("./documents-return/index.vue"),
+    ElSelectV2: () => import("@/components/select-v2/index.vue"),
+    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
+    ElPopoverMultipleSelectV2: () =>
+      import("@/components/popover-select-v2/multiple.vue"),
   },
   data() {
     return {
@@ -26,7 +57,13 @@ export default {
     };
   },
   computed: {},
-  watch: {},
+  watch: {
+    "params.materialCodes": {
+      handler: function (newProp, oldProp) {
+        console.log(newProp, oldProp);
+      },
+    },
+  },
   created() {
     this.params.status = "0";
     this.useQuery(this.params, this.page);
@@ -79,7 +116,8 @@ export default {
     },
     // 重 置
     useReset() {
-      this.page = initPage();
+      this.page.pageNum = 1;
+      this.page.pageSize = 10;
       this.params = initParams(SearchColumns);
       this.useQuery(this.params, this.page);
     },
@@ -140,16 +178,7 @@ export default {
 </script>
 
 <template>
-  <el-card
-    v-loading="loading"
-    style="
-      width: calc(100% - 20px);
-      height: 100%;
-      margin: 10px;
-      padding: 0 20px 20px 0;
-    "
-    :body-style="{ padding: 0 }"
-  >
+  <el-card v-loading="loading" :body-style="{ padding: 0 }">
     <see-model ref="SeeModel"></see-model>
     <export-model ref="ExportModel"></export-model>
     <close-model
@@ -168,94 +197,52 @@ export default {
       ref="ReturnModel"
       @success="useQuery(params, page)"
     ></return-model>
-    <el-backtop target=".el-scrollbar__wrap"></el-backtop>
     <el-form
       :size="size"
       :model="params"
       label-width="auto"
       label-position="right"
-      style="padding: 20px 20px 0"
       @submit.native.prevent
     >
-      <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
+      <el-row :gutter="20">
         <el-col
           v-for="column in searchColumns"
-          :key="column.title"
-          :span="column.span || 6"
+          :key="column.item.title"
+          :span="column.item.span || 6"
         >
-          <el-form-item :prop="column.key" :label="column.title">
-            <el-input
-              v-if="column.inputType === 'Input'"
-              v-model="params[column.key]"
-              :disabled="column.disabled"
-              :clearable="column.clearable"
-              :placeholder="column.placeholder"
-              style="width: 100%"
-              @keyup.enter.native="useQuery(params, page)"
-            ></el-input>
-            <el-select
-              v-if="column.inputType === 'Select'"
-              v-model="params[column.key]"
-              :disabled="column.disabled"
-              :clearable="column.clearable"
-              :placeholder="column.placeholder"
-              style="width: 100%"
+          <el-form-item :prop="column.item.key" :label="column.item.title">
+            <component
+              v-if="column.attr.referName"
+              v-bind="column.attr"
+              v-model="params[column.item.key]"
+              :source.sync="params"
+              :is="column.attr.component"
               @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
+            ></component>
+            <component
+              v-else-if="column.attr.dictName"
+              v-bind="column.attr"
+              v-model="params[column.item.key]"
+              :is="column.attr.component"
+              @change="useQuery(params, page)"
+              style="width: 100%"
             >
               <el-option
-                v-for="item in dict.type[column.referName]"
+                v-for="item in dict.type[column.attr.dictName]"
                 :key="item.value"
                 :label="item.label"
                 :value="item.value"
               >
-              </el-option>
-            </el-select>
-            <el-date-picker
-              v-if="column.inputType === 'DatePicker'"
-              v-model="params[column.key]"
-              :type="column.type"
-              :placeholder="column.placeholder"
-              :value-format="column.valueFormat"
-              :unlink-panels="column.unlinkPanels"
-              :picker-options="column.pickerOptions"
-              :range-separator="column.rangeSeparator"
-              :end-placeholder="column.endPlaceholder"
-              :start-placeholder="column.startPlaceholder"
-              style="width: 100%"
-              @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
-            >
-            </el-date-picker>
-            <dr-popover-select
-              v-if="column.inputType === 'PopoverSelect'"
-              v-model="params[column.key]"
-              :size="size"
-              :source.sync="params"
-              :title="column.title"
-              :type="column.referName"
-              :multiple="column.multiple"
-              :readonly="column.readonly"
-              :value-key="column.valueKey"
-              :placeholder="column.placeholder"
+              </el-option
+            ></component>
+            <component
+              v-else
+              v-bind="column.attr"
+              v-model="params[column.item.key]"
+              :is="column.attr.component"
               @change="useQuery(params, page)"
               @keyup.enter.native="useQuery(params, page)"
-            >
-            </dr-popover-select>
-            <dr-popover-tree-select
-              v-if="column.inputType === 'PopoverTreeSelect'"
-              v-model="params[column.key]"
-              :source.sync="params"
-              :title="column.title"
-              :type="column.referName"
-              :multiple="column.multiple"
-              :value-key="column.valueKey"
-              :placeholder="column.placeholder"
-              :query-params="column.queryParams"
-              @change="useQuery(params, page)"
-              @keyup.enter.native="useQuery(params, page)"
-            >
-            </dr-popover-tree-select>
+            ></component>
           </el-form-item>
         </el-col>
       </el-row>
@@ -319,17 +306,17 @@ export default {
         :key="index"
         :prop="column.key"
         :label="column.title"
-        :width="column.width || 180"
+        :width="column.width || 200"
         :show-overflow-tooltip="column.showOverflowTooltip || true"
       >
         <template slot-scope="scope">
           <dict-tag
-            v-if="column.referName"
+            v-if="column.dictName"
             :size="size"
             :value="scope.row[column.key]"
-            :options="dict.type[column.referName]"
+            :options="dict.type[column.dictName]"
           />
-          <span v-else>{{ scope.row[column.key] }}</span>
+          <component is="span" v-else>{{ scope.row[column.key] }}</component>
         </template>
       </el-table-column>
     </el-table>
@@ -341,3 +328,22 @@ export default {
     />
   </el-card>
 </template>
+
+<style scoped>
+.el-card {
+  width: calc(100% - 20px);
+  height: 100%;
+  margin: 10px;
+  padding: 0 20px 20px 0;
+}
+::v-deep .el-form {
+  padding: 20px 20px 0;
+}
+::v-deep .el-row {
+  display: flex;
+  flex-wrap: wrap;
+}
+::v-deep .el-table--mini .el-table__cell {
+  height: 50px;
+}
+</style>