修改产品结构详情

huminmin

14 小时以前 8f9e65a587ee29b607010f83025456ee28c9b0d6

 src/views/productionManagement/productStructure/StructureEdit.vue

@@ -19,130 +19,147 @@
               @click="cancelEdit"
               style="margin-bottom: 10px">取消
    </el-button>
    <el-form ref="form"
             :model="dataValue">
      <el-table :data="dataValue.dataList"
                style="width: 100%">
        <el-table-column prop="productName"
                         label="产品"
                         width="150" />
        <el-table-column prop="model"
                         label="规格"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item v-if="dataValue.isEdit"
                          :prop="`dataList.${$index}.model`"
                          :rules="[{ required: true, message: '请选择规格', trigger: ['blur','change'] }]"
                          style="margin: 0">
              <el-select v-model="row.model"
                         placeholder="请选择产品"
                         clearable
                         :disabled="!dataValue.isEdit"
                         style="width: 100%"
                         @visible-change="(v) => { if (v) openDialog($index) }">
                <el-option v-if="row.model"
                           :label="row.model"
                           :value="row.model" />
              </el-select>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="processId"
                         label="消耗工序"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item :prop="`dataList.${$index}.processId`"
                          :rules="[{ required: true, message: '请选择消耗工序', trigger: 'change' }]"
                          style="margin: 0">
              <el-select v-model="row.processId"
                         placeholder="请选择"
                         filterable
                         clearable
                         style="width: 100%"
                         :disabled="!dataValue.isEdit">
                <el-option v-for="item in dataValue.processOptions"
                           :key="item.id"
                           :label="item.name"
                           :value="item.id" />
              </el-select>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="unitQuantity"
                         label="单位产出所需数量"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item :prop="`dataList.${$index}.unitQuantity`"
                          :rules="[{ required: true, message: '请输入单位产出所需数量', trigger: ['blur','change'] }]"
                          style="margin: 0">
              <el-input-number v-model="row.unitQuantity"
                               :min="0"
                               :precision="2"
                               :step="1"
                               controls-position="right"

    <el-table
        :data="tableData"
        border
        :preserve-expanded-content="false"
        style="width: 100%"
    >
      <el-table-column type="expand">
        <template #default="props">
          <el-form ref="form"
                   :model="dataValue">
            <el-table :data="dataValue.dataList"
                      style="width: 100%">
              <el-table-column prop="productName"
                               label="产品"
                               width="150" />
              <el-table-column prop="model"
                               label="规格"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item v-if="dataValue.isEdit"
                                :prop="`dataList.${$index}.model`"
                                :rules="[{ required: true, message: '请选择规格', trigger: ['blur','change'] }]"
                                style="margin: 0">
                    <el-select v-model="row.model"
                               placeholder="请选择产品"
                               clearable
                               :disabled="!dataValue.isEdit"
                               style="width: 100%"
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="demandedQuantity"
                         label="需求总量"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item :prop="`dataList.${$index}.demandedQuantity`"
                          :rules="[{ required: true, message: '请输入需求总量', trigger: ['blur','change'] }]"
                          style="margin: 0">
              <el-input-number v-model="row.demandedQuantity"
                               :min="0"
                               :precision="2"
                               :step="1"
                               controls-position="right"
                               @visible-change="(v) => { if (v) openDialog($index) }">
                      <el-option v-if="row.model"
                                 :label="row.model"
                                 :value="row.model" />
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="processId"
                               label="消耗工序"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item :prop="`dataList.${$index}.processId`"
                                :rules="[{ required: true, message: '请选择消耗工序', trigger: 'change' }]"
                                style="margin: 0">
                    <el-select v-model="row.processId"
                               placeholder="请选择"
                               filterable
                               clearable
                               style="width: 100%"
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="unit"
                         label="单位"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item :prop="`dataList.${$index}.unit`"
                          :rules="[{ required: true, message: '请输入单位', trigger: ['blur','change'] }]"
                          style="margin: 0">
              <el-input v-model="row.unit"
                        placeholder="请输入单位"
                        clearable
                        :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="diskQuantity"
                         label="盘数（盘）"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item :prop="`dataList.${$index}.diskQuantity`"
                          :rules="[{ required: true, message: '请输入盘数', trigger: ['blur','change'] }]"
                          style="margin: 0">
              <el-input-number v-model="row.diskQuantity"
                               :min="0"
                               :precision="0"
                               :step="1"
                               controls-position="right"
                               style="width: 100%"
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template #default="{ row, $index }">
            <el-button type="danger"
                       text
                       @click="dataValue.dataList.splice($index, 1)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
                               :disabled="!dataValue.isEdit">
                      <el-option v-for="item in dataValue.processOptions"
                                 :key="item.id"
                                 :label="item.name"
                                 :value="item.id" />
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="unitQuantity"
                               label="单位产出所需数量"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item :prop="`dataList.${$index}.unitQuantity`"
                                :rules="[{ required: true, message: '请输入单位产出所需数量', trigger: ['blur','change'] }]"
                                style="margin: 0">
                    <el-input-number v-model="row.unitQuantity"
                                     :min="0"
                                     :precision="2"
                                     :step="1"
                                     controls-position="right"
                                     style="width: 100%"
                                     :disabled="!dataValue.isEdit" />
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="demandedQuantity"
                               label="需求总量"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item :prop="`dataList.${$index}.demandedQuantity`"
                                :rules="[{ required: true, message: '请输入需求总量', trigger: ['blur','change'] }]"
                                style="margin: 0">
                    <el-input-number v-model="row.demandedQuantity"
                                     :min="0"
                                     :precision="2"
                                     :step="1"
                                     controls-position="right"
                                     style="width: 100%"
                                     :disabled="!dataValue.isEdit" />
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="unit"
                               label="单位"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item :prop="`dataList.${$index}.unit`"
                                :rules="[{ required: true, message: '请输入单位', trigger: ['blur','change'] }]"
                                style="margin: 0">
                    <el-input v-model="row.unit"
                              placeholder="请输入单位"
                              clearable
                              :disabled="!dataValue.isEdit" />
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column prop="diskQuantity"
                               label="盘数（盘）"
                               width="150">
                <template #default="{ row, $index }">
                  <el-form-item :prop="`dataList.${$index}.diskQuantity`"
                                :rules="[{ required: true, message: '请输入盘数', trigger: ['blur','change'] }]"
                                style="margin: 0">
                    <el-input-number v-model="row.diskQuantity"
                                     :min="0"
                                     :precision="0"
                                     :step="1"
                                     controls-position="right"
                                     style="width: 100%"
                                     :disabled="!dataValue.isEdit" />
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column label="操作">
                <template #default="{ row, $index }">
                  <el-button type="danger"
                             text
                             @click="dataValue.dataList.splice($index, 1)">删除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="产品编码" prop="productCode" />
      <el-table-column label="产品名称" prop="productName" />
      <el-table-column label="规格型号" prop="model" />
      <el-table-column label="单位" prop="unit" />
    </el-table>

    <product-select-dialog v-if="dataValue.showProductDialog"
                           v-model:model-value="dataValue.showProductDialog"
                           @confirm="handleProduct" />
@@ -187,8 +204,8 @@
      type: Boolean,
      default: false,
    },
    productModelId: {
      type: Number,
    record: {
      type: Object,
      required: true,
    },
  });
@@ -213,18 +230,27 @@
    isEdit: false,
  });

  const tableData = [
    {
      productName: props.record.productName,
      model: props.record.model,
      unit: props.record.unit,
      productCode: props.record.productCode,
    }
  ]

  const openDialog = index => {
    dataValue.currentRowIndex = index;
    dataValue.showProductDialog = true;
  };

  const fetchData = async () => {
    const { data } = await queryList(props.productModelId);
    const { data } = await queryList(props.record.id);
    dataValue.dataList = data;
  };

  const fetchProcessOptions = async () => {
    const { data } = await list(props.productModelId);
    const { data } = await list(props.record.id);
    dataValue.processOptions = data;
  };

@@ -245,7 +271,7 @@
        dataValue.loading = true;
        if (valid) {
          add({
            parentId: props.productModelId,
            parentId: props.record.id,
            productStructureList: dataValue.dataList || [],
          }).then(res => {
            ElMessage.success("保存成功");