Merge remote-tracking branch 'origin/dev_天津军泰伟业' into dev_天津军泰伟业

张诺

6 天以前 c8b65690b946b28b179796fbe2f020e732043c58

 src/views/productionManagement/productStructure/StructureEdit.vue

@@ -1,227 +1,207 @@
<template>
  <el-dialog
      v-model="visible"
  <el-dialog v-model="visible"
      title="结构"
      width="1200"
      close-on-click-modal
      @close="visible = false"
  >
    <el-button
        v-if="dataValue.isEdit"
             @close="visible = false">
    <el-button v-if="dataValue.isEdit"
        type="primary"
        @click="addItem"
        style="margin-bottom: 10px"
    >添加
               style="margin-bottom: 10px">添加
    </el-button>
    <el-button
        v-if="!dataValue.isEdit"
    <el-button v-if="!dataValue.isEdit"
        type="primary"
        @click="dataValue.isEdit = true"
        style="margin-bottom: 10px"
    >编辑
               style="margin-bottom: 10px">编辑
    </el-button>
    <el-button
        v-if="dataValue.isEdit"
    <el-button v-if="dataValue.isEdit"
        type="primary"
        @click="cancelEdit"
        style="margin-bottom: 10px"
    >取消
               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">
    <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"
            <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"
                          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" />
                         @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">
        <el-table-column prop="processId"
                         label="消耗工序"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item
                :prop="`dataList.${$index}.processId`"
            <el-form-item :prop="`dataList.${$index}.processId`"
                :rules="[{ required: true, message: '请选择消耗工序', trigger: 'change' }]"
                style="margin: 0"
            >
              <el-select
                  v-model="row.processId"
                          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"
                         :disabled="!dataValue.isEdit">
                <el-option v-for="item in dataValue.processOptions"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
                           :value="item.id" />
              </el-select>
            </el-form-item>
          </template>
        </el-table-column>

        <el-table-column prop="unitQuantity" label="单位产出所需数量" width="150">
        <el-table-column prop="unitQuantity"
                         label="单位产出所需数量"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item
                :prop="`dataList.${$index}.unitQuantity`"
            <el-form-item :prop="`dataList.${$index}.unitQuantity`"
                :rules="[{ required: true, message: '请输入单位产出所需数量', trigger: ['blur','change'] }]"
                style="margin: 0"
            >
              <el-input-number
                  v-model="row.unitQuantity"
                          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"
              />
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>

        <el-table-column prop="demandedQuantity" label="需求总量" width="150">
        <el-table-column prop="demandedQuantity"
                         label="需求总量"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item
                :prop="`dataList.${$index}.demandedQuantity`"
            <el-form-item :prop="`dataList.${$index}.demandedQuantity`"
                :rules="[{ required: true, message: '请输入需求总量', trigger: ['blur','change'] }]"
                style="margin: 0"
            >
              <el-input-number
                  v-model="row.demandedQuantity"
                          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"
              />
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>

        <el-table-column prop="unit" label="单位" width="150">
        <el-table-column prop="unit"
                         label="单位"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item
                :prop="`dataList.${$index}.unit`"
            <el-form-item :prop="`dataList.${$index}.unit`"
                :rules="[{ required: true, message: '请输入单位', trigger: ['blur','change'] }]"
                style="margin: 0"
            >
              <el-input
                  v-model="row.unit"
                          style="margin: 0">
              <el-input v-model="row.unit"
                  placeholder="请输入单位"
                  clearable
                  :disabled="!dataValue.isEdit"
              />
                        :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>

        <el-table-column prop="diskQuantity" label="盘数（盘）" width="150">
        <el-table-column prop="diskQuantity"
                         label="盘数（盘）"
                         width="150">
          <template #default="{ row, $index }">
            <el-form-item
                :prop="`dataList.${$index}.diskQuantity`"
            <el-form-item :prop="`dataList.${$index}.diskQuantity`"
                :rules="[{ required: true, message: '请输入盘数', trigger: ['blur','change'] }]"
                style="margin: 0"
            >
              <el-input-number
                  v-model="row.diskQuantity"
                          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"
              />
                               :disabled="!dataValue.isEdit" />
            </el-form-item>
          </template>
        </el-table-column>

        <el-table-column label="操作">
          <template #default="{ row, $index }">
            <el-button
                type="danger"
            <el-button type="danger"
                text
                @click="dataValue.dataList.splice($index, 1)"
            >删除
                       @click="dataValue.dataList.splice($index, 1)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>

    <product-select-dialog
        v-if="dataValue.showProductDialog"
    <product-select-dialog v-if="dataValue.showProductDialog"
        v-model:model-value="dataValue.showProductDialog"
        @confirm="handleProduct"/>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="visible = false">取消</el-button>
        <el-button type="primary" :loading="dataValue.loading" @click="submit" :disabled="!dataValue.isEdit">
        <el-button type="primary"
                   :loading="dataValue.loading"
                   @click="submit"
                   :disabled="!dataValue.isEdit">
          确认
        </el-button>
        <el-button @click="visible = false">取消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import {computed, defineAsyncComponent, defineComponent, onMounted, reactive, ref} from "vue";
