refactor(charts): 调整图表组件的默认尺寸

- 修改了多个图表组件的宽度和高度属性
- 优化了部分组件的样式,如移除背景色
This commit is contained in:
Free-sss 2025-09-08 17:53:35 +08:00
parent b01d276440
commit f9e910ed88
19 changed files with 38 additions and 25 deletions

View File

@ -20,5 +20,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = AlarmNowListConfig.key public key = AlarmNowListConfig.key
public chartConfig = cloneDeep(AlarmNowListConfig) public chartConfig = cloneDeep(AlarmNowListConfig)
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -127,5 +127,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = FiniteSpatialDistributionConfig.key public key: string = FiniteSpatialDistributionConfig.key
public chartConfig = cloneDeep(FiniteSpatialDistributionConfig) public chartConfig = cloneDeep(FiniteSpatialDistributionConfig)
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -131,7 +131,7 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = PieCircleCommenConfig.key public key: string = PieCircleCommenConfig.key
public chartConfig = cloneDeep(PieCircleCommenConfig) public chartConfig = cloneDeep(PieCircleCommenConfig)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
// 图表配置项 // 图表配置项
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
} }

View File

@ -43,5 +43,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = videoCheckConfig.key public key = videoCheckConfig.key
public chartConfig = cloneDeep(videoCheckConfig) public chartConfig = cloneDeep(videoCheckConfig)
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 430, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -46,6 +46,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = AlarmListHazCConfig.key public key = AlarmListHazCConfig.key
public chartConfig = AlarmListHazCConfig public chartConfig = AlarmListHazCConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -39,7 +39,7 @@ const otherConfig = {
export const option = { export const option = {
...otherConfig, ...otherConfig,
backgroundColor: 'rgba(13, 16, 22, 1)', // backgroundColor: 'rgba(13, 16, 22, 1)',
grid: { grid: {
left: '8%', left: '8%',
right: '8%', right: '8%',
@ -143,5 +143,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = LineDropdownConfig.key public key: string = LineDropdownConfig.key
public chartConfig = cloneDeep(LineDropdownConfig) public chartConfig = cloneDeep(LineDropdownConfig)
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -169,9 +169,9 @@ onMounted(() => {
<style scoped> <style scoped>
.line-dropdown-container { .line-dropdown-container {
width: 100%; width: 100%;
height: 100%; height: calc(100% - 40px);
/* background: rgba(13, 16, 22, 1); */ /* background: rgba(13, 16, 22, 1); */
position: relative; /* position: relative; */
} }
.dropdown-container { .dropdown-container {
@ -180,7 +180,7 @@ onMounted(() => {
left: 7%; left: 7%;
width: 86%; width: 86%;
z-index: 10; z-index: 10;
position: relative; /* position: relative; */
/* 添加边框样式到父容器 */ /* 添加边框样式到父容器 */
border-radius: 8px; border-radius: 8px;
padding: 1px; padding: 1px;
@ -326,7 +326,10 @@ onMounted(() => {
padding-top: 0px; padding-top: 0px;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 100%; flex: 1;
height: 99%;
/* min-height: 0; */
/* height: 100%; */
} }
</style> </style>
@ -336,6 +339,7 @@ onMounted(() => {
position: relative; position: relative;
width: 90%; width: 90%;
margin: 10px auto 0; margin: 10px auto 0;
flex-shrink: 0;
:deep(.custom-select) { :deep(.custom-select) {
z-index: 999; z-index: 999;

View File

@ -140,6 +140,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
public mockData = dataJson public mockData = dataJson
// 图表配置项 // 图表配置项
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -237,5 +237,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = PieCenterConfig.key public key: string = PieCenterConfig.key
public chartConfig = cloneDeep(PieCenterConfig) public chartConfig = cloneDeep(PieCenterConfig)
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -46,5 +46,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = TopAlarmsConfig.key public key = TopAlarmsConfig.key
public chartConfig = TopAlarmsConfig public chartConfig = TopAlarmsConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -34,5 +34,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = yushiVideoConfig.key public key = yushiVideoConfig.key
public chartConfig = cloneDeep(yushiVideoConfig) public chartConfig = cloneDeep(yushiVideoConfig)
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -39,7 +39,7 @@ const otherConfig = {
export const option = { export const option = {
...otherConfig, ...otherConfig,
backgroundColor: 'rgba(13, 16, 22, 1)', // backgroundColor: 'rgba(13, 16, 22, 1)',
grid: { grid: {
left: '8%', left: '8%',
right: '8%', right: '8%',

View File

@ -169,9 +169,9 @@ onMounted(() => {
<style scoped> <style scoped>
.line-dropdown-container { .line-dropdown-container {
width: 100%; width: 100%;
height: 100%; height: calc(100% - 40px);
/* background: rgba(13, 16, 22, 1); */ /* background: rgba(13, 16, 22, 1); */
position: relative; /* position: relative; */
} }
.dropdown-container { .dropdown-container {
@ -180,7 +180,7 @@ onMounted(() => {
left: 7%; left: 7%;
width: 86%; width: 86%;
z-index: 10; z-index: 10;
position: relative; /* position: relative; */
/* 添加边框样式到父容器 */ /* 添加边框样式到父容器 */
border-radius: 8px; border-radius: 8px;
padding: 1px; padding: 1px;
@ -326,7 +326,10 @@ onMounted(() => {
padding-top: 0px; padding-top: 0px;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
height: 100%; flex: 1;
height: 99%;
/* min-height: 0; */
/* height: 100%; */
} }
</style> </style>
@ -336,6 +339,7 @@ onMounted(() => {
position: relative; position: relative;
width: 90%; width: 90%;
margin: 10px auto 0; margin: 10px auto 0;
flex-shrink: 0;
:deep(.custom-select) { :deep(.custom-select) {
z-index: 999; z-index: 999;

View File

@ -140,6 +140,6 @@ export default class Config extends PublicConfigClass implements CreateComponent
public mockData = dataJson public mockData = dataJson
// 图表配置项 // 图表配置项
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -3,7 +3,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { ParkingSceneConfig } from './index' import { ParkingSceneConfig } from './index'
import dataJson from './data.json' import dataJson from './data.json'
import { cloneDeep } from 'lodash' import { cloneDeep } from 'lodash'
import { chartInitConfig } from '@/settings/designSetting'
export const option = { export const option = {
sceneCode: "", sceneCode: "",
componentIndexKey: "", componentIndexKey: "",
@ -25,4 +25,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = ParkingSceneConfig.key public key = ParkingSceneConfig.key
public chartConfig = ParkingSceneConfig public chartConfig = ParkingSceneConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -237,5 +237,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key: string = PieCenterConfig.key public key: string = PieCenterConfig.key
public chartConfig = cloneDeep(PieCenterConfig) public chartConfig = cloneDeep(PieCenterConfig)
public option = echartOptionProfixHandle(option, includes) public option = echartOptionProfixHandle(option, includes)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -3,7 +3,7 @@ import { CreateComponentType } from '@/packages/index.d'
import { SceneDistributionConfig } from './index' import { SceneDistributionConfig } from './index'
import dataJson from './data.json' import dataJson from './data.json'
import { cloneDeep } from 'lodash' import { cloneDeep } from 'lodash'
import { chartInitConfig } from '@/settings/designSetting'
export const option = { export const option = {
sceneCode: 'T06', sceneCode: 'T06',
componentIndexKey: "a", componentIndexKey: "a",
@ -24,4 +24,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = SceneDistributionConfig.key public key = SceneDistributionConfig.key
public chartConfig = SceneDistributionConfig public chartConfig = SceneDistributionConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -46,5 +46,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = TopAlarmsConfig.key public key = TopAlarmsConfig.key
public chartConfig = TopAlarmsConfig public chartConfig = TopAlarmsConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 300, zIndex: 1 } public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }

View File

@ -3,7 +3,9 @@ import { CreateComponentType } from '@/packages/index.d'
import { WorkshopSceneConfig } from './index' import { WorkshopSceneConfig } from './index'
import dataJson from './data.json' import dataJson from './data.json'
import { cloneDeep } from 'lodash' import { cloneDeep } from 'lodash'
import { chartInitConfig } from '@/settings/designSetting'
export enum FontWeightEnum { export enum FontWeightEnum {
NORMAL = '常规', NORMAL = '常规',
BOLD = '加粗', BOLD = '加粗',
} }
@ -52,4 +54,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
public key = WorkshopSceneConfig.key public key = WorkshopSceneConfig.key
public chartConfig = WorkshopSceneConfig public chartConfig = WorkshopSceneConfig
public option = cloneDeep(option) public option = cloneDeep(option)
public attr = { ...chartInitConfig, x: 0, y: 0, w: 500, h: 325, zIndex: 1 }
} }