zhengsl/WholeProcessPlatform
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

地图功能修改

Browse Source
This commit is contained in:
扈兆增 2026-07-03 15:59:05 +08:00
parent 3200f1f36f
commit 60269f9d66
39 changed files with 1434 additions and 781 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend-sjtb/src/views/shuJuTianBao/guoYuSheShiShuJuHistory/index.vue
View File

@ -16,7 +16,7 @@
:search-params="{}"
:transform-data="customTransform"
>
<template #action="{ record }">
<template #action="{ record }">
<div class="flex">
<a-button type="link" size="small" @click="handleView(record)"
>查看</a-button
@ -199,7 +199,17 @@ const columns = computed(() => {
});
const handleView = (record: any) => {
currentRecord.value = { ...record };
const transformDashToNull = obj => {
const result = { ...obj };
for (const key in result) {
if (result[key] === '-') {
result[key] = null;
}
}
return result;
};
currentRecord.value = transformDashToNull(record);
editModalVisible.value = true;
};

87
frontend-sjtb/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/guoYuSheShiShuJuTianBaoForm.vue
View File

@ -246,51 +246,62 @@
:class="{ imgupload_hidden: isView }"
>
<a-form-item label="图片" name="picpth">
<a-upload
v-model:file-list="imageFileList"
list-type="picture-card"
:multiple="true"
accept=".png,.jpg,.jpeg"
:before-upload="beforeImageUpload"
@preview="handleImagePreview"
:disabled="isView"
:maxCount="5"
@remove="handleImageRemove"
>
<div v-if="!isView && imageFileList.length < 5">
<plus-outlined />
<div style="margin-top: 8px">上传</div>
</div>
</a-upload>
<div class="flex align-center">
<a-upload
v-show="!isView"
v-model:file-list="imageFileList"
list-type="picture-card"
:multiple="true"
accept=".png,.jpg,.jpeg"
:before-upload="beforeImageUpload"
@preview="handleImagePreview"
:disabled="isView"
:maxCount="5"
@remove="handleImageRemove"
>
<div v-if="!isView && imageFileList.length < 5">
<plus-outlined />
<div style="margin-top: 8px">上传</div>
</div>
</a-upload>
<span v-show="isView && imageFileList.length === 0">
暂无图片
</span>
</div>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item label="视频" name="vdpth">
<a-upload
v-if="!isView"
v-model:file-list="videoFileList"
list-type="text"
:multiple="true"
accept=".mp4"
:before-upload="beforeVideoUpload"
@preview="handleVideoPreview"
:disabled="isView"
:maxCount="5"
@remove="handleVideoRemove"
>
<a-button :disabled="isView && videoFileList.length < 5">
<upload-outlined />
上传视频 (MP4)
<div class="flex align-center">
<a-upload
v-if="!isView"
v-model:file-list="videoFileList"
list-type="text"
:multiple="true"
accept=".mp4"
:before-upload="beforeVideoUpload"
@preview="handleVideoPreview"
:disabled="isView"
:maxCount="5"
@remove="handleVideoRemove"
>
<a-button :disabled="isView && videoFileList.length < 5">
<upload-outlined />
上传视频 (MP4)
</a-button>
</a-upload>
<a-button
v-else-if="videoFileList.length > 0"
@click="handleVideoPreview"
>
点击预览视频
</a-button>
</a-upload>
<a-button
v-else-if="videoFileList.length > 0"
@click="handleVideoPreview"
>
点击预览视频
</a-button>
<span v-show="isView && videoFileList.length === 0">
暂无视频
</span>
</div>
</a-form-item>
</a-col>
</a-row>

14
frontend-sjtb/src/views/shuJuTianBao/guoYuSheShiShuJuTianBao/index.vue
View File

@ -401,8 +401,18 @@ const handleEdit = (record: any, type: string) => {
isView.value = true;
} else {
isView.value = false;
}
currentRecord.value = { ...record };
} // 浅层转换（只处理第一层属性）
const transformDashToNull = obj => {
const result = { ...obj };
for (const key in result) {
if (result[key] === '-') {
result[key] = null;
}
}
return result;
};
currentRecord.value = transformDashToNull(record);
editModalVisible.value = true;
};

83
frontend-sjtb/src/views/shuJuTianBao/shengPiJiLu/approvalDetailSearch.vue
View File

