Merge branch 'purchaseDev' into 'dev'

Purchase dev

See merge request new-business/drp-web!219

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

@@ -60,7 +60,19 @@ export default {
       },
       set(value) {
         this.$emit("input", value);
-        if (!value) {
+      },
+    },
+    TableColumns() {
+      const { referName } = this.$props;
+      return require(`../popover-select/components/${referName}`).default.filter(
+        (document) => document.key
+      );
+    },
+  },
+  watch: {
+    innerValue: {
+      handler: function (newValue) {
+        if (!newValue) {
           const {
             $props: { source, dataMapping },
           } = this;
@@ -71,14 +83,7 @@ export default {
         }
       },
     },
-    tableColumns() {
-      const { referName } = this.$props;
-      return require(`../popover-select/components/${referName}`).default.filter(
-        (document) => document.key
-      );
-    },
   },
-  watch: {},
   methods: {
     // open dialog
     async open() {
@@ -262,7 +267,7 @@ export default {
           @row-click="useSelect([$event])"
         >
           <el-table-column
-            v-for="(column, index) in tableColumns"
+            v-for="(column, index) in TableColumns"
             :key="index"
             :prop="column.key"
             :label="column.title"

src/components/popover-tree-select/components/MATERIALCLASSIFY_PARAM.js

@@ -1,22 +0,0 @@
-// 客户部门 tree
-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-tree-select/index.vue

@@ -1,82 +1,55 @@
 <script>
 import { REFER } from "./api/index";
-import deepCopy from "@gby/deep-copy";
+
 export default {
   name: "PopoverTreeSelect",
   props: {
-    // 参照类型 ，对应后端
-    type: {
-      type: String,
-      require: true,
-    },
     // v-model
     value: {
       type: [Array, String],
       require: true,
     },
-    // 参照弹窗标题
-    title: {
+    // 参照类型 ，对应后端
+    referName: {
       type: String,
-      default: "TITLE",
+      require: true,
     },
     // 作为 value 唯一标识的键名，绑定值
     valueKey: {
       type: String,
-      default: "code",
+      dafault: () => {
+        return "code";
+      },
     },
     // 默认查询参数
     queryParams: {
       type: Function,
       default: () => {},
     },
-    // 组件大小
-    size: {
-      type: String,
-      default: "mini",
-    },
-    // 提示
-    placeholder: {
-      type: String,
-      default: "",
-    },
-    // 是否可读
-    readonly: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否禁止
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否清除
-    clearable: {
-      type: Boolean,
-      default: false,
-    },
-    // 是否多选
-    multiple: {
-      type: Boolean,
-      default: false,
-    },
     // 需映射源数据
-    source: Object,
+    source: {
+      type: Object,
+      default: () => ({}),
+    },
     // 参照内外映射
-    dataMapping: Object,
+    dataMapping: {
+      type: Object,
+      default: () => ({}),
+    },
   },
   components: {},
   data() {
     return {
+      size: "mini",
       width: "50%",
       visible: false,
       loading: false,
-      params: {
+      model: {
         search: "",
-        isPage: true,
+        isPage: false,
       },
       data: [],
       selectData: [],
-      lastSelectData: [],
       defaultProps: {
         label: "name",
         children: "children",
@@ -84,30 +57,36 @@ export default {
     };
   },
   computed: {
-    innerValue() {
-      const { value, multiple } = this.$props;
-      return multiple ? "" : value;
-    },
-    TableColumnTemp() {
-      const { type } = this.$props;
-      const documents = require(`./components/${type}`).default;
-      return documents.filter((document) => document.key);
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
     },
   },
   watch: {
-    "$props.value": {
-      handler: function (newProp) {
-        if (!newProp) this.lastSelectData = [];
+    innerValue: {
+      handler: function (newValue) {
+        if (!newValue) {
+          const {
+            $props: { source, dataMapping },
+          } = this;
+          for (let key in dataMapping) {
+            source[key] = undefined;
+          }
+          this.$emit("update:source", source);
+        }
       },
-      immediate: true,
     },
+    // "model.search": {
+    //   handler: function (newValue) {
+    //     this.$refs.tree.filter(newValue);
+    //   },
+    // },
   },
   methods: {
-    //
-    emitChange(prop) {
-      const { type, source, multiple } = this.$props;
-      this.$emit("change", multiple ? prop : prop[0], source, type);
-    },
     // open dialog
     async open() {
       this.visible = true;
@@ -121,7 +100,12 @@ export default {
     async fetchList(prop) {
       try {
         this.loading = true;
-        const { code, rows } = await REFER(prop);
+        const { referName: type, source, queryParams } = this.$props;
+        const { code, rows } = await REFER({
+          ...prop,
+          ...queryParams(source),
+          type: type,
+        });
         if (code === 200) {
           this.data = rows;
         }
@@ -135,73 +119,46 @@ export default {
     },
     // reset list
     async useReset() {
-      const { type, source, queryParams } = this.$props;
-      this.model = {
-        type,
-        search: "",
-        ...this.model,
-        ...queryParams(source),
-      };
+      this.data = [];
+      this.model.search = null;
       await this.fetchList(this.model);
     },
     // query list
-    async useQuery() {
-      await this.fetchList(this.model);
-    },
-    // cancel
-    useCancel(prop) {
-      const { multiple } = this.$props;
-      this.useUpdate(multiple ? prop : prop[0]);
-      this.hide();
+    async useQuery(value) {
+      await this.$refs.tree.filter(value);
+      // await this.fetchList(this.model);
     },
-    // confirm
-    useConfirm(prop) {
-      const { multiple } = this.$props;
-      this.useUpdate(multiple ? prop : prop[0]);
-      this.emitChange(this.selectData);
-      this.lastSelectData = deepCopy(this.selectData);
-      this.hide();
-    },
-    // delete tag
-    useDelete(prop) {
-      this.selectData.splice(prop, 1);
-      this.useUpdate(this.selectData);
-      this.emitChange(this.selectData);
-      this.lastSelectData = deepCopy(this.selectData);
-    },
-    // update
-    useUpdate(prop) {
-      const { source, multiple, valueKey, dataMapping, type } = this.$props;
-      // update data mapping
-      if (multiple) {
-        const vModel = prop.map((item) => item[valueKey]);
-        this.$emit("input", vModel);
+    // auto
+    async useAutocomplete(prop, cb) {
+      if (prop) {
+        this.model.search = prop;
+        await this.fetchList(this.model);
+        await cb(this.data);
       } else {
-        const vModel = prop[valueKey];
-        this.$emit("input", vModel);
-        for (let key in dataMapping) {
-          source[key] = prop[dataMapping[key]];
-        }
-        this.$emit("update:source", source);
+        cb([]);
       }
     },
-    // click select row data
-    onceSelect(prop) {
-      if (prop) this.selectData = [prop];
+    // select
+    useSelect(prop) {
+      this.selectData = [prop];
     },
-    // double click select row data and confirm
-    doubleSelect(prop) {
-      this.useConfirm([prop]);
+    // filter
+    useTreeFilter(value, data) {
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
     },
-    // multiple select row data
-    selectionChange(prop, data) {
-      if (prop) {
-        this.selectData.push(data);
-      } else {
-        const { code } = data;
-        const index = this.selectData.findIndex((item) => item.code === code);
-        this.selectData.splice(index, 1);
+    // confirm
+    useConfirm(prop) {
+      this.hide();
+      const {
+        $props: { source, valueKey, dataMapping },
+      } = this;
+      for (let key in dataMapping) {
+        source[key] = prop[dataMapping[key]];
       }
+      this.innerValue = prop[valueKey];
+      this.$emit("update:source", source);
+      this.$emit("change", prop, this.$props);
     },
   },
   created() {},
@@ -211,136 +168,102 @@ export default {
 </script>
 <template>
   <div class="popover-tree-select">
-    <el-input
+    <el-autocomplete
+      v-bind="$attrs"
       v-model="innerValue"
-      :size="size"
-      :disabled="disabled"
-      :readonly="readonly"
-      :clearable="clearable"
-      :placeholder="placeholder"
+      :value-key="valueKey"
+      :fetch-suggestions="useAutocomplete"
+      @select="useConfirm"
+      style="width: 100%"
     >
-      <el-button
-        :disabled="disabled"
-        slot="append"
-        icon="el-icon-search"
-        @click="open"
-      ></el-button>
-    </el-input>
+      <i class="el-icon-search" slot="suffix" @click="open"> </i>
+      <template slot-scope="{ item }">
+        <p
+          style="
+            text-overflow: ellipsis;
+            overflow: hidden;
+            line-height: 15px;
+            margin: 5px 0;
+          "
+        >
+          {{ item.name }}
+        </p>
+        <p
+          style="
+            font-size: 12px;
+            color: #b4b4b4;
+            line-height: 15px;
+            margin: 5px 0;
+          "
+        >
+          {{ item.code }}
+        </p>
+      </template>
+    </el-autocomplete>
 
     <el-dialog
-      :title="`${title}（${multiple ? '多选' : '单选'}）`"
       :width="width"
+      :show-close="false"
       :visible.sync="visible"
       :close-on-click-modal="false"
       :close-on-press-escape="false"
       append-to-body
-      @close="hide"
     >
+      <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"
         :size="size"
         :inline="true"
-        :model="params"
+        :model="model"
         @submit.native.prevent
       >
         <el-form-item prop="search">
-          <el-input
-            v-model="params.search"
-            @keydown.enter="useQuery"
-            @change="useQuery"
-          >
-          </el-input>
+          <!-- @change="useQuery"
+          @keydown.enter="useQuery" -->
+          <el-input v-model="model.search" @change="useQuery"> </el-input>
         </el-form-item>
         <el-form-item>
           <el-button icon="el-icon-refresh" @click="useReset"></el-button>
         </el-form-item>
-      </el-form>
-      <el-tree
-        v-if="multiple"
-        :data="data"
-        :props="defaultProps"
-        accordion
-        node-key="id"
-      >
-        <div slot-scope="{ node, data }">
-          <el-checkbox
-            v-model="data.checked"
-            @click.native.stop
-            @change="selectionChange($event, data)"
-            style="margin: 0 5px 0 0"
-          >
-          </el-checkbox>
-          <span> {{ data.name }}</span>
-        </div>
-      </el-tree>
-      <el-radio-group v-else v-model="radio" style="width: 100%">
         <el-tree
           v-loading="loading"
           :data="data"
           :props="defaultProps"
+          :filter-node-method="useTreeFilter"
+          ref="tree"
           accordion
           node-key="id"
+          @node-click="useSelect"
         >
-          <div slot-scope="{ node, data }">
-            <el-radio
-              :label="data.code"
-              @click.native.stop="onceSelect(data)"
-              @dblclick.native.stop="doubleSelect(data)"
-              style="margin: 0 5px 0 0"
-            >
-              {{ data.name }}
-            </el-radio>
-          </div>
         </el-tree>
-      </el-radio-group>
-      <div style="margin-top: 20px; text-align: right">
-        <el-button :size="size" @click="visible = false">取 消</el-button>
-        <el-button :size="size" type="primary" @click="useConfirm(selectData)"
-          >确 定</el-button
-        >
-      </div>
+      </el-form>
     </el-dialog>
-    <div
-      style="
-        position: absolute;
-        left: 10px;
-        top: 50%;
-        transform: translateY(-50%);
-        padding-right: 30px;
-        overflow: hidden;
-      "
-    >
-      <div v-if="multiple && lastSelectData.length">
-        <el-popover
-          :offset="-10"
-          :width="width"
-          :visible-arrow="false"
-          title=""
-          content=""
-          trigger="click"
-          placement="bottom-start"
-        >
-          <el-tag slot="reference" :size="size" style="margin-right: 10px">
-            + {{ lastSelectData.length }}
-          </el-tag>
-          <el-tag
-            v-for="(tag, index) in lastSelectData"
-            :size="size"
-            hit
-            closable
-            :style="{
-              display: 'flex',
-              justifyContent: 'space-between',
-              alignItems: 'center',
-              margin: lastSelectData.length - 1 === index ? '0' : '0 0 5px 0',
-            }"
-            @close="useDelete(index)"
-          >
-            {{ tag.name }}
-          </el-tag>
-        </el-popover>
-      </div>
-    </div>
   </div>
 </template>
 <style scoped></style>

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

@@ -0,0 +1,298 @@
+<script>
+import { REFER } from "./api/index";
+import deepCopy from "@gby/deep-copy";
+
+export default {
+  name: "PopoverTreeSelect",
+  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%",
+      visible: false,
+      loading: false,
+      model: {
+        search: "",
+        isPage: false,
+      },
+      data: [],
+      selectData: [],
+      lastSelectData: [],
+      defaultProps: {
+        label: "name",
+        children: "children",
+      },
+    };
+  },
+  computed: {
+    innerValue: {
+      get() {
+        return this.value;
+      },
+      set(value) {
+        this.$emit("input", value);
+      },
+    },
+  },
+  watch: {
+    innerValue: {
+      handler: function (newValue) {
+        if (!newValue) this.lastSelectData = [];
+      },
+    },
+  },
+  methods: {
+    // open dialog
+    async open() {
+      this.visible = true;
+      await this.useReset();
+    },
+    // hide dialog
+    async hide() {
+      this.visible = false;
+    },
+    // fetch list
+    async fetchList(prop) {
+      try {
+        this.loading = true;
+        const { referName: type, source, queryParams } = this.$props;
+        const { code, rows } = await REFER({
+          ...prop,
+          ...queryParams(source),
+          type: type,
+        });
+        if (code === 200) {
+          this.data = rows;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    // reset list
+    async useReset() {
+      this.data = [];
+      this.model.search = null;
+      await this.fetchList(this.model);
+    },
+    // query list
+    async useQuery() {
+      await this.fetchList(this.model);
+    },
+    // auto
+    async useAutocomplete(prop, cb) {
+      if (prop) {
+        this.model.search = prop;
+        await this.fetchList(this.model);
+        await cb(this.data);
+      } else {
+        cb([]);
+      }
+    },
+    // 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]);
+      }
+      // null
+      else {
+        this.innerValue = prop;
+      }
+      //
+      this.hide();
+      this.lastSelectData = deepCopy(prop);
+      this.$emit("change", prop, this.$props);
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <div class="popover-tree-select popover-tree-select--multiple">
+    <el-input v-bind="$attrs" @focus="open">
+      <i class="el-icon-search" slot="suffix" @click="open"> </i>
+      <template slot-scope="{ item }">
+        <p
+          style="
+            text-overflow: ellipsis;
+            overflow: hidden;
+            line-height: 15px;
+            margin: 5px 0;
+          "
+        >
+          {{ item.name }}
+        </p>
+        <p
+          style="
+            font-size: 12px;
+            color: #b4b4b4;
+            line-height: 15px;
+            margin: 5px 0;
+          "
+        >
+          {{ item.code }}
+        </p>
+      </template>
+    </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="hide"
+            ></el-button>
+          </span>
+        </div>
+      </template>
+      <el-form
+        v-loading="loading"
+        :size="size"
+        :inline="true"
+        :model="model"
+        @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-tree
+          v-loading="loading"
+          :data="data"
+          :props="defaultProps"
+          accordion
+          show-checkbox
+          check-strictly
+          highlight-current
+          ref="tree"
+          node-key="id"
+          @check="useSelect($refs.tree.getCheckedNodes())"
+        >
+        </el-tree>
+      </el-form>
+    </el-dialog>
+    <el-scrollbar
+      v-if="lastSelectData.length"
+      :viewStyle="{
+        display: 'flex',
+        alignItems: 'center',
+        padding: '5px 0 0 5px',
+      }"
+      class="popover-tree-select_tags"
+    >
+      <el-tag
+        v-for="(tag, index) in lastSelectData"
+        :size="size"
+        hit
+        closable
+        @close="useDelete(index)"
+        style="margin-right: 5px"
+      >
+        {{ tag.name || tag[valueKey] }}
+      </el-tag>
+    </el-scrollbar>
+  </div>
+</template>
+<style scoped>
+.popover-tree-select .el-input {
+  width: inherit;
+}
+.popover-tree-select .el-input .el-icon-search {
+  cursor: pointer;
+}
+.popover-tree-select .popover-tree-select_tags {
+  position: absolute;
+  left: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  width: calc(100% - 40px);
+  height: 100%;
+}
+::v-deep .el-table--mini .el-table__cell {
+  height: 50px;
+}
+</style>

src/components/super-search/index.vue

@@ -8,74 +8,113 @@
     @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%"
+    <el-row :gutter="20">
+      <el-col :span="21">
+        <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
+          <el-col
+            v-for="({ item, attr }, index) in showColumns"
+            :key="index"
+            :span="item.span || 6"
           >
-          </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-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%"
               >
-              </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>
+              </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>
+              <component
+                v-if="attr.is === 'el-popover-multiple-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-col>
+      <el-col :span="3">
+        <el-button
+          :size="$attrs.size"
+          plain
+          type="primary"
+          @click="$emit('submit')"
+        >
+          查 询
+        </el-button>
+        <el-button
+          :size="$attrs.size"
+          plain
+          type="info"
+          @click="$emit('reset')"
+        >
+          重 置
+        </el-button>
+        <el-button
+          :size="$attrs.size"
+          plain
+          type="info"
+          @click="visible = !visible"
+        >
+          {{ visible ? "收 起" : "展 开" }}
+        </el-button>
       </el-col>
     </el-row>
   </el-form>
@@ -104,9 +143,13 @@ export default {
       import("@/components/popover-select-v2/multiple.vue"),
     ElPopoverTreeSelect: () =>
       import("@/components/popover-tree-select/index.vue"),
+    ElPopoverMultipleTreeSelect: () =>
+      import("@/components/popover-tree-select/multiple.vue"),
   },
   data() {
-    return {};
+    return {
+      visible: false,
+    };
   },
   computed: {
     innerValue: {
@@ -117,6 +160,16 @@ export default {
         this.$emit("input", value);
       },
     },
+    showColumns: {
+      get() {
+        const { columns, visible } = this;
+        if (visible) {
+          return columns;
+        } else {
+          return columns.filter((item, index) => index < 4);
+        }
+      },
+    },
   },
   watch: {},
   methods: {},

src/views/purchase/PurchaseDemandList/add.vue

@@ -280,6 +280,7 @@
           <el-table-column show-overflow-tooltip label="集团预测分类" align="center"  prop="forecastClassify" width="120px"/>
           <el-table-column show-overflow-tooltip label="近一月需求" align="center"  prop="onemonthAvgVolume" width="120px"/>
           <el-table-column show-overflow-tooltip label="近三月需求" align="center"  prop="threemonthAvgVolume" width="120px"/>
+          <el-table-column show-overflow-tooltip label="采购在途" align="center"  prop="puFreight" width="120px"/>
           <el-table-column show-overflow-tooltip label="交货日期" align="center"  prop="deliveryDate" width="230px">
             <template slot-scope="scope">
               <el-form-item class="hang" :prop="'puDemandItemList.' + scope.$index + '.' + 'deliveryDate'" :rules="{ required: true, message: '请填写交货日期', trigger: 'blur' }">
@@ -764,6 +765,7 @@ export default {
         item.forecastClassify = ''
         item.onemonthAvgVolume = ''
         item.threemonthAvgVolume = ''
+        item.puFreight = ''
         item.superiorAllotQty = ''
         item.resDemandQty = ''
         item.executeQty = ''
@@ -907,6 +909,7 @@ export default {
         forecastClassify: null,
         onemonthAvgVolume: null,
         threemonthAvgVolume: null,
+        puFreight: null,
         deliveryDate: null,
         isUrgency: this.basicForm.billType == 'JJXQ' ? 'Y' : 'N',
         isReplenishment: this.basicForm.billType == 'BDXQ'? 'Y': 'N',
@@ -1105,6 +1108,7 @@ export default {
             item.forecastClassify = ''
             item.onemonthAvgVolume = ''
             item.threemonthAvgVolume = ''
+            item.puFreight = ''
             item.superiorAllotQty = ''
             item.resDemandQty = ''
             item.executeQty = ''
@@ -1196,160 +1200,158 @@ export default {
       })
       console.log('复制的数组',rows);
       console.log('列表的数组',this.basicForm.puDemandItemList)
-      let linArr = []
-      // for (let i = 0; i<rows.length; i++) {
-        // console.log('items',rows[i])
+      if (rows.length < 1000) {
         await getRefer({ type: 'MATERIAL_PARAM', materialCodeList: rows }).then(res => {
-          // if (res.code === 200) {
-          //   let line = {
-          //     contacts: null,
-          //     id: null,
-          //     demandId: null,
-          //     status: null,
-          //     businessDept: null,
-          //     businessDeptName: null,
-          //     materialCategory: null,
-          //     buyer: null,
-          //     buyerName: null,
-          //     mateiralClassifyOne: null,
-          //     materialClassifyOneName: null,
-          //     materialClassifyTwo: null,
-          //     materialClassifyTwoName: null,
-          //     materialClassifyThree: null,
-          //     materialClassifyThreeName: null,
-          //     materialClassifyFour: null,
-          //     materialClassifyFourName: null,
-          //     materialCode: null,
-          //     material: null,
-          //     materialName: null,
-          //     classifyId: null,
-          //     specification: null,
-          //     unit: null,
-          //     unitName: null,
-          //     manufacturerName: null,
-          //     registrant: null,
-          //     puPeriod: null,
-          //     expiryUnit: null,
-          //     expiry: null,
-          //     minPackage: null,
-          //     minOrderQty: null,
-          //     minBatch: null,
-          //     safeStock: null,
-          //     averageQtyMonth: null,
-          //     qty: null,
-          //     adjustmentPersonal: null,
-          //     adjustmentTime: null,
-          //     manualRegulation: null,
-          //     updateCause: null,
-          //     reservedProportion: null,
-          //     reservedPeriod: null,
-          //     reservedQty: null,
-          //     demandPeriod: null,
-          //     forecastClassify: null,
-          //     onemonthAvgVolume: null,
-          //     threemonthAvgVolume: null,
-          //     deliveryDate: null,
-          //     isUrgency: this.basicForm.billType == 'JJXQ' ? 'Y' : 'N',
-          //     isReplenishment: this.basicForm.billType == 'BDXQ' ? 'Y' : 'N',
-          //     isBatchLock: 'N',
-          //     remark: null,
-          //     puRemark: null,
-          //     lastWarehouseQty: null,
-          //     resDemandQty: null,
-          //     lastWarehouse: null,
-          //     lastWarehouseName: null,
-          //     deliveryWarehouse: null,
-          //     deliveryWarehouseName: null,
-          //     lastAllocation: null,
-          //     lastAllocationName: null,
-          //     deliveryAllocation: null,
-          //     deliveryAllocationName: null,
-          //     passageOn: null,
-          //     puOrg: null,
-          //     purOrgName: null,
-          //     lastStockQty: null,
-          //     superiorCenterQty: null,
-          //     superiorAllotQty: null,
-          //     availableQty: null,
-          //     statusAllot: 'N',
-          //     additionalSupplier: null,
-          //     additionalSupplierName: null,
-          //     periodUnit: null,
-          //     demandCustomer: this.basicForm.customer,
-          //     demandCustomerName: this.basicForm.customerName,
-          //     businessDept: this.basicForm.demandDept,
-          //     businessDeptName: null,
-          //     lastStockOrg: null,
-          //     lastStockOrgName: null,
-          //     superiorStockOrg: null,
-          //     superiorStockOrgName: null,
-          //     allotCode: null,
-          //     deliveryAddress: null,
-          //     deliveryAddressName: null,
-          //     contacts: null,
-          //     contactsPhone: null,
-          //     address: null,
-          //     source: null,
-          //     priceType: 'order',
-          //     puManagerApprover: null,
-          //     puManagerApproverName: null,
-          //     processTime: null,
-          //     affirmer: null,
-          //     tenantId: null,
-          //     revision: null,
-          //     createBy: null,
-          //     createByName: null,
-          //     createTime: null,
-          //     updateBy: null,
-          //     updateByName: null,
-          //     updateTime: null,
-          //     delFlag: 0,
-          //     // 新增字段
-          //     model: null,
-          //     storageCondition: null,
-          //     transportationCondition: null,
-          //   }
-          //   line.businessDept = res.rows[0].businessDepartment
-          //   line.businessDeptName = res.rows[0].businessDepartmentName
-          //   line.materialCode = res.rows[0].code
-          //   line.material = res.rows[0].id
-          //   line.materialName = res.rows[0].name
-          //   line.classifyId = res.rows[0].classifyId
-          //   line.materialClassifyOneName = res.rows[0].oneClass
-          //   line.materialClassifyTwoName = res.rows[0].twoClass
-          //   line.materialClassifyThreeName = res.rows[0].threeClass
-          //   line.materialClassifyFourName = res.rows[0].fourClass
-          //   line.specification = res.rows[0].specification
-          //   line.model = res.rows[0].model
-          //   line.unit = res.rows[0].unitId
-          //   line.unitName = res.rows[0].unitIdName
-          //   line.registrant = res.rows[0].registrant
-          //   line.manufacturerName = res.rows[0].manufacturerIdName
-          //   line.puPeriod = res.rows[0].deliveryPeriod
-          //   line.expiry = res.rows[0].usefulLife
-          //   line.expiryUnit = res.rows[0].expiryUnitIdName
-          //   // line.minPackage = res.rows[0].usefulLife
-          //   line.minPackage = res.rows[0].minPackQty
-          //   line.minOrderQty = res.rows[0].minOrderQty
-          //   line.minBatch = res.rows[0].minBatchQty
-          //   line.safeStock = res.rows[0].safeStock
-          //   line.purOrgName = res.rows[0].purchasingOrganizationName
-          //   line.puOrg = res.rows[0].purchasingOrganization
-          //   // 物料存储条件和运输条件
-          //   line.transportationCondition = res.rows[0].transportationCondition
-          //   line.storageCondition = res.rows[0].storageCondition
-          //   linArr[i] = line
-          // }
+          if (res.code === 200) {
+            let rowList = res.rows
+            for (let i = 0; i<rowList.length; i++) {
+            let line = {
+              contacts: null,
+              id: null,
+              demandId: null,
+              status: null,
+              businessDept: null,
+              businessDeptName: null,
+              materialCategory: null,
+              buyer: null,
+              buyerName: null,
+              mateiralClassifyOne: null,
+              materialClassifyOneName: null,
+              materialClassifyTwo: null,
+              materialClassifyTwoName: null,
+              materialClassifyThree: null,
+              materialClassifyThreeName: null,
+              materialClassifyFour: null,
+              materialClassifyFourName: null,
+              materialCode: null,
+              material: null,
+              materialName: null,
+              classifyId: null,
+              specification: null,
+              unit: null,
+              unitName: null,
+              manufacturerName: null,
+              registrant: null,
+              puPeriod: null,
+              expiryUnit: null,
+              expiry: null,
+              minPackage: null,
+              minOrderQty: null,
+              minBatch: null,
+              safeStock: null,
+              averageQtyMonth: null,
+              qty: null,
+              adjustmentPersonal: null,
+              adjustmentTime: null,
+              manualRegulation: null,
+              updateCause: null,
+              reservedProportion: null,
+              reservedPeriod: null,
+              reservedQty: null,
+              demandPeriod: null,
+              forecastClassify: null,
+              onemonthAvgVolume: null,
+              threemonthAvgVolume: null,
+              puFreight: null,
+              deliveryDate: null,
+              isUrgency: this.basicForm.billType == 'JJXQ' ? 'Y' : 'N',
+              isReplenishment: this.basicForm.billType == 'BDXQ' ? 'Y' : 'N',
+              isBatchLock: 'N',
+              remark: null,
+              puRemark: null,
+              lastWarehouseQty: null,
+              resDemandQty: null,
+              lastWarehouse: null,
+              lastWarehouseName: null,
+              deliveryWarehouse: null,
+              deliveryWarehouseName: null,
+              lastAllocation: null,
+              lastAllocationName: null,
+              deliveryAllocation: null,
+              deliveryAllocationName: null,
+              passageOn: null,
+              puOrg: null,
+              purOrgName: null,
+              lastStockQty: null,
+              superiorCenterQty: null,
+              superiorAllotQty: null,
+              availableQty: null,
+              statusAllot: 'N',
+              additionalSupplier: null,
+              additionalSupplierName: null,
+              periodUnit: null,
+              demandCustomer: this.basicForm.customer,
+              demandCustomerName: this.basicForm.customerName,
+              businessDept: this.basicForm.demandDept,
+              businessDeptName: null,
+              lastStockOrg: null,
+              lastStockOrgName: null,
+              superiorStockOrg: null,
+              superiorStockOrgName: null,
+              allotCode: null,
+              deliveryAddress: null,
+              deliveryAddressName: null,
+              contacts: null,
+              contactsPhone: null,
+              address: null,
+              source: null,
+              priceType: 'order',
+              puManagerApprover: null,
+              puManagerApproverName: null,
+              processTime: null,
+              affirmer: null,
+              tenantId: null,
+              revision: null,
+              createBy: null,
+              createByName: null,
+              createTime: null,
+              updateBy: null,
+              updateByName: null,
+              updateTime: null,
+              delFlag: 0,
+              // 新增字段
+              model: null,
+              storageCondition: null,
+              transportationCondition: null,
+            }
+              line.businessDept = rowList[i].businessDepartment
+              line.businessDeptName = rowList[i].businessDepartmentName
+              line.materialCode = rowList[i].code
+              line.material = rowList[i].id
+              line.materialName = rowList[i].name
+              line.classifyId = rowList[i].classifyId
+              line.materialClassifyOneName = rowList[i].oneClass
+              line.materialClassifyTwoName = rowList[i].twoClass
+              line.materialClassifyThreeName = rowList[i].threeClass
+              line.materialClassifyFourName = rowList[i].fourClass
+              line.specification = rowList[i].specification
+              line.model = rowList[i].model
+              line.unit = rowList[i].unitId
+              line.unitName = rowList[i].unitIdName
+              line.registrant = rowList[i].registrant
+              line.manufacturerName = rowList[i].manufacturerIdName
+              line.puPeriod = rowList[i].deliveryPeriod
+              line.expiry = rowList[i].usefulLife
+              line.expiryUnit = rowList[i].expiryUnitIdName
+              // line.minPackage = rowList[i].usefulLife
+              line.minPackage = rowList[i].minPackQty
+              line.minOrderQty = rowList[i].minOrderQty
+              line.minBatch = rowList[i].minBatchQty
+              line.safeStock = rowList[i].safeStock
+              line.purOrgName = rowList[i].purchasingOrganizationName
+              line.puOrg = rowList[i].purchasingOrganization
+              // 物料存储条件和运输条件
+              line.transportationCondition = rowList[i].transportationCondition
+              line.storageCondition = rowList[i].storageCondition
+              this.basicForm.puDemandItemList.push(line)
+              // console.log('临时数组', line)
+            }
+          }
         })
-        console.log('临时数组', linArr)
-      // }
-      this.basicForm.puDemandItemList.push(...linArr)
       console.log('列表', this.basicForm.puDemandItemList)
-      // this.basicForm.puDemandItemList.forEach(e => {
-      //   rows.forEach(d => {
-      //     e.materialCode = d
-      //   })
-      // })
+      } else {
+        this.$modal.msgWarning("复制长度不能超过1000!");
+      }
     },
     // 明细行选择物料编码带出数据
     chooseMaterial(index) {
@@ -1496,6 +1498,7 @@ export default {
           item.forecastClassify = ''
           item.onemonthAvgVolume = ''
           item.threemonthAvgVolume = ''
+          item.puFreight = ''
           item.superiorAllotQty = ''
           item.resDemandQty = ''
           item.executeQty = ''

src/views/purchase/purchase-order/add/column.js

@@ -238,6 +238,7 @@ export const Columns = [
     controlsPosition: "right",
     precision:2,
     isShow:true, 
+    require: true,
   },
   { 
     key: "deductionMoney", 
@@ -246,6 +247,7 @@ export const Columns = [
     controlsPosition: "right",
     precision:2,
     isShow:true, 
+    require: true,
   },
   { 
     key: "goodsWarehouseName",
@@ -523,6 +525,14 @@ export const TabColumns = [
         disabled:true,
         require:false,
       },
+      { 
+        key: "contractNo",
+        title:"合同编号",
+        inputType: "Input", 
+        width: 180,
+        disabled:true,
+        require:false,
+      },
       // { key: "orderId", title: "采购订单ID", inputType: "Input", width: 180 },
       // {key: "material",title: "物料",inputType: "Input",   },
       {
@@ -848,8 +858,8 @@ export const TabColumns = [
        },
       { key: "exchangeRate", title: "折本汇率", inputType: "Input", },
       { key: "source", title: "上游单据号", inputType: "Input", width: 180 },
-      { key: "sourceId", title: "上游单据ID", inputType: "Input", width: 180 },
-      { key: "demandCode", title: "采购需求单号", inputType: "Input", width: 180 },
+      // { key: "sourceId", title: "上游单据ID", inputType: "Input", width: 180 },
+      // { key: "demandCode", title: "采购需求单号", inputType: "Input", width: 180 },
       { key: "arrivalDatePlan", title: "计划到货日期", inputType: "Input", width: 180 },
      
       { key: "isDistributionPrice", title: "配送价", inputType: "Checkbox", },
@@ -886,8 +896,8 @@ export const TabColumns = [
         disabled:true,
         readonly:true,
       },
-      { key: "createByName", title: "创建人", inputType: "Input", },
-      { key: "updateByName", title: "更新人", inputType: "Input", },
+      // { key: "createByName", title: "创建人", inputType: "Input", },
+      // { key: "updateByName", title: "更新人", inputType: "Input", },
       
     ]
   },
@@ -994,18 +1004,18 @@ export const TabColumns = [
         controlsPosition: "right",
         width: 180, 
       },
-      { 
-        key: "createByName", 
-        title: "创建人名称", 
-        inputType: "Input", 
-        width: 120 
-      },
-      { 
-        key: "updateByName", 
-        title: "更新人名称", 
-        inputType: "Input", 
-        width: 120 
-      },
+      // { 
+      //   key: "createByName", 
+      //   title: "创建人", 
+      //   inputType: "Input", 
+      //   width: 120 
+      // },
+      // { 
+      //   key: "updateByName", 
+      //   title: "更新人", 
+      //   inputType: "Input", 
+      //   width: 120 
+      // },
     ]
   },
 ];

src/views/purchase/task/column.js

@@ -82,9 +82,8 @@ export const SearchColumns = [
       title: "物料分类",
     },
     attr: {
-      is: "el-popover-tree-select",
+      is: "el-popover-multiple-tree-select",
       referName: "MATERIALCLASSIFY_PARAM",
-      multiple: true,
       valueKey: "id",
     },
   },

src/views/purchase/task/index.vue

@@ -159,41 +159,19 @@ export default {
 
 <template>
   <el-card v-loading="loading" :body-style="{ padding: 0 }">
-    <see-model ref="SeeModel"></see-model>
-    <export-model ref="ExportModel"></export-model>
-    <close-model
-      ref="CloseModel"
-      @success="useQuery(params, page)"
-    ></close-model>
-    <shift-model
-      ref="ShiftModel"
-      @success="useQuery(params, page)"
-    ></shift-model>
-    <direct-model
-      ref="DirectModel"
-      @success="useQuery(params, page)"
-    ></direct-model>
-    <return-model
-      ref="ReturnModel"
-      @success="useQuery(params, page)"
-    ></return-model>
     <el-super-search
       v-model="params"
       :size="size"
       :dict="dict"
       :columns="SearchColumns"
+      @reset="useReset"
       @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"
+          :disabled="!hasPowerShift(selectData)"
           @click="useShift(selectData[0])"
         >
           转 派
@@ -243,6 +221,24 @@ export default {
       :limit.sync="page.pageSize"
       @pagination="useQuery(params, page)"
     />
+    <see-model ref="SeeModel"></see-model>
+    <export-model ref="ExportModel"></export-model>
+    <close-model
+      ref="CloseModel"
+      @success="useQuery(params, page)"
+    ></close-model>
+    <shift-model
+      ref="ShiftModel"
+      @success="useQuery(params, page)"
+    ></shift-model>
+    <direct-model
+      ref="DirectModel"
+      @success="useQuery(params, page)"
+    ></direct-model>
+    <return-model
+      ref="ReturnModel"
+      @success="useQuery(params, page)"
+    ></return-model>
   </el-card>
 </template>
 <style scoped lang="scss">