记录规则功能完善、工序管理配置过程监测功能开发

src/views/rulesManagement/releaseRules/components/permitAdd.vue

@@ -236,39 +236,40 @@
         </div>
       </template>
 
-      <header-title v-if="formData.isExecuteMethod" title="执行方式">
-        <el-button type="primary" @click="addExecuteMethod"
+      <header-title title="规则明细">
+        <el-button
+          v-if="formData.isExecuteMethod"
+          type="primary"
+          @click="addExecuteMethod"
           >添加执行方式</el-button
         >
       </header-title>
 
-      <div v-if="formData.isExecuteMethod" class="executeMethodlist">
-        <div
-          class="executeMethodItem"
-          v-for="i in formData.executeMethodList"
-          :key="i"
-          :class="{
-            executeMethodItemActive: i == formData.executeMethodTitle
-          }"
-          @click="formData.executeMethodTitle = i"
+      <el-tabs
+        v-if="formData.isExecuteMethod"
+        v-model="formData.executeMethodTitle"
+        type="card"
+        closable
+        @tab-remove="deleteExecuteMethod"
+      >
+        <el-tab-pane
+          :key="item"
+          v-for="item in formData.executeMethodList"
+          :label="item"
+          :name="item"
         >
-          <span> {{ i }}</span>
-          <i
-            class="el-icon-error"
-            size="24"
-            @click="deleteExecuteMethod(i)"
-          ></i>
-        </div>
-      </div>
+          {{ item.content }}
+        </el-tab-pane>
+      </el-tabs>
 
-      <header-title title="规则明细"></header-title>
       <ele-pro-table
         ref="table"
         :columns="bankColumns"
-        :datasource="formData.details"
+        :datasource="detailsList"
         :need-page="false"
         row-key="id"
         class="table_list"
+        :cache-key="cacheKeyUrl"
       >
         <template v-slot:toolbar>
           <el-button
@@ -323,6 +324,9 @@
             v-model="row.paramValue"
             placeholder="请输入参数内容"
             size="mini"
+            type="textarea"
+            rows="1"
+            autosize
           ></el-input>
         </template>
         <template v-slot:defaultValue="{ row }">
@@ -431,6 +435,18 @@
             size="mini"
           ></el-input>
         </template>
+
+        <template v-slot:executeMethodTitle="{ row }">
+          <el-select v-model="row.executeMethodTitle" clearable size="mini">
+            <el-option
+              v-for="item in formData.executeMethodList"
+              :key="item"
+              :label="item"
+              :value="item"
+            ></el-option>
+          </el-select>
+        </template>
+
         <template v-slot:action="{ row }">
           <el-link
             type="danger"
@@ -535,12 +551,6 @@
             align: 'center',
             label: '序号'
           },
-          // {
-          //   prop: 'executeMethodTitle',
-          //   label: '执行方式',
-          //   align: 'center',
-          //   minWidth: 110
-          // },
           {
             prop: 'paramType',
             label: '参数类型',
@@ -553,7 +563,7 @@
             label: '参数内容',
             align: 'center',
             slot: 'paramValue',
-            minWidth: 180
+            minWidth: 261
           },
           {
             prop: 'defaultValue',
@@ -604,6 +614,13 @@
             slot: 'remark',
             minWidth: 110
           },
+          {
+            prop: 'executeMethodTitle',
+            label: '执行方式',
+            align: 'center',
+            slot: 'executeMethodTitle',
+            minWidth: 180
+          },
           {
             columnKey: 'action',
             label: '操作',
@@ -669,6 +686,18 @@
             fixed: 'right'
           }
         ];
