gaoluyang
11 小时以前 07f9f8657d057a38792c3822acc9b08d83478967
src/views/productionManagement/productionOrder/New.vue
@@ -1,14 +1,14 @@
<template>
  <div>
    <el-dialog
        v-model="isShow"
    <el-dialog v-model="isShow"
        title="新增生产订单"
        width="800"
        @close="closeModal"
    >
      <el-form label-width="140px" :model="formState" label-position="top" ref="formRef">
        <el-form-item
            label="产品名称"
               @close="closeModal">
      <el-form label-width="140px"
               :model="formState"
               label-position="top"
               ref="formRef">
        <el-form-item label="产品名称"
            prop="productModelId"
            :rules="[
                {
@@ -16,29 +16,24 @@
                message: '请选择产品',
                trigger: 'change',
              }
            ]"
        >
          <el-button type="primary" @click="showProductSelectDialog = true">
            ]">
          <el-button type="primary"
                     @click="showProductSelectDialog = true">
            {{ formState.productName ? formState.productName : '选择产品' }}
          </el-button>
        </el-form-item>
        <el-form-item
            label="规格"
            prop="productModelName"
        >
          <el-input v-model="formState.productModelName"  disabled />
        <el-form-item label="规格"
                      prop="productModelName">
          <el-input v-model="formState.productModelName"
                    disabled />
        </el-form-item>
        <el-form-item
            label="单位"
            prop="unit"
        >
          <el-input v-model="formState.unit"  disabled />
        <el-form-item label="单位"
                      prop="unit">
          <el-input v-model="formState.unit"
                    disabled />
        </el-form-item>
        <el-form-item label="工艺路线">
          <el-select v-model="formState.routeId"
          <el-select v-model="formState.technologyRoutingId"
                     placeholder="请选择工艺路线"
                     style="width: 100%;"
                     :loading="bindRouteLoading">
@@ -48,24 +43,30 @@
                       :value="item.id" />
          </el-select>
        </el-form-item>
        <el-form-item
            label="需求数量"
            prop="quantity"
        >
          <el-input-number v-model="formState.quantity" :step="1" :min="1" style="width: 100%" />
        <el-form-item label="需求数量"
                      prop="quantity">
          <el-input-number v-model="formState.quantity"
                           :step="1"
                           :min="0"
                           style="width: 100%" />
        </el-form-item>
        <el-form-item label="计划完成时间"
                      prop="planCompleteTime">
          <el-date-picker v-model="formState.planCompleteTime"
                          type="date"
                          placeholder="选择日期"
                          value-format="YYYY-MM-DD"
                          style="width: 100%" />
        </el-form-item>
      </el-form>
      <!-- 产品选择弹窗 -->
      <ProductSelectDialog
          v-model="showProductSelectDialog"
      <ProductSelectDialog v-model="showProductSelectDialog"
          @confirm="handleProductSelect"
          single
      />
                           single />
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleSubmit">确认</el-button>
          <el-button type="primary"
                     @click="handleSubmit">确认</el-button>
          <el-button @click="closeModal">取消</el-button>
        </div>
      </template>
@@ -76,8 +77,11 @@
<script setup>
import {ref, computed, getCurrentInstance} from "vue";
import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
import {addProductOrder, listProcessRoute} from "@/api/productionManagement/productionOrder.js";
  import {
    addProductOrder,
    listProcessRoute,
  } from "@/api/productionManagement/productionOrder.js";
  import { listPage } from "@/api/productionManagement/processRoute.js";
const props = defineProps({
  visible: {
    type: Boolean,
@@ -87,21 +91,22 @@
  type: {
    type: String,
    required: true,
    default: 'qualified',
      default: "qualified",
  },
});
const emit = defineEmits(['update:visible', 'completed']);
  const emit = defineEmits(["update:visible", "completed"]);
// 响应式数据(替代选项式的 data)
const formState = ref({
  productId: undefined,
  productModelId: undefined,
  routeId: undefined,
    technologyRoutingId: undefined,
  productName: "",
  productModelName: "",
  unit: "",
  quantity: 0,
    planCompleteTime: "",
});
const isShow = computed({
@@ -109,29 +114,31 @@
    return props.visible;
  },
  set(val) {
    emit('update:visible', val);
      emit("update:visible", val);
  },
});
const showProductSelectDialog = ref(false);
let { proxy } = getCurrentInstance()
  let { proxy } = getCurrentInstance();
const closeModal = () => {
  // 重置表单数据
  formState.value = {
    productId: undefined,
    productModelId: undefined,
    routeId: undefined,
      technologyRoutingId: undefined,
    productName: "",
    productModelName: "",
    quantity: '',
      unit: "",
      quantity: "",
      planCompleteTime: "",
  };
  isShow.value = false;
};
// 产品选择处理
const handleProductSelect = async (products) => {
  const handleProductSelect = async products => {
  if (products && products.length > 0) {
    const product = products[0];
    formState.value.productId = product.productId;
@@ -142,22 +149,24 @@
    showProductSelectDialog.value = false;
    fetchRouteOptions( product.id);
    // 触发表单验证更新
    proxy.$refs["formRef"]?.validateField('productModelId');
      proxy.$refs["formRef"]?.validateField("productModelId");
  }
};
const routeOptions = ref([]);
const bindRouteLoading = ref(false);
const fetchRouteOptions = (productModelId) => {
  formState.value.routeId = undefined;
  routeOptions.value = []
  const fetchRouteOptions = productModelId => {
    formState.value.technologyRoutingId = undefined;
    routeOptions.value = [];
  bindRouteLoading.value = true;
  listProcessRoute({ productModelId: productModelId }).then(res => {
    routeOptions.value = res.data || [];
  }).finally(() => {
    bindRouteLoading.value = false;
    listPage({ productModelId: productModelId })
      .then(res => {
        routeOptions.value = res.data.records || [];
  })
}
      .finally(() => {
        bindRouteLoading.value = false;
      });
  };
const handleSubmit = () => {
  proxy.$refs["formRef"].validate(valid => {
@@ -171,18 +180,21 @@
        proxy.$modal.msgError("请选择规格");
        return;
      }
        if (formState.value.quantity <= 0) {
          proxy.$modal.msgError("需求数量必须大于0");
          return;
        }
      addProductOrder(formState.value).then(res => {
        // 关闭模态框
        isShow.value = false;
        // 告知父组件已完成
        emit('completed');
          emit("completed");
        proxy.$modal.msgSuccess("提交成功");
      })
        });
    }
  })
    });
};
defineExpose({
  closeModal,