君歌 1.工序修改 2.销售报价重构

gaoluyang

2026-06-12 c9ed3d1958a2489460592b3b17e386d9d515d7ea

 src/views/productionManagement/productionProcess/Edit.vue

@@ -1,74 +1,95 @@
<template>
  <div>
    <el-dialog
        v-model="isShow"
        title="编辑工序"
        width="400"
        @close="closeModal"
    >
      <el-form label-width="140px" :model="formState" label-position="top" ref="formRef">
        <el-form-item
            label="工序名称："
            prop="name"
            :rules="[
                {
                required: true,
                message: '请输入工序名称',
              },
  <FormDialog
    v-model="isShow"
    title="编辑工序"
    width="800px"
    @confirm="handleSubmit"
    @cancel="closeModal"
  >
    <el-form label-width="180px" :model="formState" label-position="top" ref="formRef">
      <el-form-item
          label="部件："
          prop="name"
          :rules="[
              {
                max: 100,
                message: '最多100个字符',
              }
            ]">
          <el-input v-model="formState.name" />
        </el-form-item>
        <el-form-item label="工序编号" prop="no">
          <el-input v-model="formState.no"  />
        </el-form-item>
        <el-form-item
            label="工序类型"
            prop="type"
            :rules="[
                {
                required: true,
                message: '请选择工序类型',
              }
            ]"
        >
          <el-select v-model="formState.type" placeholder="请选择工序类型">
            <el-option label="计时" :value="0" />
            <el-option label="计件" :value="1" />
          </el-select>
        </el-form-item>
        <el-form-item label="工资定额" prop="salaryQuota">
          <el-input v-model="formState.salaryQuota" type="number" :step="0.001" />
        </el-form-item>
        <el-form-item label="是否质检" prop="isQuality">
          <el-switch v-model="formState.isQuality" :active-value="true" inactive-value="false"/>
        </el-form-item>
        <el-form-item label="是否入库" prop="inbound">
          <el-switch v-model="formState.inbound" :active-value="true" inactive-value="false"/>
        </el-form-item>
        <el-form-item label="是否报工" prop="reportWork">
          <el-switch v-model="formState.reportWork" :active-value="true" inactive-value="false"/>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="formState.remark" type="textarea" />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="handleSubmit">确认</el-button>
          <el-button @click="closeModal">取消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
              required: true,
              message: '请输入部件',
            },
            {
              max: 100,
              message: '最多100个字符',
            }
          ]">
        <el-input v-model="formState.name" />
      </el-form-item>
      <el-form-item label="工序编号" prop="no">
        <el-input v-model="formState.no"  />
      </el-form-item>
      <el-form-item
          label="工序类型"
          prop="processType"
          :rules="[
              {
              required: true,
              message: '请选择工序类型',
            }
          ]"
      >
        <el-select v-model="formState.processType" placeholder="请选择工序类型" style="width: 100%">
          <el-option v-for="item in processTypeOptions"
                     :key="item"
                     :label="item"
                     :value="item" />
        </el-select>
      </el-form-item>
      <el-form-item label="计划工时(小时)" prop="salaryQuota">
        <el-input v-model="formState.salaryQuota" type="number" :step="0.5" />
      </el-form-item>
      <el-form-item label="计划人员" prop="planPerson">
        <el-select v-model="formState.planPerson"
                   placeholder="请选择计划人员"
                   clearable
                   filterable
                   style="width: 100%">
          <el-option v-for="item in employeeOptions"
                     :key="item.id"
                     :label="item.staffName"
                     :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="计划执行人员" prop="executor">
        <el-select v-model="formState.executor"
                   placeholder="请选择计划执行人员"
                   clearable
                   filterable
                   style="width: 100%">
          <el-option v-for="item in employeeOptions"
                     :key="item.id"
                     :label="item.staffName"
                     :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="是否质检" prop="isQuality">
        <el-switch v-model="formState.isQuality" :active-value="true" inactive-value="false"/>
      </el-form-item>
      <el-form-item label="是否入库" prop="inbound">
        <el-switch v-model="formState.inbound" :active-value="true" inactive-value="false"/>
      </el-form-item>
      <el-form-item label="是否报工" prop="reportWork">
        <el-switch v-model="formState.reportWork" :active-value="true" inactive-value="false"/>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="formState.remark" type="textarea" />
      </el-form-item>
    </el-form>
  </FormDialog>
</template>

<script setup>
import { ref, computed, getCurrentInstance, watch } from "vue";
import {update} from "@/api/productionManagement/productionProcess.js";
import { ref, computed, getCurrentInstance, watch, onMounted } from "vue";
import { update } from "@/api/productionManagement/productionProcess.js";
import { staffOnJobListPage } from "@/api/personnelManagement/staffOnJob.js";
import FormDialog from "@/components/Dialog/FormDialog.vue";

const props = defineProps({
  visible: {
@@ -84,14 +105,26 @@

const emit = defineEmits(['update:visible', 'completed']);

// 响应式数据（替代选项式的 data）
const processTypeOptions = [
  "机加工",
  "刮板冷芯制作",
  "管路组对",
  "罐体连接及调试",
  "测试打压",
  "其他",
];

const employeeOptions = ref([]);

const formState = ref({
  id: props.record.id,
  name: props.record.name,
  type: props.record.type,
  no: props.record.no,
  processType: props.record.processType || '',
  remark: props.record.remark,
  salaryQuota: props.record.salaryQuota,
  planPerson: props.record.planPerson || null,
  executor: props.record.executor || null,
  isQuality: props.record.isQuality,
  inbound: props.record.inbound,
  reportWork: props.record.reportWork,
@@ -106,16 +139,17 @@
  },
});

// 监听 record 变化，更新表单数据
watch(() => props.record, (newRecord) => {
  if (newRecord && isShow.value) {
    formState.value = {
      id: newRecord.id,
      name: newRecord.name || '',
      no: newRecord.no || '',
      type: newRecord.type,
      processType: newRecord.processType || '',
      remark: newRecord.remark || '',
      salaryQuota: newRecord.salaryQuota || '',
      planPerson: newRecord.planPerson || null,
      executor: newRecord.executor || null,
      isQuality: props.record.isQuality,
      inbound: newRecord.inbound,
      reportWork: newRecord.reportWork,
@@ -123,16 +157,17 @@
  }
}, { immediate: true, deep: true });

// 监听弹窗打开，重新初始化表单数据
watch(() => props.visible, (visible) => {
  if (visible && props.record) {
    formState.value = {
      id: props.record.id,
      name: props.record.name || '',
      no: props.record.no || '',
      type: props.record.type,
      processType: props.record.processType || '',
      remark: props.record.remark || '',
      salaryQuota: props.record.salaryQuota || '',
      planPerson: props.record.planPerson || null,
      executor: props.record.executor || null,
      isQuality: props.record.isQuality,
      inbound: props.record.inbound,
      reportWork: props.record.reportWork,
@@ -150,9 +185,7 @@
  proxy.$refs["formRef"].validate(valid => {
    if (valid) {
      update(formState.value).then(res => {
        // 关闭模态框
        isShow.value = false;
        // 告知父组件已完成
        emit('completed');
        proxy.$modal.msgSuccess("提交成功");
      })
@@ -160,6 +193,19 @@
  })
};

const loadEmployees = async () => {
  try {
    const res = await staffOnJobListPage({ current: -1, size: -1, staffState: 1 });
    employeeOptions.value = res.data?.records || [];
  } catch (error) {
    console.error("加载员工列表失败", error);
  }
};

onMounted(() => {
  loadEmployees();
});

defineExpose({
  closeModal,
  handleSubmit,