+      },
+      cacheKeyUrl() {
+        return `main-permit-add-2510181429-reportWorkType`;
+      },
+      detailsList() {
+        if (this.formData.isExecuteMethod) {
+          return this.formData.details.filter(
+            (i) => i.executeMethodTitle == this.formData.executeMethodTitle
+          );
+        } else {
+          return this.formData.details;
+        }
       }
     },
     data() {
@@ -849,8 +878,29 @@
           };
 
           if (data.isExecuteMethod) {
-            data.executeMethodList = Object.keys(data.detailMap);
-            data.details = Object.values(data.detailMap).flat();
+            data.executeMethodList = Object.keys(data.detailMap).map((i) => {
+              return i === '' ? '无执行方式' : i;
+            });
+
+            if (data.executeMethodList.includes('无执行方式')) {
+              // 将无执行方式 放到第一个
+              data.executeMethodList = data.executeMethodList.filter(
+                (i) => i !== '无执行方式'
+              );
+              data.executeMethodList.unshift('无执行方式');
+            } else {
+              // 添加一个 无执行方式
+              data.executeMethodList.unshift('无执行方式');
+            }
+
+            data.details = Object.values(data.detailMap)
+              .flat()
+              .map((i) => {
+                if (i.executeMethodTitle == '') {
+                  i.executeMethodTitle = '无执行方式';
+                }
+                return i;
+              });
             data.executeMethodTitle = data.executeMethodList[0] || '';
           } else {
             data.executeMethodList = [];
@@ -940,7 +990,7 @@
           }
 
           if (this.formData.relateProductMethod == 2) {
-            // 关联分类
+            // 关联产品
             if (this.formData.categories.length == 0) {
               return this.$message.warning('请选择关联产品');
             }
@@ -1003,7 +1053,7 @@
           }
 
           if (this.formData.relateProductMethod == 2) {
-            // 关联分类
+            // 关联产品
             if (this.formData.categories.length == 0) {
               return this.$message.warning('请选择关联产品');
             }
@@ -1054,7 +1104,14 @@
               return { ...i, sortNum: index + 1 };
             });
 
-        const body = { ...this.formData };
+        const body = JSON.parse(JSON.stringify(this.formData));
+
+        body.details = body.details.map((i) => {
+          if (i.executeMethodTitle == '无执行方式') {
+            i.executeMethodTitle = '';
+          }
+          return i;
+        });
 
         body.startDate = this.$util.toDateString(
           body.startDate,
@@ -1069,9 +1126,7 @@
         if (this.type == 'edit') {
           if (body.produceTaskConfigBatchSavePo.produceTaskId) {
             // 修改工序
-
             if (body.relateProductMethod == 1) {
-              debugger;
               // 分类
               body.categoryLevels.forEach((categoryId) => {
                 // 判断是否已经存在
@@ -1138,6 +1193,42 @@
                 }
               });
             }
+
+            if (body.relateProductMethod == 0) {
+              // 不关联产品 但存在工序
+              // 判断是否已经存在
+              const item = body.produceTaskConfigs.find(
+                (i) =>
+                  i.produceTaskId ==
+                  body.produceTaskConfigBatchSavePo.produceTaskId
+              );
+
+              if (item) {
+                // 修改
+                body.produceTaskConfigBatchSavePo.updatePOs.push({
+                  ...item,
+                  produceTaskId:
+                    body.produceTaskConfigBatchSavePo.produceTaskId,
+                  produceTaskName:
+                    body.produceTaskConfigBatchSavePo.produceTaskName,
+                  reportWorkType: this.formData.reportWorkType
+                });
+              } else {
+                // 新增
+                body.produceTaskConfigBatchSavePo.deletedIds =
+                  this.formData.produceTaskConfigs.map((i) => i.id);
+
+                body.produceTaskConfigBatchSavePo.addPOs.push({
+                  executeMethod: 2,
+                  itemType: 2,
+                  produceTaskId:
+                    body.produceTaskConfigBatchSavePo.produceTaskId,
+                  produceTaskName:
+                    body.produceTaskConfigBatchSavePo.produceTaskName,
+                  reportWorkType: this.formData.reportWorkType
+                });
+              }
+            }
           } else {
             // 删除工序 全删
             body.produceTaskConfigBatchSavePo.deletedIds =
@@ -1182,6 +1273,18 @@
                 });
               });
             }
