257 lines
7.2 KiB
Vue
257 lines
7.2 KiB
Vue
|
|
|||
|
|
<template>
|
|||
|
|
<BaseDialog
|
|||
|
|
:dialogVisible="props.visible"
|
|||
|
|
@close="onclone"
|
|||
|
|
:titleName="props.form.opInstructionId ? '编辑应急仓库' : '新增应急仓库'"
|
|||
|
|
width="50%"
|
|||
|
|
@onSubmit="handleSubmit"
|
|||
|
|
:footerclosed="true"
|
|||
|
|
:diafooter="true"
|
|||
|
|
:footerkeepnaem='props.readonly?false:true'
|
|||
|
|
>
|
|||
|
|
<div class="detailForm-content">
|
|||
|
|
<el-form
|
|||
|
|
ref="formRef"
|
|||
|
|
label-position="right"
|
|||
|
|
label-width="150px"
|
|||
|
|
:rules="ruleForm"
|
|||
|
|
:model="addPostFactorForm"
|
|||
|
|
>
|
|||
|
|
<el-form-item label="仓库名称：" prop="houseName">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入仓库名称"
|
|||
|
|
v-model="addPostFactorForm.houseName"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="管理员：" prop="nameId">
|
|||
|
|
<el-select
|
|||
|
|
v-model="addPostFactorForm.nameId"
|
|||
|
|
placeholder="请选择管理员"
|
|||
|
|
filterable
|
|||
|
|
remote
|
|||
|
|
:remote-method="remoteMethod"
|
|||
|
|
@change="adminOption"
|
|||
|
|
>
|
|||
|
|
<el-option
|
|||
|
|
v-for="item in adminOptions"
|
|||
|
|
:key="item.userId"
|
|||
|
|
:value="item.userId"
|
|||
|
|
:label="item.chinaname + '（' + item.performclassname + '）'"
|
|||
|
|
>
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="联系方式：" prop="telephone">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入联系电话"
|
|||
|
|
v-model="addPostFactorForm.telephone"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="所属地区：" prop="orgCode">
|
|||
|
|
<el-cascader
|
|||
|
|
v-model="addPostFactorForm.orgCode"
|
|||
|
|
placeholder="请选择所属地区"
|
|||
|
|
@change="handleAreaChange"
|
|||
|
|
:options="orgList"
|
|||
|
|
:props="{
|
|||
|
|
checkStrictly: true,
|
|||
|
|
label: 'orgname',
|
|||
|
|
value: 'orgcode',
|
|||
|
|
}"
|
|||
|
|
clearable
|
|||
|
|
></el-cascader>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="经度：" prop="lon">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入经度"
|
|||
|
|
v-model="addPostFactorForm.lon"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="维度：" prop="lat">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入维度"
|
|||
|
|
v-model="addPostFactorForm.lat"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="所属单位：" prop="possession">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入所属单位"
|
|||
|
|
v-model="addPostFactorForm.possession"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<!-- <el-form-item
|
|||
|
|
label="装备总数："
|
|||
|
|
v-if="props.form && Object.keys(props.form).length > 0"
|
|||
|
|
>
|
|||
|
|
<el-input
|
|||
|
|
disabled
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
v-model="addPostFactorForm.houseTotal"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item> -->
|
|||
|
|
|
|||
|
|
<el-form-item label="地址：" prop="address" style="width: 100%">
|
|||
|
|
<el-input
|
|||
|
|
:readonly="props.readonly"
|
|||
|
|
placeholder="请输入详细地址"
|
|||
|
|
v-model="addPostFactorForm.address"
|
|||
|
|
></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<!-- <el-form-item
|
|||
|
|
label="二维码："
|
|||
|
|
v-if="props.form && Object.keys(props.form).length > 0"
|
|||
|
|
>
|
|||
|
|
<img
|
|||
|
|
width="200px"
|
|||
|
|
height="200px"
|
|||
|
|
:src="addPostFactorForm.qrCode"
|
|||
|
|
alt=""
|
|||
|
|
/>
|
|||
|
|
</el-form-item> -->
|
|||
|
|
</el-form>
|
|||
|
|
</div>
|
|||
|
|
</BaseDialog>
|
|||
|
|
</template>
|
|||
|
|
<script setup lang="ts" >
|
|||
|
|
import { reactive, ref, onMounted, watch } from "vue";
|
|||
|
|
import useUserStore from "@/store/modules/user";
|
|||
|
|
import { ElMessage, FormInstance, FormRules } from "element-plus";
|
|||
|
|
import { getYears, getUUID, FileType } from "@/utils/common";
|
|||
|
|
import { delOthpersonHouse, getOtheWareHouseList,getHouseSysUser } from "@/api/Othteam";
|
|||
|
|
import { areaTree } from "@/api/account";
|
|||
|
|
const formRef = ref<FormInstance>();
|
|||
|
|
const userStore = useUserStore();
|
|||
|
|
const user = ref(JSON.parse(userStore.userInfo));
|
|||
|
|
const userId = ref(user.value.userId);
|
|||
|
|
const uuid = ref("");
|
|||
|
|
const ruleForm = reactive<FormRules>({
|
|||
|
|
houseName: [{ required: true, message: "请输入仓库名称", trigger: "blur" }],
|
|||
|
|
telephone: [
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
message: "请输入仓库管理员联系方式",
|
|||
|
|
trigger: "blur",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
orgCode: [
|
|||
|
|
{ required: true, message: "请选择仓库所属地区", trigger: "change" },
|
|||
|
|
],
|
|||
|
|
possession: [
|
|||
|
|
{ required: true, message: "请输入仓库所属单位", trigger: "blur" },
|
|||
|
|
],
|
|||
|
|
address: [{ required: true, message: "请输入仓库", trigger: "blur" }],
|
|||
|
|
name: [
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
message: "请选择仓库管理员",
|
|||
|
|
trigger: "change",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
});
|
|||
|
|
const adminOptions = ref([])
|
|||
|
|
const props = defineProps({
|
|||
|
|
visible: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: false,
|
|||
|
|
},
|
|||
|
|
form: Object,
|
|||
|
|
readonly: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: false,
|
|||
|
|
},
|
|||
|
|
id: String,
|
|||
|
|
});
|
|||
|
|
const listperformid = ref(props.id);
|
|||
|
|
const addPostFactorForm = ref(<any>{});
|
|||
|
|
const emits = defineEmits(["close", "onSubmit"]);
|
|||
|
|
//保存并退出
|
|||
|
|
const handleSubmit = () => {
|
|||
|
|
formRef.value?.validate((valid) => {
|
|||
|
|
if (valid) {
|
|||
|
|
// addPostFactorForm.value.chinaname = adminId.value;
|
|||
|
|
addPostFactorForm.value.houseId =
|
|||
|
|
addPostFactorForm.value.houseId || uuid.value;
|
|||
|
|
addPostFactorForm.value.userId = userId.value;
|
|||
|
|
delOthpersonHouse(addPostFactorForm.value).then((res: any) => {
|
|||
|
|
if (res.code == 1) {
|
|||
|
|
ElMessage.success({
|
|||
|
|
message: "保存成功",
|
|||
|
|
type: "success",
|
|||
|
|
});
|
|||
|
|
onclone();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
// 政府用户列表
|
|||
|
|
const getGovUserList = () => {
|
|||
|
|
getHouseSysUser(userId.value).then((res:any) => {
|
|||
|
|
adminOptions.value = res.data;
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
//获取地区
|
|||
|
|
const orgList = ref([]);
|
|||
|
|
const getareaTree = () => {
|
|||
|
|
areaTree(userId.value).then((res: any) => {
|
|||
|
|
orgList.value = res.data;
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
const handleAreaChange = (val) => {
|
|||
|
|
addPostFactorForm.value.orgCode = addPostFactorForm.value.orgCode[addPostFactorForm.value.orgCode.length - 1];
|
|||
|
|
addPostFactorForm.value.streetCode = val[1] || "";
|
|||
|
|
addPostFactorForm.value.communityCode = val[2] || "";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//选择管理员数据处理
|
|||
|
|
const condition =ref('')
|
|||
|
|
const remoteMethod = (val) => {
|
|||
|
|
condition.value = val;
|
|||
|
|
getGovUserList();
|
|||
|
|
}
|
|||
|
|
//选择管理员数据处理
|
|||
|
|
const adminId =ref('')
|
|||
|
|
const adminOption = (val) => {
|
|||
|
|
adminId.value = val;
|
|||
|
|
}
|
|||
|
|
//关闭弹窗
|
|||
|
|
const onclone = () => {
|
|||
|
|
emits("close");
|
|||
|
|
};
|
|||
|
|
onMounted(() => {
|
|||
|
|
getGovUserList();
|
|||
|
|
getareaTree();
|
|||
|
|
});
|
|||
|
|
watch(
|
|||
|
|
() => props.form,
|
|||
|
|
(val) => {
|
|||
|
|
uuid.value = getUUID();
|
|||
|
|
if (val) {
|
|||
|
|
if (!props.visible) return;
|
|||
|
|
addPostFactorForm.value = val;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.detailForm-content {
|
|||
|
|
margin-right: 30px;
|
|||
|
|
}
|
|||
|
|
:deep(.el-form) {
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
// justify-content: space-around;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
:deep(.el-form-item) {
|
|||
|
|
width: 47%;
|
|||
|
|
}
|
|||
|
|
</style>
|