<template>
|
<div class="wmsPlace-container">
|
<el-dialog v-model="isShowDialog" :width="800" draggable="" :close-on-click-modal="false">
|
<template #header>
|
<div style="color: #fff">
|
<!--<el-icon size="16" style="margin-right: 3px; display: inline; vertical-align: middle"> <ele-Edit /> </el-icon>-->
|
<span>{{ props.title }}</span>
|
</div>
|
</template>
|
<el-form :model="ruleForm" ref="ruleFormRef" label-width="auto" :rules="rules">
|
<el-row :gutter="35">
|
<el-form-item v-show="false">
|
<el-input v-model="ruleForm.id" />
|
</el-form-item>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位编号" prop="placeCode">
|
<el-input v-model="ruleForm.placeCode" :disabled="props.title=='编辑库位信息'" placeholder="请输入库位编号" maxlength="50" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位名称" prop="placeName">
|
<el-input v-model="ruleForm.placeName" placeholder="请输入库位名称" maxlength="50" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位别名" prop="placeAlias">
|
<el-input v-model="ruleForm.placeAlias" placeholder="请输入库位别名" maxlength="50" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位类型" prop="placeType">
|
<el-select clearable v-model="ruleForm.placeType" placeholder="请选择库位类型">
|
<el-option v-for="(item,index) in getEnumPlaceTypeData" :key="index" :value="item.value" :label="`${item.describe}`"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="存放单位" prop="stockUnit">
|
<el-select clearable v-model="ruleForm.stockUnit" placeholder="请选择存放单位">
|
<el-option v-for="(item,index) in getEnumStockUnitData" :key="index" :value="item.value" :label="`${item.describe}`"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col> -->
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位属性" prop="placeStatus">
|
<el-select clearable v-model="ruleForm.placeStatus" placeholder="请选择库位属性">
|
<el-option v-for="(item,index) in getEnumPlaceStatusData" :key="index" :value="item.value" :label="`${item.describe}`"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="是否激活与任务调度" prop="isActivateWCS">
|
<el-switch v-model="ruleForm.isActivateWCS" active-text="是" inactive-text="否" />
|
|
</el-form-item>
|
|
</el-col> -->
|
<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库存环境" prop="environment">
|
<el-input v-model="ruleForm.environment" placeholder="请输入库存环境" maxlength="255" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col> -->
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="所在库区" prop="areaId">
|
<el-select clearable v-model="ruleForm.areaId" placeholder="请选择所在库区">
|
<el-option v-for="(item,index) in arr1" :key="index" :value="item.id" :label="`[${item.code}] ${item.value}`"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
<!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="检验码" prop="verificationCode">
|
<el-input v-model="ruleForm.verificationCode" placeholder="请输入检验码" maxlength="255" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col> -->
|
<!-- 原材料库没有涉及 排 列 层 巷道 update by liuwq-->
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="排" prop="rowNo">
|
<el-input-number :min="1" :precision="0" v-model="ruleForm.rowNo" placeholder="请输入排" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="列" prop="columnNo">
|
<el-input-number :min="1" :precision="0" v-model="ruleForm.columnNo" placeholder="请输入列" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="层" prop="layerNo">
|
<el-input-number :min="1" :precision="0" v-model="ruleForm.layerNo" placeholder="请输入层" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="巷道" prop="laneNo">
|
<el-input-number :min="1" :precision="0" v-model="ruleForm.laneNo" placeholder="请输入巷道" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位X坐标" prop="xzb">
|
<el-input v-model="ruleForm.xzb" placeholder="请输入库位X坐标" maxlength="255" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位Y坐标" prop="yzb">
|
<el-input v-model="ruleForm.yzb" placeholder="请输入库位Y坐标" maxlength="255" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位Z坐标" prop="zzb">
|
<el-input v-model="ruleForm.zzb" placeholder="请输入库位Z坐标" maxlength="255" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位长度" prop="length">
|
<el-input-number :min="0" :precision="3" v-model="ruleForm.length" placeholder="请输入库位长度" maxlength="10" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位宽度" prop="width">
|
<el-input-number :min="0" :precision="3" v-model="ruleForm.width" placeholder="请输入库位宽度" maxlength="10" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="库位高度" prop="height">
|
<el-input-number :min="0" :precision="3" v-model="ruleForm.height" placeholder="请输入库位高度" maxlength="10" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="最大承重" prop="maxWeight">
|
<el-input-number :min="0" :precision="3" v-model="ruleForm.maxWeight" placeholder="请输入最大承重" maxlength="10" show-word-limit clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="上架顺序" prop="inSequence">
|
<el-input-number :min="0" :precision="0" v-model="ruleForm.inSequence" placeholder="请输入上架顺序" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="下架顺序" prop="outSequence">
|
<el-input-number :min="0" :precision="0" v-model="ruleForm.outSequence" placeholder="请输入下架顺序" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="绑定容器数" prop="bindContainerCount">
|
<el-input-number :min="0" :precision="0" v-model="ruleForm.bindContainerCount" placeholder="请输入绑定容器数" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="是否虚拟" prop="isVirtually">
|
<el-switch v-model="ruleForm.isVirtually" active-text="是" inactive-text="否" />
|
|
</el-form-item>
|
|
</el-col>
|
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
<el-form-item label="是否禁用" prop="isDisabled">
|
<el-switch v-model="ruleForm.isDisabled" active-text="是" inactive-text="否" />
|
|
</el-form-item>
|
|
</el-col>
|
</el-row>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="cancel">取 消</el-button>
|
<el-button type="primary" @click="submit">确 定</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<style scoped>
|
:deep(.el-select),
|
:deep(.el-input-number) {
|
width: 100%;
|
}
|
</style>
|
<script lang="ts" setup>
|
import { ref,onMounted, nextTick } from "vue";
|
import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
|
import { ElMessage } from "element-plus";
|
import type { FormRules } from "element-plus";
|
import { addWmsPlace, updateWmsPlace, detailWmsPlace } from "/@/api/main/WmsBase/wmsPlace";
|
import { getAPI } from '/@/utils/axios-utils';
|
import { SysEnumApi } from '/@/api-services/api';
|
import { handleSlectDataWmsArea } from "/@/utils/selectData";
|
|
const getEnumPlaceTypeData = ref<any>([]);
|
const getEnumStockUnitData = ref<any>([]);
|
const getEnumPlaceStatusData = ref<any>([]);
|
|
//父级传递来的参数
|
var props = defineProps({
|
title: {
|
type: String,
|
default: "",
|
},
|
});
|
//父级传递来的函数,用于回调
|
const emit = defineEmits(["reloadTable"]);
|
const ruleFormRef = ref({
|
|
});
|
const isShowDialog = ref(false);
|
const isEditDialog = ref(false);//是否是编辑
|
const ruleForm = ref<any>({
|
|
stockUnit:2//默认选择 托盘
|
});
|
//自行添加其他规则
|
const rules = ref<FormRules>({
|
placeCode: [{required: true, message: '请输入库位编号!', trigger: 'blur',},],
|
placeName: [{required: true, message: '请输入库位名称!', trigger: 'blur',},],
|
areaId: [{required: true, message: '请选择所在库区!', trigger: 'change',},],
|
placeType: [{required: true, message: '请选择库位类型!', trigger: 'change',},],
|
// stockUnit: [{required: true, message: '请选择存放单位!', trigger: 'change',},],
|
placeStatus: [{required: true, message: '请选择库位属性!', trigger: 'change',},],
|
|
// rowNo: [{required: true, message: '请输入排!', trigger: 'blur',},],
|
// columnNo: [{required: true, message: '请输入列!', trigger: 'blur',},],
|
// layerNo: [{required: true, message: '请输入层!', trigger: 'blur',},],
|
// laneNo: [{required: true, message: '请输入巷道!', trigger: 'blur',},],
|
// length: [{required: true, message: '请输入库位长度!', trigger: 'blur',},],
|
// width: [{required: true, message: '请输入库位宽度!', trigger: 'blur',},],
|
// height: [{required: true, message: '请输入库位高度!', trigger: 'blur',},],
|
// maxWeight: [{required: true, message: '请输入最大承重!', trigger: 'blur',},],
|
});
|
let arr1:any =ref("") //下拉读取接口
|
// 打开弹窗
|
const openDialog = async (row: any) => {
|
console.log('row',row)
|
// ruleForm.value = JSON.parse(JSON.stringify(row));
|
// 改用detail获取最新数据来编辑
|
let rowData = JSON.parse(JSON.stringify(row));
|
if (rowData.id){
|
isEditDialog.value = true;
|
ruleForm.value = (await detailWmsPlace(rowData.id)).data.result;
|
}
|
else{
|
ruleForm.value = rowData;
|
ruleForm.value.bindContainerCount = 1;
|
isEditDialog.value = false;
|
}
|
|
isShowDialog.value = true;
|
ruleForm.value.stockUnit = 2
|
nextTick(async () => {
|
arr1.value = await handleSlectDataWmsArea(); //下拉读取接口
|
});
|
|
};
|
|
// 关闭弹窗
|
const closeDialog = () => {
|
emit("reloadTable");
|
isShowDialog.value = false;
|
};
|
|
// 取消
|
const cancel = () => {
|
isShowDialog.value = false;
|
};
|
|
// 提交
|
const submit = async () => {
|
ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
|
if (isValid) {
|
let values = ruleForm.value;
|
if (props.title=='编辑库位信息') {
|
await updateWmsPlace(values);
|
} else {
|
await addWmsPlace(values);
|
}
|
closeDialog();
|
} else {
|
ElMessage({
|
message: `表单有${Object.keys(fields).length}处验证失败,请修改后再提交`,
|
type: "error",
|
});
|
}
|
});
|
};
|
|
|
|
|
|
|
|
// 页面加载时
|
onMounted(async () => {
|
getEnumPlaceTypeData.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('PlaceTypeEnum')).data.result ?? [];
|
getEnumStockUnitData.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('StockUnitEnum')).data.result ?? [];
|
getEnumPlaceStatusData.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('PlaceStatusEnum')).data.result ?? [];
|
});
|
|
//将属性或者函数暴露给父组件
|
defineExpose({ openDialog });
|
</script>
|