+
+            if (body.relateProductMethod == 0) {
+              // 不关联
+              body.produceTaskConfigBatchSavePo.addPOs.push({
+                executeMethod: 2,
+                itemType: 2,
+                produceTaskId: body.produceTaskConfigBatchSavePo.produceTaskId,
+                produceTaskName:
+                  body.produceTaskConfigBatchSavePo.produceTaskName,
+                reportWorkType: this.formData.reportWorkType
+              });
+            }
           }
 
           body.produceTaskConfigBatchSavePo.updatePOs = [];
@@ -1231,13 +1334,6 @@
       },
       // 添加
       addRow() {
-        if (
-          this.formData.isExecuteMethod &&
-          !this.formData.executeMethodTitle
-        ) {
-          return this.$message.warning('请先选择执行方式');
-        }
-
         this.formData.details.push({
           id: new Date().getTime(),
           defaultValue: '',
@@ -1253,6 +1349,7 @@
           productCode: '',
           executeMethodTitle: this.formData.executeMethodTitle
         });
+        console.log('this.formData.details', this.formData.details);
       },
       deleteRow(row) {
         const index = this.formData.details.indexOf(row);
@@ -1353,7 +1450,7 @@
           ...productList
         ];
       },
-      /// 获取产品分类
+      // 获取产品分类
       async getProductCategory() {
         let { data } = await getTreeByPid(9);
         console.log('产品分类', data);
@@ -1418,9 +1515,23 @@
           this.formData.details = this.formData.details.map((i) => {
             return {
               ...i,
-              executeMethodTitle: ''
+              executeMethodTitle: '无执行方式'
             };
           });
+        } else {
+          if (this.formData.executeMethodList.length == 0) {
+            // 添加一个默认执行方式
+            this.formData.executeMethodList.push('无执行方式');
+
+            this.formData.details = this.formData.details.map((i) => {
+              return {
+                ...i,
+                executeMethodTitle: '无执行方式'
+              };
+            });
+
+            this.formData.executeMethodTitle = '无执行方式';
+          }
         }
       },
       clearProductTask() {
@@ -1480,28 +1591,4 @@
       }
     }
   }
-
-  .executeMethodlist {
-    display: flex;
-    flex-flow: row wrap;
-    margin-bottom: 20px;
-    gap: 20px;
-
-    .executeMethodItem {
-      border: 1px solid #333;
-      padding: 10px 10px;
-      display: flex;
-      gap: 4px;
-      align-items: center;
-      justify-content: space-between;
-      background: #fff;
-      cursor: pointer;
-
-      &Active {
-        border-color: #409eff;
-        background: #409eff;
-        color: #fff;
-      }
-    }
-  }
 </style>

src/views/technology/production/components/user-setting-matter-process-drawer.vue

