yunxi
/
mes-heli
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

出入库 编辑页面 子表单验证

Browse Source 
出入库 编辑页面 子表单验证
pull/1/head
siontion 9 months ago
parent d03b24a66c
commit 6494feaf65
1 changed files with 130 additions and 104 deletions
Show Stats Download Patch File Download Diff File

234
mes-ui/mes-ui-admin-vue3/src/views/heli/storage/StorageForm.vue
Unescape View File

@ -4,6 +4,7 @@
<span v-text="dialogTitle"></span> <span v-text="dialogTitle"></span>
</template> </template>
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px" v-loading="formLoading"> <el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px" v-loading="formLoading">
<!-- 基础信息 -->
<el-card class="hl-card-info"> <el-card class="hl-card-info">
<template #header> <template #header>
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">基础信息</span> <div class="hl-card-info-icona"></div><span class="hl-card-info-text">基础信息</span>
@ -78,7 +79,7 @@
</el-col> </el-col>
</el-row> </el-row>
</el-card> </el-card>
<!-- 物料信息 -->
<el-card class="hl-card-info"> <el-card class="hl-card-info">
<template #header> <template #header>
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">物料信息</span> <div class="hl-card-info-icona"></div><span class="hl-card-info-text">物料信息</span>
@ -89,95 +90,105 @@
<el-col> <el-col>
<el-button class="hl-addbutton" type="primary" size="large" @click="onAddItem">新增</el-button> <el-button class="hl-addbutton" type="primary" size="large" @click="onAddItem">新增</el-button>
</el-col> </el-col>
<el-table :data="formData.productBomItemDOList" class="hl-table"> <el-form ref="matSubFormRef" :model="formData.matItemDOList" :rules="subFormRules"
<el-table-column prop="cid" label="序号" :width="80" /> v-loading="subFormLoading" label-width="0">
<el-table-column prop="matId" label="物料编码"> <el-table :data="formData.matItemDOList" class="hl-table">
<template #default="scope"> <el-table-column prop="cid" label="序号" :width="80" />
<el-select v-model="scope.row.matId" placeholder="物料编码" :remote-method="remoteMatCodeSearch" <el-table-column prop="matId" label="物料编码">
remote-show-suffix remote clearable reserve-keyword filterable :loading="matSelectLoading" <template #default="scope">
@change="(val) => handleMatCode(scope, val)" class="!w-180px"> <el-form-item :prop="`${scope.$index}.matId`" :rules="subFormRules.matId" class="mb-0px!">
<el-option v-for="item in matList" :key="item.id" :label="item.code" :value="item.id" /> <el-select v-model="scope.row.matId" placeholder="物料编码" :remote-method="remoteMatCodeSearch"
</el-select> remote-show-suffix remote clearable reserve-keyword filterable :loading="matSelectLoading"
</template> @change="(val) => handleMatCode(scope, val)" class="!w-180px">
</el-table-column> <el-option v-for="item in matList" :key="item.id" :label="item.code" :value="item.id" />
<el-table-column prop="matName" label="物料名称"> </el-select>
<!-- <template #default="scope"> </el-form-item>
<el-input v-model="scope.row.matName" </template>
:disabled="!scope.row.editable" /> </el-table-column>
<el-table-column prop="matName" label="物料名称">
<el-select v-model="scope.row.matName" placeholder="物料名称" :remote-method="remoteMatSearch" <!-- <template #default="scope">
remote-show-suffix remote clearable reserve-keyword filterable :loading="matSelectLoading" @click="handleMatName" <el-input v-model="scope.row.matName"
class="!w-180px"> :disabled="!scope.row.editable" />
<el-option v-for="item in matList" :key="item.id" :label="item.name" :value="item.id" />
</el-select> <el-select v-model="scope.row.matName" placeholder="物料名称" :remote-method="remoteMatSearch"
remote-show-suffix remote clearable reserve-keyword filterable :loading="matSelectLoading" @click="handleMatName"
</template> --> class="!w-180px">
</el-table-column> <el-option v-for="item in matList" :key="item.id" :label="item.name" :value="item.id" />
<el-table-column prop="matType" label="物料类型"> </el-select>
<template #default="scope">
<dict-tag :type="DICT_TYPE.HELI_MATERIAL_TYPE" :value="scope.row.matType" </template> -->
v-if="scope.row.matType ? true : false" /> </el-table-column>
</template> <el-table-column prop="matType" label="物料类型">
</el-table-column> <template #default="scope">
<el-table-column prop="matSpec" label="规格/型号" /> <dict-tag :type="DICT_TYPE.HELI_MATERIAL_TYPE" :value="scope.row.matType"
v-if="scope.row.matType ? true : false" />
<el-table-column prop="matUnit" label="系统单位"> </template>
<template #default="scope"> </el-table-column>
<dict-tag :type="DICT_TYPE.HELI_MATERIAL_UNIT" :value="scope.row.matUnit" <el-table-column prop="matSpec" label="规格/型号" />
v-if="scope.row.matUnit ? true : false" />
</template> <el-table-column prop="matUnit" label="系统单位">
</el-table-column> <template #default="scope">
<el-table-column prop="rgId" width="140" label="入库库区" required> <dict-tag :type="DICT_TYPE.HELI_MATERIAL_UNIT" :value="scope.row.matUnit"
<template #default="scope"> v-if="scope.row.matUnit ? true : false" />
<el-select v-model="scope.row.rgId" placeholder="" style="width: 100%" @change="handleRg(scope)"> </template>
<el-option v-for="dict in rgList" :key="dict.id" :label="dict.rgName" :value="dict.id" /> </el-table-column>
</el-select> <el-table-column prop="rgId" width="140" label="入库库区" required>
</template> <template #default="scope">
</el-table-column> <el-form-item :prop="`${scope.$index}.rgId`" :rules="subFormRules.rgId" class="mb-0px!">
<el-table-column prop="pnId" width="140" label="入库库位" required> <el-select v-model="scope.row.rgId" placeholder="" style="width: 100%" @change="handleRg(scope)">
<template #default="scope"> <el-option v-for="dict in rgList" :key="dict.id" :label="dict.rgName" :value="dict.id" />
<el-select v-model="scope.row.pnId" placeholder="" style="width: 100%"> </el-select>
<el-option v-for="dict in scope.row.pnlist" :key="dict.id" :label="dict.pnName" :value="dict.id" /> </el-form-item>
</el-select> </template>
</template> </el-table-column>
</el-table-column> <el-table-column prop="pnId" width="140" label="入库库位" required>
<el-table-column prop="storageOkQty" width="120" label="入库数量" required> <template #default="scope">
<template #default="scope"> <el-form-item :prop="`${scope.$index}.pnId`" :rules="subFormRules.pnId" class="mb-0px!">
<el-input v-model="scope.row.storageOkQty" /> <el-select v-model="scope.row.pnId" placeholder="" style="width: 100%">
</template> <el-option v-for="dict in scope.row.pnlist" :key="dict.id" :label="dict.pnName"
</el-table-column> :value="dict.id" />
<el-table-column prop="lotNo" width="120" label="批次号"> </el-select>
<template #default="scope"> </el-form-item>
<el-input v-model="scope.row.lotNo" /> </template>
</template> </el-table-column>
</el-table-column> <el-table-column prop="storageOkQty" width="120" label="入库数量" required>
<el-table-column prop="description" width="150" label="备注"> <template #default="scope">
<template #default="scope"> <el-input v-model="scope.row.storageOkQty" />
<el-input v-model="scope.row.description" /> </template>
</template> </el-table-column>
</el-table-column> <el-table-column prop="lotNo" width="120" label="批次号">
<el-table-column label="操作" align="center" width="240"> <template #default="scope">
<template #default="scope"> <el-input v-model="scope.row.lotNo" />
<!-- <el-button v-if="!scope.row.editable" type="primary" size="small" link </template>
@click="handleEdit(scope.$index)"> </el-table-column>
编辑 <el-table-column prop="description" width="150" label="备注">
</el-button> <template #default="scope">
<el-button link v-else type="success" size="small" @click="handleSave(scope.$index)"> <el-input v-model="scope.row.description" />
保存 </template>
</el-button> </el-table-column>
<el-table-column label="操作" align="center" width="240">
<el-button link type="primary" @click="handlefuke(scope.$index, scope.row)">复制</el-button> --> <template #default="scope">
<el-button link type="danger" size="small" @click.prevent="handleDelete2(scope.$index)"> <!-- <el-button v-if="!scope.row.editable" type="primary" size="small" link
删除 @click="handleEdit(scope.$index)">
</el-button> 编辑
</template> </el-button>
</el-table-column> <el-button link v-else type="success" size="small" @click="handleSave(scope.$index)">
</el-table> 保存
</el-button>
<el-button link type="primary" @click="handlefuke(scope.$index, scope.row)">复制</el-button> -->
<el-button link type="danger" size="small" @click.prevent="handleDelete2(scope.$index)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
</el-card> </el-card>
</el-col> </el-col>
</el-row> </el-row>
</el-card> </el-card>
<!-- 附件信息 -->
<el-card class="hl-card-info"> <el-card class="hl-card-info">
<template #header> <template #header>
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">附件信息</span> <div class="hl-card-info-icona"></div><span class="hl-card-info-text">附件信息</span>
@ -222,6 +233,7 @@
</el-col> </el-col>
</el-row> </el-row>
</el-card> </el-card>
<!-- 系统信息 -->
<el-card class="hl-card-info"> <el-card class="hl-card-info">
<template #header> <template #header>
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">系统信息</span> <div class="hl-card-info-icona"></div><span class="hl-card-info-text">系统信息</span>
@ -299,7 +311,6 @@ const message = useMessage() // 消息弹窗
const router = useRoute(); const router = useRoute();
const isShow = ref(false) const isShow = ref(false)
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题 const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改 const formType = ref('') // 表单的类型：create - 新增；update - 修改
@ -321,7 +332,7 @@ const formData = ref({
outboundTime: undefined, outboundTime: undefined,
cancel: undefined, cancel: undefined,
cancelTime: undefined, cancelTime: undefined,
productBomItemDOList: [], matItemDOList: [],
attachments: [] attachments: []
}) })
const formRules = reactive({ const formRules = reactive({
@ -331,6 +342,14 @@ const formRules = reactive({
whId: [{ required: true, message: '入库仓库不能为空', trigger: 'blur' }] whId: [{ required: true, message: '入库仓库不能为空', trigger: 'blur' }]
}) })
const formRef = ref() // 表单 Ref const formRef = ref() // 表单 Ref
const matSubFormRef = ref() //子表单 Ref
const subFormLoading = ref(false) // 子表单的加载中
const subFormRules = reactive({
matId: [{ required: true, message: '物料不能为空', trigger: 'blur' }],
rgId: [{ required: true, message: '库区不能为空', trigger: 'blur' }],
pnId: [{ required: true, message: '库位不能为空', trigger: 'blur' }],
})
const userList = ref<UserApi.UserVO[]>([]) // 用户列表 const userList = ref<UserApi.UserVO[]>([]) // 用户列表
@ -388,6 +407,12 @@ const emit = defineEmits(['success']) // 定义 success 事件，用于操作成
const submitForm = async () => { const submitForm = async () => {
// 校验表单 // 校验表单
await formRef.value.validate() await formRef.value.validate()
// 校验子表单
try {
await matSubFormRef.value.validate()
} catch (e) {
return
}
// 提交请求 // 提交请求
formLoading.value = true formLoading.value = true
try { try {
@ -404,11 +429,11 @@ const submitForm = async () => {
commonResult = 'common.updateSuccess' commonResult = 'common.updateSuccess'
} }
//物料信息保存 //物料信息保存
formData.value.productBomItemDOList.forEach(item => { formData.value.matItemDOList.forEach(item => {
item.stockId = storageid.value item.stockId = storageid.value
item.whId = formData.value.whId item.whId = formData.value.whId
}) })
const dataMats = formData.value.productBomItemDOList as unknown as StorageMatApi.StorageMatVO[] const dataMats = formData.value.matItemDOList as unknown as StorageMatApi.StorageMatVO[]
await StorageMatApi.createStorageMatBatch(dataMats) await StorageMatApi.createStorageMatBatch(dataMats)
//附件信息保存 //附件信息保存
@ -448,13 +473,13 @@ const onAddItem = () => {
productBomItemValueDOList: [] productBomItemValueDOList: []
} }
matCount = matCount + 1 matCount = matCount + 1
formData.value.productBomItemDOList.push(newData) formData.value.matItemDOList.push(newData)
} }
// 复制数据 // 复制数据
const handlefuke = (index, item) => { const handlefuke = (index, item) => {
const data: any = formData.value.productBomItemDOList[index] const data: any = formData.value.matItemDOList[index]
// 复制数据 // 复制数据
const newData: any = { const newData: any = {
@ -478,13 +503,13 @@ const handlefuke = (index, item) => {
} }
matCount = matCount + 1 matCount = matCount + 1
// 添加新数据 // 添加新数据
formData.value.productBomItemDOList.splice(index + 1, 0, newData) formData.value.matItemDOList.splice(index + 1, 0, newData)
} }
//删除新增物料信息 //删除新增物料信息
const handleDelete2 = (index: number) => { const handleDelete2 = (index: number) => {
formData.value.productBomItemDOList.splice(index, 1) formData.value.matItemDOList.splice(index, 1)
} }
//仓库全数据 //仓库全数据
@ -506,7 +531,7 @@ const handleWh = (async (wid) => {
pnList.value = [] pnList.value = []
rgList.value = dataRg.list rgList.value = dataRg.list
formData.value.productBomItemDOList.forEach(item => { formData.value.matItemDOList.forEach(item => {
item.rgId = '' item.rgId = ''
item.pnId = '' item.pnId = ''
item.pnlist.value = [] item.pnlist.value = []
@ -564,6 +589,8 @@ const handleMatCode = async (scope, matid) => {
} }
} }
const isShowBtnStatus = false
const isShowBtnCancel = false
/** 初始化 **/ /** 初始化 **/
onMounted(async () => { onMounted(async () => {
@ -594,8 +621,8 @@ onMounted(async () => {
const queryParamsRg = reactive({ const queryParamsRg = reactive({
pageNo: 1, pageNo: 1,
pageSize: 99, pageSize: 99,
status:1, status: 1,
whId : formData.value.whId whId: formData.value.whId
}) })
const dataRg = await RgApi.getRgPage(queryParamsRg) const dataRg = await RgApi.getRgPage(queryParamsRg)
@ -618,7 +645,7 @@ onMounted(async () => {
stockId: router.query.id stockId: router.query.id
}) })
const dataMats = await StorageMatApi.getStorageMatPage(queryParamsMat) const dataMats = await StorageMatApi.getStorageMatPage(queryParamsMat)
formData.value.productBomItemDOList = dataMats.list formData.value.matItemDOList = dataMats.list
//获取原始物料信息 //获取原始物料信息
const queryParamsMat2 = reactive({ const queryParamsMat2 = reactive({
@ -628,20 +655,18 @@ onMounted(async () => {
}) })
const matVos = await MaterialApi.getMaterialPage(queryParamsMat2) const matVos = await MaterialApi.getMaterialPage(queryParamsMat2)
formData.value.productBomItemDOList.forEach(item => { formData.value.matItemDOList.forEach(item => {
item.cid = matCount item.cid = matCount
item.matId = matVos.list.find((record) => record.id === item.matId)?.id item.matId = matVos.list.find((record) => record.id === item.matId)?.id
//item.matCode = matVos.list.find( (record) => record.id === item.matId)?.id //item.matCode = matVos.list.find( (record) => record.id === item.matId)?.id
item.matName = matVos.list.find((record) => record.id === item.matId)?.name item.matName = matVos.list.find((record) => record.id === item.matId)?.name
item.matSpec = matVos.list.find((record) => record.id === item.matId)?.spec item.matSpec = matVos.list.find((record) => record.id === item.matId)?.spec
item.matType = matVos.list.find((record) => record.id === item.matId)?.materialType item.matType = matVos.list.find((record) => record.id === item.matId)?.materialType
item.matUnit = matVos.list.find((record) => record.id === item.matId)?.unit item.matUnit = matVos.list.find((record) => record.id === item.matId)?.unit
item.pnlist = pnList.value.filter((pn) => pn.rgId === item.rgId) item.pnlist = pnList.value.filter((pn) => pn.rgId === item.rgId)
matCount= matCount+1 matCount = matCount + 1
}) })
//物料编码信息初始化
// 附件信息 // 附件信息
let attParams = { let attParams = {
@ -653,6 +678,7 @@ onMounted(async () => {
formData.value.attachments = (await getFilePage(attParams)).list; formData.value.attachments = (await getFilePage(attParams)).list;
} }
//用户信息
userList.value = await UserApi.getSimpleUserList() userList.value = await UserApi.getSimpleUserList()
}) })

Write Preview
Loading…
Cancel
Save