尾矿库
parent
4ed118ed74
commit
20617cf378
|
|
@ -141,6 +141,17 @@ const routes = [
|
|||
},
|
||||
component: () => import("@/views/emergency_storage/index"),
|
||||
},
|
||||
{
|
||||
path: "/tailings_reservoir",
|
||||
name: "/tailings_reservoir",
|
||||
meta: {
|
||||
title: "尾矿库",
|
||||
breadcrumb: true,
|
||||
isMenu: true,
|
||||
isSubMenu: false,
|
||||
},
|
||||
component: () => import("@/views/tailings_reservoir/index"),
|
||||
},
|
||||
{
|
||||
path: "/system_management/data_dictionary",
|
||||
name: "/system_management/data_dictionary",
|
||||
|
|
@ -150,7 +161,8 @@ const routes = [
|
|||
isMenu: true,
|
||||
isSubMenu: false,
|
||||
},
|
||||
component: () => import("@/views/system_management/data_dictionary/index"),
|
||||
component: () =>
|
||||
import("@/views/system_management/data_dictionary/index"),
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,398 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
v-model="visible"
|
||||
:title="type === 'edit' ? '修改' : '新增'"
|
||||
:before-close="fnClose"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="data.rules"
|
||||
label-width="100px"
|
||||
style="margin-top: 20px"
|
||||
>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="尾矿库名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入尾矿库名称" />
|
||||
</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="area">
|
||||
<layout-cascader
|
||||
v-model="form.area"
|
||||
v-model:name="form.areaName"
|
||||
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
|
||||
:check-strictly="false"
|
||||
:level="4"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="运行状态" prop="runningStatus">
|
||||
<el-select
|
||||
v-model="form.runningStatus"
|
||||
placeholder="请选择运行状态"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in runningStatusList"
|
||||
: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="hasProductionEntity">
|
||||
<el-select
|
||||
v-model="form.hasProductionEntity"
|
||||
placeholder="请选择是否有生产经营主体"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in hasOrNoList"
|
||||
: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="isOverheadVault">
|
||||
<el-select
|
||||
v-model="form.isOverheadVault"
|
||||
placeholder="请选择是否为”头顶库“"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in yesOrNoList"
|
||||
: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="mineralSpecies">
|
||||
<el-select v-model="form.mineralSpecies" placeholder="请选择矿种">
|
||||
<el-option
|
||||
v-for="item in mineralSpeciesList"
|
||||
: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="designGrade">
|
||||
<el-select v-model="form.designGrade" placeholder="请选择设计等别">
|
||||
<el-option
|
||||
v-for="item in designGradeList"
|
||||
: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="currentGrade">
|
||||
<el-select v-model="form.currentGrade" placeholder="请选择现状等别">
|
||||
<el-option
|
||||
v-for="item in currentGradeList"
|
||||
: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="designDamHeight">
|
||||
<el-input-number
|
||||
v-model="form.designDamHeight"
|
||||
:precision="2"
|
||||
:step="0.1"
|
||||
placeholder="请输入设计坝高"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="现状坝高" prop="currentDamHeight">
|
||||
<el-input-number
|
||||
v-model="form.currentDamHeight"
|
||||
:precision="2"
|
||||
:step="0.1"
|
||||
placeholder="请输入现状坝高"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="人口数" prop="population">
|
||||
<el-input-number
|
||||
v-model="form.population"
|
||||
placeholder="请输入人口数"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="险情等级" prop="dangerousSituation">
|
||||
<el-select
|
||||
v-model="form.dangerousSituation"
|
||||
placeholder="请选择险情等级"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in dangerousSituationList"
|
||||
: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="surveySituation">
|
||||
<el-input
|
||||
v-model="form.surveySituation"
|
||||
placeholder="请输入勘察情况"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="治理情况" prop="governanceSituation">
|
||||
<el-input
|
||||
v-model="form.governanceSituation"
|
||||
placeholder="请输入治理情况"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="搬迁情况" prop="relocationSituation">
|
||||
<el-input
|
||||
v-model="form.relocationSituation"
|
||||
placeholder="请输入搬迁情况"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="风险等级" prop="riskLevel">
|
||||
<el-select v-model="form.riskLevel" placeholder="请选择风险等级">
|
||||
<el-option label="低风险" value="1" />
|
||||
<el-option label="中风险" value="2" />
|
||||
<el-option label="高风险" value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item label="规模与形态描述" prop="scaleDescription">
|
||||
<el-input
|
||||
v-model="form.scaleDescription"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="请输入规模与形态描述"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<div style="display: flex">
|
||||
<el-form-item label="经度" prop="longitude" style="flex: 1">
|
||||
<el-input v-model="form.longitude" placeholder="请选择经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude" style="flex: 1">
|
||||
<el-input v-model="form.latitude" placeholder="请选择纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label-width="10px">
|
||||
<el-button
|
||||
class="ml-10"
|
||||
type="primary"
|
||||
@click="fnSelectedPosition"
|
||||
>点击定位</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<el-button @click="fnClose">取 消</el-button>
|
||||
<el-button type="primary" @click="fnSubmit">确 定</el-button>
|
||||
</template>
|
||||
|
||||
<app-map
|
||||
v-model:visible="mapDialog.visible"
|
||||
v-model:longitude="mapDialog.longitude"
|
||||
v-model:latitude="mapDialog.latitude"
|
||||
@submit="fnMapSubmit"
|
||||
/>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { debounce } from "throttle-debounce";
|
||||
import { getDataDictionary } from "@/request/data_dictionary.js";
|
||||
import useFormValidate from "@/hooks/useFormValidate.js";
|
||||
import LayoutCascader from "@/components/layout_cascader/index.vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { reactive, ref } from "vue";
|
||||
import { useVModels } from "@vueuse/core";
|
||||
import AppMap from "@/components/map/map.vue";
|
||||
import {
|
||||
setGeologicalDisasterAdd,
|
||||
setGeologicalDisasterUpdate,
|
||||
} from "@/request/kangzai.js";
|
||||
|
||||
const props = defineProps({
|
||||
visible: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
default: false,
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
required: true,
|
||||
default: "",
|
||||
},
|
||||
form: {
|
||||
type: Object,
|
||||
required: true,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
const { validate, formRef } = useFormValidate();
|
||||
|
||||
const emits = defineEmits(["update:visible", "update:form", "getData"]);
|
||||
const { visible, form } = useVModels(props, emits);
|
||||
|
||||
// 字典数据
|
||||
const runningStatusList = ref([]);
|
||||
const mineralSpeciesList = ref([]);
|
||||
const designGradeList = ref([]);
|
||||
const currentGradeList = ref([]);
|
||||
const yesOrNoList = [
|
||||
{ name: "是", bianma: "1" },
|
||||
{ name: "否", bianma: "2" },
|
||||
];
|
||||
const hasOrNoList = [
|
||||
{ name: "有", bianma: "1" },
|
||||
{ name: "无", bianma: "2" },
|
||||
];
|
||||
const fnGetDictData = async () => {
|
||||
const [runningStatusRes, mineralSpeciesRes, designGradeRes, currentGradeRes] =
|
||||
await Promise.all([
|
||||
getDataDictionary({ parentId: "b62cbaa90f9936bca50e48e8e853150a" }),
|
||||
getDataDictionary({ parentId: "306f753002bc728163a3b14911b21d1d" }),
|
||||
getDataDictionary({ parentId: "f32b9172ba95c27041c2289d03e6133f" }),
|
||||
getDataDictionary({ parentId: "039bed1c0f108325bf800e4e4fe88b12" }),
|
||||
getDataDictionary({ parentId: "c8e9f0a1b2c347d56e7f8a9b0c1d2e3f" }),
|
||||
]);
|
||||
runningStatusList.value = runningStatusRes.dictionariesList;
|
||||
mineralSpeciesList.value = mineralSpeciesRes.dictionariesList;
|
||||
designGradeList.value = designGradeRes.dictionariesList;
|
||||
currentGradeList.value = currentGradeRes.dictionariesList;
|
||||
};
|
||||
fnGetDictData();
|
||||
|
||||
const data = reactive({
|
||||
rules: {
|
||||
name: [{ required: true, message: "请输入尾矿库名称", trigger: "blur" }],
|
||||
area: [{ required: true, message: "请选择区域", trigger: "blur" }],
|
||||
mineralSpecies: [
|
||||
{ required: true, message: "请选择灾害类型", trigger: "change" },
|
||||
],
|
||||
scale: [{ required: true, message: "请选择规模", trigger: "change" }],
|
||||
stability: [{ required: true, message: "请选择稳定性", trigger: "change" }],
|
||||
households: [{ required: true, message: "请输入户数", trigger: "blur" }],
|
||||
population: [{ required: true, message: "请输入人口数", trigger: "blur" }],
|
||||
dangerousSituation: [
|
||||
{ required: true, message: "请选择险情等级", trigger: "change" },
|
||||
],
|
||||
surveySituation: [
|
||||
{ required: true, message: "请选择勘察情况", trigger: "change" },
|
||||
],
|
||||
governanceSituation: [
|
||||
{ required: true, message: "请选择治理情况", trigger: "change" },
|
||||
],
|
||||
relocationSituation: [
|
||||
{ required: true, message: "请选择搬迁情况", trigger: "change" },
|
||||
],
|
||||
riskLevel: [
|
||||
{ required: true, message: "请选择风险等级", trigger: "change" },
|
||||
],
|
||||
longitude: [{ required: true, message: "请输入经度", trigger: "blur" }],
|
||||
latitude: [{ required: true, message: "请输入纬度", trigger: "blur" }],
|
||||
},
|
||||
});
|
||||
|
||||
const mapDialog = ref({
|
||||
visible: false,
|
||||
longitude: "",
|
||||
latitude: "",
|
||||
});
|
||||
const fnSelectedPosition = () => {
|
||||
mapDialog.value.visible = true;
|
||||
mapDialog.value.longitude = form.value.longitude;
|
||||
mapDialog.value.latitude = form.value.latitude;
|
||||
};
|
||||
const fnMapSubmit = ({ longitude, latitude }) => {
|
||||
form.value.longitude = longitude;
|
||||
form.value.latitude = latitude;
|
||||
};
|
||||
|
||||
const fnClose = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
|
||||
const fnSubmit = debounce(
|
||||
1000,
|
||||
async () => {
|
||||
await validate();
|
||||
const param = {
|
||||
...form.value,
|
||||
areaName: form.value.areaName.join("-"),
|
||||
province: form.value.area[0],
|
||||
city: form.value.area[1],
|
||||
county: form.value.area[2],
|
||||
village: form.value.area[3],
|
||||
street: form.value.area[4],
|
||||
};
|
||||
delete param.area;
|
||||
|
||||
if (props.type === "add") {
|
||||
await setGeologicalDisasterAdd(param);
|
||||
} else if (props.type === "edit") {
|
||||
await setGeologicalDisasterUpdate(param);
|
||||
}
|
||||
|
||||
ElMessage.success("操作成功");
|
||||
fnClose();
|
||||
emits("getData");
|
||||
},
|
||||
{ atBegin: true }
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -0,0 +1,199 @@
|
|||
<template>
|
||||
<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>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item label="属地" prop="area">
|
||||
<layout-cascader
|
||||
v-model="searchForm.area"
|
||||
:dictionaries-id="'e725d2a91b8248f4b8f49889038df7de'"
|
||||
:check-strictly="true"
|
||||
:level="5"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item label="地形地貌" prop="terrain">
|
||||
<el-select v-model="searchForm.terrain" placeholder="请选择地形地貌">
|
||||
<el-option
|
||||
v-for="item in terrainList"
|
||||
:key="item.bianma"
|
||||
:label="item.name"
|
||||
:value="item.bianma"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item label="灾害类型" prop="disasterType">
|
||||
<el-select
|
||||
v-model="searchForm.disasterType"
|
||||
placeholder="请选择灾害类型"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in disasterTypeList"
|
||||
:key="item.bianma"
|
||||
:label="item.name"
|
||||
:value="item.bianma"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</app-search>
|
||||
|
||||
<app-table v-model:pagination="pagination" :data="list" @get-data="getData">
|
||||
<el-table-column prop="disasterName" label="灾害点名称" />
|
||||
<el-table-column prop="areaName" label="属地" />
|
||||
<el-table-column prop="terrainName" label="地形地貌" />
|
||||
<el-table-column prop="disasterTypeName" label="灾害类型" />
|
||||
<el-table-column label="操作" width="120">
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" text link @click="fnAddOrEdit(row, 'edit')"
|
||||
>编辑</el-button
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
text
|
||||
link
|
||||
@click="fnDelete(row.geologicalDisasterId)"
|
||||
>删除</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #button>
|
||||
<el-button type="primary" @click="fnAddOrEdit('', 'add')"
|
||||
>新增</el-button
|
||||
>
|
||||
</template>
|
||||
</app-table>
|
||||
|
||||
<add
|
||||
v-model:form="data.addOrEditDialog.form"
|
||||
v-model:visible="data.addOrEditDialog.visible"
|
||||
:type="data.addOrEditDialog.type"
|
||||
@get-data="resetPagination"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, nextTick } from "vue";
|
||||
import { getDataDictionary } from "@/request/data_dictionary.js";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import LayoutCascader from "@/components/layout_cascader/index.vue";
|
||||
import AppTable from "@/components/table/index.vue";
|
||||
import AppSearch from "@/components/search/index.vue";
|
||||
import useListData from "@/hooks/useListData.js";
|
||||
import {
|
||||
getGeologicalDisasterPage,
|
||||
setGeologicalDisasterDelete,
|
||||
} from "@/request/kangzai.js";
|
||||
import Add from "./components/add.vue";
|
||||
|
||||
const terrainList = ref([]);
|
||||
const disasterTypeList = ref([]);
|
||||
|
||||
const fnGetDictData = async () => {
|
||||
const [terrainRes, disasterTypeRes] = await Promise.all([
|
||||
getDataDictionary({ parentId: "b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6q" }),
|
||||
getDataDictionary({ parentId: "c3d4e5f6g7h8i9j0k1l2m3n4o5p6q7r" }),
|
||||
]);
|
||||
terrainList.value = terrainRes.dictionariesList;
|
||||
disasterTypeList.value = disasterTypeRes.dictionariesList;
|
||||
};
|
||||
fnGetDictData();
|
||||
|
||||
const { list, pagination, searchForm, resetPagination, getData } = useListData(
|
||||
getGeologicalDisasterPage,
|
||||
{
|
||||
beforeGetData: (searchForm) => {
|
||||
const area = searchForm.area || [];
|
||||
searchForm.province = area[0];
|
||||
searchForm.city = area[1];
|
||||
searchForm.county = area[2];
|
||||
searchForm.village = area[3];
|
||||
searchForm.street = area[4];
|
||||
},
|
||||
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;
|
||||
});
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const data = reactive({
|
||||
addOrEditDialog: {
|
||||
visible: false,
|
||||
type: "",
|
||||
form: {
|
||||
disasterName: "",
|
||||
province: "",
|
||||
city: "",
|
||||
county: "",
|
||||
village: "",
|
||||
street: "",
|
||||
area: [],
|
||||
areaName: [],
|
||||
terrain: "",
|
||||
disasterType: "",
|
||||
scaleDescription: "",
|
||||
scale: "",
|
||||
stability: "",
|
||||
households: "",
|
||||
population: "",
|
||||
dangerousSituation: "",
|
||||
surveySituation: "",
|
||||
governanceSituation: "",
|
||||
relocationSituation: "",
|
||||
riskLevel: "",
|
||||
longitude: "",
|
||||
latitude: "",
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const fnDelete = async (geologicalDisasterId) => {
|
||||
await ElMessageBox.confirm("确定要删除吗？", { type: "warning" });
|
||||
await setGeologicalDisasterDelete({ geologicalDisasterId });
|
||||
ElMessage.success("删除成功");
|
||||
resetPagination();
|
||||
};
|
||||
|
||||
const fnAddOrEdit = async (row, type) => {
|
||||
data.addOrEditDialog.visible = true;
|
||||
await nextTick();
|
||||
data.addOrEditDialog.form = {};
|
||||
data.addOrEditDialog.type = type;
|
||||
|
||||
if (type === "edit") {
|
||||
data.addOrEditDialog.form = row;
|
||||
data.addOrEditDialog.form.area = [
|
||||
row.province,
|
||||
row.city,
|
||||
row.county,
|
||||
row.village,
|
||||
row.street,
|
||||
];
|
||||
data.addOrEditDialog.form.areaName = row.areaName.split("-");
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
Loading…
Reference in New Issue