@@ -0,0 +1,276 @@
+<template>
+  <el-drawer
+    title="配置工序"
+    :visible.sync="drawer"
+    direction="rtl"
+    :before-close="handleClose"
+    size="80%"
+  >
+    <div style="padding: 10px">
+      <el-form
+        :model="currentProcessData"
+        label-width="120px"
+        class="drawer-form"
+        disabled
+      >
+        <el-row style="margin-top: 20px">
+          <el-col :span="8">
+            <el-form-item label="名称">
+              <el-input v-model="currentProcessData.name"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="类型">
+              <el-input v-model="currentProcessData.type"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="工序编码">
+              <el-input v-model="currentProcessData.code"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row style="margin-top: 20px">
+          <el-col :span="8">
+            <el-form-item label="工序控制码">
+              <el-input v-model="currentProcessData.controlName"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="所属工作中心">
+              <el-input v-model="currentProcessData.workCenterName"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="所属工厂">
+              <el-input v-model="currentProcessData.factoriesName"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <el-tabs v-model="activeName" type="card">
+        <el-tab-pane label="关联分类" name="category">
+          <!-- 关联分类 -->
+          <ele-pro-table
+            ref="categoryTableRef"
+            :columns="categoryColumns"
+            :datasource="productCategory"
+            row-key="id"
+            cache-key="setting-matter-process-category-table-2510181638"
+            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+            :expand-row-keys="expandRowKeys"
+            @refresh="getProductCategory"
+            :needPage="false"
+          >
+            <template v-slot:action="{ row }">
+              <el-link
+                type="primary"
+                :underline="false"
+                icon="el-icon-setting"
+                @click="openConfig(row)"
+              >
+                工序配置
+              </el-link>
+            </template>
+          </ele-pro-table>
+        </el-tab-pane>
+        <el-tab-pane label="关联产品" name="product">
+          <div style="margin-top: 20px">
+            <seekPage :seekList="seekList" @search="reload" />
+          </div>
+          <!-- 关联产品 -->
+          <ele-pro-table
+            ref="productTableRef"
+            :columns="productColumns"
+            :datasource="productDatasource"
+            row-key="id"
+            cache-key="setting-matter-process-product-table-2510181638"
+          >
+            <template v-slot:action="{ row }">
+              <el-link
+                type="primary"
+                :underline="false"
+                icon="el-icon-setting"
+                @click="openConfig(row)"
+              >
+                工序配置
+              </el-link>
+            </template>
+          </ele-pro-table>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+  import { getTreeByPid } from '@/api/classifyManage';
+  import { getList } from '@/api/classifyManage/itemInformation.js';
+
+  export default {
+    computed: {
+      categoryColumns() {
+        return [
+          {
+            prop: 'code',
+            label: '分类编码',
+            align: 'center',
+            slot: 'code'
+          },
+          {
+            prop: 'name',
+            label: '分类名称',
+            align: 'center',
+            slot: 'name'
+          },
+          {
+            label: '操作',
+            columnKey: 'action',
+            slot: 'action'
+          }
+        ];
+      },
+      productColumns() {
+        return [
+          {
+            prop: 'code',
+            label: '产品编码',
+            align: 'center',
+            slot: 'code'
+          },
+          {
+            label: '产品名称',
+            prop: 'name'
+          },
+          {
+            label: '牌号',
+            prop: 'brandNum'
+          },
+          {
+            label: '型号',
+            prop: 'modelType'
+          },
+          {
+            label: '单位',
+            prop: 'weightUnit'
+          },
+          {
+            label: '操作',
+            columnKey: 'action',
+            slot: 'action'
+          }
+        ];
+      },
+      seekList() {
+        return [
+          {
+            label: '编码',
+            value: 'code',
+            type: 'input',
+            placeholder: '请输入'
+          },
+          {
+            label: '名称',
+            value: 'name',
+            type: 'input',
+            placeholder: '请输入'
+          },
+          {
+            label: '型号',
+            value: 'modelType',
+            type: 'input',
+            placeholder: '请输入'
+          }
+        ];
+      }
+    },
+    data() {
+      return {
+        drawer: false,
+        direction: 'rtl',
+        // 当前工序数据
+        currentProcessData: {},
+        typeList: [
+          {
+            value: 99,
+            label: '关键工序'
+          },
+          {
+            value: 1,
+            label: '普通工序'
+          },
+          // {
+          //   value: 2,
+          //   label: '抽样质检'
+          // },
+
+          {
+            value: 3,
+            label: '抽样质检'
+          },
+          {
+            value: 4,
+            label: '包装工序'
+          },
+          {
+            value: 6,
+            label: '质检工序'
+          },
+          {
+            value: 7,
+            label: '生产准备'
+          }
+        ],
+        activeName: 'category',
+        // 产品分类
+        productCategory: [],
+        expandRowKeys: []
+      };
+    },
+    created() {
+      this.getProductCategory();
+    },
+    methods: {
+      // 获取产品分类
+      async getProductCategory() {
+        let { data } = await getTreeByPid(9);
+        console.log('产品分类', data);
+        this.productCategory = data;
+        this.expandRowKeys.push(data[0]?.id);
+      },
+      open(row) {
+        console.log('row', row);
+        this.currentProcessData = { ...row };
+        this.currentProcessData.type = this.typeList.find(
+          (item) => item.value == row.type
+        )?.label;
+
+        this.drawer = true;
+      },
+      handleClose(done) {
+        done();
+      },
+      productDatasource({ page, limit, where, order }) {
+        return getList({
+          ...where,
+          ...order,
+          pageNum: page,
+          size: limit,
+          categoryLevelId: 9
+        });
+      },
+      /* 刷新表格 */
+      reload(where) {
+        this.$refs.productTableRef.reload({ page: 1, where: where });
+      },
+      // 工序配置
+      openConfig(row) {
+        console.log('row', row);
+        this.$message.warning('工序配置功能待开发');
+      }
+    }
+  };
+</script>
+
+<style></style>

