HIA24016N_PipeLineDemo.git

import {
  ref,
  onMounted,
  reactive,
  computed,
  Ref,
  watch,
  SetupContext,
  h,
} from 'vue'
import { injectModel } from '@/libs/Provider/Provider'
import { WmsMaterialStockDrawer } from '../Models/WmsMaterialStockDrawer'
import { ElMessage } from 'element-plus'
import isEqual from 'lodash/isEqual'
import { ConfirmBox } from '@/components/ConfirmBox/ConfirmBox'
import { cloneDeep } from 'lodash'
import {
  getAreaAreaDataList,
  getWmsEnumData,
} from '@/widgets/HIAWms/Models/Service/WmsMaterialDrawer'
 
export const useWmsMaterialStockDrawer = (props: any, ctx?: any) => {
  const wmsMaterialStockDrawer = injectModel<WmsMaterialStockDrawer>(
    'wmsMaterialStockDrawer'
  )
  /**
   * 用来对比的初始化数据
   */
  const initiateData: Ref<Record<string, any>> = ref({})
  const formData = ref<Record<string, any>>({})
  // ref
  const formRef = ref()
 
  const inputNumber = (attrs) => {
    return (
      <el-input-number
        min="1"
        step="1"
        precision="0"
        {...attrs}
      ></el-input-number>
    )
  }
  const datePicker = (attrs) => {
    return (
      <el-date-picker
        type="datetime"
        format="YYYY-MM-DD HH:mm:ss"
        {...attrs}
      ></el-date-picker>
    )
  }
 
  const current = computed(() => {
    return props.row || null
  })
  const visible = computed({
    get() {
      return props.modelValue
    },
    set(val) {
      ctx.emit('update:modelValue', val)
    },
  })
  /**
   * 添加的form字段
   */
  const formItems = reactive([
    // 基础信息
    {
      label: '物料编号',
      prop: 'materialNo',
      el: 'input',
      placeholder: '请输入物料编号',
      rules: [
        { required: true, message: '物料编号不能为空', trigger: 'blur' },
        { max: 50, message: '长度不能超过50个字符', trigger: 'blur' },
      ],
    },
    {
      label: '物料名称',
      prop: 'materialName',
      el: 'input',
      placeholder: '请输入物料名称',
      rules: [
        { required: true, message: '物料名称不能为空', trigger: 'blur' },
        { max: 100, message: '长度不能超过100个字符', trigger: 'blur' },
      ],
    },
    // 容器信息
    {
      label: '容器编号',
      prop: 'containerNo',
      el: 'input',
      placeholder: '请输入容器编号',
      rules: [
        { required: true, message: '物料编号不能为空', trigger: 'blur' },
        { max: 50, message: '长度不能超过50个字符', trigger: 'blur' },
      ],
    },
    // 库存信息
    {
      label: '库存数量',
      prop: 'stockNumber',
      el: (props: any, { attrs }: SetupContext) => {
        return h(inputNumber, {
          ...props,
          clearable: true,
          ...attrs,
        })
      },
      width: '100%',
      placeholder: '请输入库存数量',
      rules: [{ required: true, message: '请输入库存数量', trigger: 'blur' }],
    },
    {
      label: '物料批次',
      prop: 'materialBatch',
      el: 'input',
      placeholder: '请输入物料批次号',
      rules: [
        { required: true, message: '物料批次不能为空', trigger: 'blur' },
        { max: 50, message: '长度不能超过50个字符', trigger: 'blur' },
      ],
    },
 
    {
      label: '库位编号',
      prop: 'placeNo',
      el: 'input',
      placeholder: '请输入库位编号',
      rules: [
        { required: true, message: '库位编号不能为空', trigger: 'blur' },
        { max: 50, message: '长度不能超过50个字符', trigger: 'blur' },
      ],
    },
    // 状态信息
    {
      label: '检验状态',
      prop: 'checkStatus',
      el: 'select',
      options: [],
      placeholder: '请选择检验状态',
    },
    {
      label: '是否锁定',
      prop: 'isLock',
      el: 'select',
      options: [],
      placeholder: '请选择锁定状态',
    },
    {
      label: '是否空托',
      prop: 'emptyContainer',
      el: 'select',
      options: [],
      placeholder: '请选择空托状态',
    },
    // 时间信息
 
    {
      label: '入库时间',
      prop: 'inStockTime',
      el: (props: any, { attrs }: SetupContext) => {
        return h(datePicker, {
          ...props,
          clearable: true,
          ...attrs,
        })
      },
      width: '100%',
      placeholder: '请输入操作时间',
    },
    {
      label: '备注',
      prop: 'remark',
      el: 'input',
      type: 'textarea',
      placeholder: '请输入备注信息',
      rules: [{ max: 500, message: '长度不能超过500个字符', trigger: 'blur' }],
    },
  ])
  /**
   * 校验是否有数据变化
   */
  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 = {
      materialNo: formData.value.materialNo,
      materialName: formData.value.materialName,
      containerNo: formData.value.containerNo,
      stockNumber: formData.value.stockNumber,
      materialBatch: formData.value.materialBatch,
      placeNo: formData.value.placeNo,
      checkStatus: formData.value.checkStatus,
      isLock: formData.value.isLock,
      emptyContainer: formData.value.emptyContainer,
      inStockTime: formData.value.inStockTime,
      remark: formData.value.remark,
      sort: props.sort,
    }
    if (!current.value) {
      await wmsMaterialStockDrawer.addWmsMaterialStock(data)
    } else {
      const id = current.value.id
      await wmsMaterialStockDrawer.updateWmsMaterialStock(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 updateFormAreaOptions = (propName: string, enumData: any[]) => {
    const item = formItems.find((item) => item.prop === propName)
    if (item && enumData) {
      item.options = enumData.map((item) => ({
        label: item.areaName,
        value: item.areaNo,
      }))
    }
  }
  /**
   * 弹窗打开获取详情
   */
  const onOpen = async () => {
    const containerTypeEnum = await getWmsEnumData({
      EnumName: 'ContainerTypeEnum',
    })
    updateFormItemOptions('containerType', containerTypeEnum)
 
    const containerStatusEnum = await getWmsEnumData({
      EnumName: 'ContainerStatusEnum',
    })
    updateFormItemOptions('containerStatus', containerStatusEnum)
    const placeStatusData = await getWmsEnumData({
      EnumName: 'PlaceStatusEnum',
    })
 
    updateFormItemOptions('placeStatus', placeStatusData)
    const storageTypeNoData = await getWmsEnumData({
      EnumName: 'PlaceTypeEnum',
    })
    updateFormItemOptions('storageTypeNo', storageTypeNoData)
 
    const checkStatusList = await getWmsEnumData({
      EnumName: 'MaterialCheckStatusEnum',
    })
    updateFormItemOptions('checkStatus', checkStatusList)
 
    const yesNoData = await getWmsEnumData({
      EnumName: 'YesNoEnum',
    })
    updateFormItemOptions('isLock', yesNoData)
    updateFormItemOptions('emptyContainer', yesNoData)
 
    const areaList = await getAreaAreaDataList()
    updateFormAreaOptions('areaCode', areaList)
 
    if (current.value) {
      console.log(current.value.materialNo)
      const data = await wmsMaterialStockDrawer.getWmsMaterialStockDetail(
        current.value
      )
      const res = data?.items[0]
      formData.value = {
        materialNo: res.materialNo,
        materialName: res.materialName,
        containerNo: res.containerNo,
        stockNumber: res.stockNumber,
        materialBatch: res.materialBatch,
        placeNo: res.placeNo,
        checkStatus: res.checkStatus,
        isLock: res.isLock,
        emptyContainer: res.emptyContainer,
        inStockTime: res.inStockTime,
        remark: res.remark,
        id: res.id,
      }
      updateCheckData()
    } else {
      formData.value = {
        isLock: 0,
        emptyContainer: 0,
        inStockTime: new Date(),
      }
      updateCheckData()
    }
  }
 
  watch(() => current.value, onOpen)
 
  return {
    formItems,
    formData,
    visible,
    formRef,
    onOpen,
    onClose,
    onConfirm,
  }
}