blackteay/go-view
1
0
Fork 0
mirror of https://gitee.com/dromara/go-view.git synced 2025-06-29 16:29:14 +08:00
Code Issues Projects Releases Wiki Activity

fix: 设备一张图优化

Browse Source
This commit is contained in:
宝莉 2024-08-28 16:56:59 +08:00
parent 99e7bcd68a
commit 5dff1aa08f
14 changed files with 103 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env
View File

@ -5,7 +5,7 @@ VITE_DEV_PORT = '8080'
# VITE_DEV_PATH = 'http://192.168.0.34:11887'
VITE_DEV_PATH = 'http://192.168.0.34:8025/'
# VITE_DEV_PATH = 'http://192.168.0.120:3001'
VITE_DEV_TOKEN = "1c476210-ddea-4f3f-bd82-832fd5df020d"
VITE_DEV_TOKEN = "2e51947c-5d8d-42f2-99e8-8d841cff7a00"
# production path
# VITE_PRO_PATH = 'http://192.168.0.235:8177'

10
src/hooks/commonDataComponents/useAssetsClassRes.ts
View File

@ -19,31 +19,35 @@ const globalQueryParamsStore = useGlobalQueryParamsStore()
}
// 处理数据
if(dataSource==='IT'){
const res = await publicInterface('/dcim/asset','get_asset_overview_page_info_new', query)
res!.data = {
// dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')),
dimensions: ['品牌','data'],
source:res?.data.brand_count.slice(0,8).map((item: {})=>{
source:res?.data?.brand_count.slice(0,7).map((item: {})=>{
return {
'品牌':Object.keys(item)[0],
data:Object.values(item)[0],
}
})
}
console.log(res,'调用了吗')
return res
}else{
const res = await publicInterface('/dcim/dems/device','get_dev_brand_count', query)
res!.data = {
// dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')),
dimensions: ['品牌','data'],
source:res?.data.slice(0,8).map((item: any)=>{
source:res?.data.slice(0,7).map((item: any)=>{
return {
'品牌':item.name,
data:item.count,
}
})
}
console.log(res,'调用了吗1')
return res
}
}

3
src/hooks/commonDataComponents/useCategoryBrandCountTableRes.ts
View File

@ -14,14 +14,11 @@ export const handleCategoryBrandCountTable =async (targetComponent: CreateCompon
errmsg: ''
}
const globalQueryParamsStore = useGlobalQueryParamsStore()
console.log(currentSource,'currentSource');
const queryParams = {
...globalQueryParamsStore.getGlobalQueryParams
}
const res = await publicInterface(currentSource==='IT'?'/dcim/asset':'/dcim/dems/device',currentSource==='IT'?'get_category_brand_count': 'get_dev_category_brand_count', queryParams)
const top = ['TOP1','TOP2','TOP3']
res!.data = {
dimensions: ['分类名',...top],
source:res?.data.map((item: any)=>{

13
src/hooks/commonDataComponents/useCompanyTempTopRes.ts
View File

@ -14,9 +14,10 @@ export const handleCompanyTempTop =async (targetComponent: CreateComponentType)
data: { ...dataJson },
errmsg: ''
}
const res = await publicInterface('/dcim/dems/device_point', 'temp_list_dashboard', {signal_ids:[signal_ids],space_complete_id})
const res:any = await publicInterface('/dcim/dems/device_point', 'temp_list_dashboard', {signal_ids:[signal_ids],space_complete_id})
console.log(res,'res_handleCompanyTempTop');
if (res && res.data) {
console.log(res,'res_handleCompanyTempTop');
res.data = {
// dimensions: res?.data.brand_count.map((item: {})=>Object.keys(item).join('')),
dimensions: ['名称','温度值'],
@ -28,5 +29,13 @@ export const handleCompanyTempTop =async (targetComponent: CreateComponentType)
})
}
return res
}else{
// 后端没有给errcode,前端重置
res.errcode = '00000'
res.data = {
dimensions:[],
source:[]
}
return res
}
}

25
src/hooks/useChartCommonData.hook.ts
View File

@ -1,6 +1,6 @@
import type VChart from 'vue-echarts'
import { setOption } from "@/packages/public";
import { ref, toRefs, watch } from "vue";
import { ref, toRefs, watch,getCurrentInstance } from "vue";
import { CreateComponentType, ChartFrameEnum } from '@/packages/index.d'
import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore";
import { CurrentSourceEnum, resultType } from '@/store/modules/chartEditStore/chartEditStore.d'
@ -24,6 +24,8 @@ import { handleManulInput } from './commonDataComponents/useManualInputRes'
import { handleManulInputSingle } from './commonDataComponents/useManualInputSingleRes'
import { ResultErrcode } from '@/enums/httpEnum'
import { logDark } from 'naive-ui';
import { fetchChartComponent } from '@/packages';
// 获取类型
type ChartEditStoreType = typeof useChartEditStore
@ -61,18 +63,34 @@ export const useChartCommonData = (
// let series = []
// if(dataset.dimensions.length - 1) {
// for(let i = 0; i < dataset.dimensions.length - 1; i++) {
// series.push(cloneDeep(seriesItem))
// series.push(cloneDeep(seriesItem))
// }
// }
// else {
// series = [seriesItem]
// }
// 获取当前组件实例
if (vChartRef.value) {
// 缓存组件的实例后续更新用得上
const instanceMap = new Map()
// 存储构造函数引用,如果直接使用vChartRef.value的话会报错，因为json序列化无法对构造函数进行处理，先将它放到map中等使用的时候再获取
instanceMap.set('$ref', vChartRef.value);
targetComponent.$ref = instanceMap
Object.assign(targetComponent.option, {
// series,
dataset,
})
setOption(vChartRef.value, { dataset })
}else{
Object.assign(targetComponent.option, {
// series,
dataset,
})
const instance = targetComponent?.$ref?.get('$ref')
setOption(instance, { dataset })
}
}
else if(SingleDataArr.some(_ => _ === currentSource)) { // 单个值的处理
@ -135,9 +153,12 @@ export const useChartCommonData = (
break;
case CurrentSourceEnum.ASSETSCLASS:
res = await handleAssetsClass(targetComponent)
break;
case CurrentSourceEnum.COMPANYTEMPTOP:
res = await handleCompanyTempTop(targetComponent)
console.log(res,'res',targetComponent,'触发了吗')
break;
case CurrentSourceEnum.ALARMTREND:
res = await handleAlarmTrend(targetComponent)

8
src/packages/components/Charts/Bars/BarCommon/index.vue
View File

@ -65,15 +65,17 @@ switch (props.chartConfig.commonData.currentSource) {
globalQueryParamsStore.setGlobalQueryParams({
space_complete_id : e.data.complete_id
})
console.log(chartEditStore.getComponentList,'chartEditStore')
console.log(chartEditStore.getComponentList,'chartEditStore_getComponentList')
// 没有统一更新数据的方法，只能尝试改变它的更新时间，促使watch触发请求方法
chartEditStore.getComponentList.forEach(component=>{
component.request.requestInterval = 15
// component.request.requestInterval = 10
// component.request.requestInterval = 15
component.request.immediate = true
useChartCommonData(component, useChartEditStore)
})
console.log(globalQueryParamsStore.getGlobalQueryParams,'chartConfig2')
break;

1
src/packages/components/Charts/Maps/MapBase/index.vue
View File

@ -162,7 +162,6 @@ const updateMapFn = (data: any) => {
}
}
})
console.log(props.chartConfig.option.series[0].data,'props.chartConfig.option.series[0].data')
}
//动态获取json注册地图

4
src/packages/components/CustomComponents/AlarmDiagram/RealTimeEvent/index.vue
View File

@ -150,11 +150,13 @@ watch(() => checkAll.value, (v) => {
})
const getNumber = () => {
console.log(props.chartConfig.customData?.dems_device_point_signal_ids,'props.chartConfig.customData?.dems_device_point_signal_ids')
const q = {
space_complete_id: props.chartConfig.customData?.space_complete_id,
confirm_statuss: alarmConfirmStatus.value,
handle_statuss: alarmHandleStatuss.value,
recovery_statuss: alarmRecoveryStatus.value
recovery_statuss: alarmRecoveryStatus.value,
dems_device_point_signal_ids: props.chartConfig.customData?.dems_device_point_signal_ids.split(','),
}
publicInterface('/dcim/dems/devie_active_alarm', 'count_by_level_new', q).then(res => {
if (res && JSON.stringify(res.data) !== '{}') {

23
src/packages/components/CustomComponents/CustomComponents/ClassifiedStatistic/index.vue
View File

@ -5,7 +5,7 @@
<div class="classify" v-for="item in type_count" :key="item">
<div class="img">
<img v-if="props.chartConfig?.customData?.currentSource==='IT'" src="@/assets/images/chart/decorates/Base1.png" alt="">
<img v-else src="@/assets/images/chart/decorates/Base2.png" alt="">
<img v-else src="@/assets/images/chart/decorates/Base4.png" alt="">
<div class="value">
{{Object.values(item)[0]}}
@ -59,7 +59,9 @@ const queryParams = {
}
const getData = () => {
if(props.chartConfig?.customData?.currentSource==='IT'){
publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', queryParams).then(res => {
publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', {
...globalQueryParamsStore.getGlobalQueryParams
}).then(res => {
if (res && res.data) {
type_count.value = res.data.type_count
// for (const key in computeNodeData) {
@ -68,7 +70,9 @@ const getData = () => {
}
})
}else{
publicInterface('/dcim/dems/device', 'get_dev_category_count', queryParams).then(res => {
publicInterface('/dcim/dems/device', 'get_dev_category_count', {
...globalQueryParamsStore.getGlobalQueryParams
}).then(res => {
if (res && res.data) {
type_count.value = res.data.map((item:any)=>{
return {
@ -104,7 +108,14 @@ watch(()=>props.chartConfig?.customData?.currentSource,()=>{
console.log(props.chartConfig?.customData?.currentSource,'chartConfig');
getData()
// 根据currentSource去获取对应 参数
})
watch(()=>props.chartConfig?.request?.immediate,(v)=>{
if(!v)return
getData()
props.chartConfig.request.immediate = false
// 根据currentSource去获取对应 参数
})
onMounted(() => {
nextTick(() => {
@ -167,14 +178,14 @@ onUnmounted(() => {
transform: translate(-50%,-50%);
white-space: pre-wrap;
text-align: center;
font-size: 17px;
font-size: 20px;
}
}
}
.count{
font-size: 17px;
font-size: 20px;
padding: 0 5px;
font-family: LESLIE;
font-size: 20px;

34
src/packages/components/CustomComponents/CustomComponents/Overview/index.vue
View File

@ -3,7 +3,8 @@
<div class="overview" v-for="item in type_count" :key="item">
<div class="img">
<img src="@/assets/images/chart/decorates/Base7.png" alt="">
<img v-if="props.chartConfig?.customData?.currentSource==='IT'" src="@/assets/images/chart/decorates/Base1.png" alt="">
<img v-else src="@/assets/images/chart/decorates/Base4.png" alt="">
<div class="value">
{{item.value}}
@ -55,14 +56,16 @@ const queryParams = {
}
const getData = () => {
if(props.chartConfig?.customData?.currentSource==='IT'){
publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', queryParams).then(res => {
publicInterface('/dcim/asset', 'get_asset_overview_page_info_new', {
...globalQueryParamsStore.getGlobalQueryParams
}).then(res => {
if (res && res.data) {
let commonBrands = res.data.type_count.reduce((prev:any, curr:any) => {
let commonBrands = res.data.type_count?.reduce((prev:any, curr:any) => {
const prevValue:any = Object.values(prev)[0];
const currValue:any = Object.values(curr)[0];
return currValue > prevValue ? curr : prev;
});
},{});
let obj = [
{
label:'设备总数',
@ -81,11 +84,13 @@ const getData = () => {
}
})
}else{
publicInterface('/dcim/dems/device', 'get_dev_category_count', queryParams).then(res => {
publicInterface('/dcim/dems/device', 'get_dev_category_count', {
...globalQueryParamsStore.getGlobalQueryParams
}).then(res => {
if (res && res.data) {
const commonBrands:any = res.data.reduce((prev:any, curr:any) => {
const commonBrands:any = res?.data?.reduce((prev:any, curr:any) => {
return curr.count > prev.count ? curr : prev;
});
},{});
let obj = [
{
label:'设备总数',
@ -107,7 +112,9 @@ const getData = () => {
}
let timer:unknown
console.log([props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'),'[props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit]_overview')
watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.request.requestIntervalUnit].join('&&'), v => {
console.log(v,'overview_v')
if(!isPreview()) return
console.log(props,'props')
@ -120,15 +127,25 @@ watch(() => [props.chartConfig.request.requestInterval, props.chartConfig.reques
getData()
}, number)
}
},{
deep:true,
})
watch(()=>props.chartConfig?.customData?.currentSource,()=>{
console.log(props.chartConfig?.customData?.currentSource,'chartConfig');
getData()
// 根据currentSource去获取对应 参数
})
watch(()=>props.chartConfig?.request?.immediate,(v)=>{
if(!v)return
getData()
props.chartConfig.request.immediate = false
// 根据currentSource去获取对应 参数
})
onMounted(() => {
nextTick(() => {
@ -177,6 +194,7 @@ onUnmounted(() => {
transform: translate(-50%,-50%);
white-space: pre-wrap;
text-align: center;
font-size: 20px;
}

3
src/packages/index.d.ts vendored
View File

@ -166,7 +166,8 @@ export interface PublicConfigType {
[InteractEvents.INTERACT_COMPONENT_ID]: string | undefined
[InteractEvents.INTERACT_FN]: { [name: string]: string }
}[]
}
},
$ref
}
export interface CreateComponentType extends PublicConfigType, requestConfig {

3
src/packages/public/publicConfig.ts
View File

@ -24,11 +24,12 @@ import cloneDeep from 'lodash/cloneDeep'
// 请求基础属性
export const requestConfig: RequestConfigType = {
immediate:false,
requestDataType: RequestDataTypeEnum.STATIC,
requestHttpType: RequestHttpEnum.GET,
requestUrl: '',
requestInterval: 15,
requestIntervalUnit: RequestHttpIntervalEnum.SECOND,
requestIntervalUnit: RequestHttpIntervalEnum.HOUR,
requestContentType: RequestContentTypeEnum.DEFAULT,
requestParamsBodyType: RequestBodyEnum.NONE,
requestSQLContent: {

2
src/store/modules/chartEditStore/chartEditStore.d.ts vendored
View File

@ -214,6 +214,8 @@ export interface RequestGlobalConfigType extends RequestPublicConfigType {
// 单个图表请求配置
export interface RequestConfigType extends RequestPublicConfigType {
// 是否立即执行
immediate?:boolean
// 所选全局数据池的对应 id
requestDataPondId?: string
// 组件定制轮询时间

4
src/utils/utils.ts
View File

@ -275,11 +275,15 @@ export const setKeyboardDressShow = (keyCode?: number) => {
* @param data
*/
export const JSONStringify = <T>(data: T) => {
console.log(data,'data')
return JSON.stringify(
data,
(key, val) => {
// 处理函数丢失问题
if (typeof val === 'function') {
console.log(key,'key')
console.log(val,'val')
return `${val}`
}
// 处理 undefined 丢失问题