优化

src/views/material/materialBOM/components/edit-dialog.vue

@@ -1,15 +1,12 @@
 <template>
-  <ele-modal    custom-class="ele-dialog-form" :visible.sync="visible" v-if="visible" :title="title" width="80%" @close="cancel">
+  <ele-modal custom-class="ele-dialog-form" :visible.sync="visible" v-if="visible" :title="title" width="80%"
+    @close="cancel">
     <headerTitle title="基本信息"></headerTitle>
-    <el-form label-width="100px"  ref="form" :model="form" :rules="rules" >
+    <el-form label-width="100px" ref="form" :model="form" :rules="rules">
       <el-row>
         <el-col :span="8" label-width="100px">
           <el-form-item label="BOM编码" prop="code">
-            <el-input
-              placeholder="自动生成"
-              disabled
-              v-model="form.code"
-            ></el-input>
+            <el-input placeholder="自动生成" disabled v-model="form.code"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -24,97 +21,55 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="产品编码" prop="categoryCode">
-            <el-input
-              placeholder="请输入"
-              v-model="form.categoryCode"
-              @click.native="selectProd"
-            ></el-input>
+            <el-input placeholder="请输入" v-model="form.categoryCode" @click.native="selectProd"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="产品名称" prop="categoryName">
-            <el-input
-              placeholder="请选择"
-              disabled
-              v-model="form.categoryName"
-            ></el-input>
+            <el-input placeholder="请选择" disabled v-model="form.categoryName"></el-input>
           </el-form-item>
         </el-col>
 
         <el-col :span="8">
           <el-form-item label="版本号" prop="version">
-            <el-input
-              placeholder="请选择"
-              disabled
-              v-model="form.version"
-            ></el-input>
+            <el-input placeholder="请选择" disabled v-model="form.version"></el-input>
           </el-form-item>
         </el-col>
 
 
         <el-col :span="8">
           <el-form-item label="分类层级" prop="categoryType">
-            <el-select
-              v-model="form.categoryType"
-              placeholder="请选择"
-              class="w100"
-            >
-              <el-option
-                v-for="item in categoryList"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              ></el-option>
+            <el-select v-model="form.categoryType" placeholder="请选择" class="w100">
+              <el-option v-for="item in categoryList" :key="item.value" :label="item.label"
+                :value="item.value"></el-option>
             </el-select>
 
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="基本数量" prop="baseCount">
-            <el-row >
+            <el-row>
               <el-col :span="16">
-                <el-input
-                  placeholder="请输入"
-                  v-model.number="form.baseCount"
-                >
-                </el-input
-              ></el-col>
+                <el-input placeholder="请输入" v-model.number="form.baseCount">
+                </el-input></el-col>
               <el-col :span="2">&nbsp;</el-col>
-              <el-col :span="6"
-                ><DictSelection
-                  dictName="计量单位"
-                  v-model="form.baseCountUnit"
-              /></el-col>
+              <el-col :span="6">
+                <DictSelection dictName="计量单位" v-model="form.baseCountUnit" />
+              </el-col>
             </el-row>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="状态" prop="status">
-            <el-select
-              :disabled="title == '新建'"
-              clearable
-              v-model="form.status"
-              placeholder="请选择"
-              class="w100"
-            >
-              <el-option
-                v-for="item in Object.entries(statusOpt)"
-                :key="item[0]"
-                :label="item[1]"
-                :value="item[0]"
-              ></el-option>
+            <el-select :disabled="title == '新建'" clearable v-model="form.status" placeholder="请选择" class="w100">
+              <el-option v-for="item in Object.entries(statusOpt)" :key="item[0]" :label="item[1]"
+                :value="item[0]"></el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
     </el-form>
-    <ele-pro-table
-      ref="table"
-      :columns="columns"
-      :datasource="tableData"
-      height="calc(100vh - 550px)"
-      :need-page="false"
-    >
+    <ele-pro-table ref="table" :columns="columns" :datasource="tableData" height="calc(100vh - 550px)" :need-page="false">
       <!-- 表头工具栏 -->
       <template v-slot:toolbar>
         <el-button type="primary" @click="add">添加</el-button>
@@ -129,24 +84,15 @@
         <DictSelection dictName="计量单位" v-model="row.unit"></DictSelection>
       </template>
       <template v-slot:count="{ row }">
