liuying
2024-11-29 824a8449937515bf2ea9eff889e8dab454aa5be0
LA24030_LuLiPackageLine_Web/src/views/main/WmsOrder/mes_Order_Gather/component/editDialog.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,211 @@
<template>
   <div class="mes_Order_Gather-container">
      <el-dialog v-model="isShowDialog" :width="800" draggable="" :close-on-click-modal="false">
         <template #header>
            <div style="color: #fff">
               <!--<el-icon size="16" style="margin-right: 3px; display: inline; vertical-align: middle"> <ele-Edit /> </el-icon>-->
               <span>{{ props.title }}</span>
            </div>
         </template>
         <el-form :model="ruleForm" ref="ruleFormRef" label-width="auto" :rules="rules" v-loading="loading">
            <el-row :gutter="35">
               <el-form-item v-show="false">
                  <el-input v-model="ruleForm.id" />
               </el-form-item>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="生产单号" prop="info5">
                     <el-input v-model="ruleForm.info5" placeholder="请输入生产单号" maxlength="60" show-word-limit clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="批次号" prop="planNo">
                     <el-input v-model="ruleForm.planNo" placeholder="请输入批次号" maxlength="50" show-word-limit clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="订单号" prop="orderId">
                     <el-input v-model="ruleForm.orderId" placeholder="请输入订单号" maxlength="50" show-word-limit clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="是否齐套" prop="isKitting">
                     <el-switch v-model="ruleForm.isKitting" active-text="是" inactive-text="否" />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="包数" prop="packageNum">
                     <el-input-number v-model="ruleForm.packageNum" placeholder="请输入包数" clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="已下线包数" prop="unLinePackageNum">
                     <el-input-number v-model="ruleForm.unLinePackageNum" placeholder="请输入已下线包数" clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="未下线包数" prop="noUnLinePackageNum">
                     <el-input-number v-model="ruleForm.noUnLinePackageNum" placeholder="请输入未下线包数" clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="总包装面积" prop="allPackageArea">
                     <el-input v-model="ruleForm.allPackageArea" placeholder="请输入总包装面积" maxlength="18" show-word-limit clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="已扫描包装面积" prop="scanPackageArea">
                     <el-input v-model="ruleForm.scanPackageArea" placeholder="请输入已扫描包装面积" maxlength="18" show-word-limit clearable />
                  </el-form-item>
               </el-col>
               <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                  <el-form-item label="未扫描包装面积" prop="noScanPackageArea">
                     <el-input v-model="ruleForm.noScanPackageArea" placeholder="请输入未扫描包装面积" maxlength="18" show-word-limit clearable />
                  </el-form-item>
               </el-col>
            </el-row>
         </el-form>
         <template #footer>
            <span class="dialog-footer">
               <el-button @click="cancel">取 æ¶ˆ</el-button>
               <el-button type="primary" @click="submit" :disabled="disabled_btn">ç¡® å®š</el-button>
            </span>
         </template>
      </el-dialog>
   </div>
</template>
<style scoped>
:deep(.el-select),
:deep(.el-input-number) {
   width: 100%;
}
</style>
<script lang="ts" setup>
   import { ref,onMounted } from "vue";
   import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
   import { ElMessage } from "element-plus";
   import type { FormRules } from "element-plus";
   import { addMes_Order_Gather, updateMes_Order_Gather, detailMes_Order_Gather } from "/@/api/main/WmsOrder/mes_Order_Gather";
   //父级传递来的参数
   var props = defineProps({
      title: {
      type: String,
      default: "",
   },
   });
   //父级传递来的函数,用于回调
   const emit = defineEmits(["reloadTable"]);
   const ruleFormRef = ref();
   const isShowDialog = ref(false);
   const loading = ref(false);
   const disabled_btn = ref(false);
   const ruleForm = ref<any>({});
   //自行添加其他规则
   const rules = ref<FormRules>({
      planNo: [{required: true, message: '请输入批次号!', trigger: 'blur',},],
      orderId: [{required: true, message: '请输入订单号!', trigger: 'blur',},],
      packageNum: [{required: true, message: '请输入包数!', trigger: 'blur',},],
      unLinePackageNum: [{required: true, message: '请输入已下线包数!', trigger: 'blur',},],
      noUnLinePackageNum: [{required: true, message: '请输入未下线包数!', trigger: 'blur',},],
      allPackageArea: [{required: true, message: '请输入总包装面积!', trigger: 'blur',},],
      scanPackageArea: [{required: true, message: '请输入已扫描包装面积!', trigger: 'blur',},],
      noScanPackageArea: [{required: true, message: '请输入未扫描包装面积!', trigger: 'blur',},],
      isDelete: [{required: true, message: '请选择软删除!', trigger: 'change',},],
   });
   /*
    * æ‰“开弹窗
    * @param flag æ ‡è®°ï¼ˆ1新增 2编辑 3查看)
    * @param row  è¡Œæ•°æ®
    */
   const openDialog = async (flag: number,row: any) => {
      // ruleForm.value = JSON.parse(JSON.stringify(row));
      // æ”¹ç”¨detail获取最新数据来编辑
      let rowData = JSON.parse(JSON.stringify(row));
      if (rowData.id)
         ruleForm.value = (await detailMes_Order_Gather(rowData.id)).data.result;
      else {
          ruleForm.value = rowData;
      }
      isShowDialog.value = true;
   };
   // å…³é—­å¼¹çª—
   const closeDialog = () => {
      emit("reloadTable");
      isShowDialog.value = false;
   };
   // å–消
   const cancel = () => {
      isShowDialog.value = false;
   };
   // æäº¤
   const submit = async () => {
       disabled_btn.value = true;
      ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
         if (isValid) {
             loading.value = true;
            let values = ruleForm.value;
            let ret={};
            let title='新增';
            if (ruleForm.value.id == undefined || ruleForm.value.id == null || ruleForm.value.id == "" || ruleForm.value.id == 0) {
               ret = await addMes_Order_Gather(values);
            } else {
               title='编辑';
               ret = await updateMes_Order_Gather(values);
            }
            loading.value = false;
            disabled_btn.value = false;
            if(ret.data.type=="success"){
               ElMessage.success(title+'成功');
               closeDialog();
            }
         } else {
             disabled_btn.value = false;
            ElMessage({
               message: `表单有${Object.keys(fields).length}处验证失败,请修改后再提交`,
               type: "error",
            });
         }
      });
   };
   // é¡µé¢åŠ è½½æ—¶
   onMounted(async () => {
   });
   //将属性或者函数暴露给父组件
   defineExpose({ openDialog });
</script>