feat(tailings_reservoir):尾矿库信息页面

- 新增尾矿库信息页面,包括搜索、列表和添加功能
- 添加尾矿库基本信息字段,如名称、地址、运行状态等- 集成字典数据获取,支持运行状态、设计等别等字段的展示
-优化属地选择组件,设置为4级联动
master
fangjiakai 2025-06-10 19:19:07 +08:00
parent 5d0ebba6fa
commit 62dabd6574
8 changed files with 123 additions and 69 deletions

View File

@ -21,18 +21,41 @@
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="应急库级别" prop="emergencyLevel">
<el-select
v-model="form.emergencyLevel"
placeholder="请选择应急库级别"
filterable
>
<el-option
v-for="item in emergencyLevelList"
:key="item.bianma"
:label="item.name"
:value="item.bianma"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="属地" prop="area">
<layout-cascader
v-model="form.area"
v-model:name="form.areaName"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="false"
:check-strictly="true"
:level="4"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="地址" prop="address">
<el-input v-model="form.address" placeholder="请输入地址" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="应急库类型" prop="storageType">
<el-select
@ -127,14 +150,17 @@ const props = defineProps({
});
const { validate, formRef } = useFormValidate();
const storageTypeList = ref([]);
const fnGetStorageTypeList = async () => {
const resData = await getDataDictionary({
parentId: "j0k1l2m3n4o5p6q7r8s9t0u1v2w3x4y",
});
storageTypeList.value = resData.dictionariesList;
};
fnGetStorageTypeList();
const emergencyLevelList = ref([]);
const fnGetDictData = async () => {
const [storageTypeRes, emergencyLevelRes] = await Promise.all([
getDataDictionary({ parentId: "j0k1l2m3n4o5p6q7r8s9t0u1v2w3x4y" }),
getDataDictionary({ parentId: "870745cbf63985632dd43d9e56a62cb9" }),
]);
storageTypeList.value = storageTypeRes.dictionariesList;
emergencyLevelList.value = emergencyLevelRes.dictionariesList;
};
fnGetDictData();
const emits = defineEmits(["update:visible", "update:form", "getData"]);
const { visible, form } = useVModels(props, emits);
const data = reactive({
@ -142,7 +168,11 @@ const data = reactive({
storageName: [
{ required: true, message: "请输入应急库名称", trigger: "blur" },
],
emergencyLevel: [
{ required: true, message: "请选择应急库等级", trigger: "change" },
],
area: [{ required: true, message: "请输入应急库区域", trigger: "blur" }],
address: [{ required: true, message: "请输入应急库地址", trigger: "blur" }],
longitude: [{ required: true, message: "请输入经度", trigger: "blur" }],
latitude: [{ required: true, message: "请输入纬度", trigger: "blur" }],
},

View File

@ -15,7 +15,7 @@
v-model="searchForm.area"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="true"
:level="5"
:level="4"
/>
</el-form-item>
</el-col>
@ -124,8 +124,10 @@ const data = reactive({
form: {
storageName: "",
storageType: "",
emergencyLevel: "",
area: [],
areaName: [],
address: "",
managementUnit: "",
longitude: "",
latitude: "",

View File

@ -16,7 +16,7 @@
v-model="searchForm.area"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="true"
:level="5"
:level="4"
/>
</el-form-item>
</el-col>

View File

@ -299,8 +299,15 @@ const data = reactive({
countyWarningOfficer: [
{ required: true, message: "请输入县级预警负责人", trigger: "blur" },
],
countyWarningPhone: [
{ required: true, message: "请输入县级预警负责人电话", trigger: "blur" },
],
countyWarningOfficerPhone: [
{ required: true, message: "请输入县级预警负责人手机号", trigger: "blur" },
{
required: true,
message: "请输入县级预警负责人手机号",
trigger: "blur",
},
],
countyOfficer: [
{ required: true, message: "请输入县级责任人姓名", trigger: "blur" },

View File

@ -15,7 +15,7 @@
v-model="searchForm.area"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="true"
:level="5"
:level="4"
/>
</el-form-item>
</el-col>

View File

@ -38,10 +38,10 @@
</el-col>
<el-col :span="24">
<el-form-item label="水库等级" prop="reservoirLevel">
<el-form-item label="工程规模" prop="reservoirLevel">
<el-select
v-model="form.reservoirLevel"
placeholder="请选择水库等级"
placeholder="请选择工程规模"
>
<el-option
v-for="item in reservoirLevelList"
@ -157,9 +157,6 @@ const data = reactive({
reservoirName: [
{ required: true, message: "请输入水库名称", trigger: "blur" },
],
reservoirType: [
{ required: true, message: "请选择水库类型", trigger: "change" },
],
reservoirLevel: [
{ required: true, message: "请选择水库等级", trigger: "change" },
],

View File

@ -2,11 +2,8 @@
<div>
<app-search v-model="searchForm" @submit="resetPagination">
<el-col :span="6">
<el-form-item label="灾害点名称" prop="disasterName">
<el-input
v-model="searchForm.disasterName"
placeholder="请输入灾害点名称"
/>
<el-form-item label="尾矿库名称" prop="name">
<el-input v-model="searchForm.name" placeholder="请输入尾矿库名称" />
</el-form-item>
</el-col>
@ -16,16 +13,19 @@
v-model="searchForm.area"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="true"
:level="5"
:level="4"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="地形地貌" prop="terrain">
<el-select v-model="searchForm.terrain" placeholder="请选择地形地貌">
<el-form-item label="运行状态" prop="runningStatus">
<el-select
v-model="searchForm.runningStatus"
placeholder="请选择运行状态"
>
<el-option
v-for="item in terrainList"
v-for="item in runningStatusList"
:key="item.bianma"
:label="item.name"
:value="item.bianma"
@ -35,13 +35,13 @@
</el-col>
<el-col :span="6">
<el-form-item label="灾害类型" prop="disasterType">
<el-form-item label="设计等别" prop="designGrade">
<el-select
v-model="searchForm.disasterType"
placeholder="请选择灾害类型"
v-model="searchForm.designGrade"
placeholder="请选择设计等别"
>
<el-option
v-for="item in disasterTypeList"
v-for="item in designGradeList"
:key="item.bianma"
:label="item.name"
:value="item.bianma"
@ -52,10 +52,11 @@
</app-search>
<app-table v-model:pagination="pagination" :data="list" @get-data="getData">
<el-table-column prop="disasterName" label="灾害点名称" />
<el-table-column prop="name" label="尾矿库名称" />
<el-table-column prop="areaName" label="属地" />
<el-table-column prop="terrainName" label="地形地貌" />
<el-table-column prop="disasterTypeName" label="灾害类型" />
<el-table-column prop="runningStatusLabel" label="运行状态" />
<el-table-column prop="designGradeLabel" label="设计等别" />
<el-table-column prop="currentGradeLabel" label="现状等别" />
<el-table-column label="操作" width="120">
<template #default="{ row }">
<el-button type="primary" text link @click="fnAddOrEdit(row, 'edit')"
@ -65,7 +66,7 @@
type="primary"
text
link
@click="fnDelete(row.geologicalDisasterId)"
@click="fnDelete(row.tailingsReservoirId)"
>删除</el-button
>
</template>
@ -95,26 +96,30 @@ import AppTable from "@/components/table/index.vue";
import AppSearch from "@/components/search/index.vue";
import useListData from "@/hooks/useListData.js";
import {
getGeologicalDisasterPage,
setGeologicalDisasterDelete,
setTailingsReservoirDelete,
setTailingsReservoirListPage,
} from "@/request/kangzai.js";
import Add from "./components/add.vue";
const terrainList = ref([]);
const disasterTypeList = ref([]);
//
const runningStatusList = ref([]);
const designGradeList = ref([]);
const currentGradeList = ref([]);
const fnGetDictData = async () => {
const [terrainRes, disasterTypeRes] = await Promise.all([
getDataDictionary({ parentId: "b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6q" }),
getDataDictionary({ parentId: "c3d4e5f6g7h8i9j0k1l2m3n4o5p6q7r" }),
const [runningRes, designRes, currentRes] = await Promise.all([
getDataDictionary({ parentId: "b62cbaa90f9936bca50e48e8e853150a" }),
getDataDictionary({ parentId: "f32b9172ba95c27041c2289d03e6133f" }),
getDataDictionary({ parentId: "039bed1c0f108325bf800e4e4fe88b12" }),
]);
terrainList.value = terrainRes.dictionariesList;
disasterTypeList.value = disasterTypeRes.dictionariesList;
runningStatusList.value = runningRes.dictionariesList || [];
designGradeList.value = designRes.dictionariesList || [];
currentGradeList.value = currentRes.dictionariesList || [];
};
fnGetDictData();
const { list, pagination, searchForm, resetPagination, getData } = useListData(
getGeologicalDisasterPage,
setTailingsReservoirListPage,
{
beforeGetData: (searchForm) => {
const area = searchForm.area || [];
@ -126,13 +131,17 @@ const { list, pagination, searchForm, resetPagination, getData } = useListData(
},
callback: (list) => {
list.forEach((item) => {
item.terrainName =
terrainList.value.find((dict) => dict.bianma === item.terrain)
?.name || item.terrain;
item.disasterTypeName =
disasterTypeList.value.find(
(dict) => dict.bianma === item.disasterType
)?.name || item.disasterType;
item.runningStatusLabel =
runningStatusList.value.find(
(dict) => dict.bianma === item.runningStatus
)?.name || item.runningStatus;
item.designGradeLabel =
designGradeList.value.find((dict) => dict.bianma === item.designGrade)
?.name || item.designGrade;
item.currentGradeLabel =
currentGradeList.value.find(
(dict) => dict.bianma === item.currentGrade
)?.name || item.currentGrade;
});
},
}
@ -143,7 +152,9 @@ const data = reactive({
visible: false,
type: "",
form: {
disasterName: "",
tailingsReservoirId: "",
name: "",
address: "",
province: "",
city: "",
county: "",
@ -151,27 +162,34 @@ const data = reactive({
street: "",
area: [],
areaName: [],
terrain: "",
disasterType: "",
scaleDescription: "",
scale: "",
stability: "",
households: "",
population: "",
dangerousSituation: "",
surveySituation: "",
governanceSituation: "",
relocationSituation: "",
riskLevel: "",
longitude: "",
latitude: "",
runningStatus: "",
hasProductionEntity: "",
isOverheadVault: "",
mineralSpecies: "",
designGrade: "",
currentGrade: "",
designDamHeight: "",
currentDamHeight: "",
designStorageCapacity: "",
currentStorageCapacity: "",
isCloseToImportantRivers: "",
safetyProductionLicense: "",
effectiveDate: "",
expiryDate: "",
corpPrincipalName: "",
corpPrincipalPost: "",
corpPrincipalPhone: "",
creator: "",
createTime: "",
operator: "",
operatTime: "",
},
},
});
const fnDelete = async (geologicalDisasterId) => {
const fnDelete = async (tailingsReservoirId) => {
await ElMessageBox.confirm("确定要删除吗?", { type: "warning" });
await setGeologicalDisasterDelete({ geologicalDisasterId });
await setTailingsReservoirDelete({ tailingsReservoirId });
ElMessage.success("删除成功");
resetPagination();
};

View File

@ -16,7 +16,7 @@
v-model="searchForm.area"
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
:check-strictly="true"
:level="5"
:level="4"
/>
</el-form-item>
</el-col>