src/views/technology/production/components/user-setting-matter-process.vue

@@ -19,12 +19,88 @@
       ></el-tab-pane>
     </el-tabs>
     <div style="margin: 10px 0"></div>
+
+    <el-form :model="params" label-width="115px" style="margin-top: 20px">
+      <el-row :gutter="20" style="margin-bottom: 10px">
+        <el-col :span="10">
+          <el-form-item label="关联产品方式">
+            <el-select
+              v-model="relateProductMethod"
+              placeholder="请选择关联产品方式"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in relateProductMethodOpeions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col v-if="relateProductMethod == 1" :span="10">
+          <el-form-item label="关联产品分类">
+            <ele-tree-select
+              multiple
+              clearable
+              :data="productCategory"
+              v-model="params.categoryLevels"
+              placeholder="请选择关联产品分类"
+              default-expand-all
+              labelKey="name"
+              valueKey="id"
+              @change="getMatterList"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <template v-if="relateProductMethod == 2">
+        <div style="margin-bottom: 20px">
+          <header-title title="关联产品">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-plus"
+              class="ele-btn-icon"
+              @click="relateProductSelect"
+            >
+              选择产品
+            </el-button>
+          </header-title>
+
+          <ele-pro-table
+            ref="productTableRef"
+            :columns="productColumns"
+            :datasource="params.products"
+            :needPage="false"
+            row-key="id"
+            cache-key="user-setting-matter-process-product-2510181402"
+          >
+            <template v-slot:action="{ row }">
+              <el-link
+                type="danger"
+                :underline="false"
+                icon="el-icon-delete"
+                @click="productColumnsDeleteRow(row)"
+              >
+                删除
+              </el-link>
+            </template>
+          </ele-pro-table>
+        </div>
+      </template>
+    </el-form>
+
     <ele-pro-table
       ref="table"
       :columns="bankColumns"
       :datasource="datasource"
       :need-page="false"
       class="table_list"
+      @refresh="getMatterList"
+      cache-key="user-setting-matter-process-2510181058"
     >
       <template v-slot:toolbar>
         <el-button
@@ -77,6 +153,12 @@
       @editMatter="editMatter"
       notProduceTaskConfig
     />
+
+    <ProductModal
+      ref="ProductModalCorrelationRef"
+      @changeProduct="changeRelateProduct"
+      multiple
+    ></ProductModal>
   </ele-modal>
 </template>
 
@@ -90,11 +172,13 @@
   import dictMixins from '@/mixins/dictMixins';
   import userSettingMatterAdd from './user-setting-matter-add.vue';
   import { mapGetters } from 'vuex';
+  import { getTreeByPid } from '@/api/classifyManage';
+  import ProductModal from '@/components/selectProduct/ProductModal.vue';
 
   export default {
     name: 'UserSettingMatter',
     mixins: [dictMixins, tableColumnsMixin],
-    components: { userSettingMatterAdd },
+    components: { userSettingMatterAdd, ProductModal },
     data() {
       return {
         visible: false,
@@ -147,7 +231,19 @@
         addPOs: [],
         deletedIds: [],
         updatePOs: [],
-        butLoading: false
+        butLoading: false,
+        relateProductMethod: null,
+        params: {
+          categoryLevels: [],
+          products: []
+        },
+        relateProductMethodOpeions: [
+          { label: '不关联', value: 0 },
+          { label: '关联分类', value: 1 },
+          { label: '关联产品', value: 2 }
+        ],
+        // 产品分类
+        productCategory: []
       };
     },
     computed: {
@@ -162,10 +258,63 @@
         const list = this.dict['record_rules_report_work_type'] || [];
         // 只显示过程监测
         return list.filter((item) => item.dictCode + '' == '2');
+      },
+      productColumns() {
+        return [
+          {
+            columnKey: 'index',
+            type: 'index',
+            width: 45,
+            align: 'center',
+            reserveSelection: true
+          },
+          {
+            prop: 'code',
+            label: '产品编码'
+          },
+          {
+            prop: 'name',
+            label: '产品名称',
+            showOverflowTooltip: true
+          },
+          {
+            prop: 'brandNum',
+            label: '牌号'
+          },
+          {
+            prop: 'modelType',
+            label: '型号'
+          },
+          {
+            prop: 'measuringUnit',
+            label: '计量单位'
+          },
+          {
+            prop: 'packingUnit',
+            label: '包装单位'
+          },
+          {
+            columnKey: 'action',
+            label: '操作',
+            width: 110,
+            align: 'center',
+            resizable: false,
+            slot: 'action',
+            fixed: 'right'
+          }
+        ];
       }
     },