@ -14,22 +14,15 @@
</template>
<script lang="ts" setup>
import { ref, computed, onMounted } from "vue";
import dayjs from "dayjs";
import BasicSearch from "@/components/BasicSearch/index.vue";
import { DateSetting } from "@/utils/enumeration";
import { useShuJuTianBaoStore } from "@/store/modules/shuJuTianBao";
interface Props {
direction: any[];
guoyuStatus: any[];
}
const props = defineProps<Props>();
import { ref, computed, onMounted } from 'vue';
import dayjs from 'dayjs';
import BasicSearch from '@/components/BasicSearch/index.vue';
import { DateSetting } from '@/utils/enumeration';
import { useShuJuTianBaoStore } from '@/store/modules/shuJuTianBao';
const emit = defineEmits<{
(e: "reset", values: any): void;
(e: "search-finish", values: any): void;
(e: 'reset', values: any): void;
(e: 'search-finish', values: any): void;
}>();
const shuJuTianBaoStore = useShuJuTianBaoStore();
@ -37,51 +30,51 @@ const localTypeDate = ref<string>(null);
const basicSearchRef = ref<any>();
const initSearchData = {
rvcd: "all",
rvcd: 'all',
stcd: null,
rstcd: null,
strdt: [
dayjs().subtract(1, "month").startOf("month").format("YYYY-MM-DD"),
dayjs().endOf("day").format("YYYY-MM-DD"),
],
rstcd: null
// strdt: [
// dayjs().subtract(1, "month").startOf("month").format("YYYY-MM-DD"),
// dayjs().endOf("day").format("YYYY-MM-DD"),
// ],
};
const searchData = ref<any>({ ...initSearchData });
const searchList: any = computed(() => [
{
type: "waterStation",
name: "rvcd",
label: "流域",
type: 'waterStation',
name: 'rvcd',
label: '流域',
fieldProps: {
allowClear: true,
allowClear: true
},
options: [],
},
{
span: 12,
type: "RangePicker",
name: "strdt",
label: "过鱼时间",
picker: "date",
fieldProps: {
format: "YYYY-MM-DD",
valueFormat: "YYYY-MM-DD",
allowClear: false,
},
presets: DateSetting.RangeButton.month,
},
options: []
}
// {
// span: 12,
// type: "RangePicker",
// name: "strdt",
// label: "过鱼时间",
// picker: "date",
// fieldProps: {
// format: "YYYY-MM-DD",
// valueFormat: "YYYY-MM-DD",
// allowClear: false,
// },
// presets: DateSetting.RangeButton.month,
// },
]);
const onSearchFinish = (values: any) => {
emit("search-finish", values);
emit('search-finish', values);
};
const onValuesChange = (changedValues: any, allValues: any) => {
searchData.value = { ...searchData.value, ...allValues };
if (
Object.keys(changedValues)[0] == "rstcd" ||
Object.keys(changedValues)[0] == "rvcd"
Object.keys(changedValues)[0] == 'rstcd' ||
Object.keys(changedValues)[0] == 'rvcd'
) {
const formInstance = basicSearchRef.value?.formData;
formInstance.stcd = null;
@ -90,12 +83,12 @@ const onValuesChange = (changedValues: any, allValues: any) => {
const handleReset = () => {
localTypeDate.value = null;
emit("reset", initSearchData);
emit('reset', initSearchData);
};
onMounted(() => {
emit("search-finish", initSearchData);
shuJuTianBaoStore.getFpssOption("", "");
emit('search-finish', initSearchData);
shuJuTianBaoStore.getFpssOption('', '');
});
</script>

61
frontend-sjtb/src/views/shuJuTianBao/shengPiJiLu/index.vue
View File

@ -19,7 +19,7 @@
@selection-change="handleSelectionChange"
>
<!-- 使用 bodyCell 插槽自定义单元格渲染 -->
<template #action="{ column, record }">
<template #action="{ record }">
<div class="flex">
<a-button type="link" size="small" @click="handleShowDetail(record)"
>详情</a-button
@ -55,7 +55,7 @@
:list-url="getApprovalLogList"
:scroll-y="500"
>
<template #action="{ column, record }">
<template #action="{ record }">
{{ handName(record.action, actionTypeDict) }}
</template>
</BasicTable>
@ -82,13 +82,13 @@
:list-url="getApprovalChangeLogList"
:scroll-y="500"
>
<template #operationType="{ column, record }">
<template #operationType="{ record }">
{{ handName(record.operationType, operationTypeDict) }}
</template>
<template #bizType="{ column, record }">
<template #bizType="{ record }">
{{ handName(record.bizType, yeWuType) }}
</template>
<template #changeJson="{ column, record }">
<template #changeJson="{ record }">
<pre style="max-height: 200px; overflow: auto; margin: 0">{{
record.changeJson
}}</pre>
@ -122,7 +122,7 @@
:scroll-y="'500px'"
:transform-data="customTransform"
>
<template #isfs="{ column, record }">
<template #isfs="{ record }">
<a-tag
:color="
record.isfs === 1 || record.isfs === '1' ? 'success' : 'error'
@ -131,10 +131,10 @@
{{ record.isfs === 1 || record.isfs === '1' ? '是' : '否' }}
</a-tag>
</template>
<template #direction="{ column, record }">
<template #direction="{ record }">
{{ handName(record.direction, direction) }}
</template>
<template #action="{ column, record }">
<template #action="{ record }">
<a-button type="link" size="small" @click="handleView(record)"
>查看</a-button
>
@ -243,7 +243,7 @@ let columns = ref([
dataIndex: 'rvnm',
key: 'rvnm',
title: '流域',
width: 120,
width: 320,
fixed: 'left'
},
{
@ -346,7 +346,7 @@ let columns = ref([
{
title: '操作',
key: 'action',
width: 120,
width: 130,
fixed: 'right',
slots: { customRender: 'action' }
}
@ -504,7 +504,7 @@ const detailColumns = ref([
dataIndex: 'rvnm',
key: 'rvnm',
title: '流域',
width: 120,
width: 320,
fixed: 'left'
},
{
@ -518,7 +518,7 @@ const detailColumns = ref([
dataIndex: 'stnm',
key: 'stnm',
title: '过鱼设施名称',
width: 150,
width: 180,
fixed: 'left'
},
{ dataIndex: 'strdt', key: 'strdt', title: '过鱼时间', width: 150 },
@ -581,18 +581,18 @@ const handleDetailSearchFinish = (values: any) => {
dataType: 'string',
value: values.ftp
},
values.strdt && {
field: 'strdt',
operator: 'gte',
dataType: 'date',
value: values.strdt[0] + ' 00:00:00'
},
values.strdt && {
field: 'strdt',
operator: 'lte',
dataType: 'date',
value: values.strdt[1] + ' 23:59:59'
},
// values.strdt && {
// field: 'strdt',
// operator: 'gte',
// dataType: 'date',
// value: values.strdt[0] + ' 00:00:00'
// },
// values.strdt && {
// field: 'strdt',
// operator: 'lte',
// dataType: 'date',
// value: values.strdt[1] + ' 23:59:59'
// },
values.direction && {
field: 'direction',
operator: 'eq',
@ -643,7 +643,18 @@ const handleShowDetail = (record: any) => {
// 查看单条记录
const handleView = (record: any) => {
currentViewRecord.value = { ...record };
// 浅层转换（只处理第一层属性）
const transformDashToNull = obj => {
const result = { ...obj };
for (const key in result) {
if (result[key] === '-') {
result[key] = null;
}
}
return result;
};
currentViewRecord.value = transformDashToNull(record);
viewModalVisible.value = true;
};

1
frontend/.env.development
View File

@ -29,7 +29,6 @@ VITE_APP_TEST_ONLINE_URL = 'https://211.99.26.225:12122'
VITE_APP_BASE_API_URL = 'http://10.84.121.21:8093'
## 开发环境 附件服务地址
VITE_APP_ATTACHMENT_URL = 'https://211.99.26.225:12125'
attachment
# 地图服务地址
VITE_APP_MAP_URL = 'https://211.99.26.225:18085'

45
frontend/docs/问题.md
View File

@ -2,30 +2,33 @@
> 本记录用于跟踪项目开发过程中发现的问题，按日期倒序排列，并标注每项问题的发现人及处理状态。
***
---
## 问题列表（2026-06-26）
| 发现日期 | 解决人 | 编号 | 问题描述 | 状态 | 备注 |
| ---------- | ------ | -- | ------------------------------------- | -- | ------ |
| 2026-06-26 | 扈 | 1 | 基础信息图片展示是什么逻辑 | ✅ | <br /> |
| 2026-06-26 | 扈 | 2 | 电站专题展示逻辑 | ✅ | <br /> |
| 2026-06-26 | <br /> | 3 | 实时视频回放 少接口 | ⚠ | 缺少接口 |
| 2026-06-26 | <br /> | 4 | 预警提示 少接口 | ⚠ | 缺少接口 |
| 2026-06-26 | 扈 | 5 | 生态流量 达标率查询不对 | ✅ | <br /> |
| 2026-06-26 | 王 | 6 | 鱼类适应性繁殖同期对比 NAN | ⚠ | <br /> |
| 2026-06-26 | 扈 | 7 | 出库水温 综合分析 导出没做 | ✅ | <br /> |
| 2026-06-26 | <br /> | 8 | 栖息地-流量监测 没有水位视频和流量视频 字段没数据 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 9 | 栖息地 水温、水质、流量没有数据没法测 | ⚠ | <br /> |
| 2026-06-26 | 扈 | 10 | 鱼类增殖站 - 运行数据 要添加字典 | ✅ | <br /> |
| 2026-06-26 | 扈 | 11 | 珍惜植物园 - 种植要求字段不知道 | ✅ | <br /> |
| 2026-06-26 | 扈 | 12 | 水生调查断面 - 监测数据 不知道电导率，性腺发育期，早期资源量和种类 | ✅ | <br /> |
| 2026-06-26 | 扈 | 13 | 水电告警情况 生态流量 不知道字段 接口传参有问题 | ✅ | <br /> |
| 2026-06-26 | <br /> | 14 | 地图抽吸 碰撞检测 放大到具体层级锚点抽吸了但是 popup 弹框还在显示 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 15 | 地图比如积石峡 放大到层级被公伯峡隐藏掉了，然后在放大才显示 抽吸的问题 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 16 | 运行情况 计划开始运行时间 接口没接 | ⚠ | <br /> |
| 发现日期 | 解决人 | 编号 | 问题描述 | 状态 | 备注 |
| ---------- | ------ | ---- | ---------------------------------------------------------------------- | ------ | -------- |
| 2026-06-26 | 扈 | 1 | 基础信息图片展示是什么逻辑 | ✅ | <br /> |
| 2026-06-26 | 扈 | 2 | 电站专题展示逻辑 | ✅ | <br /> |
| 2026-06-26 | <br /> | 3 | 实时视频回放 少接口 | ⚠ | 缺少接口 |
| 2026-06-26 | <br /> | 4 | 预警提示 少接口 | ⚠ | 缺少接口 |
| 2026-06-26 | 扈 | 5 | 生态流量 达标率查询不对 | ✅ | <br /> |
| 2026-06-26 | 王 | 6 | 鱼类适应性繁殖同期对比 NAN | ⚠ | <br /> |
| 2026-06-26 | 扈 | 7 | 出库水温 综合分析 导出没做 | ✅ | <br /> |
| 2026-06-26 | <br /> | 8 | 栖息地-流量监测 没有水位视频和流量视频 字段没数据 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 9 | 栖息地 水温、水质、流量没有数据没法测 | ⚠ | <br /> |
| 2026-06-26 | 扈 | 10 | 鱼类增殖站 - 运行数据 要添加字典 | ✅ | <br /> |
| 2026-06-26 | 扈 | 11 | 珍惜植物园 - 种植要求字段不知道 | ✅ | <br /> |
| 2026-06-26 | 扈 | 12 | 水生调查断面 - 监测数据 不知道电导率，性腺发育期，早期资源量和种类 | ✅ | <br /> |
| 2026-06-26 | 扈 | 13 | 水电告警情况 生态流量 不知道字段 接口传参有问题 | ✅ | <br /> |
| 2026-06-26 | <br /> | 14 | 地图抽吸 碰撞检测 放大到具体层级锚点抽吸了但是 popup 弹框还在显示 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 15 | 地图比如积石峡 放大到层级被公伯峡隐藏掉了，然后在放大才显示 抽吸的问题 | ⚠ | <br /> |
| 2026-06-26 | <br /> | 16 | 运行情况 计划开始运行时间 接口没接 | ⚠ | <br /> |
| 2026-07-01 | 王 | 17 | 所有弹框加拖动 | <br /> | <br /> |
| 2026-07-01 | 王 | 18 | 所有弹框检查宽度有的是固定的 | <br /> | <br /> |
| 2026-07-02 | 扈 | 19 | 地图点击基地切换偶发性会全部展示出来所有锚点 | <br /> | <br /> |
***
---
## 状态说明
@ -33,6 +36,6 @@
- ⚠ – 处理中 / 待解决
- ❌ – 阻塞 / 未开始
***
---
、

2
frontend/package.json
View File

@ -21,6 +21,7 @@
"@wangeditor/editor": "^5.0.0",
"@wangeditor/editor-for-vue": "^5.1.10",
"ant-design-vue": "latest",
"antdv-draggable-modal": "^1.1.6",
"axios": "^1.2.0",
"better-scroll": "^2.4.2",
"cesium": "^1.141.0",
@ -52,6 +53,7 @@
"video.js": "^8.23.7",
"videojs-contrib-hls": "^5.15.0",
"vue": "^3.2.40",
"vue-ant-modal-enhance": "^1.2.2",
"vue-i18n": "^9.1.9",
"vue-router": "^4.1.6",
"vuedraggable": "^2.24.3",

29
frontend/pnpm-lock.yaml
View File

@ -41,6 +41,9 @@ importers:
ant-design-vue:
specifier: latest
version: 4.2.6(vue@3.5.33(typescript@6.0.3))
antdv-draggable-modal:
specifier: ^1.1.6
version: 1.1.6(ant-design-vue@4.2.6(vue@3.5.33(typescript@6.0.3)))(vue@3.5.33(typescript@6.0.3))
axios:
specifier: ^1.2.0
version: 1.15.2
@ -134,6 +137,9 @@ importers:
vue:
specifier: ^3.2.40
version: 3.5.33(typescript@6.0.3)
vue-ant-modal-enhance:
specifier: ^1.2.2
version: 1.2.2(ant-design-vue@4.2.6(vue@3.5.33(typescript@6.0.3)))(vue@3.5.33(typescript@6.0.3))
vue-i18n:
specifier: ^9.1.9
version: 9.14.5(vue@3.5.33(typescript@6.0.3))
@ -2220,6 +2226,13 @@ packages:
peerDependencies:
vue: '>=3.2.0'
antdv-draggable-modal@1.1.6:
resolution: {integrity: sha512-nGYIbkHfXBwKOtcw9lknpCdXK/Co0MpikywHREdgGI7dNm5c0zwHgolWf2XQSRvQx9sAtv2+BJYeDsJF77bncg==}
engines: {node: '>=18.0.0'}
peerDependencies:
ant-design-vue: '>=3.2.0 <4.0.0'
vue: '>=3.2.0 <3.4.0'
any-promise@1.3.0:
resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
@ -5360,6 +5373,12 @@ packages:
vscode-uri@3.1.0:
resolution: {integrity: sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==}
vue-ant-modal-enhance@1.2.2:
resolution: {integrity: sha512-gLozUM4K+pESYcV5ljsc9rAOvy94jL4fId4oNfuxu2pT/hx1HIGnQixi08yKV4FoBOwiFe4cd6dPVqCQLNAANQ==}
peerDependencies:
ant-design-vue: ^3.0.0 || ^4.0.0
vue: ^3.2.0
vue-component-type-helpers@3.2.7:
resolution: {integrity: sha512-+gPp5YGmhfsj1IN+xUo7y0fb4clfnOiiUA39y07yW1VzCRjzVgwLbtmdWlghh7mXrPsEaYc7rrIir/HT6C8vYQ==}
@ -8569,6 +8588,11 @@ snapshots:
vue-types: 3.0.2(vue@3.5.33(typescript@6.0.3))
warning: 4.0.3
antdv-draggable-modal@1.1.6(ant-design-vue@4.2.6(vue@3.5.33(typescript@6.0.3)))(vue@3.5.33(typescript@6.0.3)):
dependencies:
ant-design-vue: 4.2.6(vue@3.5.33(typescript@6.0.3))
vue: 3.5.33(typescript@6.0.3)
any-promise@1.3.0: {}
anymatch@3.1.3:
@ -11975,6 +11999,11 @@ snapshots:
vscode-uri@3.1.0: {}
vue-ant-modal-enhance@1.2.2(ant-design-vue@4.2.6(vue@3.5.33(typescript@6.0.3)))(vue@3.5.33(typescript@6.0.3)):
dependencies:
ant-design-vue: 4.2.6(vue@3.5.33(typescript@6.0.3))
vue: 3.5.33(typescript@6.0.3)
vue-component-type-helpers@3.2.7: {}
vue-demi@0.14.10(vue@3.5.33(typescript@6.0.3)):

9
frontend/src/api/map.ts
View File

@ -3,8 +3,10 @@ import request from '@/utils/request';
// 获取图例列表
export function getModuleMapLegendList(params?: { moduleId?: string }) {
const url = params?.moduleId
? `/api/wmp-sys-server/mapLegend/getModuleMapLegendList?moduleId=${params.moduleId}`
: '/api/wmp-sys-server/mapLegend/getModuleMapLegendList';
? // ? `/api/wmp-sys-server/mapLegend/getModuleMapLegendList?moduleId=${params.moduleId}`
// : '/api/wmp-sys-server/mapLegend/getModuleMapLegendList';
`/mapLegend/getModuleMapLegendList?moduleId=${params.moduleId}`
: '/mapLegend/getModuleMapLegendList';
return request({
url,
method: 'get'
@ -13,7 +15,8 @@ export function getModuleMapLegendList(params?: { moduleId?: string }) {
// 获取地图配置列表
export function getMapList(data: any) {
return request({
url: '/api/wmp-sys-server/mapmodule/getMapData',
// url: '/api/wmp-sys-server/mapmodule/getMapData',
url: '/mapmodule/getMapData',
method: 'post',
data
});

108
frontend/src/api/mapModal/index.ts
View File

@ -46,7 +46,7 @@ export function getBuildState(data: any) {
// 查询鱼类栖息地监测数据类型可用性
export function getFishTab(stcd: string) {
return request({
url: `/api/wmp-env-server/we/wer/getWeDefaultData`,
url: `/wte/we/wer/getWeDefaultData`,
method: 'get',
params: { stcd }
});
@ -86,15 +86,15 @@ export function getPanoramaList(data: any) {
// 实时视频
export function getVideoList(data: any) {
return request({
url: '/api/dec-lygk-base-server/base/msstbprpt/GetKendoList',
url: '/vd/msstbprpt/GetKendoList',
method: 'post',
data
});
}
// 录像视频 - 时间查询 没接
// 录像视频 - 时间查询
export function getNoLiveVideoYear(data: any) {
return request({
url: '/wmp-env-server/env/vd/GetKendoListCust',
url: '/vd/GetKendoListCust',
method: 'post',
data
});
@ -103,7 +103,7 @@ export function getNoLiveVideoYear(data: any) {
// 录像视频
export function getNoLiveVideoList(data: any) {
return request({
url: '/wmp-env-server/env/vd/runData/GetKendoListCust',
url: '/vd/runData/GetKendoListCust',
method: 'post',
data
});
@ -306,7 +306,6 @@ export function getFishZHFX(data: any) {
data
});
}
export function getRunStateAnalysis(data: any) {
return request({
url: '/fp/run/analysis/GetKendoListCust',
@ -314,51 +313,51 @@ export function getRunStateAnalysis(data: any) {
data
});
}
// ai运行识别 没接
// ai运行识别
export function getAIYXSB(data: any) {
return request({
url: '/api/dec-lygk-base-server/base/msstbprpt/getStInfoByStcd',
url: '/fp/msstbprpt/getStInfoByStcd',
method: 'get',
params: data
});
}
// ai运行识别 视频/表格 没接
// ai运行识别 视频/表格
export function getAIComList(data: any) {
return request({
url: '/wmp-env-server/env/ai/com/GetKendoListCust',
url: '/warn/ai/com/GetKendoListCust',
method: 'post',
data
});
}
// ai运行识别 日历 没接
// ai运行识别 日历
export function getAIComCalendar(data: any) {
return request({
url: '/wmp-env-server/env/ai/com/qgc/aiRecord/GetKendoListCust',
url: '/warn/ai/com/qgc/aiRecord/GetKendoListCust',
method: 'post',
data
});
}
// ai运行 日历点击 没接
// ai运行 日历点击
export function getAIComCalendarClick(data: any) {
return request({
url: '/wmp-env-server/env/ai/com/qgc/aiFile/GetKendoListCust',
url: '/warn/ai/com/qgc/aiFile/GetKendoListCust',
method: 'post',
data
});
}
// 鱼类增殖站 - 运行数据 -获取年 没接
// 鱼类增殖站 - 运行数据 -获取年
export function getFishProgressionYear(data: any) {
return request({
url: '/wmp-env-server/fb/fbrdmr/getFbRelatedYrByStcd',
url: '/fb/fbrdmr/getFbRelatedYrByStcd',
method: 'get',
params: data
});
}
//鱼类增殖站 - 运行数据 -获取鱼 没接
//鱼类增殖站 - 运行数据 -获取鱼
export function getFishProgressionFish(data: any) {
return request({
url: '/wmp-env-server/env/fishDic/stcd/GetKendoList',
url: '/fp/fishDic/stcd/GetKendoList',
method: 'post',
data
});
@ -367,7 +366,7 @@ export function getFishProgressionFish(data: any) {
// 过程图 - 亲鱼
export function getProcessDiagramParentFish(data: any) {
return request({
url: '/wmp-env-server/fb/bsmfr/fish/GetKendoListCust',
url: '/fb/bsmfr/fish/GetKendoListCust',
method: 'post',
data
});
@ -376,7 +375,7 @@ export function getProcessDiagramParentFish(data: any) {
// 过程图 - 产卵/孵化
export function getProcessDiagramHatch(data: any, type: 1 | 2) {
return request({
url: `/wmp-env-server/fb/fishhatchrecr/fish/GetKendoListCust?type=${type}`,
url: `/fb/fishhatchrecr/fish/GetKendoListCust?type=${type}`,
method: 'post',
data
});
@ -385,32 +384,31 @@ export function getProcessDiagramHatch(data: any, type: 1 | 2) {
// 过程图 - 鱼苗
export function getProcessDiagramFishFry(data: any) {
return request({
url: '/wmp-env-server/fb/fishbreedr/fish/GetKendoListCust',
url: '/fb/fishbreedr/fish/GetKendoListCust',
method: 'post',
data
});
}
//增值放流情况 获取年 没接
//增值放流情况 获取年
export function getNormalAddedSituationYear(data: any) {
return request({
url: '/wmp-env-server/fb/msfbrdm/fbFlData/GetKendoListCust',
url: '/fb/msfbrdm/fbFlData/GetKendoListCust',
method: 'post',
data
});
}
//增值放流情况 列表 没接
//增值放流情况 列表
export function getNormalAddedSituation(data: any) {
return request({
url: '/wmp-env-server/fb/msfbrdm/qgc/GetKendoListCust',
url: '/fb/msfbrdm/qgc/GetKendoListCust',
method: 'post',
data
});
}
// 科研情况 没接
// 科研情况
export function getNormalResearchSituation(data: any) {
return request({
url: '/wmp-env-server/base/researchb/GetKendoList',
url: '/fb/base/researchb/GetKendoList',
method: 'post',
data
});
@ -418,23 +416,23 @@ export function getNormalResearchSituation(data: any) {
// 珍稀植物园 - 运行数据 没接
export function getNormalDataMonitoring2Year(data: any) {
return request({
url: '/wmp-env-server/env/vpr/year/GetKendoListCust',
url: '/vap/vpr/year/GetKendoListCust',
method: 'post',
data
});
}
// 珍稀植物园 - 运行数据 列表 没接
// 珍稀植物园 - 运行数据 列表
export function getNormalDataMonitoring2List(data: any) {
return request({
url: '/wmp-env-server/env/vpr/basinVpIntDetail',
url: '/vap/vpr/basinVpIntDetail',
method: 'post',
data
});
}
// 珍稀动物园 - 监测数据 时间 没接
// 珍稀动物园 - 监测数据 时间
export function getNormal2Year(data: any) {
return request({
url: '/wmp-env-server/env/var/year/GetKendoListCust',
url: '/vap/var/year/GetKendoListCust',
method: 'post',
data
});
@ -443,7 +441,7 @@ export function getNormal2Year(data: any) {
// 珍稀动物园 - 监测数据 列表 没接
export function getNormal2List(data: any) {
return request({
url: '/wmp-env-server/env/var/GetKendoListCust',
url: '/vap/var/GetKendoListCust',
method: 'post',
data
});
@ -451,31 +449,23 @@ export function getNormal2List(data: any) {
// 水生生态调查断面 - 监测数据 年份 没接
export function getEcologyYear(data: any) {
return request({
url: '/wmp-env-server/we/wer/getWeYr',
url: '/wte/we/wer/getWeYr',
method: 'get',
params: data
});
}
// 水生生态调查断面 - 监测数据 调查批次 没接
// 水生生态调查断面 - 监测数据 调查批次
export function getEcologyBatch(data: any) {
return request({
url: '/wmp-env-server/env/we/fisht/GetKendoListCust',
url: '/wte/we/fisht/GetKendoListCust',
method: 'post',
data
});
}
// 水生生态调查断面 - 监测数据 保护类型 没接
export function getEcologyProtectType(data: any) {
return request({
url: '/api/dec-modules-usm-springcloud-starter/usm/v1/dict/getRemoteDictTreeValue',
method: 'get',
params: data
});
}
// 水生生态调查断面 - 监测数据 调查鱼类列表 没接
// 水生生态调查断面 - 监测数据 调查鱼类列表
export function getEcologyList(data: any) {
return request({
url: '/wmp-env-server/env/we/fisht/qgc/GetKendoListCust',
url: '/wte/we/fisht/qgc/GetKendoListCust',
method: 'post',
data
});
@ -483,7 +473,7 @@ export function getEcologyList(data: any) {
// 水生生态调查断面 - 监测数据 水温列表 没接
export function getEcologyList1(data: any) {
return request({
url: '/wmp-env-server/we/wewtr/GetKendoListCust',
url: '/wte/we/wewtr/GetKendoListCust',
method: 'post',
data
});
@ -491,7 +481,7 @@ export function getEcologyList1(data: any) {
// 水生生态调查断面 - 监测数据 水质列表 没接
export function getEcologyList2(data: any) {
return request({
url: '/wmp-env-server/we/wewqr/GetKendoListCust',
url: '/wte/we/wewqr/GetKendoListCust',
method: 'post',
data
});
@ -500,23 +490,23 @@ export function getEcologyList2(data: any) {
// 水生生态调查断面 - 监测数据 流速列表 没接
export function getEcologyList3(data: any) {
return request({
url: '/wmp-env-server/env/we/fvR/GetKendoListCust',
url: '/wte/we/fvR/GetKendoListCust',
method: 'post',
data
});
}
// 野生动物检测 -现场录像 - 年份 - 没接
// 野生动物检测 -现场录像 - 年份
export function getLiveFootageYear(data: any) {
return request({
url: '/wmp-env-server/env/wva/default/GetKendoListCust',
url: '/wte/wva/default/GetKendoListCust',
method: 'post',
data
});
}
// 野生动物检测 -现场录像 - 没接
// 野生动物检测 -现场录像
export function getLiveFootageList(data: any) {
return request({
url: '/wmp-env-server/env/wva/GetKendoListCust',
url: '/wte/wva/GetKendoListCust',
method: 'post',
data
});
@ -524,15 +514,15 @@ export function getLiveFootageList(data: any) {
// 鱼类分布明细 - 年 没接
export function getFishDistributionYear(data: any) {
return request({
url: '/wmp-env-server/we/wer/getWeYr',
url: '/wte/we/wer/getWeYr',
method: 'get',
params: data
});
}
// 鱼类分布明细 - 列表 没接
// 鱼类分布明细 - 列表
export function getFishDistributionList(data: any) {
return request({
url: '/wmp-env-server/env/we/fisht/qgc/GetKendoListCust',
url: '/wte/we/fisht/qgc/GetKendoListCust',
method: 'post',
data
});
@ -540,14 +530,14 @@ export function getFishDistributionList(data: any) {
// 生态流量泄放设施 - 监测数据 年份 没接
export function getFlowDischargeYear(data: any) {
return request({
url: '/wmp-env-server/env/operat/default/year',
url: '/eq/operat/default/year',
method: 'post',
data
});
}
export function getFlowDischargeList(code: string, data: any) {
return request({
url: `/apo/dec-lygk-base-server/base/stbprpData/GetKendoListCust?tbCode=${code}`,
url: `/env/engInfo/stbprpData/GetKendoListCust?tbCode=${code}`,
method: 'post',
data
});

6
frontend/src/components/BasicSearch/index.vue
View File

@ -219,6 +219,7 @@
children: 'children'
}
"
:filterTreeNode="filterTreeNode"
:show-search="item.showSearch !== false"
:tree-checkable="item.treeCheckable"
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
@ -333,12 +334,15 @@ const formData = reactive<any>({});
const rules = reactive<Record<string, any>>({});
const filterOption = (inputValue: string, option: any) => {
const label = option.label || '';
const label = option.label || option.name || '';
const reachcdName = option.reachcdName || '';
const keyword = inputValue || '';
return label.indexOf(keyword) !== -1 || reachcdName.indexOf(keyword) !== -1;
};
const filterTreeNode = (inputValue: string, option: any) => {
return filterOption(inputValue, option);
};
// 2. 创建计算属性，自动过滤掉 false/null/undefined 的项
const validSearchList = computed(() => {
return props.searchList.filter(item => item);

7
frontend/src/components/BasicTable/index.vue
View File

@ -638,7 +638,12 @@ const enhancedColumns = computed(() => {
ellipsis: true,
customRender: ({ text }: { text: any }) => {
// 如果 text 是空值，直接返回占位符
if (text === null || text === undefined || text === '') {
if (
text === null ||
text === undefined ||
text === '' ||
text === '-'
) {
return props.emptyPlaceholder;
}
// 使用 h 函数创建 Tooltip

1
frontend/src/components/MapModal/components/AIYXSB/index.vue
View File

@ -136,7 +136,6 @@
@panel-change="handleCalendarPanelChange"
@select="handleCalendarSelect"
>
<template #headerRender="{ current }"> </template>
<template #dateCellRender="{ current }">
<div class="calendar-content">
<template v-if="isCurrentMonth(current)">

17
frontend/src/components/MapModal/index.vue
View File

@ -247,7 +247,7 @@
</template>
<script lang="ts" setup>
import { ref, watch, computed } from 'vue';
import { ref, watch, computed, toRef } from 'vue';
// 导入预定义的 Tab 内容组件
import BasicInfo from './components/BasicInfo.vue'; // 基本信息
import VideoInfo from './components/videoInfo.vue'; // 实时视频
@ -300,6 +300,7 @@ import {
getMonitorDataWaterTempPowerStation2,
checkPowerStationTopic
} from '@/api/mapModal';
import { useDraggable } from '@/utils/drag';
// import { useRouter } from 'vue-router';
const modelStore = useModelStore();
@ -601,7 +602,6 @@ const setQGCTabList = async (_tabs: any, stcd: string) => {
};
const res2 = await getVideoList(params);
console.log('', modelStore.params.sttp);
//
if (
res2?.data?.data?.length > 0 ||
res2?.data?.records?.length > 0 ||
@ -645,17 +645,10 @@ const applyTabFilters = async (params: any) => {
} else if (isLCJ && sttpCode === 'WE') {
// LCJ 鱼类栖息地数据类型检查
await checkFishTab(stcd);
} else if (
( sttpCode === 'WQ') ||
sttpCode === 'WQFB' ||
sttpCode === 'wq'
) {
} else if (sttpCode === 'WQ' || sttpCode === 'WQFB' || sttpCode === 'wq') {
// 水质 AI 预测检查（React 逻辑：WQ 需要条件，WQFB/wq 无条件）
await checkAnalysisAvailability(stcd);
} else if (
( sttpCode === 'WT') ||
sttpCode === 'wt'
) {
} else if (sttpCode === 'WT' || sttpCode === 'wt') {
// 水温站特殊处理（React 逻辑：WT 需要条件，wt 无条件）
await checkWaterTempConfig(stcd);
} else if (
@ -841,6 +834,8 @@ const props = defineProps<{
data?: any; // 可选：传递给内部组件的数据
}>();
// 启用弹窗拖拽（限制在可视区域内）
useDraggable(toRef(props, 'visible'), { boundary: true, resetOnOpen: true });
// 定义 Emits
// 添加 'update:activeKey' 以支持 v-model:active-key
const emit = defineEmits<{

1
frontend/src/components/gis/GisView.vue
View File

@ -128,7 +128,6 @@ watch(
onMounted(() => {
init();
// @ts-ignore
window.mapClass = mapClass;
});

57
frontend/src/components/gis/map.ol.ts
View File

@ -12,8 +12,6 @@ import Stroke from 'ol/style/Stroke';
import Icon from 'ol/style/Icon';
import Text from 'ol/style/Text';
import Circle from 'ol/style/Circle';
import RegularShape from 'ol/style/RegularShape';
import Cluster from 'ol/source/Cluster';
import WMTS from 'ol/source/WMTS';
import WMTSTileGrid from 'ol/tilegrid/WMTS';
import { get as getProjection, fromLonLat } from 'ol/proj';
@ -75,6 +73,7 @@ export class MapOl implements MapInterface {
geoJsonData1: any = null;
private BASEID = '';
private currentClipGeoJson: any | null = null;
private clipRequestController: AbortController | null = null;
private hoveredFeatureId: string | number | null = null;
private popupManager: PopupManager;
private regionMaskManager: RegionMaskManager;
@ -98,13 +97,18 @@ export class MapOl implements MapInterface {
defaultZoom: INITIAL_ZOOM
});
}
private async loadGeoJsonData(url): Promise<any> {
private async loadGeoJsonData(url, signal?: AbortSignal): Promise<any> {
try {
const response = await fetch(url);
const response = await fetch(url, { signal });
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error('配置加载失败:', error);
} catch (error: any) {
if (error.name !== 'AbortError') {
console.error('配置加载失败:', error);
}
}
}
//地图初始化
@ -222,6 +226,11 @@ export class MapOl implements MapInterface {
_mdoptions?: MDOptions
): void {
this.pointLayerManager.addDataLayer(pointData, layerType);
if (this.currentClipGeoJson) {
this.regionMaskManager.filterPointsByRegion(this.currentClipGeoJson);
}
const currentZoom = this.view ? this.view.getZoom() : INITIAL_ZOOM;
this.pointLayerManager.updateNearbyFeatureLayout(currentZoom);
this.requestRefreshPointLabelVisibility(true);
@ -1124,11 +1133,7 @@ export class MapOl implements MapInterface {
* 初始化加载基础图层
* @param layer 图层配置对象
*/
addBaseDataLayer(
layer: any,
isShow: boolean,
isCache: boolean = false
): void {
addBaseDataLayer(layer: any, isShow: boolean, isCache = false): void {
if (!this.map) return;
// 备注：同 key 的底图重复添加前先移除旧实例，避免注册表覆盖后旧图层仍残留在地图上。
@ -1142,7 +1147,7 @@ export class MapOl implements MapInterface {
if (layer.type === 'wmts') {
if (!layer.url) return;
let url = !isCache ? layer.url : layer.url_3d;
const url = !isCache ? layer.url : layer.url_3d;
const urlParams = new URLSearchParams(url.split('?')[1]);
if (layer.key === this.REGISTRY_KEY) {
this.baseLayerConfig = layer;
@ -1311,6 +1316,11 @@ export class MapOl implements MapInterface {
return;
}
if (this.clipRequestController) {
this.clipRequestController.abort();
this.clipRequestController = null;
}
this.BASEID = _regionId;
if (!isAll) {
@ -1327,21 +1337,40 @@ export class MapOl implements MapInterface {
}
this.regionMaskManager.hideAllPoints();
this.clipRequestController = new AbortController();
const signal = this.clipRequestController.signal;
try {
const url =
this.hydropBaseConfig.geojson_url +
`&cql_filter=BASEID='${this.BASEID}'`;
const geoJsonData = await this.loadGeoJsonData(url);
const geoJsonData = await this.loadGeoJsonData(url, signal);
if (signal.aborted) {
return;
}
if (this.BASEID !== _regionId) {
return;
}
this.currentClipGeoJson = geoJsonData;
this.regionMaskManager.filterPointsByRegion(geoJsonData);
this.regionMaskManager.fitViewToGeoJson(geoJsonData);
this.regionMaskManager.applyMapMaskToLayers(baseLayers, geoJsonData);
} catch (error) {
} catch (error: any) {
if (error.name === 'AbortError') {
return;
}
this.currentClipGeoJson = null;
console.error('加载裁切数据失败:', error);
this.regionMaskManager.clearMapMask();
this.regionMaskManager.showAllPoints();
} finally {
if (this.clipRequestController?.signal === signal) {
this.clipRequestController = null;
}
}
}
/**

1
frontend/src/components/gis/ol/point-layer-manager.ts
View File

@ -400,6 +400,7 @@ export class PointLayerManager {
);
feature.set('_baseCoordinates', coord);
feature.set('_legendVisible', true);
feature.set('_regionVisible', true);
feature.set('_sttpMap', item.sttpMap);
if (item.popupHtml) {
feature.set('popupHtml', item.popupHtml);

1
frontend/src/components/mapController/LayerController.vue
View File

@ -56,7 +56,6 @@ const layerConfigs = computed(() => {
return convertCheckedToBoolean(mapConfigStore.layerConfigTree);
});
// 备注：选中图层完全以运行态 store 为唯一来源，组件不再维护额外同步状态。
const checkedKeys = computed(() => mapViewStore.checkedLayerKeys || []);
const tooltipVisible = ref(false);

2
frontend/src/components/mapFilter/index.vue
View File

@ -26,11 +26,9 @@
<a-form-item label="" name="siteRangePicker">
<a-range-picker
v-model:value="searchTimeRange"
picker="date"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD HH:mm:ss"
:allow-clear="false"
show-time
:presets="DateSetting.RangeButton.days1"
style="width: 100%"
@change="triggerManualValuesChange"

2
frontend/src/components/mapLegend/index.vue
View File

@ -87,6 +87,7 @@ const hasEnvFac = computed(() =>
);
const legendItemClick = (item: any) => {
console.log(item);
if (item.parentName == '环保设施') return;
if (item.canBeChecked == 0) {
return;
@ -121,6 +122,7 @@ const toggleGroup = (group: any) => {
if (leafItems.length === 0) return;
const hasAnyChecked = leafItems.some((item: any) => item.checked === 1);
const targetChecked = hasAnyChecked ? 0 : 1;
const targetNameEns = leafItems
.filter(

1
frontend/src/main.ts
View File

@ -12,7 +12,6 @@ import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/reset.css'; // Ant Design 全局样式重置
import dayjs from 'dayjs'; // ant 中文语言
import 'dayjs/locale/zh-cn';
// @ts-ignore
import 'virtual:svg-icons-register';
// 3d地图
import * as Cesium from 'cesium';

150
frontend/src/modules/map/application/map-orchestrator.ts
View File

@ -1,4 +1,5 @@
import { watch, type WatchStopHandle } from 'vue';
import { watch, type WatchStopHandle, ref } from 'vue';
import { useRoute } from 'vue-router';
import { unByKey } from 'ol/Observable';
import dayjs from 'dayjs';
import { MapClass } from '@/components/gis/map.class';
@ -17,6 +18,7 @@ type InitializeOptions = {
type LoadPageOptions = {
pageKey: string;
isInitialLoad?: boolean;
};
type ApplyLayerSelectionOptions = {
@ -24,9 +26,7 @@ type ApplyLayerSelectionOptions = {
triggerKey?: string;
checked?: boolean;
};
const SYSTEM_ID = '974975A6-47FD-4C04-9ACD-68938D2992BD';
const MODULE_ID = '2157c1a1-e909-4c9f-af94-b4ccebe05808';
const SYSTEM_ID = 'qgc';
const HYDRO_DYNAMIC_LAYER_KEYS = [
'dw_point',
'stinfo_video_point',
@ -47,6 +47,7 @@ const LARGE_ENG_LEGEND_PREFIX = 'large_eng_';
const MID_ENG_LEGEND_PREFIX = 'mid_eng_';
export const useMapOrchestrator = () => {
const route = useRoute();
const mapClass = MapClass.getInstance();
const mapStore = useMapStore();
const mapConfigStore = useMapConfigStore();
@ -56,6 +57,9 @@ export const useMapOrchestrator = () => {
let zoomListenerKey: any = null;
let stopBaseSelectionWatch: WatchStopHandle | null = null;
const initializedBaseLayerKeys = new Set<string>();
const baseSelectionDebounceTimer = ref<ReturnType<typeof setTimeout> | null>(
null
);
// 备注：统一获取当前地图视图对象，避免在多个组件里重复兼容 2D/3D view 访问方式。
const getCurrentView = () => {
@ -107,50 +111,86 @@ export const useMapOrchestrator = () => {
};
// 备注：统一加载当前页面所需的图层配置、图例配置以及首批锚点数据。
const loadPage = async ({ pageKey }: LoadPageOptions) => {
const loadPage = async ({
pageKey,
isInitialLoad = false
}: LoadPageOptions) => {
mapDataStore.setLoading(true);
try {
const hasGlobalLegendConfig =
Array.isArray(mapConfigStore.legendConfigOriginal) &&
mapConfigStore.legendConfigOriginal.length > 0;
const hasPointLayerCache =
Object.keys(mapDataStore.pointDataCache || {}).length > 0;
const shouldLoadGlobalLegend = isInitialLoad && !hasGlobalLegendConfig;
const shouldPreloadLayerData = isInitialLoad && !hasPointLayerCache;
const previousPageKey = mapConfigStore.lastLoadOptions?.pageKey || '';
const previousCheckedKeys = mapViewStore.getCheckedLayerKeys();
const moduleId = (route.meta?.moduleId as string) || '';
const loadOptions = {
systemId: SYSTEM_ID,
moduleId: MODULE_ID,
moduleId,
pageKey,
description: 'true'
};
const layerConfigPromise =
mapConfigStore.loadPageLayerConfig(loadOptions);
const legendConfigPromise = mapConfigStore.loadPageLegendConfig(pageKey);
const { legendOriginal, pageLegend } = await legendConfigPromise;
const legendConfigPromise = mapConfigStore.loadPageLegendConfig(
moduleId,
{
includeGlobal: shouldLoadGlobalLegend
}
);
if (legendOriginal.length > 0) {
mapStore.setLegendData(legendOriginal, pageLegend);
}
const { layerConfig } = await layerConfigPromise;
// 同时等待两个 promise
const [{ layerConfig }, { legendOriginal, pageLegend }] =
await Promise.all([layerConfigPromise, legendConfigPromise]);
// 先设置图层数据（更新 checkedLayerKeys），再设置图例数据
if (layerConfig.length > 0) {
mapStore.setLayerData(layerConfig);
ensureBaseLayersInitialized(layerConfig);
let checkedKeys = mapViewStore.getCheckedLayerKeys();
if (previousPageKey === pageKey && previousCheckedKeys.length > 0) {
const currentLayerKeys = new Set(
layerConfig
.flatMap((item: any) => layerConfig2Flat([item]))
.map((item: any) => item?.key)
.filter(Boolean)
);
const getAllLayerKeys = (items: any[]): string[] => {
const keys: string[] = [];
const walk = (nodes: any[]) => {
nodes.forEach(item => {
if (item?.key) {
keys.push(item.key);
}
if (item?.children?.length > 0) {
walk(item.children);
}
});
};
walk(items);
return keys;
};
const currentLayerKeys = new Set(getAllLayerKeys(layerConfig));
const runtimeCheckedKeys = previousCheckedKeys.filter(key =>
currentLayerKeys.has(key)
);
if (runtimeCheckedKeys.length > 0) {
mapViewStore.setCheckedLayerKeys(runtimeCheckedKeys);
mapStore.setSelectedLegendData();
checkedKeys = runtimeCheckedKeys;
}
}
await mapStore.loadAllLayerData(layerConfig, checkedKeys);
// 设置图例数据（此时 checkedLayerKeys 已正确设置）
if (legendOriginal.length > 0) {
mapStore.setLegendData(legendOriginal, pageLegend);
}
if (shouldPreloadLayerData) {
mapStore.setSelectedLegendData();
await mapStore.loadAllLayerData(layerConfig, checkedKeys);
} else {
await mapStore.updateLayerData(checkedKeys, true);
mapStore.setSelectedLegendData();
}
}
} finally {
// mapDataStore.setLoading(false);
@ -180,7 +220,7 @@ export const useMapOrchestrator = () => {
popupContainer,
pageKey
});
await loadPage({ pageKey });
await loadPage({ pageKey, isInitialLoad: true });
};
// 备注：统一绑定地图缩放监听，让页面组件只负责触发初始化，不再直接处理缩放联动细节。
@ -218,13 +258,23 @@ export const useMapOrchestrator = () => {
}
stopBaseSelectionWatch = watch(
() => jidiSelectEventStore.selectedItem,
newVal => {
if (newVal?.wbsCode) {
changeBaseId(newVal.wbsCode);
() => jidiSelectEventStore.selectedItem?.wbsCode,
newWbsCode => {
if (!newWbsCode) {
changeBaseId('');
return;
}
if (baseSelectionDebounceTimer.value) {
clearTimeout(baseSelectionDebounceTimer.value);
}
baseSelectionDebounceTimer.value = setTimeout(() => {
changeBaseId(newWbsCode);
baseSelectionDebounceTimer.value = null;
}, 100);
},
{ deep: true, immediate: true }
{ immediate: true }
);
};
@ -237,13 +287,31 @@ export const useMapOrchestrator = () => {
await initializeMapShell(options);
bindBaseSelection();
bindZoomListener(options.getIsHydroMenu);
await loadPage({ pageKey: options.pageKey });
await loadPage({ pageKey: options.pageKey, isInitialLoad: true });
};
// 备注：统一处理菜单切换后的页面配置重载，供页面 watch 直接复用。
const reloadPage = async (pageKey: string) => {
if (!pageKey) return;
await loadPage({ pageKey });
await loadPage({ pageKey, isInitialLoad: false });
};
// 备注：菜单切换前先隐藏旧页面当前可见的点图层，避免旧锚点残留到新页面接口返回之后才消失。
const hideCurrentVisiblePointLayers = () => {
const currentCheckedKeys = mapViewStore.getCheckedLayerKeys();
currentCheckedKeys.forEach(layerKey => {
const layerItem = mapStore.findLayerByKey(mapStore.layerData, layerKey);
if (
!layerItem?.key ||
layerItem.type !== 'pointMap' ||
!mapClass.hasLayer(layerItem.key)
) {
return;
}
mapClass.mdLayerTreeShowOrHidden(layerItem.key, false);
});
};
// 备注：统一处理图层树勾选结果归一化和地图联动，供图层树组件复用。
@ -277,6 +345,9 @@ export const useMapOrchestrator = () => {
// 备注：统一控制水电开发菜单下的动态图层增删，避免页面组件直接操作加载和勾选细节。
const syncHydroDynamicLayers = async (visible: boolean) => {
const currentCheckedKeys = mapViewStore.getCheckedLayerKeys();
const pageDefaultCheckedKeys = new Set(
mapConfigStore.extractCheckedLayerKeys(mapStore.layerData || [])
);
if (visible) {
const layersToAdd = HYDRO_DYNAMIC_LAYER_KEYS.filter(
@ -293,9 +364,12 @@ export const useMapOrchestrator = () => {
});
}
const nextCheckedKeys = currentCheckedKeys.filter(
key => !HYDRO_DYNAMIC_LAYER_KEYS.includes(key)
);
const nextCheckedKeys = currentCheckedKeys.filter(key => {
if (!HYDRO_DYNAMIC_LAYER_KEYS.includes(key)) {
return true;
}
return pageDefaultCheckedKeys.has(key);
});
if (nextCheckedKeys.length === currentCheckedKeys.length) {
return currentCheckedKeys;
@ -348,6 +422,11 @@ export const useMapOrchestrator = () => {
const handlePageChange = async (pageKey: string, isHydroMenu: boolean) => {
if (!pageKey) return;
const previousPageKey = mapConfigStore.lastLoadOptions?.pageKey || '';
if (previousPageKey && previousPageKey !== pageKey) {
hideCurrentVisiblePointLayers();
}
await reloadPage(pageKey);
const currentZoom = getCurrentZoom();
@ -452,7 +531,7 @@ export const useMapOrchestrator = () => {
};
// 备注：统一处理搜索定位，按点位编码从缓存数据中查找并飞行到目标位置。
const focusPoint = (pointId: string, zoom: number = 15) => {
const focusPoint = (pointId: string, zoom = 15) => {
if (!pointId) return;
const targetPoint = mapDataStore.pointData.find((item: any) => {
return item.stcd === pointId || item._id === pointId;
@ -472,6 +551,11 @@ export const useMapOrchestrator = () => {
stopBaseSelectionWatch();
stopBaseSelectionWatch = null;
}
if (baseSelectionDebounceTimer.value) {
clearTimeout(baseSelectionDebounceTimer.value);
baseSelectionDebounceTimer.value = null;
}
};
return {

43
frontend/src/modules/map/stores/map-config.store.ts
View File

@ -9,6 +9,10 @@ type MapConfigLoadOptions = {
description?: string;
};
type LegendConfigLoadOptions = {
includeGlobal?: boolean;
};
const cloneConfigData = <T>(data: T): T => {
return JSON.parse(JSON.stringify(data));
};
@ -55,7 +59,7 @@ export const useMapConfigStore = defineStore('map-config', () => {
const walk = (nodes: any[] = []) => {
nodes.forEach(item => {
if (item?.checked === 1 && item?.key) {
if (Number(item?.checked) === 1 && item?.key) {
keys.push(item.key);
}
if (item?.children?.length > 0) {
@ -157,6 +161,7 @@ export const useMapConfigStore = defineStore('map-config', () => {
moduleId: options.moduleId,
description: options.description ?? 'true'
});
console.log(cloneConfigData(layerRes));
const layerConfig = layerRes?.data?.mapLayerVos || [];
setLayerConfigTree(layerConfig);
@ -168,17 +173,32 @@ export const useMapConfigStore = defineStore('map-config', () => {
}
};
const loadPageLegendConfig = async (pageKey?: string) => {
const loadPageLegendConfig = async (
pageKey?: string,
options: LegendConfigLoadOptions = {}
) => {
legendLoading.value = true;
try {
const [legendAllRes, legendPageRes] = await Promise.all([
getModuleMapLegendList(),
getModuleMapLegendList(pageKey ? { moduleId: pageKey } : undefined)
]);
const includeGlobal = options.includeGlobal !== false;
const legendOriginal = legendAllRes?.data || [];
const pageLegend = legendPageRes?.data || [];
let legendOriginal = legendConfigOriginal.value || [];
let pageLegend: any[] = [];
if (includeGlobal) {
const [legendAllRes, legendPageRes] = await Promise.all([
getModuleMapLegendList(),
getModuleMapLegendList(pageKey ? { moduleId: pageKey } : undefined)
]);
legendOriginal = legendAllRes?.data || [];
pageLegend = legendPageRes?.data || [];
} else {
const legendPageRes = await getModuleMapLegendList(
pageKey ? { moduleId: pageKey } : undefined
);
pageLegend = legendPageRes?.data || [];
}
setLegendConfigOriginal(legendOriginal);
setPageLegendConfig(pageLegend);
@ -194,10 +214,9 @@ export const useMapConfigStore = defineStore('map-config', () => {
// 备注：加载页面地图配置，只负责请求和保存配置数据，不处理锚点或地图渲染逻辑。
const loadPageMapConfig = async (options: MapConfigLoadOptions) => {
const [{ layerConfig }, { legendOriginal, pageLegend }] = await Promise.all([
loadPageLayerConfig(options),
loadPageLegendConfig(options.pageKey)
]);
const [{ layerConfig }, { legendOriginal, pageLegend }] = await Promise.all(
[loadPageLayerConfig(options), loadPageLegendConfig(options.pageKey)]
);
return {
layerConfig,

1
frontend/src/modules/monthlyAvgWaterTemCompareHistory/monthlyAverage.vue
View File

@ -104,7 +104,6 @@ import { message } from 'ant-design-vue';
import dayjs, { Dayjs } from 'dayjs';
import * as echarts from 'echarts';
import type { EChartsOption } from 'echarts';
import dayjs from 'dayjs';
import { omit } from 'lodash';
import { wbsbGetKendoList, getVmsstbprpt, DetGetKendoListCust } from '@/api/sw';
import BasicTable from '@/components/BasicTable/index.vue';

65
frontend/src/modules/shengtaidabiaoMod/index.vue
View File

@ -8,10 +8,10 @@
<p>
1、统计电站范围：接入过生态流量数据的电站
<span
style="color: #5989ad; cursor: pointer; "
style="color: #5989ad; cursor: pointer"
@click.stop="handleStationClick()"
>
({{titleData.cnt}})
({{ titleData.cnt }})
</span>
</p>
<p>2、当来水不足时，生态流量不小于入库流量判定为达标</p>
@ -87,7 +87,11 @@
width="1536px"
:footer="null"
>
<ModalYkzhbzdjcgz v-if="huanbaoModalVisible" :baseId="baseid" :titleData = titleData />
<ModalYkzhbzdjcgz
v-if="huanbaoModalVisible"
:baseId="baseid"
:titleData="titleData"
/>
</a-modal>
</div>
</template>
@ -103,6 +107,7 @@ import { useJidiSelectEventStore } from '@/store/modules/jidiSelectEvent';
import STLLXFFS from './TwoLayer/ShengTaiLiuLiangDaBQKTwoLayer.vue';
import ModalYkzhbzdjcgz from './TwoLayer/ModalYkzhbzdjcgz.vue';
import HuanbaoZDJCGZKZ from '@/modules/huanbaozdjcgzkzQK/index.vue';
import { useDraggable } from '@/utils/drag';
// 定义组件名（便于调试和递归）
defineOptions({
name: 'shengtaidabiaoMod'
@ -142,10 +147,13 @@ const datalist: any = ref([]);
const allArr: any = ref(Array.from({ length: 20 }, (_, i) => i));
const spinning = ref(false);
const modalVisible = ref(false);
const modalTitle = ref('');
const selectedItem = ref<any>(null);
const huanbaoModalVisible = ref(false);
// 启用弹窗拖拽（限制在可视区域内）
useDraggable(modalVisible, { boundary: true, resetOnOpen: true });
// 启用弹窗拖拽（限制在可视区域内）
useDraggable(huanbaoModalVisible, { boundary: true, resetOnOpen: true });
// 处理电站数量点击事件
const handleStationClick = () => {
huanbaoModalVisible.value = true;
@ -154,7 +162,6 @@ const handleStationClick = () => {
// 处理进度条点击事件
const handleBarClick = (item: any) => {
selectedItem.value = item;
// modalTitle.value = `${item.name} - 详细信息`;
modalVisible.value = true;
};
@ -280,43 +287,41 @@ watch(
{ deep: true, immediate: true }
);
//统计电站范围：接入过生态流量数据的电站
const titleData:any = ref({ cnt: 0 })
const titleData: any = ref({ cnt: 0 });
const getcont = async () => {
let params = {
"filter": {
"logic": "and",
"filters": [
{
"field": "showIds",
"operator": "in",
"value": [
"7"
]
}
]
filter: {
logic: 'and',
filters: [
{
field: 'showIds',
operator: 'in',
value: ['7']
}
]
}
}
};
let res = await evnmAutoMonitorGetKendoListCust(params);
// [
// {
// "cnt": 452,
// "orderInx": 7,
// "orderInxName": "生态流量",
// "sttpFullPath": "ENG",
// "sttpCode": "ENG",
// "sttpName": "生态流量"
// }
// ]
// [
// {
// "cnt": 452,
// "orderInx": 7,
// "orderInxName": "生态流量",
// "sttpFullPath": "ENG",
// "sttpCode": "ENG",
// "sttpName": "生态流量"
// }
// ]
let list = res?.data?.data[0];
if (list) {
titleData.value = list
titleData.value = list;
}
//
};
// 页面加载时执行的逻辑
onMounted(() => {
setStyle();
getcont()
getcont();
});
</script>

288
frontend/src/store/modules/map.ts
View File

@ -14,7 +14,7 @@ import { useMapConfigStore } from '@/modules/map/stores/map-config.store';
import { useMapDataStore } from '@/modules/map/stores/map-data.store';
import { useMapViewStore } from '@/modules/map/stores/map-view.store';
import request from '@/utils/request';
import { urlList } from '@/utils/GisUrlList';
// import { urlList } from '@/utils/GisUrlList';
const mapClass = MapClass.getInstance();
const DEFAULT_LAYER_REQUEST_CONCURRENCY = 4;
const ENG_POINT_LAYER_KEY = 'eng_point';
@ -47,23 +47,23 @@ const normalizeCachePayload = (value: any): any => {
return value;
};
const buildUrlListIndex = (items: any[] = []) => {
const index: Record<string, any[]> = {};
items.forEach(item => {
[item.url, item.title, item.keyType].forEach(key => {
if (!key) return;
if (!index[key]) {
index[key] = [];
}
index[key].push(item);
});
});
return index;
};
const urlListIndex = buildUrlListIndex(urlList);
// const buildUrlListIndex = (items: any[] = []) => {
// const index: Record<string, any[]> = {};
//
// items.forEach(item => {
// [item.url, item.title, item.keyType].forEach(key => {
// if (!key) return;
// if (!index[key]) {
// index[key] = [];
// }
// index[key].push(item);
// });
// });
//
// return index;
// };
//
// const urlListIndex = buildUrlListIndex(urlList);
const isCanceledRequestError = (error: unknown) => {
const message = error instanceof Error ? error.message : String(error || '');
@ -74,6 +74,72 @@ const isCanceledRequestError = (error: unknown) => {
);
};
const buildFiltersFromParamsObject = (
paramsObject: Record<string, any> = {}
) => {
const filtersArray: any[] = [];
Object.keys(paramsObject).forEach(paramKey => {
const value = paramsObject[paramKey];
if (Array.isArray(value)) {
value.forEach((filter: any) => {
filtersArray.push({
...filter,
dataType: filter?.dataType || 'string'
});
});
return;
}
filtersArray.push({
field: paramKey,
operator: 'eq',
dataType: 'string',
value
});
});
return filtersArray;
};
const normalizeRequestParams = (rawParams: any) => {
if (!rawParams || !Object.keys(rawParams).length) {
return { logic: 'and', filters: [] };
}
if (Array.isArray(rawParams.filters)) {
return {
logic: rawParams.logic || 'and',
filters: rawParams.filters.map((filter: any) => ({
...filter,
dataType: filter?.dataType || 'string'
}))
};
}
return {
logic: 'and',
filters: buildFiltersFromParamsObject(rawParams)
};
};
const parseAnchorParamFilters = (anchorParamJson?: string) => {
if (!anchorParamJson) return [];
try {
const parsedParams = JSON.parse(anchorParamJson);
if (!parsedParams || typeof parsedParams !== 'object') {
return [];
}
return buildFiltersFromParamsObject(parsedParams);
} catch (error) {
console.error('解析 anchorParamJson 失败:', error);
return [];
}
};
export const useMapStore = defineStore('map', () => {
const mapConfigStore = useMapConfigStore();
const mapDataStore = useMapDataStore();
@ -260,7 +326,7 @@ export const useMapStore = defineStore('map', () => {
};
const getRuntimeCheckedLayerKeys = (): string[] => {
return normalizeCheckedLayerKeys(mapViewStore.getCheckedLayerKeys());
return mapViewStore.getCheckedLayerKeys();
};
const syncPointDataForFilter = () => {
@ -300,6 +366,7 @@ export const useMapStore = defineStore('map', () => {
mapConfigStore.setLayerConfigTree(data);
const nextCheckedLayerKeys = mapConfigStore.extractCheckedLayerKeys(data);
mapViewStore.setCheckedLayerKeys(nextCheckedLayerKeys);
console.log(1);
rebuildLegendRuntimeData(nextCheckedLayerKeys);
};
@ -374,6 +441,7 @@ export const useMapStore = defineStore('map', () => {
mapViewStore.setLegendCheckedState(
buildLegendCheckedState(legendDataOriginal.value, normalizeLegendNameEn)
);
console.log(2);
rebuildLegendRuntimeData(checkedLayerKeys.value);
};
@ -381,6 +449,7 @@ export const useMapStore = defineStore('map', () => {
* 设置选中的图例数据（在图层加载完成后调用）
*/
const setSelectedLegendData = () => {
console.log(3);
rebuildLegendRuntimeData(checkedLayerKeys.value);
};
@ -458,7 +527,10 @@ export const useMapStore = defineStore('map', () => {
* @param isInit - 是否是初始化阶段（初始化时遍历所有图层）
*/
const updateLayerData = async (checkKeys: string[], isInit = false) => {
checkKeys = normalizeCheckedLayerKeys(checkKeys);
console.log(checkKeys);
if (!isInit) {
checkKeys = normalizeCheckedLayerKeys(checkKeys);
}
mapViewStore.setCheckedLayerKeys(checkKeys);
@ -594,6 +666,11 @@ export const useMapStore = defineStore('map', () => {
const allPointData = mapDataStore.rebuildPointDataFromCache(allLayerKeys);
attachNearbyPointRuntimeMeta(allPointData);
const runtimeCheckedKeys = getRuntimeCheckedLayerKeys();
const treeCheckedKeys = mapConfigStore.extractCheckedLayerKeys(
layerData.value.length > 0 ? layerData.value : items
);
const finalCheckedKeys =
runtimeCheckedKeys.length > 0 ? runtimeCheckedKeys : treeCheckedKeys;
// 备注：近邻点元数据需要基于全量点位统一识别，识别完成后同步刷新各图层 Feature。
for (const key of allLayerKeys) {
@ -608,7 +685,7 @@ export const useMapStore = defineStore('map', () => {
const shouldRestoreVisible =
typeof cacheChecked === 'boolean'
? cacheChecked
: layer.checked === 1 || runtimeCheckedKeys.includes(key);
: layer.checked === 1 || finalCheckedKeys.includes(key);
layer.data = layerPoints;
mapClass.addInitDataLayer(displayData, key);
if (shouldRestoreVisible) {
@ -622,7 +699,7 @@ export const useMapStore = defineStore('map', () => {
// 备注：初始化 loading 期间用户可能已经手动改过图层勾选，这里必须以最新运行态收尾，
// 不能再回放 load 启动瞬间的默认 checked 快照。
await updateLayerData(runtimeCheckedKeys, true);
await updateLayerData(finalCheckedKeys, true);
} finally {
mapDataStore.setLoading(false);
}
@ -736,6 +813,7 @@ export const useMapStore = defineStore('map', () => {
normalizedNameEn,
checked
);
console.log(5);
rebuildLegendRuntimeData(checkedLayerKeys.value);
applyLegendItemVisibility(legendItem, checked);
};
@ -754,14 +832,13 @@ export const useMapStore = defineStore('map', () => {
});
mapViewStore.setLegendCheckedState(nextState);
console.log(6);
rebuildLegendRuntimeData(checkedLayerKeys.value);
changedLegendItems.forEach(legendItem =>
applyLegendItemVisibility(legendItem, checked)
);
};
/**
/**
* 生成请求标识符，用于避免重复请求
*/
@ -777,130 +854,85 @@ export const useMapStore = defineStore('map', () => {
layer: any,
sessionId: number = loadSessionSeed
) => {
const { key, url, params = {}, paramJson } = layer;
const { key, url, params = {}, paramJson, anchorParamJson } = layer;
// 没有URL，跳过
if (!url) {
return [];
}
// 参考 React 版本：使用 urlList 匹配图层配置
let requestUrl = url;
const requestUrl = url;
let requestParams: any = params;
let requestOrders: any = null;
// 根据图层的 key（keyType）、title、url 查找匹配的 urlList 项
const layerKey = layer?.key || '';
const layerTitle = layer?.title || '';
const matchedList =
urlListIndex[layerKey] || urlListIndex[layerTitle] || urlListIndex[url];
if (matchedList && matchedList.length > 0) {
let matchedItem: any = null;
if (key == 'va_built_point ' || key == 'vp_built_point') {
matchedList.forEach(item => {
if (item.title === layerTitle) {
matchedItem = item;
}
});
} else {
matchedItem = matchedList[0];
}
requestUrl = matchedItem.url;
const voidSttp = 'all';
const ylfbKeys = ['ylfb_point'];
const timeRangeLayerKeys = ['ef_point'];
const spjkz = ['stinfo_video_point'];
// 转换 params 为 filter 格式
if (matchedItem.params) {
const filtersArray: any[] = [];
for (const key in matchedItem.params) {
const value = matchedItem.params[key];
if (Array.isArray(value)) {
// 处理数组格式: { field: 'sttpCode', operator: 'eq', value: 'WQ' }
value.forEach((filter: any) => {
filtersArray.push({
...filter,
dataType: filter.dataType || 'string'
});
});
} else {
// 处理简单格式: sttpCode: 'VP'
filtersArray.push({
field: key,
operator: 'eq',
dataType: 'string',
value: value
});
}
}
requestParams = {
logic: 'and',
filters: filtersArray
};
}
let voidSttp = 'all';
const ylfbKeys = ['ylfb_point']; // 需要时间搜索的图层key
const timeRangeLayerKeys = ['ef_point']; // 需要时间搜索的图层key
const spjkz = ['stinfo_video_point'];
const lineTimeLayerKeys = [
'wt_rive_gradient_line',
'wq_rive_gradient_line'
]; // 需要时间搜索的图层key
const yearTime = dayjs().subtract(1, 'years');
let yearTime = dayjs().subtract(1, 'years'); // 鱼类分布年份
if (timeRangeLayerKeys.includes(layerKey)) {
requestParams = normalizeRequestParams(requestParams);
const anchorParamFilters = parseAnchorParamFilters(anchorParamJson);
if (anchorParamFilters.length) {
requestParams.filters.push(...anchorParamFilters);
}
if (timeRangeLayerKeys.includes(layerKey)) {
requestParams.filters.push({
field: 'tm',
operator: 'gte',
dataType: 'date',
value: dayjs(searchTimeRange.value[0]).format('YYYY-MM-DD HH:mm:ss')
});
requestParams.filters.push({
field: 'tm',
operator: 'lte',
dataType: 'date',
value: dayjs(searchTimeRange.value[1]).format('YYYY-MM-DD 23:59:59')
});
}
if (spjkz.includes(layerKey)) {
if (voidSttp !== 'all') {
requestParams.filters.push({
field: 'tm',
operator: 'gte',
field: 'sttp',
operator: 'in',
value: voidSttp == 'VD_EQ,VD_EQS' ? ['VD_EQ', 'VD_EQS'] : [voidSttp]
});
}
}
if (ylfbKeys.includes(layerKey)) {
if (yearTime) {
requestParams.filters.push({
field: 'startTime',
operator: 'eq',
dataType: 'date',
value: dayjs(searchTimeRange.value[0]).format('YYYY-MM-DD HH:mm:ss')
value: dayjs(yearTime).startOf('year').format('YYYY-MM-DD 00:00:00')
});
requestParams.filters.push({
field: 'tm',
operator: 'lte',
field: 'endTime',
operator: 'eq',
dataType: 'date',
value: dayjs(searchTimeRange.value[1]).format('YYYY-MM-DD 23:59:59')
value: dayjs(yearTime).endOf('year').format('YYYY-MM-DD 23:59:59')
});
}
if (spjkz.includes(layerKey)) {
if (voidSttp !== 'all') {
requestParams.filters.push({
field: 'sttp',
operator: 'in',
value: voidSttp == 'VD_EQ,VD_EQS' ? ['VD_EQ', 'VD_EQS'] : [voidSttp]
});
}
}
if (ylfbKeys.includes(layerKey)) {
if (yearTime) {
requestParams.filters.push({
field: 'startTime',
operator: 'eq',
dataType: 'date',
value: dayjs(yearTime).startOf('year').format('YYYY-MM-DD 00:00:00')
});
requestParams.filters.push({
field: 'endTime',
operator: 'eq',
dataType: 'date',
value: dayjs(yearTime).endOf('year').format('YYYY-MM-DD 23:59:59')
});
}
}
// 转换 orders 格式：从 JSON 字符串转换为数组格式
if (matchedItem.orders) {
try {
const ordersObj = JSON.parse(matchedItem.orders);
const ordersArray = Object.entries(ordersObj).map(([field, dir]) => ({
field,
dir
}));
requestOrders = ordersArray;
} catch (e) {
console.error('解析 orders 失败:', e);
}
}
}
// 如果没有匹配到 urlList，尝试解析 paramJson
if (layer?.orders) {
try {
const ordersObj = JSON.parse(layer.orders);
const ordersArray = Object.entries(ordersObj).map(([field, dir]) => ({
field,
dir
}));
requestOrders = ordersArray;
} catch (e) {
console.error('解析 orders 失败:', e);
}
}
if (!Object.keys(requestParams).length && paramJson) {
try {
const jsonObj = JSON.parse(paramJson);
@ -1109,6 +1141,8 @@ export const useMapStore = defineStore('map', () => {
const allPointData = mapDataStore.rebuildPointDataFromCache();
console.log(888);
console.log(currentCheckedKeys);
// 更新地图锚点显示
await updateLayerData(currentCheckedKeys, false);
}

3
frontend/src/store/modules/permission.ts
View File

@ -15,7 +15,8 @@ const filterAsyncRoutes = (routes: RouteRecordRaw[], roles: string[]) => {
// ✅ 保存原始名称到 meta，用于菜单显示
tmp.meta = {
...tmp.meta,
title: tmp.name || tmp.menuName // 原始名称用于显示
title: tmp.name || tmp.menuName, // 原始名称用于显示
moduleId: tmp.id // 保存菜单ID，供地图模块使用
};
// ✅ name 使用路径生成唯一值
tmp.name = tmp.path || tmp.opturl;

3
frontend/src/styles/ant-design-vue.scss
View File

@ -39,3 +39,6 @@
.ant-message {
z-index: 2005 !important;
}
.ant-modal-header {
cursor: move;
}

204
frontend/src/utils/GisUrlList.ts
View File

@ -25,16 +25,16 @@ export const urlList = [
orders:
'{"baseId":"asc","rvcdStepSort":"asc","siteStepSort":"asc","ennm":"asc"}'
},
{
url: '/wmp-env-server/env/wq/anchorPoint/reach/GetKendoListCust',
title: '实际水质',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
{
url: '/wmp-env-server/env/wq/anchorPoint/reach/GetKendoListCust',
title: '目标水质',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
// {
// url: '/wmp-env-server/env/wq/anchorPoint/reach/GetKendoListCust',
// title: '实际水质',
// params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
// },
// {
// url: '/wmp-env-server/env/wq/anchorPoint/reach/GetKendoListCust',
// title: '目标水质',
// params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
// },
// {
// url: '/wmp-env-server/env/wq/anchorPoint/GetKendoListCust',
// title: '自建站',
@ -171,11 +171,11 @@ export const urlList = [
title: '水电站告警情况',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
{
url: '/wmp-env-server/fb/point/discharge/GetKendoListCust',
title: '水电站',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
// {
// url: '/wmp-env-server/fb/point/discharge/GetKendoListCust',
// title: '水电站',
// params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
// },
{
url: '/wmp-env-server/env/fh/zqpoint/GetKendoListCust',
title: '国家水文站',
@ -200,19 +200,19 @@ export const urlList = [
title: '视频监控站',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
{
url: '/wmp-env-server/env/wb/point/GetKendoListCust',
title: '气象站',
params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
},
{
url: '/wmp-env-server/sw/getEngTempPointList/getLastData',
title: '水温站点',
params: {
logic: 'and',
filters: []
}
},
// {
// url: '/wmp-env-server/env/wb/point/GetKendoListCust',
// title: '气象站',
// params: { lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] }
// },
// {
// url: '/wmp-env-server/sw/getEngTempPointList/getLastData',
// title: '水温站点',
// params: {
// logic: 'and',
// filters: []
// }
// },
{
url: '/wmp-env-server/env/wq/anchorPoint/GetKendoListCust',
title: '水质站点',
@ -233,38 +233,38 @@ export const urlList = [
},
orders: '{"orderIndex":"asc"}'
},
{
url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
title: '水质告警',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'WQ' }]
}
},
{
url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
title: '水温告警',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'WTRV' }]
}
},
{
url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
title: '水位告警',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'ENG' }]
}
},
{
url: '/wmp-env-server/env/warn/stcd/operatePoint/GetKendoListCust',
title: '环保设施告警',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
yr: dayjs().format('YYYY')
}
},
// {
// url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
// title: '水质告警',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'WQ' }]
// }
// },
// {
// url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
// title: '水温告警',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'WTRV' }]
// }
// },
// {
// url: '/wmp-env-server/env/warn/stcd/point/GetKendoListCust',
// title: '水位告警',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'ENG' }]
// }
// },
// {
// url: '/wmp-env-server/env/warn/stcd/operatePoint/GetKendoListCust',
// title: '环保设施告警',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// yr: dayjs().format('YYYY')
// }
// },
{
url: '/wmp-env-server/env/fp/point/built/GetKendoListCust',
title: '在建过鱼设施-地图锚点',
@ -273,24 +273,24 @@ export const urlList = [
bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
}
},
{
url: '/wmp-env-server/env/fb/point/built/GetKendoListCust',
title: '在建鱼类增殖站',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'FB' }],
bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
}
},
{
url: '/wmp-env-server/env/fb/point/built/GetKendoListCust',
title: '在建人工产卵场',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'SG' }],
bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
}
},
// {
// url: '/wmp-env-server/env/fb/point/built/GetKendoListCust',
// title: '在建鱼类增殖站',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'FB' }],
// bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
// }
// },
// {
// url: '/wmp-env-server/env/fb/point/built/GetKendoListCust',
// title: '在建人工产卵场',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'SG' }],
// bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
// }
// },
{
url: '/wmp-env-server/env/fhvap/built/GetKendoListCust',
title: '在建珍稀植物园',
@ -309,21 +309,21 @@ export const urlList = [
bldsttCcode: [{ field: 'bldsttCcode', operator: 'eq', value: '1' }]
}
},
{
url: '/wmp-env-server/eng/eq/eqds/built/GetKendoListCust',
title: '在建生态流量泄放设施',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
BLDSTT_CCODE: [{ field: 'BLDSTT_CCODE', operator: 'eq', value: '1' }]
}
},
{
url: '/wmp-env-server/env/we/fishList/point/GetKendoList',
title: '鱼类沿程',
params: {
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }]
}
},
// {
// url: '/wmp-env-server/eng/eq/eqds/built/GetKendoListCust',
// title: '在建生态流量泄放设施',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }],
// BLDSTT_CCODE: [{ field: 'BLDSTT_CCODE', operator: 'eq', value: '1' }]
// }
// },
// {
// url: '/wmp-env-server/env/we/fishList/point/GetKendoList',
// title: '鱼类沿程',
// params: {
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }]
// }
// },
{
url: '/wmp-env-server/env/wva/point/GetKendoListCust',
title: '野生动物监测',
@ -332,15 +332,15 @@ export const urlList = [
sttpCode: [{ field: 'sttpCode', operator: 'eq', value: 'WVA' }]
}
},
{
url: '/wmp-env-server/env/we/fishList/point/GetNativeRareFish',
title: '土著珍稀鱼类',
params: {
rare: '1',
specOrigin: '1',
lgtd: [{ field: 'lgtd', operator: 'isnotnull' }]
}
},
// {
// url: '/wmp-env-server/env/we/fishList/point/GetNativeRareFish',
// title: '土著珍稀鱼类',
// params: {
// rare: '1',
// specOrigin: '1',
// lgtd: [{ field: 'lgtd', operator: 'isnotnull' }]
// }
// },
// { url: '/wmp-env-server/te/tet/point/GetTerrestrialAnimal', title: '陆生动物分布', params: { baseId: window?.__lyConfigs?.baseId, lgtd: [{ field: 'lgtd', operator: 'isnotnull' }] } },
{
url: '/wmp-env-server/sdFprdR/point/getFprdPointList',

153
frontend/src/utils/drag.ts Normal file
View File

@ -0,0 +1,153 @@
import { nextTick, watch } from 'vue';
export interface DraggableOptions {
/** 拖拽手柄选择器，默认 '.ant-modal-header' */
handle?: string;
/** 弹窗内容选择器，默认 '.ant-modal-content' */
modalSelector?: string;
/** 是否限制在可视区域内，默认 true */
boundary?: boolean;
/** 打开弹窗时是否自动重置到居中位置，默认 true */
resetOnOpen?: boolean;
}
export function useDraggable(
openRef: { value: boolean },
options: DraggableOptions = {}
) {
console.log(openRef);
const {
handle = '.ant-modal-header',
modalSelector = '.ant-modal-content',
boundary = true,
resetOnOpen = true
} = options;
let cleanup: (() => void) | null = null;
const initDrag = (): (() => void) | null => {
const modalContent = document.querySelector(
modalSelector
) as HTMLElement | null;
const dragHandle = document.querySelector(handle) as HTMLElement | null;
if (!modalContent || !dragHandle) return null;
// 重置位置到居中
if (resetOnOpen) {
modalContent.style.position = '';
modalContent.style.left = '';
modalContent.style.top = '';
modalContent.style.margin = '';
modalContent.style.transform = '';
}
let isDragging = false;
let startX = 0;
let startY = 0;
let startLeft = 0;
let startTop = 0;
const getPointerPos = (e: MouseEvent | TouchEvent) => {
if (e instanceof TouchEvent) {
const touch = e.touches[0];
return { clientX: touch.clientX, clientY: touch.clientY };
}
return { clientX: e.clientX, clientY: e.clientY };
};
const onPointerDown = (e: MouseEvent | TouchEvent) => {
if (
e.target instanceof HTMLElement &&
(e.target.closest('.ant-modal-close') ||
e.target.closest('button') ||
e.target.closest('input') ||
e.target.closest('select') ||
e.target.closest('textarea') ||
e.target.closest('a'))
)
return;
e.preventDefault();
isDragging = true;
const rect = modalContent.getBoundingClientRect();
startLeft = rect.left;
startTop = rect.top;
const pos = getPointerPos(e);
startX = pos.clientX - startLeft;
startY = pos.clientY - startTop;
// --- 新增：固定宽度 ---
const currentWidth = modalContent.offsetWidth;
modalContent.style.width = currentWidth + 'px';
modalContent.style.userSelect = 'none';
modalContent.style.webkitUserSelect = 'none';
modalContent.style.position = 'fixed';
modalContent.style.margin = '0';
modalContent.style.transform = 'none';
document.addEventListener('mousemove', onPointerMove, { passive: false });
document.addEventListener('mouseup', onPointerUp);
document.addEventListener('touchmove', onPointerMove, { passive: false });
document.addEventListener('touchend', onPointerUp);
};
const onPointerMove = (e: MouseEvent | TouchEvent) => {
if (!isDragging) return;
e.preventDefault();
const pos = getPointerPos(e);
let newLeft = pos.clientX - startX;
let newTop = pos.clientY - startY;
if (boundary) {
const maxX = window.innerWidth - modalContent.offsetWidth;
const maxY = window.innerHeight - modalContent.offsetHeight;
newLeft = Math.max(0, Math.min(newLeft, maxX));
newTop = Math.max(0, Math.min(newTop, maxY));
}
modalContent.style.left = `${newLeft}px`;
modalContent.style.top = `${newTop}px`;
};
const onPointerUp = () => {
isDragging = false;
modalContent.style.userSelect = '';
modalContent.style.webkitUserSelect = '';
document.removeEventListener('mousemove', onPointerMove);
document.removeEventListener('mouseup', onPointerUp);
document.removeEventListener('touchmove', onPointerMove);
document.removeEventListener('touchend', onPointerUp);
};
dragHandle.addEventListener('mousedown', onPointerDown);
dragHandle.addEventListener('touchstart', onPointerDown, {
passive: false
});
return () => {
dragHandle.removeEventListener('mousedown', onPointerDown);
dragHandle.removeEventListener('touchstart', onPointerDown);
document.removeEventListener('mousemove', onPointerMove);
document.removeEventListener('mouseup', onPointerUp);
document.removeEventListener('touchmove', onPointerMove);
document.removeEventListener('touchend', onPointerUp);
};
};
watch(
openRef,
newVal => {
if (newVal) {
nextTick(() => {
cleanup = initDrag();
});
} else {
cleanup?.();
cleanup = null;
}
},
{ immediate: true }
);
return { initDrag };
}

15
frontend/src/views/system/map/components/LayerManagement/LayerManagementForm.vue
View File

@ -58,6 +58,14 @@
placeholder="请输入锚点接口"
/>
</a-form-item>
<a-form-item label="接口参数" name="anchorParamJson" v-if="isInterface">
<a-textarea
:rows="6"
v-model:value="formData.anchorParamJson"
style="width: 100%"
placeholder="请输入接口参数"
/>
</a-form-item>
<a-form-item
label="三维接口"
name="urlThd"
@ -140,9 +148,14 @@ const defaultFormData = reactive({
id: undefined,
title: undefined,
code: undefined,
type: undefined,
treeLevel: undefined,
description: undefined,
parentId: undefined
parentId: undefined,
url: undefined,
urlThd: undefined,
paramJson: undefined,
anchorParamJson: undefined
});
const typeOpiton = ref<any>([]);
const formData: any = reactive({ ...defaultFormData });

38
frontend/src/views/system/map/components/LayerManagement/index.vue
View File

@ -13,7 +13,7 @@
:list-url="getAllMapLayerTree"
:search-params="searchParams"
>
<template #action="{ column, record }">
<template #action="{ record }">
<div class="flex gap-[6px]">
<a-button
class="!p-0"
@ -47,13 +47,13 @@
>
</div>
</template>
<template #enable="{ column, record }">
<template #enable="{ record }">
<a-switch
:checked="record.enable === 1"
@change="(checked: boolean) => handleEnableChange(record, checked)"
/>
</template>
<template #checkable="{ column, record }">
<template #checkable="{ record }">
<a-switch
:checked="record.checkable === 1"
@change="(checked: boolean) => handleCheckableChange(record, checked)"
@ -89,7 +89,10 @@ const columns = [
title: '',
dataIndex: '',
key: '',
width: 50
width: 50,
customRender: () => {
return '';
}
},
{
title: '序号',
@ -226,8 +229,9 @@ const handleAdd = (record: any) => {
// 过滤掉值为 '-' 的字段
const filterRecord = (record: any) => {
const filtered: any = {};
const keepKeys = ['code']; // 这些键始终保留
Object.keys(record).forEach(key => {
if (record[key] !== '-') {
if (keepKeys.includes(key) || record[key] !== '-') {
filtered[key] = record[key];
}
});
@ -236,6 +240,7 @@ const filterRecord = (record: any) => {
// 编辑处理
const handleEdit = (record: any) => {
console.log('handleEdit', record);
parentId.value = null;
isInterface.value = false;
currentRecord.value = filterRecord(record);
@ -243,8 +248,10 @@ const handleEdit = (record: any) => {
};
// 编辑接口处理
const handleEditInterface = (record: any) => {
isInterface.value = true;
console.log('handleEdit', record);
currentRecord.value = filterRecord(record);
console.log('handleEdit', currentRecord.value);
isInterface.value = true;
parentId.value = null;
editModalVisible.value = true;
};
@ -285,6 +292,7 @@ const handleReset = () => {
// 是否启用切换处理
const handleEnableChange = (record: any, checked: boolean) => {
currentRecord.value = filterRecord(record);
console.log(currentRecord.value);
record.enable = checked ? 1 : 0;
handleEditSubmit({ enable: checked ? 1 : 0 }, 'switch');
};
@ -310,13 +318,21 @@ const handleEditSubmit = async (values: any, type: string) => {
...values,
parentId: parentId.value
});
if (type === 'switch') {
message.success('修改状态成功');
if (res.code == 0) {
if (type === 'switch') {
message.success('修改状态成功');
} else {
message.success(`保存成功`);
}
editModalVisible.value = false;
basicTable.value.refresh();
} else {
message.success(`保存成功`);
if (type === 'switch') {
message.success('修改状态成功');
} else {
message.success(`保存成功`);
}
}
editModalVisible.value = false;
basicTable.value.refresh();
} catch (error) {
if (type === 'switch') {
message.error('修改状态失败');

83
frontend/src/views/system/map/components/LegendData/LegendDataForm.vue
View File

@ -67,29 +67,32 @@
placeholder="请输入icon编码"
/>
</a-form-item>
<a-form-item label="父级图例名称" name="parentId">
<a-select
<a-form-item label="父级图例" name="parentId">
<a-tree-select
v-model:value="formData.parentId"
:options="LegendOptions"
:tree-data="processedLegendOptions"
:fieldNames="{
label: 'name',
value: 'id'
value: 'id',
children: 'childrenList'
}"
style="width: 100%"
placeholder="请选择父级图例名称"
placeholder="请选择父级图例"
@select="handleParentSelect"
/>
</a-form-item>
<a-form-item label="图层名称" name="layerCode">
<a-form-item label="图层" name="layerCode">
<a-tree-select
v-model:value="formData.layerCode"
:tree-data="LayerOptions"
:tree-data="processedLayerOptions"
:fieldNames="{
label: 'title',
value: 'code',
children: 'children'
}"
style="width: 100%"
placeholder="请选择图层名称"
placeholder="请选择图层"
@select="handleLayerSelect"
/>
</a-form-item>
<a-form-item label="二维最小缩放" name="minZoom">
@ -163,6 +166,29 @@ const options = ref([
{ label: '锚点', value: 'pointLayer' }
]);
const processTreeData = (data: any[], childrenKey = 'children'): any[] => {
if (!data || !Array.isArray(data)) return [];
return data.map(item => {
const newItem = { ...item };
const hasChildren = newItem[childrenKey] && newItem[childrenKey].length > 0;
if (hasChildren) {
newItem.selectable = false;
newItem[childrenKey] = processTreeData(newItem[childrenKey], childrenKey);
} else {
newItem.selectable = true;
}
return newItem;
});
};
const processedLegendOptions = computed(() => {
return processTreeData(props.LegendOptions || [], 'childrenList');
});
const processedLayerOptions = computed(() => {
return processTreeData(props.LayerOptions || [], 'children');
});
const modalVisible = computed({
get: () => props.visible,
set: val => emit('update:visible', val)
@ -207,6 +233,47 @@ const rules: Record<string, Rule[]> = {
};
const isEdit = computed(() => !!props.initialValues);
const handleChange = (value: any) => {
console.log(value);
};
const checkNodeHasChildren = (
nodes: any[],
value: any,
childrenKey: string
): boolean => {
for (const node of nodes) {
if (node.id === value || node.code === value) {
return !!(node[childrenKey] && node[childrenKey].length > 0);
}
if (node[childrenKey] && node[childrenKey].length > 0) {
if (checkNodeHasChildren(node[childrenKey], value, childrenKey)) {
return true;
}
}
}
return false;
};
const handleParentSelect = (value: any) => {
if (
value &&
checkNodeHasChildren(props.LegendOptions || [], value, 'childrenList')
) {
message.warning('请选择叶子节点，不能选择有子级的父节点');
formData.parentId = undefined;
}
};
const handleLayerSelect = (value: any) => {
if (
value &&
checkNodeHasChildren(props.LayerOptions || [], value, 'children')
) {
message.warning('请选择叶子节点，不能选择有子级的父节点');
formData.layerCode = undefined;
}
};
const handleOk = async () => {
try {

52
frontend/src/views/system/map/components/LegendData/LegendDataSelectedConfig.vue
View File

@ -9,6 +9,9 @@
>
<div class="mb-4">
<a-button type="primary" @click="handleAdd">新增选中配置</a-button>
<a-button class="ml-2" @click="handleDeleteSelected"
>删除选中配置</a-button
>
</div>
<a-table
:columns="columns"
@ -17,6 +20,7 @@
:pagination="pagination"
row-key="id"
@change="handleTableChange"
:row-selection="{ onChange: onSelectChange }"
>
<template #action="{ record }">
<div class="flex gap-[6px]">
@ -97,17 +101,17 @@ const columns = [
}
},
{
title: '是否默认展示',
dataIndex: 'enable',
key: 'enable',
title: '是否默认选中',
dataIndex: 'checked',
key: 'checked',
width: 150,
customRender: ({ record }: any) => {
const text =
record.enable === 1 ? '是' : record.enable === 0 ? '否' : '-';
record.checked === 1 ? '是' : record.checked === 0 ? '否' : '-';
const color =
record.enable === 1
record.checked === 1
? '#52c41a'
: record.enable === 0
: record.checked === 0
? '#ff4d4f'
: '#999';
return h('span', { style: { color } }, text);
@ -129,6 +133,7 @@ const columns = [
const tableData = ref<any[]>([]);
const tableLoading = ref(false);
const selectedRows = ref<any[]>([]);
const pagination = reactive({
current: 1,
pageSize: 10,
@ -155,11 +160,11 @@ const fetchTableData = async () => {
tableLoading.value = true;
try {
const res = await getAllMapLegendModuleTree({
skip: pagination.current - 1,
skip: pagination.current,
take: pagination.pageSize,
sort: [
{
field: 'orderIndex',
field: 'id',
dir: 'asc'
}
],
@ -184,7 +189,10 @@ const fetchTableData = async () => {
tableLoading.value = false;
}
};
const onSelectChange = (row: any[]) => {
console.log(row);
selectedRows.value = row;
};
const handleTableChange = (pag: any) => {
pagination.current = pag.current;
pagination.pageSize = pag.pageSize;
@ -199,7 +207,7 @@ const handleAdd = () => {
// 编辑
const handleEdit = (record: any) => {
if (record.moduleId == 'tycd') {
if (record.moduleId == 'common') {
record.universal = 1;
} else {
record.universal = 0;
@ -226,6 +234,28 @@ const handleDelete = (record: any) => {
}
});
};
const handleDeleteSelected = () => {
console.log(selectedRows.value);
Modal.confirm({
title: '确认删除',
content: '确定要删除选中的记录吗？',
zIndex: 2100,
onOk: async () => {
try {
let res = await deleteMapLegendModule(selectedRows.value);
if (res.code == 0) {
message.success('删除成功');
fetchTableData();
} else {
message.error('删除失败');
}
} catch (error) {
message.error('删除失败');
return;
}
}
});
};
// 表单取消
const handleFormCancel = () => {
@ -241,7 +271,7 @@ const handleFormSubmit = async (values: any) => {
let res = await saveMapLegendModule({
...values,
resId: props.legendId,
resType: props.legendType
resType: 'legend'
});
// 刷新表格数据
message.success('保存成功');

67
frontend/src/views/system/map/components/LegendData/LegendDataSelectedConfigForm.vue
View File

@ -31,7 +31,7 @@
>
<a-tree-select
v-model:value="formData.moduleId"
:tree-data="menuTreeData"
:tree-data="processedMenuTreeData"
:field-names="{ label: 'name', value: 'id', children: 'children' }"
tree-node-filter-prop="name"
style="width: 100%"
@ -39,10 +39,11 @@
allow-clear
show-search
tree-default-expand-all
@select="handleLayerSelect"
/>
</a-form-item>
<a-form-item label="是否选中" name="enable">
<a-radio-group v-model:value="formData.enable">
<a-form-item label="是否默认选中" name="checked">
<a-radio-group v-model:value="formData.checked">
<a-radio :value="1">是</a-radio>
<a-radio :value="0">否</a-radio>
</a-radio-group>
@ -92,11 +93,33 @@ const modalVisible = computed({
const formRef = ref();
const menuTreeData = ref<any[]>([]);
const processTreeData = (data: any[], childrenKey = 'children'): any[] => {
if (!data || !Array.isArray(data)) return [];
return data.map(item => {
const newItem = { ...item };
const hasChildren = newItem[childrenKey] && newItem[childrenKey].length > 0;
if (hasChildren) {
newItem.selectable = false;
newItem[childrenKey] = processTreeData(newItem[childrenKey], childrenKey);
} else {
newItem.selectable = true;
}
return newItem;
});
};
const processedMenuTreeData = computed(() => {
return processTreeData(menuTreeData.value || [], 'children');
});
const defaultFormData = reactive({
id: undefined,
legendId: undefined,
moduleId: undefined,
enable: 1,
checked: 1,
orderIndex: 0,
universal: 0
});
@ -108,7 +131,7 @@ const rules: Record<string, Rule[]> = {
{ required: true, message: '请选择是否通用菜单', trigger: 'change' }
],
moduleId: [{ required: true, message: '请选择所属菜单', trigger: 'change' }],
enable: [{ required: true, message: '请选择是否选中', trigger: 'change' }],
checked: [{ required: true, message: '请选择是否选中', trigger: 'change' }],
orderIndex: [{ required: true, message: '请输入排序', trigger: 'blur' }]
};
@ -133,12 +156,16 @@ const fetchMenuTree = async () => {
const handleOk = async () => {
try {
await formRef.value.validate();
const values = { ...formData, systemId: 'qgc', systemName: 'qgc' };
const values = {
...formData,
systemId: 'qgc',
systemName: 'qgc'
};
if (values.universal === 0) {
delete values.universal;
} else {
delete values.universal;
values.moduleId = 'tycd';
values.moduleId = 'common';
}
console.log(values);
emit('ok', values);
@ -148,6 +175,32 @@ const handleOk = async () => {
}
};
const checkNodeHasChildren = (
nodes: any[],
value: any,
childrenKey: string
): boolean => {
for (const node of nodes) {
if (node.id === value || node.code === value) {
return !!(node[childrenKey] && node[childrenKey].length > 0);
}
if (node[childrenKey] && node[childrenKey].length > 0) {
if (checkNodeHasChildren(node[childrenKey], value, childrenKey)) {
return true;
}
}
}
return false;
};
const handleLayerSelect = (value: any) => {
if (
value &&
checkNodeHasChildren(menuTreeData.value || [], value, 'children')
) {
message.warning('请选择叶子节点，不能选择有子级的父节点');
formData.moduleId = undefined;
}
};
const handleCancel = () => {
emit('update:visible', false);
emit('cancel');

18
frontend/src/views/system/map/components/LegendData/index.vue
View File

@ -15,7 +15,7 @@
:list-url="getAllMapLegendTree"
:search-params="searchParams"
>
<template #action="{ column, record }">
<template #action="{ record }">
<div class="flex gap-[6px] justify-between">
<a-button
class="!p-0"
@ -41,19 +41,19 @@
>
</div>
</template>
<template #enable="{ column, record }">
<template #enable="{ record }">
<a-switch
:checked="record.enable === 1"
@change="(checked: boolean) => handleEnableChange(record, checked)"
/>
</template>
<template #internal="{ column, record }">
<template #internal="{ record }">
<a-switch
:checked="record.internal === 1"
@change="(checked: boolean) => handleInternalChange(record, checked)"
/>
</template>
<template #ifShow="{ column, record }">
<template #ifShow="{ record }">
<a-switch
:checked="record.ifShow === 1"
@change="(checked: boolean) => handleIfShowChange(record, checked)"
@ -311,8 +311,12 @@ const handleDelete = (record: any) => {
onOk: async () => {
try {
let res = await deleteMapLegend([record.id]);
message.success('删除成功');
basicTable.value.refresh();
if (res.code == 1) {
message.error('删除失败');
} else {
message.success('删除成功');
basicTable.value.refresh();
}
} catch (error) {
message.error('删除失败');
return;
@ -364,7 +368,7 @@ const handleReset = () => {
basicTable.value.getList({
logic: 'and',
filters: [
{ field: 'dataType', operator: 'eq', dataType: 'string', value: '1' }
{ field: 'dataType', operator: 'eq', dataType: 'string', value: '2' }
]
});
});

13
frontend/src/views/system/map/components/LegendStructure/index.vue
View File

@ -14,7 +14,7 @@
:transformData="transformData"
:list-url="getAllMapLegendTree"
>
<template #action="{ column, record }">
<template #action="{ record }">
<div class="flex gap-[6px]">
<a-button
class="!p-0"
@ -41,19 +41,19 @@
>
</div>
</template>
<template #enable="{ column, record }">
<template #enable="{ record }">
<a-switch
:checked="record.enable === 1"
@change="(checked: boolean) => handleEnableChange(record, checked)"
/>
</template>
<template #internal="{ column, record }">
<template #internal="{ record }">
<a-switch
:checked="record.internal === 1"
@change="(checked: boolean) => handleInternalChange(record, checked)"
/>
</template>
<template #ifShow="{ column, record }">
<template #ifShow="{ record }">
<a-switch
:checked="record.ifShow === 1"
@change="(checked: boolean) => handleIfShowChange(record, checked)"
@ -88,7 +88,10 @@ const columns = [
title: '',
dataIndex: '',
key: '',
width: 50
width: 50,
customRender: () => {
return null;
}
},
{
title: '序号',

466
frontend/src/views/system/menu/index.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ElForm, ElMessageBox, ElMessage } from "element-plus";
import { ref, onMounted } from 'vue';
import { ElForm, ElMessageBox, ElMessage } from 'element-plus';
import {
getdata,
addmenu,
@ -8,20 +8,20 @@ import {
deltmenu,
moveOrderno,
uploadIcon,
moveIcon,
} from "@/api/menu";
import Sortable from "sortablejs";
moveIcon
} from '@/api/menu';
import Sortable from 'sortablejs';
//定义表格数据
const url = import.meta.env.VITE_APP_BASE_API;
const tableData: any = ref([]);
function gteTabledata() {
const params = {
systemcode: systemcode.value,
name: "",
name: ''
};
loading.value = true;
getdata(params)
.then((res) => {
.then(res => {
tableData.value = res;
loading.value = false;
})
@ -34,54 +34,54 @@ const menuInfoRef = ref();
const btnInfoRef = ref();
const loading = ref(false);
//定义tabbar
const systemcode = ref("1");
const activeIndex = ref("1");
const systemcode = ref('1');
const activeIndex = ref('1');
function handleSelect(key: string) {
if (key == "1") {
systemcode.value = "1";
} else if (key == "2") {
systemcode.value = "2";
} else if (key == "3") {
systemcode.value = "3";
if (key == '1') {
systemcode.value = '1';
} else if (key == '2') {
systemcode.value = '2';
} else if (key == '3') {
systemcode.value = '3';
}
gteTabledata();
}
//定义搜索框文本
const menuname = ref("");
const menuname = ref('');
//点击搜索
function search() {
menuname.value = menuname.value.replace(/\s+/g, "");
menuname.value = menuname.value.replace(/\s+/g, '');
let params = {
systemcode: systemcode.value,
name: menuname.value,
isdisplay: "",
isdisplay: ''
};
getdata(params).then((res) => {
getdata(params).then(res => {
tableData.value = res;
});
}
//目录添加
const title = ref("");
const title = ref('');
const expertInfo: any = ref({
name: "",
type: "0",
opturl: "",
permission: "",
name: '',
type: '0',
opturl: '',
permission: '',
isdisplay: true,
systemcode: "",
icon: "",
code: "",
systemcode: '',
icon: '',
code: ''
});
const dialogVisible = ref(false);
function addClick() {
title.value = "新增目录";
title.value = '新增目录';
const orgnamemage = ref({
name: "",
type: "3",
opturl: "",
permission: "",
name: '',
type: '3',
opturl: '',
permission: '',
orderno: 1,
isdisplay: "1",
isdisplay: '1'
});
expertInfo.value = orgnamemage.value;
dialogVisible.value = true;
@ -97,35 +97,37 @@ function handleClose() {
}
//表格规则定义
const rules = ref({
name: [{ required: true, message: "请输入目录名称", trigger: "blur" }],
opturl: [{ required: true, message: "请输入操作URL", trigger: "blur" }],
permission: [{ required: true, message: "请输入目录权限标识", trigger: "blur" }],
name: [{ required: true, message: '请输入目录名称', trigger: 'blur' }],
opturl: [{ required: true, message: '请输入操作URL', trigger: 'blur' }],
permission: [
{ required: true, message: '请输入目录权限标识', trigger: 'blur' }
]
});
//添加子目录
const parentID = ref("");
const parentID = ref('');
function addchilder(row: any) {
title.value = "新增子目录";
title.value = '新增子目录';
const orgnamemage = ref({
name: "",
type: "3",
opturl: "",
permission: "",
name: '',
type: '3',
opturl: '',
permission: '',
orderno: 1,
isdisplay: "1",
isdisplay: '1'
});
parentID.value = row.id;
expertInfo.value = orgnamemage.value;
dialogVisible.value = true;
iconall.value = "";
iconall.value = '';
getid.value = row.id;
}
//新增目录-确认按钮
function expertsubmit() {
if (expertInfo.value.name == "") {
if (expertInfo.value.name == '') {
ElMessage({
message: "请填写目录名称",
type: "error",
message: '请填写目录名称',
type: 'error'
});
return false;
}
@ -133,116 +135,120 @@ function expertsubmit() {
let params = {
name: expertInfo.value.name,
systemcode: systemcode.value,
type: "0",
parentid: "0",
type: '0',
parentid: '0',
id: expertInfo.value.id,
icon: iconall.value,
opturl: expertInfo.value.opturl,
isdisplay: expertInfo.value.isdisplay,
isdisplay: expertInfo.value.isdisplay
};
editmenu(params).then(() => {
gteTabledata();
dialogVisible.value = false;
ElMessage({
message: "修改成功",
type: "success",
message: '修改成功',
type: 'success'
});
});
} else if (title.value == "新增子目录") {
} else if (title.value == '新增子目录') {
let params = {
name: expertInfo.value.name,
systemcode: systemcode.value,
type: "0",
type: '0',
opturl: expertInfo.value.opturl,
isdisplay: expertInfo.value.isdisplay,
parentid: parentID.value,
icon: iconall.value,
icon: iconall.value
};
addmenu(params).then(() => {
gteTabledata();
dialogVisible.value = false;
ElMessage({
message: "新建成功",
type: "success",
message: '新建成功',
type: 'success'
});
});
} else {
let params = {
name: expertInfo.value.name,
systemcode: systemcode.value,
type: "0",
type: '0',
opturl: expertInfo.value.opturl,
isdisplay: expertInfo.value.isdisplay,
parentid: "0",
parentid: '0',
id: expertInfo.value.id,
icon: iconall.value,
icon: iconall.value
};
addmenu(params).then(() => {
gteTabledata();
dialogVisible.value = false;
ElMessage({
message: "新建成功",
type: "success",
message: '新建成功',
type: 'success'
});
});
}
}
//菜单目录
const menurules = ref({
name: [{ required: true, message: "请输入菜单名称", trigger: "blur" }],
opturl: [{ required: true, message: "请输入操作URL", trigger: "blur" }],
permission: [{ required: true, message: "请输入菜单权限标识", trigger: "blur" }],
name: [{ required: true, message: '请输入菜单名称', trigger: 'blur' }],
opturl: [{ required: true, message: '请输入操作URL', trigger: 'blur' }],
permission: [
{ required: true, message: '请输入菜单权限标识', trigger: 'blur' }
]
});
const menuVisible = ref(false);
const menutitle = ref("");
const menutitle = ref('');
//定义按钮弹窗数据
const btnInfo: any = ref({
name: " ",
orderno: " ",
islink: " ",
opturl: " ",
permission: " ",
isdisplay: " ",
icon: "",
name: ' ',
orderno: ' ',
islink: ' ',
opturl: ' ',
permission: ' ',
isdisplay: ' ',
icon: ''
});
const btnVisible = ref(false);
const btnrules = ref({
name: [{ required: true, message: "请输入按钮名称", trigger: "blur" }],
permission: [{ required: true, message: "请输入按钮权限标识", trigger: "blur" }],
name: [{ required: true, message: '请输入按钮名称', trigger: 'blur' }],
permission: [
{ required: true, message: '请输入按钮权限标识', trigger: 'blur' }
]
});
//定义菜单弹窗数据
const menuInfo: any = ref({
name: "",
orderno: "",
islink: "",
opturl: "",
permission: "",
isdisplay: "",
icon: "",
name: '',
orderno: '',
islink: '',
opturl: '',
permission: '',
isdisplay: '',
icon: ''
});
//修改目录
const btntitle = ref("");
const getid = ref("");
const allId = ref("");
const btntitle = ref('');
const getid = ref('');
const allId = ref('');
function handleEdit(row: any) {
iconall.value = row.icon;
const Row = JSON.parse(JSON.stringify(row));
getid.value = row.id;
btnparentid.value = row.parentid;
if (row.type == "2") {
btntitle.value = "修改按钮";
if (row.type == '2') {
btntitle.value = '修改按钮';
let newInfo = ref({});
newInfo.value = Row;
btnInfo.value = newInfo.value;
btnVisible.value = true;
} else if (row.type == "1") {
menutitle.value = "修改菜单";
} else if (row.type == '1') {
menutitle.value = '修改菜单';
let newInfo = ref({});
newInfo.value = Row;
menuInfo.value = newInfo.value;
menuVisible.value = true;
} else {
title.value = "修改目录";
title.value = '修改目录';
let newInfo = ref({});
newInfo.value = Row;
expertInfo.value = newInfo.value;
@ -250,39 +256,39 @@ function handleEdit(row: any) {
}
}
//新增菜单
const btnparentid = ref("");
const btnparentid = ref('');
function menuclick(row: any) {
if (row.id == undefined) {
btnparentid.value = "0";
btnparentid.value = '0';
} else {
btnparentid.value = row.id;
}
menutitle.value = "添加菜单";
menutitle.value = '添加菜单';
(menuInfo.value = {
name: "",
type: "1",
islink: "0",
opturl: "",
permission: "",
name: '',
type: '1',
islink: '0',
opturl: '',
permission: '',
orderno: 1,
isdisplay: "1",
isdisplay: '1'
}),
(menuVisible.value = true);
iconall.value = "";
iconall.value = '';
getid.value = row.id;
}
//添加按钮
function btnclick(row: any) {
getid.value = row.id;
btntitle.value = "添加按钮";
btntitle.value = '添加按钮';
(btnInfo.value = {
name: "",
type: "2",
islink: "0",
opturl: "",
permission: "",
name: '',
type: '2',
islink: '0',
opturl: '',
permission: '',
orderno: 1,
isdisplay: "1",
isdisplay: '1'
}),
(btnVisible.value = true);
btnparentid.value = row.id;
@ -290,36 +296,36 @@ function btnclick(row: any) {
//删除
function handleDelete(row: any) {
const message = ref();
if (row.type == "0") {
message.value = "确定删除此目录及此目录下的所有菜单吗？";
} else if (row.type == "1") {
message.value = "确定删除此菜单及此菜单下的所有按钮吗？";
} else if (row.type == "2") {
message.value = "确定删除此按钮吗？";
if (row.type == '0') {
message.value = '确定删除此目录及此目录下的所有菜单吗？';
} else if (row.type == '1') {
message.value = '确定删除此菜单及此菜单下的所有按钮吗？';
} else if (row.type == '2') {
message.value = '确定删除此按钮吗？';
}
ElMessageBox.confirm(message.value, "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
ElMessageBox.confirm(message.value, '删除提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: row.id,
id: row.id
};
deltmenu(params).then(() => {
gteTabledata();
ElMessage({
message: "删除成功",
type: "success",
message: '删除成功',
type: 'success'
});
});
});
}
//菜单目录-确定
function menusubmit() {
if (menuInfo.value.name == "") {
if (menuInfo.value.name == '') {
ElMessage({
message: "请填写菜单名称",
type: "error",
message: '请填写菜单名称',
type: 'error'
});
return false;
}
@ -327,41 +333,41 @@ function menusubmit() {
let params = {
name: menuInfo.value.name,
systemcode: systemcode.value,
type: "1",
type: '1',
opturl: menuInfo.value.opturl,
permission: menuInfo.value.permission,
islink: menuInfo.value.islink,
isdisplay: menuInfo.value.isdisplay,
// parentid: '',
id: getid.value,
icon: iconall.value,
icon: iconall.value
};
editmenu(params).then(() => {
gteTabledata();
menuVisible.value = false;
ElMessage({
message: "修改成功",
type: "success",
message: '修改成功',
type: 'success'
});
});
} else {
let params = {
name: menuInfo.value.name,
systemcode: systemcode.value,
type: "1",
type: '1',
opturl: menuInfo.value.opturl,
islink: menuInfo.value.islink,
isdisplay: menuInfo.value.isdisplay,
parentid: btnparentid.value,
id: expertInfo.value.id,
icon: iconall.value,
icon: iconall.value
};
addmenu(params).then(() => {
gteTabledata();
menuVisible.value = false;
ElMessage({
message: "新建成功",
type: "success",
message: '新建成功',
type: 'success'
});
});
}
@ -369,10 +375,10 @@ function menusubmit() {
//按钮目录-确定
function btnsubmit() {
if (btnInfo.value.name == "" || btnInfo.value.permission == "") {
if (btnInfo.value.name == '' || btnInfo.value.permission == '') {
ElMessage({
message: "请填写按钮名称和权限标识",
type: "error",
message: '请填写按钮名称和权限标识',
type: 'error'
});
return false;
}
@ -381,19 +387,19 @@ function btnsubmit() {
code: btnInfo.value.code,
name: btnInfo.value.name,
systemcode: systemcode.value,
type: "2",
type: '2',
opturl: btnInfo.value.opturl,
permission: btnInfo.value.permission,
islink: btnInfo.value.islink,
// isdisplay: btnInfo.value.isdisplay,
id: getid.value,
id: getid.value
};
editmenu(params).then(() => {
gteTabledata();
dialogVisible.value = false;
ElMessage({
message: "修改成功",
type: "success",
message: '修改成功',
type: 'success'
});
btnVisible.value = false;
});
@ -401,19 +407,19 @@ function btnsubmit() {
let params = {
name: btnInfo.value.name,
systemcode: systemcode.value,
type: "2",
type: '2',
opturl: btnInfo.value.opturl,
permission: btnInfo.value.permission,
islink: btnInfo.value.islink,
isdisplay: btnInfo.value.isdisplay,
parentid: btnparentid.value,
parentid: btnparentid.value
};
addmenu(params).then(() => {
gteTabledata();
dialogVisible.value = false;
ElMessage({
message: "新建成功",
type: "success",
message: '新建成功',
type: 'success'
});
btnVisible.value = false;
});
@ -425,70 +431,88 @@ function dateFormat(row: any) {
var date = new Date(daterc);
var year = date.getFullYear();
var month =
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
date.getMonth() + 1 < 10
? '0' + (date.getMonth() + 1)
: date.getMonth() + 1;
date.getMonth() + 1 < 10
? '0' + (date.getMonth() + 1)
: date.getMonth() + 1;
var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
var minutes =
date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
var seconds =
date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
// 拼接
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
return (
year +
'-' +
month +
'-' +
day +
' ' +
hours +
':' +
minutes +
':' +
seconds
);
}
}
//上传图标
function fileClick(val: any) {
allId.value = val;
const avatar = document.getElementById("avatar");
const avatar = document.getElementById('avatar');
avatar?.click();
}
const iconall = ref("");
const iconall = ref('');
function changeFile(e: any) {
const files = new FormData();
files.append("icon", e.target.files[0]);
files.append("menuId", allId.value);
files.append('icon', e.target.files[0]);
files.append('menuId', allId.value);
uploadIcon(files)
.then((res) => {
.then(res => {
iconall.value = res.data;
gteTabledata();
ElMessage({
type: "success",
message: "上传成功",
type: 'success',
message: '上传成功'
});
// location.reload()
var file: any = document.getElementById("avatar");
file.value = "";
var file: any = document.getElementById('avatar');
file.value = '';
})
.catch(() => {
ElMessage({
type: "error",
message: "上传失败",
type: 'error',
message: '上传失败'
});
var file: any = document.getElementById("avatar");
file.value = "";
var file: any = document.getElementById('avatar');
file.value = '';
});
}
//图标删除事件
function delectIcon(id: any) {
ElMessageBox.confirm("确定删除此图标吗？", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
ElMessageBox.confirm('确定删除此图标吗？', '删除提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: id,
id: id
};
moveIcon(params).then(() => {
iconall.value = "";
iconall.value = '';
gteTabledata();
ElMessage({
type: "success",
message: "删除成功",
type: 'success',
message: '删除成功'
});
});
});
}
// Icon选择器显示状态
function treeToTile(treeData: any, childKey = "children") {
function treeToTile(treeData: any, childKey = 'children') {
const arr = [] as any[];
const expanded = (data: any) => {
if (data && data.length > 0) {
@ -505,9 +529,11 @@ function treeToTile(treeData: any, childKey = "children") {
}
const activeRows: any = ref([]);
function rowDrop() {
const tbody = document.querySelector(".draggable .el-table__body-wrapper tbody");
const tbody = document.querySelector(
'.draggable .el-table__body-wrapper tbody'
);
Sortable.create(tbody, {
draggable: ".draggable .el-table__row",
draggable: '.draggable .el-table__row',
onMove: () => {
activeRows.value = treeToTile(tableData.value); // 把树形的结构转为列表再进行拖拽
},
@ -517,8 +543,8 @@ function rowDrop() {
if (oldRow.type != newRow.type) {
ElMessage({
message: "拖拽同级目录排序",
type: "warning",
message: '拖拽同级目录排序',
type: 'warning'
});
tableData.value = [];
gteTabledata();
@ -526,22 +552,22 @@ function rowDrop() {
}
const params = {
fromId: oldRow.id,
toId: newRow.id,
toId: newRow.id
};
moveOrderno(params).then((res: any) => {
if (res.code == 1) {
tableData.value = [];
gteTabledata();
ElMessage({
type: "error",
message: "修改失败",
type: 'error',
message: '修改失败'
});
} else {
tableData.value = [];
gteTabledata();
}
});
},
}
});
}
onMounted(() => {
@ -612,10 +638,15 @@ onMounted(() => {
:header-cell-style="{
background: 'rgb(250 250 250)',
color: '#383838',
height: '50px',
height: '50px'
}"
>
<el-table-column label="菜单标题" width="250" prop="name" show-overflow-tooltip>
<el-table-column
label="菜单标题"
width="250"
prop="name"
show-overflow-tooltip
>
<template #default="scope">
<div style="position: absolute; left: 15px">
<img src="@/assets/MenuIcon/lbcz_td.png" alt="" />
@ -623,7 +654,12 @@ onMounted(() => {
<div style="margin-left: 20px">{{ scope.row.name }}</div>
</template>
</el-table-column>
<el-table-column label="菜单类型" width="100" align="center" prop="type">
<el-table-column
label="菜单类型"
width="100"
align="center"
prop="type"
>
<template #default="scope">
<span v-if="scope.row.type == '2'">按钮</span>
<span v-else-if="scope.row.type == '1'">菜单</span>
@ -636,14 +672,19 @@ onMounted(() => {
width="100"
show-overflow-tooltip
/>
<el-table-column label="系统类型" width="120" prop="systemcode" align="center">
<el-table-column
label="系统类型"
width="120"
prop="systemcode"
align="center"
>
<template #default="scope">
<span v-if="scope.row.systemcode == '1'">Web端</span>
<span v-else-if="scope.row.systemcode == '2'">手机App</span>
<span v-else>Pad端</span>
</template>
</el-table-column>
<el-table-column label="图标" width="100" prop="icon" align="center">
<!-- <el-table-column label="图标" width="100" prop="icon" align="center">
<template #default="scope">
<div
v-if="scope.row.type !== '2'"
@ -702,11 +743,16 @@ onMounted(() => {
@change="changeFile"
/>
</div>
<!-- <img :src="url + '/menu/' + scope.row.icon" alt=""> -->
<img :src="url + '/menu/' + scope.row.icon" alt="">
</div>
</template>
</el-table-column>
<el-table-column label="是否外链" width="100" prop="islink" align="center">
</el-table-column> -->
<el-table-column
label="是否外链"
width="100"
prop="islink"
align="center"
>
<template #default="scope">
<span v-if="scope.row.islink == '1'">是</span>
<span v-else>否</span>
@ -729,7 +775,12 @@ onMounted(() => {
prop="permission"
show-overflow-tooltip
/>
<el-table-column label="是否显示" width="100" prop="isdisplay" align="center">
<el-table-column
label="是否显示"
width="100"
prop="isdisplay"
align="center"
>
<template #default="scope">
<span v-if="scope.row.isdisplay == '1'">是</span>
<span v-else>否</span>
@ -740,7 +791,11 @@ onMounted(() => {
label="最近修改者"
width="120"
></el-table-column>
<el-table-column prop="lastmodifydate" label="最近修改日期" width="170">
<el-table-column
prop="lastmodifydate"
label="最近修改日期"
width="170"
>
<template #default="scope">
{{ dateFormat(scope.row.lastmodifydate) }}
</template>
@ -863,7 +918,12 @@ onMounted(() => {
width="620px"
class="dialogClass"
>
<el-form ref="expertInfoRef" :model="expertInfo" :rules="rules" label-width="90px">
<el-form
ref="expertInfoRef"
:model="expertInfo"
:rules="rules"
label-width="90px"
>
<el-form-item label="目录编号" prop="name">
<el-input
v-model="expertInfo.code"
@ -910,7 +970,12 @@ onMounted(() => {
width="620px"
class="dialogClass"
>
<el-form ref="menuInfoRef" :model="menuInfo" :rules="menurules" label-width="90px">
<el-form
ref="menuInfoRef"
:model="menuInfo"
:rules="menurules"
label-width="90px"
>
<el-form-item label="菜单编号">
<el-input
v-model="menuInfo.code"
@ -920,7 +985,11 @@ onMounted(() => {
></el-input>
</el-form-item>
<el-form-item label="菜单名称" prop="name">
<el-input v-model="menuInfo.name" placeholder="" style="width: 100%"></el-input>
<el-input
v-model="menuInfo.name"
placeholder=""
style="width: 100%"
></el-input>
</el-form-item>
<el-form-item label="是否外链" prop="islink">
@ -967,7 +1036,12 @@ onMounted(() => {
class="dialogClass"
draggable
>
<el-form ref="btnInfoRef" :model="btnInfo" :rules="btnrules" label-width="90px">
<el-form
ref="btnInfoRef"
:model="btnInfo"
:rules="btnrules"
label-width="90px"
>
<el-form-item label="按钮编号">
<el-input
v-model="btnInfo.code"
@ -977,7 +1051,11 @@ onMounted(() => {
></el-input>
</el-form-item>
<el-form-item label="按钮名称" prop="name">
<el-input v-model="btnInfo.name" placeholder="" style="width: 100%"></el-input>
<el-input
v-model="btnInfo.name"
placeholder=""
style="width: 100%"
></el-input>
</el-form-item>
<el-form-item label="权限标识" prop="permission">
<el-input