import {
|
ref,
|
onMounted,
|
reactive,
|
computed,
|
Ref,
|
watch,
|
SetupContext,
|
h,
|
} from 'vue'
|
import { injectModel } from '@/libs/Provider/Provider'
|
import { WmsAreaDrawer } from '../Models/WmsAreaDrawer'
|
import { ElMessage } from 'element-plus'
|
import isEqual from 'lodash/isEqual'
|
import { ConfirmBox } from '@/components/ConfirmBox/ConfirmBox'
|
import { cloneDeep } from 'lodash'
|
// 引入公共选项配置
|
import {
|
FILTER_MODE_OPTIONS_STRING,
|
FILTER_MODE_OPTIONS_NUM,
|
FILTER_MODE_OPTIONS_BOOL,
|
} from '@/components/DyFormForHighQuery/DyFormForHighQueryOptions'
|
import { BOOLEAN_OPTIONS } from '@/utils/commonOptionConstants'
|
import { getStoreDataList } from '@/widgets/HIAWms/Models/Service/WmsMaterialDrawer'
|
|
export const useWmsAreaQueryDrawer = (props: any, ctx?: any) => {
|
const wmsAreaDrawer = injectModel<WmsAreaDrawer>('WmsAreaDrawer')
|
/**
|
* 用来对比的初始化数据
|
*/
|
const initiateData: Ref<Record<string, any>> = ref({})
|
const formData = ref<Record<string, any>>({})
|
// ref
|
const formRef = ref()
|
const storeList = ref([])
|
const disabled = ref(false)
|
|
const current = computed(() => {
|
return props.row || null
|
})
|
|
const inputNumber = (attrs) => {
|
return (
|
<el-input-number
|
min="1"
|
step="1"
|
precision="0"
|
{...attrs}
|
></el-input-number>
|
)
|
}
|
|
const datePickerRange = (attrs) => {
|
return (
|
<el-date-picker
|
type="daterange"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
{...attrs}
|
></el-date-picker>
|
)
|
}
|
|
const dateTimePickerRange = (attrs) => {
|
return (
|
<el-date-picker
|
type="datetimerange"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
{...attrs}
|
></el-date-picker>
|
)
|
}
|
|
const visible = computed({
|
get() {
|
return props.modelValue
|
},
|
set(val) {
|
ctx.emit('update:modelValue', val)
|
},
|
})
|
/**
|
* 高级查询的form字段
|
*/
|
const formItems = reactive([
|
{
|
label: '库区编号',
|
prop: 'areaNo',
|
el: 'input',
|
//disabled: disabled,
|
placeholder: '请输入库区编号',
|
highSelectAttrs: {
|
prop: 'areaNo_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
{
|
label: '库区名称',
|
prop: 'areaName',
|
el: 'input',
|
//disabled: disabled,
|
placeholder: '请输入库区名称',
|
highSelectAttrs: {
|
prop: 'areaName_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
{
|
label: '描述',
|
prop: 'areaDesc',
|
el: 'input',
|
//disabled: disabled,
|
placeholder: '请输入描述',
|
highSelectAttrs: {
|
prop: 'areaDesc_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
{
|
label: '库区状态',
|
prop: 'areaStatus',
|
el: 'select',
|
clearable: true,
|
option: [],
|
//disabled: disabled,
|
placeholder: '请输入库区状态',
|
highSelectAttrs: {
|
prop: 'areaStatus_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_BOOL,
|
},
|
},
|
{
|
label: '库区类型',
|
prop: 'areaType',
|
el: 'select',
|
clearable: true,
|
option: [],
|
//disabled: disabled,
|
placeholder: '请输入库区类型',
|
highSelectAttrs: {
|
prop: 'areaType_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_BOOL,
|
},
|
},
|
// {
|
// label: '冗余字段1 - 预留扩展用途',
|
// prop: 'redundantField1',
|
// el: 'input',
|
// //disabled: disabled,
|
// placeholder: '请输入冗余字段1 - 预留扩展用途',
|
// highSelectAttrs: {
|
// prop: 'redundantField1_FilterMode',
|
// el: 'select',
|
// placeholder: '请选择',
|
// options: FILTER_MODE_OPTIONS_STRING,
|
// },
|
// },
|
// {
|
// label: '冗余字段2 - 预留扩展用途',
|
// prop: 'redundantField2',
|
// el: 'input',
|
// //disabled: disabled,
|
// placeholder: '请输入冗余字段2 - 预留扩展用途',
|
// highSelectAttrs: {
|
// prop: 'redundantField2_FilterMode',
|
// el: 'select',
|
// placeholder: '请选择',
|
// options: FILTER_MODE_OPTIONS_STRING,
|
// },
|
// },
|
// {
|
// label: '冗余字段3 - 预留扩展用途',
|
// prop: 'redundantField3',
|
// el: 'input',
|
// //disabled: disabled,
|
// placeholder: '请输入冗余字段3 - 预留扩展用途',
|
// highSelectAttrs: {
|
// prop: 'redundantField3_FilterMode',
|
// el: 'select',
|
// placeholder: '请选择',
|
// options: FILTER_MODE_OPTIONS_STRING,
|
// },
|
// },
|
{
|
label: '仓库',
|
prop: 'storeCode',
|
el: 'select',
|
option: [],
|
//disabled: disabled,
|
placeholder: '请输入仓库代码',
|
highSelectAttrs: {
|
prop: 'storeCode_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
{
|
label: '仓库名称',
|
prop: 'storeName',
|
el: 'input',
|
//disabled: disabled,
|
placeholder: '请输入仓库名称',
|
highSelectAttrs: {
|
prop: 'storeName_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
{
|
label: '备注',
|
prop: 'remark',
|
el: 'input',
|
//disabled: disabled,
|
placeholder: '请输入备注',
|
highSelectAttrs: {
|
prop: 'remark_FilterMode',
|
el: 'select',
|
placeholder: '请选择',
|
options: FILTER_MODE_OPTIONS_STRING,
|
},
|
},
|
// {
|
// label: '',
|
// prop: 'creationTime',
|
// el: (props: any, { attrs }: SetupContext) => {
|
// return h(dateTimePickerRange, {
|
// ...props,
|
// clearable: true,
|
// ...attrs,
|
// })
|
// },
|
// width: '100%',
|
// //disabled: disabled,
|
// placeholder: '请输入',
|
// isDateControl: true, // 显式标记为日期控件
|
// },
|
// {
|
// label: '',
|
// prop: 'lastModificationTime',
|
// el: (props: any, { attrs }: SetupContext) => {
|
// return h(dateTimePickerRange, {
|
// ...props,
|
// clearable: true,
|
// ...attrs,
|
// })
|
// },
|
// width: '100%',
|
// //disabled: disabled,
|
// placeholder: '请输入',
|
// isDateControl: true, // 显式标记为日期控件
|
// },
|
])
|
/**
|
* 校验是否有数据变化
|
*/
|
const checkIsEqualObject = () => {
|
const data = {
|
formData: formData.value,
|
}
|
const check = isEqual(initiateData.value, data)
|
return check
|
}
|
const commonGetFormData = () => {
|
const data = {
|
areaNo: formData.value.areaNo || '',
|
areaNo_FilterMode: formData.value.areaNo_FilterMode || '',
|
areaName: formData.value.areaName || '',
|
areaName_FilterMode: formData.value.areaName_FilterMode || '',
|
areaDesc: formData.value.areaDesc || '',
|
areaDesc_FilterMode: formData.value.areaDesc_FilterMode || '',
|
areaStatus: formData.value.areaStatus || '',
|
areaStatus_FilterMode: formData.value.areaStatus_FilterMode || '',
|
areaType: formData.value.areaType || '',
|
areaType_FilterMode: formData.value.areaType_FilterMode || '',
|
redundantField1: formData.value.redundantField1 || '',
|
redundantField1_FilterMode:
|
formData.value.redundantField1_FilterMode || '',
|
redundantField2: formData.value.redundantField2 || '',
|
redundantField2_FilterMode:
|
formData.value.redundantField2_FilterMode || '',
|
redundantField3: formData.value.redundantField3 || '',
|
redundantField3_FilterMode:
|
formData.value.redundantField3_FilterMode || '',
|
storeCode: formData.value.storeCode || '',
|
storeCode_FilterMode: formData.value.storeCode_FilterMode || '',
|
storeName: formData.value.storeName || '',
|
storeName_FilterMode: formData.value.storeName_FilterMode || '',
|
remark: formData.value.remark || '',
|
remark_FilterMode: formData.value.remark_FilterMode || '',
|
creationTime: formData.value.creationTime || '',
|
lastModificationTime: formData.value.lastModificationTime || '',
|
}
|
return data
|
}
|
const onClose = (done: () => void) => {
|
if (visible.value) {
|
visible.value = false
|
const data = commonGetFormData()
|
ctx.emit('close', data)
|
}
|
}
|
/**
|
* 确认查询
|
*/
|
const onConfirmQuery = async () => {
|
const data = commonGetFormData()
|
ctx.emit('confirmQuery', data)
|
}
|
/**
|
* 重置公共select查询
|
*/
|
const onResetForHighSelect = async () => {
|
formData.value.areaNo_FilterMode = 1
|
formData.value.areaName_FilterMode = 1
|
formData.value.areaDesc_FilterMode = 1
|
formData.value.areaStatus_FilterMode = 2
|
formData.value.areaType_FilterMode = 2
|
formData.value.redundantField1_FilterMode = 1
|
formData.value.redundantField2_FilterMode = 1
|
formData.value.redundantField3_FilterMode = 1
|
formData.value.storeCode_FilterMode = 1
|
formData.value.storeName_FilterMode = 1
|
formData.value.remark_FilterMode = 1
|
}
|
/**
|
* 重置查询
|
*/
|
const onReset = async () => {
|
formData.value = {}
|
onResetForHighSelect() //重置公共select查询
|
formData.value.areaNo = ''
|
formData.value.areaName = ''
|
formData.value.areaDesc = ''
|
formData.value.areaStatus = ''
|
formData.value.areaType = ''
|
formData.value.redundantField1 = ''
|
formData.value.redundantField2 = ''
|
formData.value.redundantField3 = ''
|
formData.value.storeCode = ''
|
formData.value.storeName = ''
|
formData.value.remark = ''
|
formData.value.creationTime = ''
|
formData.value.lastModificationTime = ''
|
//向父组件发送自定义事件
|
ctx.emit('restQuery')
|
}
|
|
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 updateFormStoreOptions = (propName: string, enumData: any[]) => {
|
const item = formItems.find((item) => item.prop === propName)
|
if (item && enumData) {
|
item.options = enumData.map((item) => ({
|
label: item.storeName,
|
value: item.storeCode,
|
}))
|
}
|
}
|
/**
|
* 通用查询枚举
|
*/
|
const commonQueryEnumForFrom = async () => {
|
const areaStatusEnumEnum = await wmsAreaDrawer.getWmsEnumData({
|
EnumName: 'AreaStatusEnum',
|
})
|
updateFormItemOptions('areaStatus', areaStatusEnumEnum)
|
const areaTypeEnumEnum = await wmsAreaDrawer.getWmsEnumData({
|
EnumName: 'AreaTypeEnum',
|
})
|
updateFormItemOptions('areaType', areaTypeEnumEnum)
|
const stores = await getStoreDataList()
|
storeList.value = stores
|
console.log('storeList', stores)
|
updateFormStoreOptions('storeCode', stores)
|
}
|
commonQueryEnumForFrom()
|
onResetForHighSelect() //重置公共select查询
|
/**
|
* 弹窗打开获取详情
|
*/
|
const onOpen = async () => {
|
disabled.value = false
|
updateCheckData()
|
}
|
|
watch(() => current.value, onOpen)
|
|
return {
|
formItems,
|
formData,
|
visible,
|
formRef,
|
onOpen,
|
onClose,
|
onConfirmQuery,
|
onReset,
|
}
|
}
|