import {queryList, add} from '@/api/productionManagement/productStructure.js'
import {list} from '@/api/productionManagement/productionProcess'
  import {
    computed,
    defineAsyncComponent,
    defineComponent,
    onMounted,
    reactive,
    ref,
  } from "vue";
  import { queryList, add } from "@/api/productionManagement/productStructure.js";
  import { list } from "@/api/productionManagement/productionProcess";
import {ElMessage} from "element-plus";


defineComponent({
  name: "StructureEdit",
})
  });

const ProductSelectDialog = defineAsyncComponent(() => import('@/views/basicData/product/ProductSelectDialog.vue'))
const form = ref()


  const ProductSelectDialog = defineAsyncComponent(
    () => import("@/views/basicData/product/ProductSelectDialog.vue")
  );
  const form = ref();

const props = defineProps({
  showModel: {
    type: Boolean,
    default: false
      default: false,
  },
  productModelId: {
    type: Number,
    required: true
  }
})
      required: true,
    },
  });

const emits = defineEmits(['update:showModel'])
  const emits = defineEmits(["update:showModel"]);
const visible = computed({
  get() {
    return props.showModel
      return props.showModel;
  },
  set(val) {
    emits('update:showModel', val)
  }
})
      emits("update:showModel", val);
    },
  });

const dataValue = reactive({
  dataList: [],
@@ -233,72 +213,73 @@
  isEdit: false,
});

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

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

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

const handleProduct = (row) => {
  const handleProduct = row => {
  if (row?.length > 1) {
    ElMessage.error('只能选择一个产品')
      ElMessage.error("只能选择一个产品");
  }
  dataValue.dataList[dataValue.currentRowIndex].productName = row[0].productName
  dataValue.dataList[dataValue.currentRowIndex].model = row[0].model
  dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id
  dataValue.showProductDialog = false
}
    dataValue.dataList[dataValue.currentRowIndex].productName =
      row[0].productName;
    dataValue.dataList[dataValue.currentRowIndex].model = row[0].model;
    dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id;
    dataValue.showProductDialog = false;
  };

const submit = () => {
  form.value.validate(valid => {
    dataValue.loading = true
    form.value
      .validate(valid => {
        dataValue.loading = true;
    if (valid) {
      add({
        parentId: props.productModelId,
        productStructureList: dataValue.dataList || []
            productStructureList: dataValue.dataList || [],
      }).then(res => {
        ElMessage.success('保存成功')
        visible.value = false
        dataValue.loading = false
      })
            ElMessage.success("保存成功");
            visible.value = false;
            dataValue.loading = false;
          });
    }
  }).finally(() => {
    dataValue.loading = false
  })
}
      .finally(() => {
        dataValue.loading = false;
      });
  };

const addItem = () => {
  dataValue.dataList.push({
    productName: '',
    productId: '',
      productName: "",
      productId: "",
    model: undefined,
    productModelId: undefined,
    processId: '',
      processId: "",
    unitQuantity: 0,
    demandedQuantity: 0,
    unit: '',
      unit: "",
    diskQuantity: 0,
  })
}
    });
  };

const cancelEdit = () => {
  dataValue.isEdit = false
  dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined)
}
    dataValue.isEdit = false;
    dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined);
  };

onMounted(() => {
  fetchData()
  fetchProcessOptions()
})


    fetchData();
    fetchProcessOptions();
  });
</script>