合并代码

gaoluyang

7 小时以前 07f9f8657d057a38792c3822acc9b08d83478967

 src/views/inventoryManagement/stockManagement/New.vue

@@ -1,71 +1,90 @@
<template>
  <div>
    <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="产品名称"
            prop="productModelId"
            :rules="[
    <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="产品名称"
                      prop="productModelId"
                      :rules="[
                {
                required: true,
                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="库存数量"
            prop="qualitity"
        >
          <el-input-number v-model="formState.qualitity" :step="1" :min="1" style="width: 100%" />
        <el-form-item label="库存类型"
                      prop="type"
                      :rules="[
                {
                required: true,
                message: '请选择库存类型',
                trigger: 'change',
              }
            ]">
          <el-select v-model="formState.type"
                     placeholder="请选择库存类型">
            <el-option label="合格库存"
                       value="qualified" />
            <el-option label="不合格库存"
                       value="unqualified" />
          </el-select>
        </el-form-item>

        <el-form-item
            v-if="type === 'qualified'"
            label="库存预警数量"
            prop="warnNum"
        >
          <el-input-number v-model="formState.warnNum" :step="1" :min="0" :max="formState.qualitity" style="width: 100%" />
        <el-form-item label="库存数量"
                      prop="qualitity">
          <el-input-number v-model="formState.qualitity"
                           :step="1"
                           :min="1"
                           style="width: 100%" />
        </el-form-item>

        <el-form-item label="备注" prop="remark">
          <el-input v-model="formState.remark" type="textarea" />
        <el-form-item label="批号"
                      prop="batchNo">
          <el-input v-model="formState.batchNo"
                    placeholder="请输入批号" />
        </el-form-item>
        <el-form-item v-if="formState.type === 'qualified'"
                      label="库存预警数量"
                      prop="warnNum">
          <el-input-number v-model="formState.warnNum"
                           :step="1"
                           :min="0"
                           :max="formState.qualitity"
                           style="width: 100%" />
        </el-form-item>
        <el-form-item label="备注"
                      prop="remark">
          <el-input v-model="formState.remark"
                    type="textarea" />
        </el-form-item>
      </el-form>

      <!-- 产品选择弹窗 -->
      <ProductSelectDialog
          v-model="showProductSelectDialog"
          @confirm="handleProductSelect"
          single
      />
      <ProductSelectDialog v-model="showProductSelectDialog"
                           @confirm="handleProductSelect"
                           :top-product-parent-id="props.topProductParentId"
                           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>
@@ -74,116 +93,131 @@
</template>

<script setup>
import {ref, computed, getCurrentInstance} from "vue";
import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
import {createStockInventory} from "@/api/inventoryManagement/stockInventory.js";
import {createStockUnInventory} from "@/api/inventoryManagement/stockUninventory.js";
  import { ref, computed, watch, getCurrentInstance } from "vue";
  import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue";
  import { addStockInRecordOnly } from "@/api/inventoryManagement/stockInventory.js";
  import { createStockUnInventory } from "@/api/inventoryManagement/stockUninventory.js";

const props = defineProps({
  visible: {
    type: Boolean,
    required: true,
  },
  const props = defineProps({
    visible: {
      type: Boolean,
      required: true,
    },
    topProductParentId: {
      type: Number,
      default: undefined,
      required: false,
    },
  });

  type: {
    type: String,
    required: true,
    default: 'qualified',
  },
});
  const emit = defineEmits(["update:visible", "completed"]);

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

// 响应式数据（替代选项式的 data）
const formState = ref({
  productId: undefined,
  productModelId: undefined,
  productName: "",
  productModelName: "",
  unit: "",
  qualitity: 0,
  warnNum: 0,
  remark: '',
});

const isShow = computed({
  get() {
    return props.visible;
  },
  set(val) {
    emit('update:visible', val);
  },
});

const showProductSelectDialog = ref(false);

let { proxy } = getCurrentInstance()

