diff --git a/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.ts b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.ts
new file mode 100644
index 0000000..6a48ba0
--- /dev/null
+++ b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.ts
@@ -0,0 +1,209 @@
+import { echartOptionProfixHandle, PublicConfigClass } from '@/packages/public'
+import { PowerSupplySystemConfig } from './index'
+import { CreateComponentType } from '@/packages/index.d'
+import cloneDeep from 'lodash/cloneDeep'
+import dataJson from './data.json'
+import * as echarts from 'echarts'
+
+export const includes = []
+const otherOption = {
+ secneID: '',
+ unit: dataJson.unit,
+}
+
+const option = {
+ ...otherOption,
+ dataset: dataJson,
+ // 添加标题配置
+ title: {
+ text: '单位:' + otherOption.unit,
+ left: '3%',
+ top: '3%',
+ textStyle: {
+ fontSize: 12,
+ color: 'rgba(255, 255, 255, 0.7)',
+ fontWeight: 'normal'
+ }
+ },
+ // 提示框配置
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ },
+ backgroundColor: 'rgba(0, 0, 0, 0.8)',
+ borderColor: '#00ffff',
+ textStyle: {
+ color: '#ffffff'
+ }
+ },
+ // 网格配置
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ top: '15%',
+ containLabel: true
+ },
+
+ // X轴配置
+ xAxis: {
+ type: 'category',
+ axisLine: {
+ lineStyle: {
+ color: 'rgba(255, 255, 255, 0.1)',
+ }
+ },
+ axisTick: {
+ show: false
+ },
+ //
+ axisLabel: {
+ color: '#eee',
+ interval: 0,
+ fontSize: 9,
+ margin: 20
+ }
+
+ },
+
+ // Y轴配置
+ yAxis: {
+ type: 'value',
+ min: 0,
+ interval: 25,
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: 'rgba(255, 255, 255, 0.1)',
+ }
+ },
+ axisTick: {
+ show: false
+ },
+ axisLabel: {
+ color: 'rgba(255, 255, 255, 0.8)',
+ formatter: '{value}'
+ },
+ splitLine: {
+ lineStyle: {
+ color: 'rgba(255, 255, 255, 0.1)',
+ type: 'solid'
+ }
+ }
+ },
+
+ // 数据系列配置
+ series: [{
+
+ name: '能源消耗',
+ type: 'bar',
+ itemStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+ { offset: 0, color: '#009CFF' }, // 更暗的左侧颜色,增强阴影效果
+ { offset: 0.5, color: '#5B69BE ' }, // 中间主色
+ { offset: 1, color: '#A478FF' } // 右侧亮色,增强高光效果
+ ]),
+ opacity: 0.7,
+ // 添加更强的3D效果
+ shadowBlur: 20,
+ shadowColor: 'rgba(0, 0, 0, 0.7)',
+ shadowOffsetX: -5,
+ shadowOffsetY: 5,
+ borderRadius: [0, 0, 5, 5],
+ borderWidth: 0,
+
+ },
+ emphasis: {
+ itemStyle: {
+ shadowColor: 'rgba(40, 26, 143, 0.9)',
+ shadowBlur: 25,
+ shadowOffsetX: -8,
+ shadowOffsetY: 8
+ }
+ },
+ z: 2,
+
+ barWidth: '45%',
+
+ // 3D圆柱体效果
+ roundCap: false
+ }, {
+ type: 'pictorialBar',
+ z: 3,
+ symbolSize: ['65%', '5'],
+ symbolOffset: [0.1, -3],
+ symbolPosition: "end",
+ itemStyle: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+ { offset: 0, color: '#009CFF' }, // 更暗的左侧颜色,增强阴影效果
+ { offset: 0.5, color: '#5B69BE ' }, // 中间主色
+ { offset: 1, color: '#A478FF' } // 右侧亮色,增强高光效果
+ ]),
+ // opacity: 0.1,
+ emphasis: {
+ itemStyle: {
+ shadowColor: "rgba(119, 51, 221, 0.9)",
+ shadowBlur: 12
+ }
+ }
+ },
+ // 有透明度的数据柱加底部面会导致显示叠加以成效果不堪,所以暂时取消
+ // {
+ // type: 'pictorialBar',
+ // z: 1,
+ // symbolSize: ['65%', '5'],
+ // symbolOffset: [0.1,],
+ // symbolPosition: "start",
+ // itemStyle: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+ // { offset: 0, color: '#009CFF' }, // 更暗的左侧颜色,增强阴影效果
+ // { offset: 0.5, color: '#5B69BE ' }, // 中间主色
+ // { offset: 1, color: '#A478FF' } // 右侧亮色,增强高光效果
+ // ]),
+ // // opacity: 0.1,
+ // emphasis: {
+ // itemStyle: {
+ // shadowColor: "rgba(105, 10, 221, 0.9)",
+ // shadowBlur: 12
+ // }
+ // }
+ // }
+ ],
+
+ // 图形元素配置
+ graphic: [{
+ // 左侧阴影效果
+ type: 'rect',
+ left: 0,
+ top: '15%',
+ width: '25%',
+ bottom: '3%',
+ style: {
+ fill: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+ { offset: 0, color: 'rgba(0, 0, 0, 0.8)' }, // 更强的左侧阴影
+ { offset: 1, color: 'rgba(0, 0, 0, 0)' }
+ ])
+ },
+ z: -1
+ }, {
+ // 底部阴影效果
+ type: 'rect',
+ left: '3%',
+ right: '4%',
+ bottom: '0',
+ height: '10%',
+ style: {
+ fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: 'rgba(0, 0, 0, 0)' },
+ { offset: 1, color: 'rgba(0, 0, 0, 0.6)' } // 底部阴影
+ ])
+ },
+ z: -1
+ }]
+};
+
+export default class Config extends PublicConfigClass implements CreateComponentType {
+ public key: string = PowerSupplySystemConfig.key
+ public chartConfig = cloneDeep(PowerSupplySystemConfig)
+ // 图表配置项
+ public option = echartOptionProfixHandle(option, includes)
+}
diff --git a/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.vue b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.vue
new file mode 100644
index 0000000..4c6f38a
--- /dev/null
+++ b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/config.vue
@@ -0,0 +1,16 @@
+
+
+
+
diff --git a/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/data.json b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/data.json
new file mode 100644
index 0000000..ddbeeb7
--- /dev/null
+++ b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/data.json
@@ -0,0 +1,57 @@
+{
+ "dimensions": [
+ "month",
+ "value"
+ ],
+ "source": [
+ {
+ "month": "1月",
+ "value": 88
+ },
+ {
+ "month": "2月",
+ "value": 54
+ },
+ {
+ "month": "3月",
+ "value": 66
+ },
+ {
+ "month": "4月",
+ "value": 54
+ },
+ {
+ "month": "5月",
+ "value": 89
+ },
+ {
+ "month": "6月",
+ "value": 67
+ },
+ {
+ "month": "7月",
+ "value": 54
+ },
+ {
+ "month": "8月",
+ "value": 89
+ },
+ {
+ "month": "9月",
+ "value": 54
+ },
+ {
+ "month": "10月",
+ "value": 89
+ },
+ {
+ "month": "11月",
+ "value": 54
+ },
+ {
+ "month": "12月",
+ "value": 67
+ }
+ ],
+ "unit": "万kwh"
+}
\ No newline at end of file
diff --git a/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.ts b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.ts
new file mode 100644
index 0000000..0ee585e
--- /dev/null
+++ b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.ts
@@ -0,0 +1,14 @@
+import { ConfigType, PackagesCategoryEnum, ChartFrameEnum } from '@/packages/index.d'
+import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d'
+
+export const PowerSupplySystemConfig: ConfigType = {
+ key: 'PowerSupplySystem',
+ chartKey: 'VPowerSupplySystem',
+ conKey: 'VCPowerSupplySystem',
+ title: '供电系统',
+ category: ChatCategoryEnum.IntegratedEnergy,
+ categoryName: ChatCategoryEnumName.IntegratedEnergy,
+ package: PackagesCategoryEnum.CHARTS,
+ chartFrame: ChartFrameEnum.ECHARTS,
+ image: 'PowerSupplySystem.png'
+}
\ No newline at end of file
diff --git a/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.vue b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.vue
new file mode 100644
index 0000000..021058e
--- /dev/null
+++ b/src/packages/components/Charts/IntegratedEnergy/PowerSupplySystem/index.vue
@@ -0,0 +1,90 @@
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/packages/components/Charts/IntegratedEnergy/index.ts b/src/packages/components/Charts/IntegratedEnergy/index.ts
index edf3973..93cd485 100644
--- a/src/packages/components/Charts/IntegratedEnergy/index.ts
+++ b/src/packages/components/Charts/IntegratedEnergy/index.ts
@@ -4,10 +4,10 @@ import { ConsumptionProportionConfig } from "./ConsumptionProportion"
import { FeeOverviewConfig } from "./FeeOverview"
import { WaterSupplySystemConfig } from "./WaterSupplySystem"
import { AirSupplySystemConfig } from './AirSupplySystem'
-
+import { PowerSupplySystemConfig } from './PowerSupplySystem'
export default [
- EnergyOverviewConfig, EnergyConsumptionTrendConfig,
+ EnergyOverviewConfig, EnergyConsumptionTrendConfig,
ConsumptionProportionConfig,
FeeOverviewConfig,
- WaterSupplySystemConfig, AirSupplySystemConfig
+ WaterSupplySystemConfig, AirSupplySystemConfig, PowerSupplySystemConfig
]
\ No newline at end of file