HIA24016N_PipeLineDemo.git

import { 
  ref, 
  onMounted, 
  reactive, 
  computed, 
  Ref, 
  watch, 
  SetupContext, 
  h, 
} from 'vue' 
import { injectModel } from '@/libs/Provider/Provider' 
import { WorkPlanDrawer } from '../Models/WorkPlanDrawer' 
import { ElMessage } from 'element-plus' 
import isEqual from 'lodash/isEqual' 
import { ConfirmBox } from '@/components/ConfirmBox/ConfirmBox' 
import { cloneDeep } from 'lodash' 
// 引入公共选项配置  
import {   
  BOOLEAN_OPTIONS_AddEdit  
} from '@/utils/commonOptionConstants';  
// 引入公共表单工具文件   
import { extractFormDataForOnConfirm,extractAndAssignFormData } from '@/utils/myformUtils';  
export const useWorkPlanDrawer = (props: any, ctx?: any) => { 
  const workPlanDrawer = injectModel<WorkPlanDrawer>('workPlanDrawer') 
  /** 
   * 用来对比的初始化数据 
   */ 
  const initiateData: Ref<Record<string, any>> = ref({}) 
  const formData = ref<Record<string, any>>({}) 
  // ref 
  const formRef = ref() 
 
  const disabled = ref(false) 
 
  const current = computed(() => { 
    return props.row || null 
  }) 
 
   
  const datePicker = (attrs) => { 
    return ( 
      <el-date-picker 
        type="date" 
        format="YYYY-MM-DD HH:mm:ss" 
        formatValue="YYYY-MM-DD HH:mm:ss" 
        {...attrs} 
      ></el-date-picker> 
    ) 
  } 
  const inputNumber = (attrs) => { 
    return ( 
      <el-input-number 
        min="1" 
        step="1" 
        precision="0" 
        {...attrs} 
      ></el-input-number> 
    ) 
  } 
 
  const dateTimePicker = (attrs) => { 
    return ( 
      <el-date-picker 
        type="datetime" 
        format="YYYY-MM-DD HH:mm:ss" 
        formatValue="YYYY-MM-DD HH:mm:ss" 
        {...attrs} 
      ></el-date-picker> 
    ) 
  } 
 
  const visible = computed({ 
    get() { 
      return props.modelValue 
    }, 
    set(val) { 
      ctx.emit('update:modelValue', val) 
    }, 
  }) 
  /** 
   * 添加的form字段 
   */ 
  const formItems = reactive([ 
                    { 
                   label: '任务编码', 
                   prop: 'taskCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入任务编码', 
              rules: [{required: true, message: '任务编码不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '管段编码', 
                   prop: 'pipeSpecCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入管段编码', 
                }, 
                { 
                   label: '管段名称', 
                   prop: 'pipeSectionName', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入管段名称', 
                }, 
                { 
                   label: '管段型号', 
                   prop: 'pipeSpecMode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入管段型号', 
                }, 
                { 
                   label: '工序名称', 
                   prop: 'processName', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入工序名称', 
                }, 
                { 
                   label: '船号', 
                   prop: 'shipNumber', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入船号', 
                }, 
                { 
                   label: '项目号', 
                   prop: 'projectNumber', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入项目号', 
                }, 
                { 
                   label: '计划状态', 
                   prop: 'workPlanStatus', 
                   el: 'select', 
                   clearable:true, 
                   options: [], 
                   //disabled: disabled, 
                   placeholder: '请输入计划状态', 
              rules: [{required: true, message: '计划状态不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '叫料状态', 
                   prop: 'callMaterialStatus', 
                   el: 'select', 
                   clearable:true, 
                   options: [], 
                   //disabled: disabled, 
                   placeholder: '请输入叫料状态', 
              rules: [{required: true, message: '叫料状态不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '工艺流向编号', 
                   prop: 'processRouteNumber', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入工艺流向编号', 
                }, 
                { 
                   label: '原料标识', 
                   prop: 'dataIdentifier', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入原料标识', 
                }, 
                { 
                   label: '原料型号', 
                   prop: 'materialMode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入原料型号', 
                }, 
                { 
                   label: '长度(mm)', 
                   prop: 'length', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入长度(mm)', 
              rules: [{required: true, message: '长度(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '打码内容', 
                   prop: 'markingContent', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入打码内容', 
                }, 
                { 
                   label: '打码位置', 
                   prop: 'markingPosition', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入打码位置', 
              rules: [{required: true, message: '打码位置不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '切割位置', 
                   prop: 'cuttingPosition', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入切割位置', 
              rules: [{required: true, message: '切割位置不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '管段数量', 
                   prop: 'quantity', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true, 
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 1,
                   precision: 0, 
                   //disabled: disabled, 
                   placeholder: '请输入管段数量', 
              rules: [{required: true, message: '管段数量不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '法兰厚度(mm)', 
                   prop: 'flangeThickness', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入法兰厚度(mm)', 
              rules: [{required: true, message: '法兰厚度(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '法兰直径(mm)', 
                   prop: 'flangeInnerDiameter', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入法兰直径(mm)', 
              rules: [{required: true, message: '法兰直径(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '法兰公称压力', 
                   prop: 'weldingHeatInput', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入法兰公称压力', 
                }, 
                { 
                   label: '法兰冲码内容', 
                   prop: 'pipeAllowableStress', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入法兰冲码内容', 
                }, 
                { 
                   label: '套管长度(mm)', 
                   prop: 'pipeDiameter', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入套管长度(mm)', 
              rules: [{required: true, message: '套管长度(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '套管直径(mm)', 
                   prop: 'pipeWallThickness', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入套管直径(mm)', 
              rules: [{required: true, message: '套管直径(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '工厂代码', 
                   prop: 'factoryCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入工厂代码', 
                }, 
                { 
                   label: '产品代码', 
                   prop: 'productCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入产品代码', 
                }, 
                { 
                   label: '工位代码', 
                   prop: 'workstationCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入工位代码', 
                }, 
                { 
                   label: '设备代码', 
                   prop: 'equipmentCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入设备代码', 
                }, 
                { 
                   label: '产线编码', 
                   prop: 'prodLineCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入产线编码', 
                }, 
                { 
                   label: '管件编码', 
                   prop: 'pipeFittingCode', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入管件编码', 
                }, 
                { 
                   label: '顺序号', 
                   prop: 'preSerialNumber', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入顺序号', 
                }, 
                { 
                   label: '外径(mm)', 
                   prop: 'outerDiameter', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入外径(mm)', 
              rules: [{required: true, message: '外径(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '壁厚(mm)', 
                   prop: 'thickness', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(inputNumber, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   step: 0.01,
                   precision: 2, 
                   //disabled: disabled, 
                   placeholder: '请输入壁厚(mm)', 
              rules: [{required: true, message: '壁厚(mm)不能为空', trigger: 'blur' }], 
                }, 
                { 
                   label: '材质', 
                   prop: 'material', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入材质', 
                }, 
                { 
                   label: '计划开始时间', 
                   prop: 'plannedStartTime', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(datePicker, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   //disabled: disabled, 
                   placeholder: '请输入计划开始时间', 
                }, 
                { 
                   label: '计划完成时间', 
                   prop: 'plannedEndTime', 
                   el: (props: any, { attrs }: SetupContext) => { 
                     return h(datePicker, {  
                       ...props,  
                       clearable: true,  
                       ...attrs,  
                     })  
                   },
                   width: '100%',
                   //disabled: disabled, 
                   placeholder: '请输入计划完成时间', 
                }, 
                { 
                   label: '班组信息', 
                   prop: 'teamInfo', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入班组信息', 
                }, 
                { 
                   label: '时间戳', 
                   prop: 'timestamp', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入时间戳', 
                }, 
                { 
                   label: '备注', 
                   prop: 'remark', 
                   el: 'input', 
                   //disabled: disabled, 
                   placeholder: '请输入备注', 
                },  
  ]) 
  /** 
   * 校验是否有数据变化 
   */ 
  const checkIsEqualObject = () => { 
    const data = { 
      formData: formData.value, 
    } 
    const check = isEqual(initiateData.value, data) 
    return check 
  } 
 
  const onClose = (done: () => void) => { 
    if (visible.value) { 
      if (checkIsEqualObject()) { 
        visible.value = false 
        done && done() 
      } else { 
        ConfirmBox('是否保存设置？') 
          .then(() => { 
            onConfirm() 
          }) 
          .catch(() => { 
            visible.value = false 
            done && done() 
          }) 
      } 
    } 
  } 
  /** 
   * 保存 
   */ 
  const onConfirm = async () => { 
    await formRef.value?.validate() 
    const data=extractFormDataForOnConfirm(formData); 
    if (!current.value) { 
      await workPlanDrawer.addWorkPlan(data) 
    } else { 
      const id = current.value.id 
      await workPlanDrawer.updateWorkPlan(id, data) 
    } 
    ElMessage.success('保存成功') 
    ctx.emit('confirm') 
  } 
 
  const updateCheckData = () => { 
    initiateData.value = { 
      formData: { 
        ...formData.value, 
      }, 
    } 
  } 
  const updateFormItemOptions = (propName: string, enumData: any[]) => { 
    const item = formItems.find((item) => item.prop === propName) 
    if (item && enumData) { 
      item.options = enumData.map((item) => ({ 
        label: item.description, 
        value: item.value, 
      })) 
    } 
  } 
  /** 
   * 通用查询枚举 
   */ 
  const commonQueryEnumForFrom = async () => { 
    const workPlanStatusEnumEnum = await workPlanDrawer.getWmsEnumData({ 
 EnumName: 'WorkPlanStatusEnum', 
}) 
updateFormItemOptions('workPlanStatus', workPlanStatusEnumEnum) 
const callMaterialStatusEnumEnum = await workPlanDrawer.getWmsEnumData({ 
 EnumName: 'CallMaterialStatusEnum', 
}) 
updateFormItemOptions('callMaterialStatus', callMaterialStatusEnumEnum) 
 
  } 
  commonQueryEnumForFrom() 
  /** 
   * 弹窗打开获取详情 
   */ 
  const onOpen = async () => { 
    if (current.value) { 
      const res = await workPlanDrawer.getWorkPlanDetail(current.value) 
 
      extractAndAssignFormData(res,formData); 
      disabled.value = true 
      updateCheckData() 
    } else { 
      formData.value = {} 
 
      disabled.value = false 
      updateCheckData() 
    } 
  } 
 
  watch(() => current.value, onOpen) 
 
  return { 
    formItems, 
    formData, 
    visible, 
    formRef, 
    onOpen, 
    onClose, 
    onConfirm, 
  } 
}