const closeModal = () => {
  // 重置表单数据
  formState.value = {
  // 响应式数据（替代选项式的 data）
  const formState = ref({
    productId: undefined,
    productModelId: undefined,
    productName: "",
    productModelName: "",
    description: '',
  };
  isShow.value = false;
};
    unit: "",
    type: undefined,
    qualitity: 0,
    batchNo: null,
    warnNum: 0,
    remark: "",
  });

// 产品选择处理
const handleProductSelect = async (products) => {
  if (products && products.length > 0) {
    const product = products[0];
    formState.value.productId = product.productId;
    formState.value.productName = product.productName;
    formState.value.productModelName = product.model;
    formState.value.productModelId = product.id;
    formState.value.unit = product.unit;
    showProductSelectDialog.value = false;
    // 触发表单验证更新
    proxy.$refs["formRef"]?.validateField('productModelId');
  }
};
  const isShow = computed({
    get() {
      return props.visible;
    },
    set(val) {
      emit("update:visible", val);
    },
  });

const handleSubmit = () => {
  proxy.$refs["formRef"].validate(valid => {
    if (valid) {
      // 验证是否选择了产品和规格
      if (!formState.value.productModelId) {
        proxy.$modal.msgError("请选择产品");
        return;
      }
      if (!formState.value.productModelId) {
        proxy.$modal.msgError("请选择规格");
        return;
      }
      if (props.type === 'qualified') {
        createStockInventory(formState.value).then(res => {
          // 关闭模态框
          isShow.value = false;
          // 告知父组件已完成
          emit('completed');
          proxy.$modal.msgSuccess("提交成功");
        })
      } else {
        createStockUnInventory(formState.value).then(res => {
          // 关闭模态框
          isShow.value = false;
          // 告知父组件已完成
          emit('completed');
          proxy.$modal.msgSuccess("提交成功");
        })
      }
  const showProductSelectDialog = ref(false);

  // 批号为空时转为 null
  watch(
    () => formState.value.batchNo,
    val => {
      if (val === "") {
        formState.value.batchNo = null;
      }
    }
  })
};
  );

  let { proxy } = getCurrentInstance();

defineExpose({
  closeModal,
  handleSubmit,
  isShow,
});
  const closeModal = () => {
    // 重置表单数据
    formState.value = {
      productId: undefined,
      productModelId: undefined,
      productName: "",
      productModelName: "",
      unit: "",
      type: undefined,
      qualitity: 0,
      batchNo: null,
      warnNum: 0,
      remark: "",
    };
    isShow.value = false;
  };

  // 产品选择处理
  const handleProductSelect = async products => {
    if (products && products.length > 0) {
      const product = products[0];
      formState.value.productId = product.productId;
      formState.value.productName = product.productName;
      formState.value.productModelName = product.model;
      formState.value.productModelId = product.id;
      formState.value.unit = product.unit;
      showProductSelectDialog.value = false;
      // 触发表单验证更新
      proxy.$refs["formRef"]?.validateField("productModelId");
    }
  };

  const handleSubmit = () => {
    proxy.$refs["formRef"].validate(valid => {
      if (valid) {
        // 验证是否选择了产品和规格
        if (!formState.value.productModelId) {
          proxy.$modal.msgError("请选择产品");
          return;
        }
        if (!formState.value.productModelId) {
          proxy.$modal.msgError("请选择规格");
          return;
        }
        if (formState.value.type === "qualified") {
          addStockInRecordOnly(formState.value).then(res => {
            // 关闭模态框
            isShow.value = false;
            // 告知父组件已完成
            emit("completed");
            proxy.$modal.msgSuccess("提交成功");
          });
        } else {
          formState.value.warnNum = 0;
          createStockUnInventory(formState.value).then(res => {
            // 关闭模态框
            isShow.value = false;
            // 告知父组件已完成
            emit("completed");
            proxy.$modal.msgSuccess("提交成功");
          });
        }
      }
    });
  };

  defineExpose({
    closeModal,
    handleSubmit,
    isShow,
  });
</script>