<template>
|
<div class="system-add-menu-container">
|
<el-dialog :title="goodsDetailAddState.title" :close-on-click-modal="false" v-model="goodsDetailAddState.goodsDetailAddVisible" width="30%">
|
<el-form
|
:model="goodsDetailAddState.goodsDetailForm"
|
:rules="goodsDetailAddState.goodsDetailRules"
|
ref="goodsDetailFormRef"
|
size="default"
|
v-loading="goodsDetailAddState.loading"
|
element-loading-text="Loading..."
|
label-width="120px">
|
<el-row>
|
<el-col :span="24" class="mb20">
|
<el-form-item label="选择物资" prop="smId">
|
<el-row :gutter="6">
|
<!-- <el-col :span="8">-->
|
<!-- <el-select-->
|
<!-- filterable-->
|
<!-- placeholder="请选择部门"-->
|
<!-- clearable-->
|
<!-- @change="changeDepartment"-->
|
<!-- v-model="goodsDetailAddState.depId">-->
|
<!-- <el-option-->
|
<!-- v-for="item in goodsDetailAddState.departmentList"-->
|
<!-- :key="item.depId"-->
|
<!-- :value="item.depId"-->
|
<!-- :label="item.depName"-->
|
<!-- ></el-option>-->
|
<!-- </el-select>-->
|
<!-- </el-col>-->
|
<el-col :span="12">
|
<el-select v-model="goodsDetailAddState.classifyId" placeholder="选择分类" @change="changeClassify" filterable clearable>
|
<el-option
|
v-for="item in goodsDetailAddState.classifyList"
|
:key="item.materialClassifyId"
|
:value="item.materialClassifyId"
|
:label="item.materialClassifyName"
|
></el-option>
|
</el-select>
|
</el-col>
|
<el-col :span="12">
|
<el-select v-model="goodsDetailAddState.goodsDetailForm.smId" placeholder="选择物资" filterable clearable>
|
<el-option
|
v-for="item in goodsDetailAddState.goodsList"
|
:key="item.smId"
|
:value="item.smId"
|
:label="item.materialName"
|
></el-option>
|
</el-select>
|
</el-col>
|
</el-row>
|
</el-form-item>
|
</el-col>
|
<el-col :span="24" class="mb20">
|
<el-row :gutter="6">
|
<el-col :span="12">
|
<el-form-item label="RFID起:" prop="startRfid">
|
<el-input v-model="goodsDetailAddState.RFID" placeholder="选填">
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-input v-model="goodsDetailAddState.startRfid" @blur="checkLength('start')" @input="onVerifiyNumberInteger($event, 'start')" placeholder="选填">
|
</el-input>
|
</el-col>
|
</el-row>
|
</el-col>
|
<el-col :span="24" class="mb20">
|
<el-row :gutter="6">
|
<el-col :span="12">
|
<el-form-item label="RFID止:" prop="endRfid">
|
<el-input v-model="goodsDetailAddState.RFID" placeholder="选填">
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-input @blur="checkLength('end')" @input="onVerifiyNumberInteger($event, 'end')" v-model="goodsDetailAddState.endRfid" placeholder="选填">
|
</el-input>
|
</el-col>
|
</el-row>
|
</el-col>
|
<el-col :span="24" class="mb20">
|
<el-form-item label="入库数量:" prop="wareHousingCount">
|
<el-input @input="onVerifiyNumberInteger($event, 'wareHousingCount')" v-model="goodsDetailAddState.goodsDetailForm.wareHousingCount" placeholder="入库总数">
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="24" class="mb20">
|
<el-form-item label="有效期类型:" prop="validType">
|
<el-radio-group v-model="goodsDetailAddState.goodsDetailForm.validType">
|
<el-radio :label="0">长期</el-radio>
|
<el-radio :label="1">非长期</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
<el-col :span="24" class="mb20" v-if="goodsDetailAddState.goodsDetailForm.validType === 1">
|
<el-form-item label="有效期至:" prop="validTime">
|
<el-date-picker
|
v-model="goodsDetailAddState.goodsDetailForm.validTime"
|
type="datetime"
|
format="YYYY-MM-DD HH:mm:ss"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
placeholder="选择日期时间"
|
style="width: 100%" />
|
</el-form-item>
|
</el-col>
|
|
</el-row>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="goodsDetailAddState.goodsDetailAddVisible = !goodsDetailAddState.goodsDetailAddVisible" size="default">取 消</el-button>
|
<el-button type="primary" @click="submitGoodsDetail" v-throttle size="default">确 定</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script lang="ts" setup>
|
import {reactive, ref, watch} from 'vue'
|
import {
|
BaseMaterialListType,
|
ClassificationListType,
|
DepartmentType,
|
GoodsDetailDataType,
|
GoodsDetailAddType
|
} from "/@/views/facilityManagement/goodsDetailManage/index";
|
import {isValidKey} from "/@/views/facilityManagement/safetyGoodsAndEquipment/index";
|
import {ElMessage} from "element-plus/es";
|
import {goodsDetailApi} from "/@/api/facilityManagement/goodsDetailManage";
|
import {verifiyNumberInteger, verifyString} from "/@/utils/toolsValidate";
|
import {useUserInfo} from "/@/stores/userInfo";
|
|
const goodsDetailFormRef = ref()
|
const userInfo = useUserInfo()
|
|
const goodsDetailAddState = reactive<GoodsDetailAddType>({
|
title: '新增入库',
|
RFID: 'RFIDXXX',
|
startRfid: '',
|
endRfid: '',
|
depId: null,
|
loading: false,
|
classifyId: null,
|
goodsDetailAddVisible: false,
|
goodsDetailForm: {
|
id: null,
|
smId: null,
|
validType: null,
|
validTime: null,
|
startRfid: null,
|
endRfid: null ,
|
wareHousingCount: null,
|
},
|
goodsDetailRules: {
|
smId: [{ required: true, message: '请选择物资名称', trigger: 'change' }],
|
validType: [{ required: true, message: '请选择时间类型', trigger: 'change' }],
|
validTime: [{ required: true, message: '请选择有效时间', trigger: 'change' }],
|
wareHousingCount: [{ required: true, message: '请填写入库数量', trigger: 'blur' }],
|
},
|
departmentList: [],
|
classifyList: [],
|
goodsList: [],
|
})
|
|
watch(() => [goodsDetailAddState.startRfid,goodsDetailAddState.endRfid],(newVal, oldVal) => {
|
if(goodsDetailAddState.startRfid.length === 8 && goodsDetailAddState.endRfid.length === 8){
|
goodsDetailAddState.goodsDetailForm.wareHousingCount = Number(goodsDetailAddState.endRfid) - Number(goodsDetailAddState.startRfid) + 1
|
}
|
},{immediate :false});
|
|
const openGoodsDetailAddDialog = async (title: string, value: GoodsDetailDataType, departmentList: DepartmentType []) => {
|
goodsDetailAddState.goodsDetailAddVisible = true;
|
goodsDetailAddState.departmentList = departmentList;
|
setTimeout(() => {
|
goodsDetailFormRef.value.clearValidate();
|
});
|
goodsDetailAddState.startRfid = '';
|
goodsDetailAddState.endRfid = '';
|
goodsDetailAddState.goodsDetailForm = {
|
id: null,
|
smId: null,
|
validType: null,
|
validTime: null,
|
startRfid: null,
|
endRfid: null ,
|
wareHousingCount: null,
|
};
|
goodsDetailAddState.classifyList = goodsDetailAddState.departmentList.find(item => item.depId === userInfo.userInfos.depId)?.classificationList as Array<ClassificationListType>
|
}
|
|
// const changeDepartment = (value: number | null) => {
|
// goodsDetailAddState.classifyId = null
|
// goodsDetailAddState.goodsDetailForm.smId = null
|
// goodsDetailAddState.classifyList = goodsDetailAddState.departmentList.find(item => item.depId === value)?.classificationList as Array<ClassificationListType>
|
// }
|
|
const changeClassify = (value: number | null) => {
|
goodsDetailAddState.goodsDetailForm.smId = null
|
goodsDetailAddState.goodsList = JSON.parse(JSON.stringify(
|
(goodsDetailAddState.classifyList.find(item => item.materialClassifyId === value) ?? {baseMaterialList:[]})?.baseMaterialList as Array<BaseMaterialListType>
|
))
|
}
|
|
const submitGoodsDetail = () => {
|
goodsDetailFormRef.value.validate(async (valid: boolean) => {
|
if(valid){
|
goodsDetailAddState.goodsDetailForm.startRfid = `RFID${goodsDetailAddState.startRfid}`
|
goodsDetailAddState.goodsDetailForm.endRfid = `RFID${goodsDetailAddState.endRfid}`
|
goodsDetailAddState.loading = true
|
let res = await goodsDetailApi().addGoodsDetail(goodsDetailAddState.goodsDetailForm)
|
if(res.data.code === '200'){
|
goodsDetailAddState.goodsDetailAddVisible = false
|
emit('refreshData')
|
ElMessage({
|
type: 'success',
|
message: '物资新增成功',
|
duration: 2000
|
});
|
}else{
|
ElMessage({
|
type:'warning',
|
message:res.data.msg
|
})
|
}
|
goodsDetailAddState.loading = false
|
}else{
|
ElMessage({
|
type: 'warning',
|
message: '请完善基本信息'
|
})
|
}
|
})
|
}
|
|
const checkLength = (value: string) => {
|
if(value === 'start' && goodsDetailAddState.startRfid.length !== 8){
|
ElMessage({
|
type:'warning',
|
message: 'RFID起不符合规范，请重新填入'
|
})
|
goodsDetailAddState.startRfid = ''
|
goodsDetailAddState.goodsDetailForm.wareHousingCount = null
|
}else if(value === 'end' && goodsDetailAddState.endRfid.length !== 8){
|
ElMessage({
|
type:'warning',
|
message: 'RFID止不符合规范，请重新填入'
|
})
|
goodsDetailAddState.endRfid = ''
|
goodsDetailAddState.goodsDetailForm.wareHousingCount = null
|
}else{
|
return
|
}
|
}
|
|
const onVerifiyNumberInteger = (val: number, title: string) => {
|
if(title === 'wareHousingCount'){
|
goodsDetailAddState.goodsDetailForm.wareHousingCount = Number(verifiyNumberInteger(val.toString())) === 0 ? null : Number(verifiyNumberInteger(val.toString()));
|
}else if(title === 'start'){
|
goodsDetailAddState.startRfid = verifyString(val.toString());
|
}else{
|
goodsDetailAddState.endRfid = verifyString(val.toString());
|
}
|
|
};
|
|
const emit = defineEmits(['refreshData',])
|
|
defineExpose({
|
openGoodsDetailAddDialog
|
})
|
|
</script>
|
|
<style scoped>
|
|
</style>
|
