diff --git a/src/api/axios.ts b/src/api/axios.ts index 4444fa27..3a7a82e6 100644 --- a/src/api/axios.ts +++ b/src/api/axios.ts @@ -1,5 +1,5 @@ import axios, { AxiosResponse, AxiosRequestConfig, Axios, AxiosError, InternalAxiosRequestConfig } from 'axios' -import { RequestHttpHeaderEnum, ResultEnum, ModuleTypeEnum } from '@/enums/httpEnum' +import { RequestHttpHeaderEnum, ResultEnum, ResultErrcode } from '@/enums/httpEnum' import { PageEnum, ErrorPageNameMap } from '@/enums/pageEnum' import { StorageEnum } from '@/enums/storageEnum' import { axiosPre } from '@/settings/httpSetting' @@ -7,6 +7,7 @@ import { SystemStoreEnum, SystemStoreUserInfoEnum } from '@/store/modules/system import { redirectErrorPage, getLocalStorage, routerTurnByName, isPreview } from '@/utils' import { fetchAllowList } from './axios.config' import includes from 'lodash/includes' +import { postMessageToParent } from "@/utils"; export interface MyResponseType { code: ResultEnum @@ -50,16 +51,27 @@ axiosInstance.interceptors.request.use( // 响应拦截器 axiosInstance.interceptors.response.use( (res: AxiosResponse) => { + const { code, errcode, errmsg } = res.data as { code: number, errcode: string, errmsg: string } + + const logOutCodeList = ['00004', '000012', '000013'] + if(logOutCodeList.some(_ => _ === errcode)) { + window['$message'].error(errmsg) + setTimeout(() => { + postMessageToParent({ + type: 'logOut' + }) + }) + return Promise.resolve(res.data) + } // 预览页面错误不进行处理 if (isPreview()) { return Promise.resolve(res.data) } - const { code } = res.data as { code: number } - if (code === undefined || code === null) return Promise.resolve(res.data) + // if (code === undefined || code === null) return Promise.resolve(res.data) // 成功 - if (code === ResultEnum.SUCCESS) { + if (errcode === ResultErrcode.SUCCESS) { return Promise.resolve(res.data) } @@ -71,27 +83,28 @@ axiosInstance.interceptors.response.use( // } // 固定错误码重定向 - if (ErrorPageNameMap.get(code)) { - redirectErrorPage(code) - return Promise.resolve(res.data) - } + // if (ErrorPageNameMap.get(code)) { + // redirectErrorPage(code) + // return Promise.resolve(res.data) + // } - // 提示错误 - window['$message'].error(window['$t']((res.data as any).msg)) + // 统一提示错误 + window['$message'].error(errmsg) return Promise.resolve(res.data) }, (err: AxiosError) => { - const status = err.response?.status - switch (status) { - case 401: - routerTurnByName(PageEnum.BASE_LOGIN_NAME) - Promise.reject(err) - break - - default: - Promise.reject(err) - break - } + Promise.reject(err) + // const status = err.response?.status + // switch (status) { + // case 401: + // routerTurnByName(PageEnum.BASE_LOGIN_NAME) + // Promise.reject(err) + // break + // + // default: + // Promise.reject(err) + // break + // } } ) diff --git a/src/assets/images/chart/charts/Dashboard.png b/src/assets/images/chart/charts/Dashboard.png new file mode 100644 index 00000000..7da2b61b Binary files /dev/null and b/src/assets/images/chart/charts/Dashboard.png differ diff --git a/src/components/Pages/ChartItemSetting/PositionSetting.vue b/src/components/Pages/ChartItemSetting/PositionSetting.vue index 82f17bd0..a10cf6cf 100644 --- a/src/components/Pages/ChartItemSetting/PositionSetting.vue +++ b/src/components/Pages/ChartItemSetting/PositionSetting.vue @@ -33,13 +33,37 @@ 左 + + + + + + diff --git a/src/hooks/commonDataComponents/useDeviceClassRes.ts b/src/hooks/commonDataComponents/useDeviceClassRes.ts new file mode 100644 index 00000000..398db572 --- /dev/null +++ b/src/hooks/commonDataComponents/useDeviceClassRes.ts @@ -0,0 +1,19 @@ +import { publicInterface } from "@/api/path"; +import { CreateComponentType } from '@/packages/index.d' +import { ResultErrcode } from "@/enums/httpEnum"; +import { DeviceClassType } from '@/store/modules/chartEditStore/chartEditStore.d' +import dataJson from "./data.json"; + +export const handleDeviceClass = (targetComponent: CreateComponentType) => { + const obj = targetComponent.commonData[targetComponent.commonData.currentSource] as DeviceClassType + let { enable, space_complete_id } = obj + if(!enable) return { + errcode: ResultErrcode.SUCCESS, + data: { ...dataJson }, + errmsg: '' + } + const query = { + space_complete_id + } + return publicInterface('/dcim/system/custom_large_screen', 'count_device_by_device_type_active', query) +} diff --git a/src/hooks/useChartCommonData.hook.ts b/src/hooks/useChartCommonData.hook.ts index b1fa0cec..3a5adc5b 100644 --- a/src/hooks/useChartCommonData.hook.ts +++ b/src/hooks/useChartCommonData.hook.ts @@ -12,6 +12,7 @@ import { handleRecordValueHistory } from './commonDataComponents/useRecordValueH import { handlePointRealTime } from './commonDataComponents/usePointRealTimeRes' import { handleSinglePoint } from './commonDataComponents/useSinglePointRes' import { handleMonthAlarmClass } from './commonDataComponents/useMonthAlarmClassRes' +import { handleDeviceClass } from './commonDataComponents/useDeviceClassRes' import { handleNoParam } from './commonDataComponents/useNoParamRes' import { ResultErrcode } from '@/enums/httpEnum' @@ -97,7 +98,7 @@ export const useChartCommonData = ( clearInterval(fetchInterval) const fetchFn = async () => { - let res + let res, isMultiple = true switch (targetComponent.commonData?.currentSource) { case CurrentSourceEnum.POINTHISTORY: res = await handlePointHistory(targetComponent) @@ -113,30 +114,41 @@ export const useChartCommonData = ( break; case CurrentSourceEnum.SINGLEPOINT: res = await handleSinglePoint(targetComponent) + isMultiple = false break; case CurrentSourceEnum.MONTHALARMCLASS: res = await handleMonthAlarmClass(targetComponent) break; + case CurrentSourceEnum.DEVICECLASS: + res = await handleDeviceClass(targetComponent) + break; default: - res = await handleNoParam(targetComponent) + // res = await handleNoParam(targetComponent) break; } if (res && res.errcode === ResultErrcode.SUCCESS) { try { const { data } = res - if(Object.prototype.toString.call(data) === '[object Array]') { - if(data.length) echartsUpdateHandle(data[0]) + // 多值的 + if(isMultiple) { + if(Object.prototype.toString.call(data) === '[object Array]') { + if(data.length && data[0].dimensions && data[0].source) echartsUpdateHandle(data[0]) + else throw Error() + } + else if(Object.prototype.toString.call(data) === '[object Object]'){ + if(data.dimensions && data.source) echartsUpdateHandle(data) + else throw Error() + } } - else if(Object.prototype.toString.call(data) === '[object Object]'){ - echartsUpdateHandle(data) + // 单值的 + else { + if(data) echartsUpdateHandle(data) + else throw Error() } } catch (error) { - console.error(error) + window['$message'].error('数据错误') } } - else if(res && res.errmsg){ - window['$message'].warning(res.errmsg) - } } // 普通初始化与组件交互处理监听 watch( diff --git a/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.ts b/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.ts new file mode 100644 index 00000000..319ef9ed --- /dev/null +++ b/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.ts @@ -0,0 +1,32 @@ +import { PublicConfigClass } from '@/packages/public' +import { CreateComponentType } from '@/packages/index.d' +import { DashboardConfig } from './index' +import cloneDeep from 'lodash/cloneDeep' +// import logo from '@/assets/logo.png' +import { CurrentSourceEnum } from '@/store/modules/chartEditStore/chartEditStore.d' + + +export const option = { + dataset: 0, + showUnit: false, + showSubtext: true, + showSubtextUnit: true, + min: 0, + max: 100, + titleFontSize: 24, + titleColor: '#fff', + subtextFontSize: 20, + subtextColor: '#fff' +} + +export default class Config extends PublicConfigClass implements CreateComponentType { + constructor() { + super(); + this.attr.w = 250 + this.attr.h = 250 + this.commonData.currentSource = CurrentSourceEnum.SINGLEPOINT + } + public key = DashboardConfig.key + public chartConfig = cloneDeep(DashboardConfig) + public option = cloneDeep(option) +} diff --git a/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.vue b/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.vue new file mode 100644 index 00000000..bdacaa6b --- /dev/null +++ b/src/packages/components/CustomComponents/CustomComponents/Dashboard/config.vue @@ -0,0 +1,65 @@ + + + + + \ No newline at end of file diff --git a/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.ts b/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.ts new file mode 100644 index 00000000..10c06428 --- /dev/null +++ b/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.ts @@ -0,0 +1,14 @@ +import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d' +import { ChatCategoryEnum, ChatCategoryEnumName } from '@/packages/components/CustomComponents/index.d' + +export const DashboardConfig: ConfigType = { + key: 'Dashboard', + chartKey: 'VDashboard', + conKey: 'VCDashboard', + title: '仪表盘', + category: ChatCategoryEnum.CUSTOMCOMPONENTS, + categoryName: ChatCategoryEnumName.CUSTOMCOMPONENTS, + package: PackagesCategoryEnum.CUSTOMCOMPONENTS, + chartFrame: ChartFrameEnum.ECHARTS, + image: 'Dashboard.png' +} diff --git a/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.vue b/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.vue new file mode 100644 index 00000000..1848074f --- /dev/null +++ b/src/packages/components/CustomComponents/CustomComponents/Dashboard/index.vue @@ -0,0 +1,364 @@ + + + + + \ No newline at end of file diff --git a/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue b/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue index be0b8119..9ef846d9 100644 --- a/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue +++ b/src/packages/components/CustomComponents/CustomComponents/RealTimeTraffic/index.vue @@ -6,8 +6,7 @@ :option="option" :manual-update="false" :update-options="{ - notMerge: true, - replaceMerge: ['series', 'xAxis'] + replaceMerge: [] }" autoresize style="overflow: visible" @@ -235,22 +234,34 @@ const getData = () => { } query.types = [methodArr[0]] query.query_type = methodArr[1] || '' - option.xAxis['data'] = [] - option.series[0]['data'] = [] + // option.xAxis['data'] = [] + // option.series[0]['data'] = [] publicInterface('/dcim/dems/statistic', 'get_point_realtime_data_echarts', query).then((res:any) => { if (res && res.data && res.data['current']) { const data = res.data - option.xAxis['data'] = data['echarts'] && data['echarts']['xAxis'] && data['echarts']['xAxis']['data'] ? data['echarts']['xAxis']['data'].map((item:any) => { - const time = query.query_type === '' ? moment(item).format('YYYY-MM-DD HH:mm:ss') : query.query_type === 'day' ? moment(item).format('YYYY-MM-DD') : moment(item).format('YYYY-MM') - return time - }) : [] - option.series[0]['data'] = data['echarts'] && data['echarts']['series'] && data['echarts']['series'][0] && data['echarts']['series'][0]['data'] ? data['echarts']['series'][0] && data['echarts']['series'][0]['data'] : [] - if (query.query_type === '') { - option.tooltip.formatter = '{b}
' + '速率(测点/s)' + '  ' + '{c}' - } else { - option.tooltip.formatter = '{b}
' + '测点总数' + '  ' + '{c}' - } + // option.xAxis['data'] = data['echarts'] && data['echarts']['xAxis'] && data['echarts']['xAxis']['data'] ? data['echarts']['xAxis']['data'].map((item:any) => { + // const time = query.query_type === '' ? moment(item).format('YYYY-MM-DD HH:mm:ss') : query.query_type === 'day' ? moment(item).format('YYYY-MM-DD') : moment(item).format('YYYY-MM') + // return time + // }) : [] + // option.series[0]['data'] = data['echarts'] && data['echarts']['series'] && data['echarts']['series'][0] && data['echarts']['series'][0]['data'] ? data['echarts']['series'][0] && data['echarts']['series'][0]['data'] : [] + // if (query.query_type === '') { + // option.tooltip.formatter = '{b}
' + '速率(测点/s)' + '  ' + '{c}' + // } else { + // option.tooltip.formatter = '{b}
' + '测点总数' + '  ' + '{c}' + // } + nextTick(() => { + if(!vChartRef.value) return + let xAxisData = data['echarts'] && data['echarts']['xAxis'] && data['echarts']['xAxis']['data'] ? data['echarts']['xAxis']['data'].map((item:any) => { + const time = query.query_type === '' ? moment(item).format('YYYY-MM-DD HH:mm:ss') : query.query_type === 'day' ? moment(item).format('YYYY-MM-DD') : moment(item).format('YYYY-MM') + return time + }) : [] + let series0Data = data['echarts'] && data['echarts']['series'] && data['echarts']['series'][0] && data['echarts']['series'][0]['data'] ? data['echarts']['series'][0] && data['echarts']['series'][0]['data'] : [] + vChartRef.value.setOption({ + xAxis: { data: xAxisData }, + series: [{ data:series0Data }] + }) + }) } }).catch((e:unknown) => { console.log(e) diff --git a/src/packages/components/CustomComponents/CustomComponents/index.ts b/src/packages/components/CustomComponents/CustomComponents/index.ts index 32e28fa2..b4c48450 100644 --- a/src/packages/components/CustomComponents/CustomComponents/index.ts +++ b/src/packages/components/CustomComponents/CustomComponents/index.ts @@ -4,6 +4,7 @@ import { RealTimeTrafficConfig } from './RealTimeTraffic' import { OverviewOfComputingNodesConfig } from './OverviewOfComputingNodes' import { GDMapConfig } from './GDMap' import { MonitorRealTimeEventsConfig } from './MonitorRealTimeEvents' +import { DashboardConfig } from './Dashboard' export default [ // Theme1Config, @@ -12,4 +13,5 @@ export default [ OverviewOfComputingNodesConfig, GDMapConfig, MonitorRealTimeEventsConfig, + DashboardConfig, ] diff --git a/src/packages/public/publicConfig.ts b/src/packages/public/publicConfig.ts index cbbb2173..4b212809 100644 --- a/src/packages/public/publicConfig.ts +++ b/src/packages/public/publicConfig.ts @@ -80,7 +80,8 @@ const commonData: commonDataType = { space_complete_id: '' }, deviceClass: { - enable: false + enable: false, + space_complete_id: '' }, singlePoint: { enable: false, diff --git a/src/store/modules/chartEditStore/chartEditStore.d.ts b/src/store/modules/chartEditStore/chartEditStore.d.ts index 041d21b7..f61cab23 100644 --- a/src/store/modules/chartEditStore/chartEditStore.d.ts +++ b/src/store/modules/chartEditStore/chartEditStore.d.ts @@ -335,6 +335,12 @@ export interface MonthAlarmClassType { space_complete_id: string } +// 设备分类统计 +export interface DeviceClassType { + enable: boolean + space_complete_id: string +} + // 通用组件数据 export interface commonDataType { // 多数据 @@ -345,7 +351,8 @@ export interface commonDataType { pointRealTime: PointRealTimeType monthAlarmClass: MonthAlarmClassType // 多数据无参数 - deviceClass: NoParamsType + // 设备分类统计 + deviceClass: DeviceClassType // 单数据 singlePoint: SinglePointType } diff --git a/src/views/chart/ContentCharts/hooks/useAside.hook.ts b/src/views/chart/ContentCharts/hooks/useAside.hook.ts index 836c549d..227bce32 100644 --- a/src/views/chart/ContentCharts/hooks/useAside.hook.ts +++ b/src/views/chart/ContentCharts/hooks/useAside.hook.ts @@ -44,18 +44,18 @@ const packagesListObj = { icon: renderIcon(AirPlaneOutlineIcon), label: PackagesCategoryName.ICONS }, - [PackagesCategoryEnum.THEMESANDLAYOUTS]: { - icon: renderIcon(Apps20RegularIcon), - label: PackagesCategoryName.THEMESANDLAYOUTS - }, + // [PackagesCategoryEnum.THEMESANDLAYOUTS]: { + // icon: renderIcon(Apps20RegularIcon), + // label: PackagesCategoryName.THEMESANDLAYOUTS + // }, [PackagesCategoryEnum.CUSTOMCOMPONENTS]: { icon: renderIcon(AreaCustomIcon), label: PackagesCategoryName.CUSTOMCOMPONENTS }, - [PackagesCategoryEnum.BACKGROUNDS]: { - icon: renderIcon(InsertPhotoSharpIcon), - label: PackagesCategoryName.BACKGROUNDS - } + // [PackagesCategoryEnum.BACKGROUNDS]: { + // icon: renderIcon(InsertPhotoSharpIcon), + // label: PackagesCategoryName.BACKGROUNDS + // } } export const useAsideHook = () => { diff --git a/src/views/chart/ContentConfigurations/components/ChartDataV2/components/DeviceClass.vue b/src/views/chart/ContentConfigurations/components/ChartDataV2/components/DeviceClass.vue new file mode 100644 index 00000000..bfdce82f --- /dev/null +++ b/src/views/chart/ContentConfigurations/components/ChartDataV2/components/DeviceClass.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/src/views/chart/ContentConfigurations/components/ChartDataV2/components/MonthAlarmClass.vue b/src/views/chart/ContentConfigurations/components/ChartDataV2/components/MonthAlarmClass.vue index 0b6d756a..0215bf10 100644 --- a/src/views/chart/ContentConfigurations/components/ChartDataV2/components/MonthAlarmClass.vue +++ b/src/views/chart/ContentConfigurations/components/ChartDataV2/components/MonthAlarmClass.vue @@ -25,14 +25,14 @@ import {SettingItemBox} from '@/components/Pages/ChartItemSetting' import {useTargetData} from '../../hooks/useTargetData.hook' import {DateOptions, PolicyOptions} from './ComponentsType.d' import {icon} from '@/plugins/icon' -import {commonDataType, RecordValueHistoryType} from '@/store/modules/chartEditStore/chartEditStore.d' +import {commonDataType, MonthAlarmClassType} from '@/store/modules/chartEditStore/chartEditStore.d' const {CloseIcon, AddIcon} = icon.ionicons5 const {targetData} = useTargetData() as { targetData: Ref<{ commonData: commonDataType, id: string }> } const target = computed(() => { - return targetData.value.commonData[targetData.value.commonData.currentSource] + return targetData.value.commonData[targetData.value.commonData.currentSource] as MonthAlarmClassType }) // const recordValueHistory: Ref = computed(() => targetData.value.commonData.recordValueHistory) diff --git a/src/views/chart/ContentConfigurations/components/ChartDataV2/index.vue b/src/views/chart/ContentConfigurations/components/ChartDataV2/index.vue index 128b1062..f3df6eca 100644 --- a/src/views/chart/ContentConfigurations/components/ChartDataV2/index.vue +++ b/src/views/chart/ContentConfigurations/components/ChartDataV2/index.vue @@ -9,7 +9,7 @@ - +