From 464634d38dc3579213b828264ef1af8f6e5fa3e1 Mon Sep 17 00:00:00 2001 From: zmk <496160012@qq.com> Date: 星期三, 22 五月 2024 16:07:50 +0800 Subject: [PATCH] Merge branch 'master' of ssh://117.78.1.188:29418/dkyChenJiang --- javaweb-plus/javaweb-admin/src/main/resources/templates/main.html | 403 +++++++-------------------------------------------------- 1 files changed, 50 insertions(+), 353 deletions(-) diff --git a/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html b/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html index 403df31..ff61655 100644 --- a/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html +++ b/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html @@ -22,7 +22,7 @@ width: 20px; height: 20px; border-radius: 50%; - font-size: 16px; + font-size: 14px; color: white; background: #314659; text-align: center; @@ -61,7 +61,7 @@ margin-left: 10px; } .rankrow{ - margin-top: 15px; + margin-top: 12px; } </style> @@ -82,7 +82,7 @@ </div> <div> <span style="color:rgba(0,0,0,.65);font-size: 15px;"> - 鍗忚皟涓� 0 + 鍗忚皟涓� <li class="el-icon-caret-bottom" style="color: #f56c6c"> </span> <span style="color:rgba(0,0,0,.65);font-size: 15px;"> @@ -105,7 +105,7 @@ <li class="el-icon-coin" style="font-size: 18px;float: right;color: grey"> </div> <div> - <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">864涓� + <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">647涓� </span> </div> <div> @@ -128,16 +128,16 @@ <li class="el-icon-video-camera" style="font-size: 18px;float: right;color: grey"> </div> <div> - <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">114涓� + <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">68涓� </span> </div> <div> <span style="color:rgba(0,0,0,.65);font-size: 15px;"> - 鎬昏繘灏� 134,1000.00m + 宸插畨瑁� 0 <li class="el-icon-caret-bottom" style="color: #f56c6c"> </span> <span style="color:rgba(0,0,0,.65);font-size: 15px;"> - 宸插畬鎴� 12,322.23m + 鏈畨瑁� 68 <li class="el-icon-caret-bottom" style="color: #409eff"> </span> </div> @@ -170,9 +170,6 @@ <el-row> <el-col :span="16"> <el-card class="box-card"> -<!-- <div slot="header">--> -<!-- --> -<!-- </div>--> <div style="height: 200px;"> <h3>鏉愭枡缁熻</h3> </div> @@ -197,59 +194,24 @@ <h3>鍦哄湴璇︾粏杩涘害(%)</h3> </div> <div style="width: 100%;height: 500px;overflow: auto"> -<!-- <div id="Chart2" style="width: 100%;height: 1500px;"></div>--> - <el-row class="rankrow"> - <el-col :span="2"> - <div class="active-red">1</div> - </el-col> +<!-- <el-row class="rankrow" v-for='entity in stationProcessData'>--> +<!-- <el-col :span="2">--> +<!-- <div class="active-red">{{entity.ranking}}</div>--> +<!-- </el-col>--> - <el-col :span="4"> - <div style="font-size: 16px">鍦哄湴001</div> - </el-col > +<!-- <el-col :span="4">--> +<!-- <div style="font-size: 16px">{{entity.station}}</div>--> +<!-- </el-col >--> - <el-col :span="4"> - <div style="font-size: 16px">鍗忚皟涓�</div> - </el-col> +<!-- <el-col :span="4">--> +<!-- <div style="font-size: 16px">{{entity.status}}</div>--> +<!-- </el-col>--> - <el-col :span="12"> - <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div> - </el-col> - </el-row> - <el-row class="rankrow"> - <el-col :span="2"> - <div class="active-red">1</div> - </el-col> - - <el-col :span="4"> - <div style="font-size: 16px">鍦哄湴002</div> - </el-col > - - <el-col :span="4"> - <div style="font-size: 16px">鍗忚皟涓�</div> - </el-col> - - <el-col :span="12"> - <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div> - </el-col> - </el-row> - <el-row class="rankrow"> - <el-col :span="2"> - <div class="active-red">1</div> - </el-col> - - <el-col :span="4"> - <div style="font-size: 16px">鍦哄湴003</div> - </el-col > - - <el-col :span="4"> - <div style="font-size: 16px">鍗忚皟涓�</div> - </el-col> - - <el-col :span="12"> - <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div> - </el-col> - </el-row> +<!-- <el-col :span="12">--> +<!-- <div><el-progress :stroke-width="12" :percentage="{{entity.status}}"></el-progress></div>--> +<!-- </el-col>--> +<!-- </el-row>--> </div> @@ -282,12 +244,39 @@ loadMap(); getReallyData(); totalProcess(); - stationProcess(); + //stationProcess(); + indexCount(); }) + + function indexCount() { + let url = ctx + "/system/indexDataCount"; + $.ajaxSettings.async = false; + $.get(url,{},function(res){ + console.log(res); + //vm.indexDataCount = res.projectData; + }) + $.ajaxSettings.async = false; + console.log(vm.stationProcessData); + } + + function stationProcess() { + let url = ctx + "/system/projectProcess"; + $.ajaxSettings.async = false; + $.get(url,{},function(res){ + console.log(res.projectData); + vm.stationProcessData = res.projectData; + }) + $.ajaxSettings.async = false; + console.log(vm.stationProcessData); + + } var vm = new Vue({ el: "#app", data() { - return {}; + return { + stationProcessData: [], + indexDataCount :"", + }; }, methods: { } @@ -562,298 +551,6 @@ Chart1.setOption(option); } - var datas = [ - { ranking: 1, station: '鍦哄湴001 鍗忚皟涓�', value: 85 }, - { ranking: 2, station: '鍦哄湴002 鍗忚皟涓�', value: 22 }, - { ranking: 3, station: '鍦哄湴003', value: 33 }, - { ranking: 4, station: '鍦哄湴004', value: 40 }, - { ranking: 5, station: '鍦哄湴005', value: 33 }, - { ranking: 6, station: '鍦哄湴006', value: 14.97 }, - { ranking: 7, station: '鍦哄湴007', value: 13.03 }, - { ranking: 8, station: '鍦哄湴008', value: 18.48 }, - { ranking: 9, station: '鍦哄湴009', value: 16.74 }, - { ranking: 10, station: '鍦哄湴010', value: 14.97 }, - - { ranking: 11, station: '鍦哄湴011', value: 13.03 }, - { ranking: 12, station: '鍦哄湴012', value: 18.48 }, - - { ranking: 13, station: '鍦哄湴013', value: 16.74 }, - { ranking: 14, station: '鍦哄湴014', value: 14.97 }, - { ranking: 15, station: '鍦哄湴015', value: 13.03 }, - { ranking: 16, station: '鍦哄湴016', value: 18.48 }, - - { ranking: 17, station: '鍦哄湴017', value: 16.74 }, - { ranking: 18, station: '鍦哄湴018', value: 14.97 }, - { ranking: 19, station: '鍦哄湴019', value: 13.03 }, - { ranking: 20, station: '鍦哄湴020', value: 18.48 }, - - { ranking: 21, station: '鍦哄湴021', value: 16.74 }, - { ranking: 22, station: '鍦哄湴022', value: 14.97 }, - { ranking: 23, station: '鍦哄湴023', value: 13.03 }, - { ranking: 24, station: '鍦哄湴024', value: 18.48 }, - - { ranking: 25, station: '鍦哄湴025', value: 16.74 }, - { ranking: 26, station: '鍦哄湴026', value: 14.97 }, - { ranking: 27, station: '鍦哄湴027', value: 13.03 }, - { ranking: 28, station: '鍦哄湴028', value: 18.48 }, - - { ranking: 29, station: '鍦哄湴029', value: 13.03 }, - { ranking: 30, station: '鍦哄湴030', value: 18.48 }, - { ranking: 31, station: '鍦哄湴031', value: 13.03 }, - { ranking: 32, station: '鍦哄湴032', value: 18.48 }, - { ranking: 33, station: '鍦哄湴033', value: 13.03 }, - { ranking: 34, station: '鍦哄湴034', value: 18.48 }, - ]; - - - var seriesName = ['宸插畬鎴愯繘搴�','鎬昏繘搴�']; - var attackSourcesColor1 = ['#FF557F','#FFAA00','#5470C6','#1E9FFF']; - - var attackSourcesColor = [ - new echarts.graphic.LinearGradient(0, 1, 1, 1, [ - { offset: 0, color: 'rgba(255,85,127,1)' }, - { offset: 1, color: 'rgba(255,85,127,1)' }, - ]), - new echarts.graphic.LinearGradient(0, 1, 1, 1, [ - { offset: 0, color: 'rgba(255,170,0,1)' }, - { offset: 1, color: 'rgba(255,170,0,1)' }, - ]), - new echarts.graphic.LinearGradient(0, 1, 1, 1, [ - { offset: 0, color: 'rgba(84,112,198,1)' }, - { offset: 1, color: 'rgba(84,112,198,1)' }, - ]), - new echarts.graphic.LinearGradient(0, 1, 1, 1, [ - { offset: 0, color: 'rgba(30,159,255,.82)' }, - { offset: 1, color: 'rgba(30,159,255,.82)' }, - ]), - ]; - - function stationProcess() { - - let url = ctx + "/system/projectProcess"; - $.ajaxSettings.async = false; - $.get(url,{},function(res){ - console.log(res.projectData); - datas = res.projectData; - }) - $.ajaxSettings.async = false; - - - var Chart2 = echarts.init(document.getElementById('Chart2')); - var rankings = []; - var stationData = []; - var values = []; - - datas.forEach(function (it, index) { - rankings.push(it.ranking); - stationData.push(it.station); - values.push(it.value); - }); - - option = { - // backgroundColor: '#000', - tooltip: { - trigger: 'axis', - axisPointer: { - type: 'shadow', - }, - }, - - grid: { - left: '-8%', - right: '2%', - bottom: '3%', - top:'2%', - containLabel: true, - }, - xAxis: { - type: 'value', - splitLine: { - show: false, - }, - axisLabel: { - show: false, - }, - axisTick: { - show: false, - }, - axisLine: { - show: false, - }, - }, - yAxis: [ - { - type: 'category', - inverse: true, - axisLine: { - show: false, - }, - axisTick: { - show: false, - }, - data: stationData, - axisLabel: { - margin: 30, - fontSize: 14, - align: 'left', - padding: [3, 0, 0, 0], - color: '#000', - rich: { - nt1: { - color: '#fff', - backgroundColor: attackSourcesColor1[0], - width: 20, - height: 18, - fontSize: 12, - align: 'center', - borderRadius: 50, - lineHeight: '5', - padding: [2, 0, 0, 0], - // padding:[0,0,2,0], - }, - nt2: { - color: '#fff', - backgroundColor: attackSourcesColor1[1], - width: 20, - height: 18, - fontSize: 12, - align: 'center', - borderRadius: 50, - padding: [2, 0, 0, 0], - }, - nt3: { - color: '#fff', - backgroundColor: attackSourcesColor1[2], - width: 20, - height: 18, - fontSize: 12, - align: 'center', - borderRadius: 50, - padding: [2, 0, 0, 0], - }, - nt: { - color: '#fff', - backgroundColor: attackSourcesColor1[3], - width: 20, - height: 18, - fontSize: 12, - align: 'center', - borderRadius: 50, - padding: [2, 0, 0, 0], - }, - }, - formatter: function (value, index) { - index = contains(stationData, value) + 1; - if (index - 1 < 3) { - return ['{nt' + index + '|' + index + '}'].join('\n'); - } else { - return ['{nt|' + index + '}'].join('\n'); - } - }, - }, - }, - - { - type: 'category', - inverse: true, - axisTick: 'none', - axisLine: 'none', - show: true, - axisLabel: { - textStyle: { - color: '#666', - fontSize: '12', - }, - }, - data: dataFormat(values), - }, - - { // 鏉$姸鏍囬 - type: 'category', - inverse: true, - offset: -10, - position: 'left', - axisTick: 'none', - axisLine: 'none', - show: true, - axisLabel: { - interval: 0, - color: ['#666'], - align: 'left', - verticalAlign: 'bottom', - lineHeight: 42, - fontSize: 14, - }, - data: dataFormat(stationData), - }, - ], - series: [ - { - zlevel: 1, - name: seriesName[0], - type: 'bar', - barWidth: 15, - data: dataFormat(values), - align: 'center', - itemStyle: { - normal: { - barBorderRadius: 10, - }, - }, - label: { //鏉$姸涓殑鏍峰紡 - show: true, - fontSize: 10, - color: '#fff', //鏉¤涓瓧浣撻鑹� - textBorderWidth: 2, - padding: [2, 0, 0, 0], - }, - }, - { - name: seriesName[1], - type: 'bar', - barWidth: 15, - barGap: '-100%', - data: [100, 100, 100, 100, 100, 100, 100, 100, 100, 100, - 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, - 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, - 100, 100, 100, 100], - itemStyle: { - normal: { - color: 'rgba(200,200,200,.3)', - //width:"100%", - fontSize: 12, - barBorderRadius: 30, - }, - }, - }, - ], - }; - Chart2.setOption(option); - } - - function dataFormat(data) { - var arr = []; - data.forEach(function (item, i) { - let itemStyle = { - color: i > 3 ? attackSourcesColor[3] : attackSourcesColor[i], - }; - arr.push({ - value: item, - itemStyle: itemStyle, - }); - }); - return arr; - } - - function contains(arr, dst) { - var i = arr.length; - while ((i -= 1)) { - if (arr[i] == dst) { - return i; - } - } - return false; - } -- Gitblit v1.9.1