-    created() {},
+    created() {
+      this.getProductCategory();
+    },
     methods: {
+      // 获取产品分类
+      async getProductCategory() {
+        let { data } = await getTreeByPid(9);
+        console.log('产品分类', data);
+        this.productCategory = data;
+      },
       updateVisible(val) {
         this.visible = val;
       },
@@ -173,21 +322,17 @@
         console.log('row', row);
         this.currentRow = row;
         this.visible = true;
-        this.getMatterList(row);
-        // this.getDetails(row.id);
+        this.getMatterList();
       },
-      // 查询详情
-      // async getDetails(id) {
-      //   const data = await produceTaskRecordRulesGetById(id);
-      //   console.log('data 详情数据', data);
-      // },
       // 查询事项数据
       async getMatterList() {
         const { list } = await produceTaskRecordRules({
           produceTaskId: this.currentRow.id,
           pageNum: 1,
           size: 9999,
-          reportWorkType: this.reportWorkType
+          reportWorkType: this.reportWorkType,
+          categoryLevels: this.params.categoryLevels,
+          productIds: this.params.products.map((item) => item.id)
         });
         console.log('list', list);
         // 表格数据
@@ -331,6 +476,20 @@
         this.updatePOs = [];
         this.butLoading = false;
         this.reportWorkType = '2';
+      },
+      // 关联产品
+      relateProductSelect() {
+        this.$refs.ProductModalCorrelationRef.open(this.params.products);
+      },
+      changeRelateProduct(array) {
+        console.log('paroduct list ', array);
+
+        this.params.products = [
+          ...this.params.products,
+          ...array.filter(
+            (i) => !this.params.products.some((cat) => cat.id === i.id)
+          )
+        ];
       }
     }
   };

src/views/technology/production/index.vue

@@ -166,6 +166,10 @@
     ></userSettingMatterProcess>
 
     <WorkCenter ref="centerRefs" @changeCenter="determineChoose" />
+
+    <userSettingMatterProcessDrawer
+      ref="userSettingMatterProcessDrawerRef"
+    ></userSettingMatterProcessDrawer>
   </div>
 </template>
 
@@ -182,7 +186,7 @@
   import WorkCenter from './components/WorkCenter.vue';
   import userSettingMatter from './components/user-setting-matter.vue';
   import userSettingMatterProcess from './components/user-setting-matter-process.vue';
-
+  import userSettingMatterProcessDrawer from './components/user-setting-matter-process-drawer.vue';
   import dictMixins from '@/mixins/dictMixins';
 
   export default {
@@ -196,7 +200,8 @@
       importDialog,
       WorkCenter,
       userSettingMatter,
-      userSettingMatterProcess
+      userSettingMatterProcess,
+      userSettingMatterProcessDrawer
     },
     data() {
       return {
@@ -369,7 +374,7 @@
         this.$refs.userSettingMatterRef.openSetting(row);
       },
       openSettingMatterProcess(row) {
-        this.$refs.userSettingMatterProcessRef.openSetting(row);
+        this.$refs.userSettingMatterProcessDrawerRef.open(row);
       },
       typeLabel(type) {
         return (