diff --git a/package.json b/package.json index 2078035..c52c548 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "axios": "1.8.4", "crypto-js": "4.2.0", "echarts": "5.6.0", + "echarts-gl": "^2.0.9", "echarts-liquidfill": "^3.1.0", "element-plus": "2.9.8", "file-saver": "2.0.5", @@ -94,4 +95,4 @@ "Safari >= 14", "Firefox >= 78" ] -} \ No newline at end of file +} diff --git a/src/api/large/index.ts b/src/api/large/index.ts index 36dd00f..7e8cda9 100644 --- a/src/api/large/index.ts +++ b/src/api/large/index.ts @@ -3,14 +3,14 @@ import request from '@/utils/request'; // 查询图表总数据 export function getPowerStationOverview() { return request({ - url: '/ginlong/api/getPowerStationOverview', + url: '/ops/ginlong/api/getPowerStationOverview', method: 'get' }); } //能源收益 export function getStationMonthOverview(params: any) { return request({ - url: '/ginlong/api/getStationMonthOverview', + url: '/ops/ginlong/api/getStationMonthOverview', method: 'get', params }); @@ -18,7 +18,7 @@ export function getStationMonthOverview(params: any) { //能源收益 export function getInverterListOverview(params: any) { return request({ - url: '/ginlong/api/getInverterListOverview', + url: '/ops/ginlong/api/getInverterListOverview', method: 'get', params }); @@ -26,7 +26,7 @@ export function getInverterListOverview(params: any) { //警告 export function getAlarmListOverview(params?: any) { return request({ - url: '/ginlong/api/getAlarmListOverview', + url: '/ops/ginlong/api/getAlarmListOverview', method: 'get', params }); diff --git a/src/assets/large/Inversion.png b/src/assets/large/Inversion.png new file mode 100644 index 0000000..df93ff0 Binary files /dev/null and b/src/assets/large/Inversion.png differ diff --git a/src/assets/large/bg.png b/src/assets/large/bg.png new file mode 100644 index 0000000..599bbe1 Binary files /dev/null and b/src/assets/large/bg.png differ diff --git a/src/assets/large/center1.png b/src/assets/large/center1.png new file mode 100644 index 0000000..c61c5ec Binary files /dev/null and b/src/assets/large/center1.png differ diff --git a/src/assets/large/center2.png b/src/assets/large/center2.png new file mode 100644 index 0000000..6ba97d3 Binary files /dev/null and b/src/assets/large/center2.png differ diff --git a/src/assets/large/center3.png b/src/assets/large/center3.png new file mode 100644 index 0000000..0a84ce8 Binary files /dev/null and b/src/assets/large/center3.png differ diff --git a/src/assets/large/center4.png b/src/assets/large/center4.png new file mode 100644 index 0000000..d24bbb3 Binary files /dev/null and b/src/assets/large/center4.png differ diff --git a/src/assets/large/center5.png b/src/assets/large/center5.png new file mode 100644 index 0000000..d631691 Binary files /dev/null and b/src/assets/large/center5.png differ diff --git a/src/assets/large/income.png b/src/assets/large/income.png new file mode 100644 index 0000000..1cc3e54 Binary files /dev/null and b/src/assets/large/income.png differ diff --git a/src/assets/large/monitor.png b/src/assets/large/monitor.png new file mode 100644 index 0000000..6b41a2f Binary files /dev/null and b/src/assets/large/monitor.png differ diff --git a/src/assets/large/power.png b/src/assets/large/power.png new file mode 100644 index 0000000..5e41216 Binary files /dev/null and b/src/assets/large/power.png differ diff --git a/src/assets/large/right1.png b/src/assets/large/right1.png new file mode 100644 index 0000000..51caef6 Binary files /dev/null and b/src/assets/large/right1.png differ diff --git a/src/assets/large/right2.png b/src/assets/large/right2.png new file mode 100644 index 0000000..7b9c095 Binary files /dev/null and b/src/assets/large/right2.png differ diff --git a/src/assets/large/right3.png b/src/assets/large/right3.png new file mode 100644 index 0000000..53fb377 Binary files /dev/null and b/src/assets/large/right3.png differ diff --git a/src/assets/large/right4.png b/src/assets/large/right4.png new file mode 100644 index 0000000..cb57c3b Binary files /dev/null and b/src/assets/large/right4.png differ diff --git a/src/assets/large/right5.png b/src/assets/large/right5.png new file mode 100644 index 0000000..08920ea Binary files /dev/null and b/src/assets/large/right5.png differ diff --git a/src/assets/large/right6.png b/src/assets/large/right6.png new file mode 100644 index 0000000..e9402df Binary files /dev/null and b/src/assets/large/right6.png differ diff --git a/src/assets/large/right7.png b/src/assets/large/right7.png new file mode 100644 index 0000000..d67f9fb Binary files /dev/null and b/src/assets/large/right7.png differ diff --git a/src/assets/large/right8.png b/src/assets/large/right8.png new file mode 100644 index 0000000..8992a3d Binary files /dev/null and b/src/assets/large/right8.png differ diff --git a/src/assets/large/right9.png b/src/assets/large/right9.png new file mode 100644 index 0000000..8844bd1 Binary files /dev/null and b/src/assets/large/right9.png differ diff --git a/src/assets/large/secure.png b/src/assets/large/secure.png new file mode 100644 index 0000000..a46ae34 Binary files /dev/null and b/src/assets/large/secure.png differ diff --git a/src/assets/large/setting.png b/src/assets/large/setting.png new file mode 100644 index 0000000..e2f7328 Binary files /dev/null and b/src/assets/large/setting.png differ diff --git a/src/assets/large/weather.png b/src/assets/large/weather.png new file mode 100644 index 0000000..4d35d24 Binary files /dev/null and b/src/assets/large/weather.png differ diff --git a/src/assets/styles/element.scss b/src/assets/styles/element.scss index 0c51519..85201d0 100644 --- a/src/assets/styles/element.scss +++ b/src/assets/styles/element.scss @@ -3,7 +3,7 @@ .el-select__wrapper { background: transparent !important; box-shadow: none !important; - border: 0.1px solid #fff !important; + border: 0.1px solid rgba(24, 177, 219, 0.3) !important; } .el-select__placeholder { @@ -47,7 +47,7 @@ // transition: var(--el-transition-box-shadow); // transform: translate3d(0, 0, 0); box-shadow: none !important; - border: 0.1px solid #fff !important; + border: 0.1px solid rgba(24, 177, 219, 0.3) !important; } .el-input__inner { diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss index 69bcc20..e6cee07 100644 --- a/src/assets/styles/index.scss +++ b/src/assets/styles/index.scss @@ -9,12 +9,6 @@ @use 'element-plus/dist/index.css'; @use './dialog.scss'; -@font-face { - font-family: 'AlimamaShuHeiTi'; - src: url('@/assets/font/庞门正道标题体2.0增强版.ttf') format('truetype'); - // font-weight: normal; - // font-style: normal; -} body { height: 100%; diff --git a/src/views/largeScreen/components/header.vue b/src/views/largeScreen/components/header.vue index 2c639e4..34c4b16 100644 --- a/src/views/largeScreen/components/header.vue +++ b/src/views/largeScreen/components/header.vue @@ -102,7 +102,7 @@ onUnmounted(() => { } .title { color: #fff; - font-family: 'AlimamaShuHeiTi', sans-serif; + font-family: 'Rang_men_zheng_title', sans-serif; text-align: center; } .title > div:first-child { @@ -169,7 +169,7 @@ onUnmounted(() => { .right-section { display: flex; align-items: center; - font-family: 'AlimamaShuHeiTi', sans-serif; + font-family: 'Rang_men_zheng_title', sans-serif; font-size: 20px; } .right-section img { diff --git a/src/views/largeScreen/components/leftPage.vue b/src/views/largeScreen/components/leftPage.vue index b0fac8f..820a00e 100644 --- a/src/views/largeScreen/components/leftPage.vue +++ b/src/views/largeScreen/components/leftPage.vue @@ -57,7 +57,7 @@ -
+
@@ -125,9 +125,8 @@
- +
-
@@ -138,7 +137,7 @@
- +
@@ -168,9 +167,8 @@ import * as echarts from 'echarts'; import EchartBoxTwo from '@/components/EchartBox/index.vue'; import { formatDate } from '@/utils/index'; - import { getLineOption, getBarOptions } from './optionList'; -import { getPowerStationOverview, getStationMonthOverview, getInverterListOverview } from '@/api/large'; +import { getPowerStationOverview, getStationMonthOverview, getInverterListOverview } from '@/api/large/index'; // 直接在组件内部定义数据 const chartData = ref({ @@ -258,9 +256,9 @@ const getInverterData = () => { getInverterListOverview(params).then((res) => { if (res.code == 200) { pedestrianFlow(res.data.data); - chartData.value.fault = res.data.fault; - chartData.value.normal = res.data.normal; - chartData.value.abnormal = res.data.offline; + chartData.value.fault = res.data.fault ?? 0; + chartData.value.normal = res.data.normal ?? 0; + chartData.value.abnormal = res.data.offline ?? 0; renderChart(); } }); @@ -295,9 +293,9 @@ const calculatePercentages = () => { } return { - normal: Number(normal), - abnormal: Number(abnormal), - fault: Number(fault) + normal: Number(normal) ?? 0, + abnormal: Number(abnormal) ?? 0, + fault: Number(fault) ?? 0 }; }; const lineOption = ref({}); @@ -335,6 +333,8 @@ const initChart = () => { getEnergyData(); getInverterData(); + // pedestrianFlow(); + // getTurnoverList(); }; // 渲染图表逆变器柱状图 @@ -445,6 +445,8 @@ const renderChart = () => { chartInstance.setOption(option); }; +const lineChart = ref(); + onMounted(() => { initChart(); window.addEventListener('resize', () => chartInstance?.resize()); @@ -515,7 +517,7 @@ onMounted(() => { } .left_title_text { font-size: 20px; - font-family: 'AlimamaShuHeiTi', sans-serif; + font-family: 'Rang_men_zheng_title', sans-serif; display: flex; align-items: flex-end; margin-left: 15px; @@ -595,19 +597,19 @@ img { } .income { width: 100%; - height: 20vh; + height: 24vh; // margin-top: 20px; } .income_list { width: 100%; - height: 9vh; + height: 7vh; display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; /* 垂直居中 */ // grid-gap: 10px; // background-color: rgba(29, 214, 255, 0.1); // border-radius: 10px; - padding: 10px; + padding: 0 10px; box-sizing: border-box; font-size: 14px; } diff --git a/src/views/largeScreen/components/optionList.ts b/src/views/largeScreen/components/optionList.ts index 7d9486f..5836b87 100644 --- a/src/views/largeScreen/components/optionList.ts +++ b/src/views/largeScreen/components/optionList.ts @@ -601,15 +601,15 @@ export const getBarOptions = (data: any) => { backgroundColor: '', grid: { left: '7%', - top: '4%', - bottom: '25%', + top: '10%', + bottom: '23%', right: '2%' }, tooltip: { show: true, backgroundColor: '', trigger: 'axis', - formatter: '{b0}：{c0}元', + formatter: '{b0}：{c0}万元', textStyle: { color: '#fff' } diff --git a/src/views/largeScreen/components/rightPage.vue b/src/views/largeScreen/components/rightPage.vue index 990496c..93b0ad5 100644 --- a/src/views/largeScreen/components/rightPage.vue +++ b/src/views/largeScreen/components/rightPage.vue @@ -267,7 +267,7 @@ getAlarm(); } .left_title_text { font-size: 20px; - font-family: 'AlimamaShuHeiTi', sans-serif; + font-family: 'Rang_men_zheng_title', sans-serif; display: flex; align-items: flex-end; margin-left: 15px;