-        <el-input
-          v-model="row.count"
-          placeholder="请输入"
-          @input="
-            (value) =>
-              (row.count = value.replace(
-                /^(-)*(\d+)\.(\d\d\d\d\d\d).*$/,
-                '$1$2.$3'
-              ))
-          "
-        ></el-input>
+        <el-input v-model="row.count" placeholder="请输入" @input="(value) =>
+        (row.count = value.replace(
+          /^(-)*(\d+)\.(\d\d\d\d\d\d).*$/,
+          '$1$2.$3'
+        ))
+          "></el-input>
       </template>
       <template v-slot:categoryName="{ row }">
-        <el-input
-          :value="row.categoryName"
-          placeholder="请选择"
-          @click.native="categorySelect(row)"
-        ></el-input>
+        <el-input :value="row.categoryName" placeholder="请选择" @click.native="categorySelect(row)"></el-input>
       </template>
     </ele-pro-table>
 
@@ -160,236 +106,257 @@
 </template>
 
 <script>
-  import materialDialog from '@/components/SelectDialog/materialDialog';
-  import productDialog from '@/components/SelectDialog/productDialog';
-  import factorySelect from '@/components/CommomSelect/factory-select.vue';
-  import { getCode } from '@/api/codeManagement/index.js';
-  import { getVersionCode, bomSave, bomUpdate  } from '@/api/material/BOM';
-  export default {
-    components: { materialDialog, factorySelect, productDialog },
-    props: {
-      statusOpt: Object
-    },
-    data () {
+import materialDialog from '@/components/SelectDialog/materialDialog';
+import productDialog from '@/components/SelectDialog/productDialog';
+import factorySelect from '@/components/CommomSelect/factory-select.vue';
+import { getCode } from '@/api/codeManagement/index.js';
+import { getVersionCode, bomSave, bomUpdate,  getById, detailPage } from '@/api/material/BOM';
+export default {
+  components: { materialDialog, factorySelect, productDialog },
+  props: {
+    statusOpt: Object
+  },
+  data() {
 
-      var baseCountVa = (rule ,value,callback ) => {
-        if (value == '') {
-          callback(new Error('请输入基本数量'));
-        } else if (this.form.baseCountUnit == '') {
-          callback(new Error('请选择基本数量单位'));
-        } else {
-          callback();
-        }
-      };
+    var baseCountVa = (rule, value, callback) => {
+      if (value == '') {
+        callback(new Error('请输入基本数量'));
+      } else if (this.form.baseCountUnit == '') {
+        callback(new Error('请选择基本数量单位'));
+      } else {
+        callback();
+      }
+    };
+
+    return {
+      visible: false,
+      title: '',
+      row: {},
+      form: {
+        code: '',
+        name: '',
+        type: 0,
+        factoryId: '',
+        categoryCode: '',
+        categoryId: '',
+        categoryName: '',
+        version: '',
+        categoryType: '',
+        baseCount: '',
+        baseCountUnit: '',
+        status: '-1',
 
-      return {
-        visible: false,
-        title: '',
-        row: {},
-        form: {
-          code: '',
-          name: '',
-          type: 0,
-          factoryId: '',
-          categoryCode: '',
-          categoryId: '',
-          categoryName: '',
-          version: '',
-          categoryType: '',
-          baseCount: '',
-          baseCountUnit: '',
-          status: '-1',
-       
+      },
+      categoryList: [
+        {
+          value: 1,
+          label: '产品'
+        },
+        {
+          value: 2,
+          label: '部件'
         },
-        categoryList: [
-          {
-            value: '1',
-            label: '产品'
-          },
-          {
-            value: '2',
-            label: '部件'
-          },
-          {
-            value: '3',
-            label: '零件'
-          }
+        {
+          value: 3,
+          label: '零件'
+        }
 
+      ],
+      tableData: [],
+      columns: [
+        {
+          type: 'index',
+          width: 55,
+          align: 'center'
+        },
+        {
+          label: '子项编号',
+          prop: 'subCode',
+          slot: 'subCode',
+          action: 'subCode'
+        },
+        {
+          label: '物料名称',
+          prop: 'categoryName',
+          slot: 'categoryName',
+          action: 'categoryName'
+        },
+        {
+          label: '物料编码',
+          prop: 'categoryId'
+        },
+        {
+          label: '牌号',
+          prop: 'brandNum'
+        },
+        {
+          label: '型号',
+          prop: 'modelType'
+        },
+        {
+          label: '需量（子）',
+          slot: 'count',
+          action: 'count'
+        },
+        {
+          label: '单位',
+          slot: 'unit',
+          action: 'unit'
+        },
+        {
+          action: 'action',
+          slot: 'action',
+          label: '操作'
+        }
+      ],
+      rules: {
+        name: [
+          { required: true, message: '请输入BOM名称', trigger: 'blur' }
         ],
-        tableData: [],
-        columns: [
-          {
-            type: 'index',
-            width: 55,
-            align: 'center'
-          },
-          {
-            label: '子项编号',
-            prop: 'subCode',
-            slot: 'subCode',
-            action: 'subCode'
-          },
-          {
-            label: '物料名称',
-            prop: 'categoryName',
-            slot: 'categoryName',
-            action: 'categoryName'
-          },
-          {
-            label: '物料编码',
-            prop: 'categoryId'
-          },
-          {
-            label: '牌号',
-            prop: 'brandNum'
-          },
-          {
-            label: '型号',
-            prop: 'modelType'
-          },
-          {
-            label: '需量（子）',
-            slot: 'count',
-            action: 'count'
-          },
-          {
-            label: '单位',
-            slot: 'unit',
-            action: 'unit'
-          },
-          {
-            action: 'action',
-            slot: 'action',
-            label: '操作'
-          }
-        ],
-        rules: {
-          name: [
-            { required: true, message: '请输入BOM名称', trigger: 'blur' }
-          ],
-          factoryId: [
+        factoryId: [
           { required: true, message: '请输入所属工厂', trigger: 'change' }
-          ],
-          categoryCode: [
+        ],
+        categoryCode: [
           { required: true, message: '请输入产品编码', trigger: 'blur' }
-          ],
+        ],
 
-          baseCount: [
-            { validator: baseCountVa, trigger: 'blur' }
-          ]
-        },
+        baseCount: [
+          { validator: baseCountVa, trigger: 'blur' }
+        ]
+      },
 
-        // 提交状态
-        loading: false,
-        // 是否是修改
-        isUpdate: false,
-      };
+      // 提交状态
+      loading: false,
+      // 是否是修改
+      isUpdate: false,
+    };
+  },
+  methods: {
+    open(type, row) {
+      this.title = type;
+      this.row = row;
+      this.visible = true;
+      if (type == '新建') {
+        this._getCode();
+      } else {
+        this.isUpdate = true
+        this._getById(row.id);
+
+    
+      }
     },
-    methods: {
-      open (type, row) {
-        this.title = type;
-        this.row = row;
-        this.visible = true;
-        if (type == '新建') {
-          this._getCode();
-        }
-      },
-      add () {
-        let subCode = '0010';
-        if (this.tableData.length) {
-          let max = Math.max(...this.tableData.map((i) => i.subCode)) + 10 + '';
+    add() {
+      let subCode = '0010';
+      if (this.tableData.length) {
+        let max = Math.max(...this.tableData.map((i) => i.subCode)) + 10 + '';
 
-          if (max.length < 4) {
-            max = new Array(4 - max.length).fill('0').join('') + max;
-          }
-          subCode = max.substring(0, max.length - 1) + '0';
+        if (max.length < 4) {
+          max = new Array(4 - max.length).fill('0').join('') + max;
         }
+        subCode = max.substring(0, max.length - 1) + '0';
+      }
 
-        this.tableData.push({
-          subCode,
-          categoryId: '',
-          categoryName: '',
-          brandNum: '',
-          count: '',
-          modelType: '',
-          unit: ''
-        });
-      },
-      async _getCode () {
-        const code = await getCode('bom_code');
-        this.form.code = code;
-      },
-      selectProd () {
-        this.$refs.productDialogRef.open(this.form, (res) => {
-          this.form.categoryCode = res.code;
-          this.form.categoryId = res.id;
-          this.form.categoryName = res.name;
-          console.log(res);
+      this.tableData.push({
+        subCode,
+        categoryId: '',
+        categoryName: '',
+        brandNum: '',
+        count: '',
+        modelType: '',
+        unit: ''
+      });
+    },
+    async _getCode() {
+      const code = await getCode('bom_code');
+      this.form.code = code;
+    },
+    selectProd() {
+      this.$refs.productDialogRef.open(this.form, (res) => {
+        this.form.categoryCode = res.code;
+        this.form.categoryId = res.id;
+        this.form.categoryName = res.name;
+        console.log(res);
 
-          this.getVersion() // 获取版本号
-        });
-      },
-      categorySelect (row) {
-        this.$refs.materialDialogRef.open(row, (res) => {
-          row.categoryName = res.name;
-          row.categoryId = res.id;
-          row.unit = res.measuringUnit;
-          row.modelType = res.modelType;
-          row.brandNum = res.brandNum;
-        });
-      },
+        this.getVersion() // 获取版本号
+      });
+    },
+    categorySelect(row) {
+      this.$refs.materialDialogRef.open(row, (res) => {
+        row.categoryName = res.name;
+        row.categoryId = res.id;
+        row.unit = res.measuringUnit;
+        row.modelType = res.modelType;
+        row.brandNum = res.brandNum;
+      });
+    },
 
 
-      async getVersion () {
-        const res = await getVersionCode(this.form.categoryId);
-        
-        this.form.version = res
-      },
+    async getVersion() {
+      const res = await getVersionCode(this.form.categoryId);
 
+      this.form.version = res
+    },
 
-      save () {
-       console.log(this.tableData)
-        this.$refs.form.validate((valid) => {
-          if (!valid) {
-            return false;
-          }
-          this.loading = true;
-          if (!this.isUpdate) {
-            delete this.form.id;
-          }
 
-          const data = {
-            ...this.form,
-            subDetailList: this.tableData
-          };
+    save() {
 
-          const saveOrUpdate = this.isUpdate ? bomUpdate : bomSave;
-          saveOrUpdate(data)
-            .then((msg) => {
-              this.loading = false;
-              this.$message.success(msg);
-              this.updateVisible(false);
-              this.$emit('done');
-            })
-            .catch((e) => {
-              this.loading = false;
-            });
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        this.loading = true;
+        if (!this.isUpdate) {
+          delete this.form.id;
+        }
 
-        });
+        const data = {
+          ...this.form,
+          subDetailList: this.tableData
+        };
 
-      },
+        const saveOrUpdate = this.isUpdate ? bomUpdate : bomSave;
+        saveOrUpdate(data)
+          .then((msg) => {
+            this.loading = false;
+            this.$message.success(msg);
+            this.updateVisible(false);
+            this.$emit('done');
+          })
+          .catch((e) => {
+            this.loading = false;
+          });
 
-            /* 更新visible */
-            updateVisible(value) {
-        this.$emit('update:visible', value);
-      },
+      });
+
+    },
+
+    /* 更新visible */
+    updateVisible(value) {
+      this.$emit('update:visible', value);
+    },
+
+    handleDel(index) {
+      this.tableData.splice(index, 1);
+    },
+    cancel() {
+      this.visible = false
+    },
+
+    async _getById(id) {
+      const data = await getById(id);
+      this.form = data;
+      this.form.status =  this.form.status + ''
+    },
 
-      handleDel (index) {
-        this.tableData.splice(index, 1);
+    tableData (res) {
+        const { page, limit, where } = res;
+        return detailPage({
+          pageNum: page,
+          size: limit,
+          ...where
+        });
       },
-      cancel () {
-        this.visible = false
-      }
-    }
-  };
+
+  }
+};
 </script>

src/views/material/materialBOM/components/view-dialog.vue

@@ -157,6 +157,7 @@
       open (row) {
         this.visible = true;
         this._getById(row.id);
+        
         this.$nextTick(() => {
           this.$refs.table.reload({ where: { bomId: row.id } });
         });

src/views/material/materialBOM/index.vue

@@ -23,7 +23,7 @@
         </template>
         <template v-slot:action="{ row }">
           <el-link type="primary" @click="handelDetail(row)">详情</el-link>
-          <el-link type="primary"  icon="el-icon-edit"  @click="handelEdit('编辑')">编辑</el-link>
+          <el-link type="primary"  icon="el-icon-edit"  @click="handelEdit('编辑', row)">编辑</el-link>
         </template>
       </ele-pro-table>
     </el-card>
@@ -126,8 +126,8 @@
         this.$refs.table.reload({ where });
       },
       /* 显示编辑 */
-      handelEdit (row) {
-        this.$refs.editDialogRef.open(row);
+      handelEdit (type, row) {
+        this.$refs.editDialogRef.open(type,row);
       },
       /* 删除 */
       remove () {