优化

src/components/select/bom/ProductModal.vue

@@ -0,0 +1,274 @@
+<template>
+  <el-dialog :title="title" :visible.sync="visible" v-if="visible" :before-close="handleClose"
+    :close-on-click-modal="false" :close-on-press-escape="false" append-to-body width="75%">
+    <el-card shadow="never">
+      <ProductSearch @search="reload" ref="searchRef" />
+
+      <ele-split-layout width="244px" allow-collapse :right-style="{ overflow: 'hidden' }">
+        <div class="ele-border-lighter split-layout-right-content">
+          <el-tree :data="treeList" :props="defaultProps" ref="treeRef"
+            :default-expanded-keys="current && current.id ? [current.id] : []" :highlight-current="true" node-key="id"
+            @node-click="handleNodeClick"></el-tree>
+        </div>
+        <!-- 表格 -->
+        <template v-slot:content>
+          <ele-pro-table ref="table" :columns="columns" :datasource="datasource" row-key="id" height="calc(100vh - 350px)"
+            class="dict-table" @cell-click="cellClick">
+            <!-- 表头工具栏 -->
+            <template v-slot:action="{ row }">
+              <el-radio class="radio" v-model="radio" :label="row.id"><i></i></el-radio>
+            </template>
+          </ele-pro-table>
+        </template>
+      </ele-split-layout>
+    </el-card>
+    <div class="btns">
+      <el-button type="primary" size="small" @click="selected">选择</el-button>
+      <el-button size="small" @click="handleClose">关闭</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+
+import ProductSearch from './product-search.vue'
+import { getMaterialList } from '@/api/material/list.js';
+import { getTreeByGroup } from '@/api/classifyManage';
+export default {
+  components: { ProductSearch },
+  data() {
+    return {
+      visible: false,
+
+      // 表格列配置
+      columns: [
+        {
+          columnKey: 'index',
+          type: 'index',
+          width: 45,
+          align: 'center',
+          reserveSelection: true
+        },
+        {
+          prop: 'code',
+          label: '编码'
+        },
+        {
+          prop: 'name',
+          label: '名称',
+          showOverflowTooltip: true
+        },
+        {
+          prop: 'brandNum',
+          label: '牌号'
+        },
+
+        {
+          prop: 'modelType',
+          label: '型号',
+          align: 'center',
+          showOverflowTooltip: true
+        },
+        {
+          prop: 'specification',
+          label: '规格',
+          align: 'center',
+          showOverflowTooltip: true
+        },
+        {
+          prop: 'measuringUnit',
+          label: '计量单位',
+          showOverflowTooltip: true,
+          minWidth: 90
+        },
+
+        {
+          prop: 'weightUnit',
+          label: '重量单位',
+          showOverflowTooltip: true,
+          minWidth: 90
+        },
+
+        {
+          prop: 'roughWeight',
+          label: '毛重',
+          showOverflowTooltip: true,
+          minWidth: 90
+        },
+
+        {
+          prop: 'netWeight',
+          label: '净重',
+          showOverflowTooltip: true,
+          minWidth: 90
+        },
+
+
+        {
+          prop: 'packingUnit',
+          align: 'center',
+          label: '包装单位',
+          showOverflowTooltip: true
+        },
+        {
+          prop: 'categoryLevelPath',
+          label: '分类',
+          align: 'center',
+          showOverflowTooltip: true
+        },
+
+        {
+          action: 'action',
+          slot: 'action',
+          align: 'center',
+          label: '选择'
+        }
+      ],
+      title: null,
+      categoryLevelId: null,
+      radio: null,
+      idx: null,
+
+      isCategory: true,
+
+      current: {},
+
+      treeList: [],
+      treeLoading: false,
+
+      defaultProps: {
+        children: 'children',
+        label: 'name'
+      }
+    }
+  },
+
+  watch: {
+
+  },
+  methods: {
+    /* 表格数据源 */
+    datasource({ page, where, limit }) {
+      return getMaterialList({
+        ...where,
+        pageNum: page,
+        size: limit,
+        categoryLevelId: this.isCategory ? this.categoryLevelId : null,
+
+      });
+    },
+    handleNodeClick(data) {
+      this.isCategory = true
+      this.categoryLevelId = data.id;
+      this.$refs.table.reload({ pageNum: 1, where: {} });
+      this.$refs.searchRef.reset2()
+
+
+    },
+    /* 刷新表格 */
+    reload(where) {
+      this.isCategory = false
+      this.$refs.table.reload({ pageNum: 1, where: where });
+    },
+    open(item, title, type, idx) {
+      if (item) {
+        this.title = title
+        this.type = type
+        this.idx = idx
+
+        this.current = {
+          id: item.categoryId,
+          name: item.categoryName,
+          code: item.categoryCode
+        }
+        this.radio = item.categoryId
+
+        this.getTreeData();
+
+      }
+      this.visible = true
+    },
+
+
+    async getTreeData() {
+      try {
+        this.treeLoading = true;
+
+        const res = await getTreeByGroup({ type: this.type });
+        this.treeLoading = false;
+        if (res?.code === '0') {
+          this.treeList = res.data;
+
+          this.$nextTick(() => {
+            // 默认高亮第一级树节点
+            if (this.treeList[0]) {
+              this.rootTreeId = this.treeList[0].id
+              this.$nextTick(() => {
+                this.$refs.treeRef.setCurrentKey(this.treeList[0].id);
+              });
+
+            }
+          });
+          return this.treeList;
+        }
+      } catch (error) { }
+      this.treeLoading = false;
+    },
+
+
+
+
+
+
+    // 单击获取id
+    cellClick(row) {
+      this.current = row
+      this.radio = row.id
+    },
+    handleClose() {
+      this.visible = false
+      this.current = null
+      this.radio = ''
+    },
+    selected() {
+      if (!this.current) {
+        return this.$message.warning('请选择工作中心')
+      }
+      this.$emit('changeProduct', this.title, this.current, this.idx)
+      this.handleClose()
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.tree_col {
+  border: 1px solid #eee;
+  padding: 10px 0;
+  box-sizing: border-box;
+  height: 500px;
+  overflow: auto;
+}
+
+.table_col {
+  padding-left: 10px;
+
+  ::v-deep .el-table th.el-table__cell {
+    background: #f2f2f2;
+  }
+}
+
+.pagination {
+  text-align: right;
+  padding: 10px 0;
+}
+
+.btns {
+  text-align: center;
+  padding: 10px 0;
+}
+
+.topsearch {
+  margin-bottom: 15px;
+}
+</style>

src/components/select/bom/product-search.vue

@@ -0,0 +1,102 @@
+<!-- 搜索表单 -->
+<template>
+  <el-form
+    label-width="77px"
+    class="ele-form-search"
+    @keyup.enter.native="search"
+    @submit.native.prevent
+  >
+    <el-row :gutter="10">
+      <el-col v-bind="styleResponsive ? { md: 6 } : { span: 6 }">
+        <el-form-item label="编码">
+          <el-input clearable v-model="where.code" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { md: 6 } : { span: 6 }">
+        <el-form-item label="名称">
+          <el-input clearable v-model="where.name" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+
+      <el-col v-bind="styleResponsive ? { md: 6 } : { span: 6 }">
+        <el-form-item label="型号">
+          <el-input clearable v-model="where.modelType" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { md: 4 } : { md: 4 }">
+        <div class="ele-form-actions">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            class="ele-btn-icon"
+            @click="search"
+          >
+            查询
+          </el-button>
+
+          <el-button
+            @click="reset"
+            icon="el-icon-refresh"
+            class="ele-btn-icon"
+            size="medium"
+            >重置</el-button
+          >
+        </div>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+  export default {
+    data () {
+      // 默认表单数据
+      const defaultWhere = {
+        name: '',
+        code: '',
+        modelType: ''
+      };
+      return {
+        defaultWhere,
+        // 表单数据
+        where: { ...defaultWhere },
+        treeData:[]
+      };
+    },
+    computed: {
+      // 是否开启响应式布局
+      styleResponsive () {
+        return this.$store.state.theme.styleResponsive;
+      }
+    },
+    created() {
+    },
+    methods: {
+
+      /* 搜索 */
+      search () {
+        if (this.where.appType === 0) {
+          this.where.appType = '';
+        }
+        this.$emit('search', this.where);
+      },
+      /*  重置 */
+      reset () {
+        this.where = { ...this.defaultWhere };
+        this.search();
+      },
+      reset2 () {
+        this.where = { ...this.defaultWhere };
+
+      }
+    }
+  };
+</script>
+
+<style>
+  .ele-form-actions {
+    display: inline-block;
+    transform: translate(0);
+    transition: all;
+  }
+</style>

src/views/classifyManage/treeClassify/components/list-edit.vue

@@ -166,6 +166,11 @@
             value: '2',
             label: '仓储组'
           },
+
+          { 
+            value: '3',
+            label: '物料组'
+          },
      
         
         ],

src/views/material/product/components/MaterialAdd.vue

@@ -113,7 +113,7 @@ import factorySelect from '@/components/CommomSelect/factory-select.vue';
 import { pageList } from '@/api/technology/version/version.js';
 import { getCode } from '@/api/codeManagement/index.js';
 import { bomSave, bomUpdate } from '@/api/material/BOM';
-import ProductModal from '@/views/technology/productParam/components/ProductModal.vue'
+import ProductModal from '@/components/select/bom/ProductModal.vue'
 export default {
     components: {
         factorySelect,
@@ -353,7 +353,8 @@ export default {
 
 
         categorySelect(row, idx) {
-            this.$refs.productRefs.open(row, '选择物料', '1', idx)
+            // 3  type: 物料组
+            this.$refs.productRefs.open(row, '选择物料', 3, idx)
 
         },