zS/go-viee-fetch-Demo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat：完善配置，修改接口前缀为'/aw'

Browse Source
This commit is contained in:
Free-sss 2025-08-28 18:56:34 +08:00
parent e9f0a6eaba
commit 025a2a2aa6
13 changed files with 73 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/packages/components/Charts/ConfinedSpace/AlarmNowList/config.ts
View File

@ -3,7 +3,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { AlarmNowListConfig } from './index'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
import { chartInitConfig } from '@/settings/designSetting'
export const styleConfig = {
titleText: '实时报警',
titleOption: {
@ -31,4 +31,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = AlarmNowListConfig.key
public chartConfig = cloneDeep(AlarmNowListConfig)
public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 430, h: 300, zIndex: 1 }
}

59
src/packages/components/Charts/ConfinedSpace/AlarmNowList/index.vue
View File

@ -248,16 +248,37 @@ const handleCloseDialog = () => {
status.showDialog = false
status.selectedRow = null
}
/**
* 格式化单个报警项的函数
* @param {Object} item 原始报警数据项
* @returns {Object} 格式化后的报警数据项
*/
const formatAlarmItem = (item) => {
let newAlarmDescname = item.alarmDescname;
const dateTimeRegexInDesc = /于\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}/;
if (newAlarmDescname) {
newAlarmDescname = newAlarmDescname.replace(dateTimeRegexInDesc, '');
}
let newAlarmLevel = item.alarmLevel;
if (typeof newAlarmLevel === 'string') {
newAlarmLevel = newAlarmLevel.replace('风险', '');
}
return {
...item,
alarmTime: convertTimestampToDateTime(item.alarmTime), // 格式化 alarmTime
alarmDescname: newAlarmDescname,
alarmLevel: newAlarmLevel
};
};
const fetchRecentAlarms = async () => {
try {
isLoading.value = true;
const res = await axios.get(
`/dev/space/getRecentAlarms`, // 手动添加 dev
`/aw/space/getRecentAlarms`,
{
responseType: 'json',
}
);
if (res.data.state === true) {
let rawData = [];
if (Array.isArray(res.data.value.items)) {
@ -265,30 +286,18 @@ const fetchRecentAlarms = async () => {
} else if (Array.isArray(res.data.value)) {
rawData = res.data.value;
}
const formattedData = rawData.map(item => {
let newAlarmDescname = item.alarmDescname;
const dateTimeRegexInDesc = /于\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}/;
if (newAlarmDescname) {
newAlarmDescname = newAlarmDescname.replace(dateTimeRegexInDesc, '');
}
return {
...item,
alarmTime: convertTimestampToDateTime(item.alarmTime), // 格式化 alarmTime
alarmDescname: newAlarmDescname // 更新 alarmDescname，移除时间部分
};
});
option.dataset = formattedData; // 更新 option 的 dataset
option.dataset = rawData.map(formatAlarmItem);
} else {
console.warn('API返回数据格式不符合预期:', res);
option.dataset = [];
console.warn('API返回数据格式不符合预期，将保留原有数据并尝试重新格式化:', res);
if (Array.isArray(option.dataset)) {
option.dataset = option.dataset.map(formatAlarmItem);
}
}
} catch (error) {
console.error('获取最近报警数据失败:', error);
option.value.dataset = [];
console.error('获取最近报警数据失败，将保留原有数据并尝试重新格式化:', error);
if (Array.isArray(option.dataset)) {
option.dataset = option.dataset.map(formatAlarmItem);
}
} finally {
isLoading.value = false;
}
@ -317,7 +326,7 @@ onUnmounted(() => {
.seamless {
z-index: 1;
height: 240px;
margin: 20px 10px 30px 10px;
margin: 0px 10px 30px 10px;
overflow: hidden;
}
@ -353,7 +362,7 @@ onUnmounted(() => {
.item_level_text {
width: fit-content;
min-width: 4em;
min-width: 2em;
height: 18px;
color: #ff9191;
border-radius: 12px;

2
src/packages/components/Charts/ConfinedSpace/FiniteSpatialDistribution/3dPie.ts
View File

@ -126,7 +126,7 @@ export function getPie3D(pieData, internalDiameterRatio) {
false,
false,
k,
series[i].pieData.value
series[i].pieData.value / sumValue * 100
);
startValue = endValue;

8
src/packages/components/Charts/ConfinedSpace/FiniteSpatialDistribution/config.ts
View File

@ -4,7 +4,7 @@ import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
import { getParametricEquation, getPie3D } from './3dPie'
import { chartInitConfig } from '@/settings/designSetting'
export const includes = ['legend']
// 其它配置
@ -42,10 +42,7 @@ dataJson.source.forEach(item => {
total += item.value;
})
const series = getPie3D(dataJson.source.map(item => {
item.value = Number((item.value / total * 100).toFixed(2))
return item
}), 0.8);
const series = getPie3D(dataJson.source, 0.8);
const option = {
@ -126,4 +123,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = FiniteSpatialDistributionConfig.key
public chartConfig = cloneDeep(FiniteSpatialDistributionConfig)
public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 430, h: 300, zIndex: 1 }
}

17
src/packages/components/Charts/ConfinedSpace/FiniteSpatialDistribution/data.json
View File

@ -1,25 +1,30 @@
{
"dimensions": ["name", "value", "itemColor", "borderColor"],
"dimensions": [
"name",
"value",
"itemColor",
"borderColor"
],
"source": [
{
"name": "类型1",
"value": 5830
"value": 1867
},
{
"name": "类型2",
"value": 7020
"value": 3100
},
{
"name": "类型3",
"value": 4220
"value": 4000
},
{
"name": "类型4",
"value": 5180
"value": 1987
},
{
"name": "类型5",
"value": 2340
"value": 200
}
]
}

8
src/packages/components/Charts/ConfinedSpace/FiniteSpatialDistribution/index.vue
View File

@ -66,10 +66,7 @@ const initializeChartData = () => {
props.chartConfig.option.title[0].text = totalValue
}
const series = getPie3D(dataJson.source.map(item => {
item.value = Number((item.value / totalValue * 100).toFixed(2))
return item
}), 0.8);
const series = getPie3D(dataJson.source, 0.8);
props.chartConfig.option.series=series
@ -91,6 +88,9 @@ const updateChartData = (newData: any) => {
if (props.chartConfig.option.title && props.chartConfig.option.title[0]) {
props.chartConfig.option.title[0].text = totalValue
}
const series = getPie3D(newData.source, 0.8);
props.chartConfig.option.series = series;
}
watch(

4
src/packages/components/Charts/ConfinedSpace/Map/config.ts
View File

@ -6,7 +6,7 @@ import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
export const includes = []
const BAR_ITEM_DEFAULT_COLORS = [
{ color: "#00CF28", wfColor: "#03D61A" },
{ color: "#61DDAA", wfColor: "#8F7830" },
{ color: "#AF380E", wfColor: "#BD1408" },
{ color: "#047DB0", wfColor: "#02BBD1" },
{ color: "#01E5A9", wfColor: "#01C97F" },
@ -138,7 +138,7 @@ const option = {
}
export default class Config extends PublicConfigClass implements CreateComponentType {
public key: string = MapConfig.key
public attr = { ...chartInitConfig, w: 1300, h: 900, zIndex: -1 }
public attr = { ...chartInitConfig, x: 167, y: 429, w: 1212, h: 890, zIndex: -1 }
public chartConfig = cloneDeep(MapConfig)
public option = echartOptionProfixHandle(option, includes)
}

9
src/packages/components/Charts/ConfinedSpace/Map/index.vue
View File

@ -19,7 +19,6 @@ import axios from 'axios';
import config, { BarOption } from './config';
import { PropType, toRefs, ref, onMounted, computed, watch } from 'vue';
import dataJson from './data.json'
import { option } from 'keymaster';
const iframeRef = ref<HTMLIFrameElement | null>(null);
const isIframeReady = ref(false); // 2. 创建一个状态来跟踪 iframe 是否已加载
@ -55,9 +54,9 @@ const selectButton = (id: number) => {
const updateChartData = async (buttonId: number) => {
let dataToRender: BarOption[] = [];
if (buttonId === 1) {
dataToRender = await fetchData('/space');
dataToRender = await fetchData('/spaceMap');
} else if (buttonId === 2) {
dataToRender = await fetchData('/day');
dataToRender = await fetchData('/dayMap');
} else {
console.warn(`未知的按钮ID: ${buttonId}，将使用默认数据。`);
}
@ -67,7 +66,7 @@ const updateChartData = async (buttonId: number) => {
};
const fetchData = async (url: string) => {
try {
const response = await axios.get(url);
const response = await axios.get(`/dev${url}`);
if (response.data.state === true && response.data.value && response.data.value.length > 0) {
return response.data.value; // 返回原始数据
} else {
@ -103,7 +102,7 @@ onMounted(() => {
setTimeout(() => {
BarOptionsData.value.forEach((barConfig: any) => {
callIframeMethod("setProvinceFocusable", false)
console.log(" Drawing bar with config:", barConfig);
// console.log(" Drawing bar with config:", barConfig);
callIframeMethod("createBar", barConfig);
});
}, 500); // 500ms延迟，可根据实际情况调整

4
src/packages/components/Charts/ConfinedSpace/PieCircleCommen/config.ts
View File

@ -3,7 +3,7 @@ import { PieCircleCommenConfig } from './index'
import { CreateComponentType } from '@/packages/index.d'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './data.json'
import { chartInitConfig } from '@/settings/designSetting'
export const includes = ['legend']
export const selectStyleOption = {
showAngle: false,
@ -143,7 +143,7 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = PieCircleCommenConfig.key
public chartConfig = cloneDeep(PieCircleCommenConfig)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 430, h: 300, zIndex: 1 }
// 图表配置项
public option = echartOptionProfixHandle(option, includes)
}

8
src/packages/components/Charts/ConfinedSpace/PieCircleCommen/index.vue
View File

@ -182,15 +182,15 @@ const fetchAlarmData = async ({ startTime, endTime }: { startTime: string; endTi
const defaultNoData = {
dimensions: props.chartConfig.option.dataset.dimensions,
source: [{
[props.chartConfig.option.dataset.dimensions[0]]: "无数据",
[props.chartConfig.option.dataset.dimensions[1]]: 0
[props.chartConfig.option.dataset.dimensions[0]]: "测试数据",
[props.chartConfig.option.dataset.dimensions[1]]: 10
}],
};
try {
const res = await axios.get(
`/dev/space/getNumberByAlarmLevel`, // 手动添加 dev
`/aw/space/getNumberByAlarmLevel`,
{
params: { startTime, endTime }, // 请求参数（对应原 params）
params: { startTime, endTime },
responseType: 'json',
}
);

4
src/packages/components/Charts/ConfinedSpace/index.ts
View File

@ -2,10 +2,10 @@ import { MapConfig } from './Map'
import { PieCircleCommenConfig } from './PieCircleCommen'
import { AlarmNowListConfig } from './AlarmNowList'
import { LineDropdownConfig } from './LineDropdown'
import { SmallBorder01CoConfig } from './SmallBorder01Co'
// import { SmallBorder01CoConfig } from './SmallBorder01Co'
import { videoCheckConfig } from './videoCheck'
import {FiniteSpatialDistributionConfig} from './FiniteSpatialDistribution'
export default [MapConfig, videoCheckConfig, LineDropdownConfig, PieCircleCommenConfig, AlarmNowListConfig, SmallBorder01CoConfig,FiniteSpatialDistributionConfig]
export default [MapConfig, videoCheckConfig, LineDropdownConfig, PieCircleCommenConfig, AlarmNowListConfig,FiniteSpatialDistributionConfig]

4
src/packages/components/Charts/ConfinedSpace/videoCheck/config.ts
View File

@ -3,6 +3,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { videoCheckConfig } from './index'
import cloneDeep from 'lodash/cloneDeep'
import dataJson from './cameratree.json'
import { chartInitConfig } from '@/settings/designSetting'
export const option = {
// 摄像头id
dataset: {
@ -26,7 +27,7 @@ export const option = {
sca: 1,
showBtn: true,
isOldStyle: true,
titleText: '实时报警',
titleText: '视频巡查',
titleOption: {
color: '#ffffff',
fontSize: '17px',
@ -46,4 +47,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = videoCheckConfig.key
public chartConfig = cloneDeep(videoCheckConfig)
public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 430, h: 300, zIndex: 1 }
}

2
src/packages/components/Charts/ConfinedSpace/videoCheck/index.vue
View File

@ -527,7 +527,7 @@ const getDataSource = (newData: any) => {
const fetchCameraTree = async () => {
console.log('fetchCameraTree: 正在获取摄像头树数据...');
try {
const res = await axios.get('/dev/api/camera/tree');
const res = await axios.get('/aw/api/camera/tree');
if (res.status === 200 && res.data && res.data.state) {
console.log("API 响应数据 (Camera Tree):", res.data.value);
return res.data.value;