|
@@ -1,7 +1,15 @@
|
|
|
<template>
|
|
<template>
|
|
|
<div style="overflow-y: auto;background-color: #F7F7F7;height: 100%;">
|
|
<div style="overflow-y: auto;background-color: #F7F7F7;height: 100%;">
|
|
|
<div style="margin-left: 1%;width: 98%;display: flex;margin-top: 1%;height: 15vh;">
|
|
<div style="margin-left: 1%;width: 98%;display: flex;margin-top: 1%;height: 15vh;">
|
|
|
- <div shadow="always" style="width: 33%;height: 100%;;border-radius: 10px;background-color: white;" class="boxShadow">
|
|
|
|
|
|
|
+ <div shadow="always" style="width: 33%;height: 100%;;border-radius: 10px;background-color: white;margin-left: 0%;" class="boxShadow">
|
|
|
|
|
+ <div style="width: 100%;display: flex;align-items: center;justify-content: center;font-size: 35px;font-weight: bold;color: #2DBEA2;;height: 70%">
|
|
|
|
|
+ {{yearAll}}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="display: flex;align-items: center;justify-content: center;background-color: #2DBEA2;font-size: 20px;width: 100%;color: white;text-align: center;border-radius: 0 0 10px 10px;height: 30%;">
|
|
|
|
|
+ 年调用次数
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div shadow="always" style="width: 33%;margin-left: 1%;height: 100%;;border-radius: 10px;background-color: white;" class="boxShadow">
|
|
|
<div style="width: 100%;display: flex;align-items: center;justify-content: center;font-size: 35px;font-weight: bold;color: #477ACF;;height: 70%">
|
|
<div style="width: 100%;display: flex;align-items: center;justify-content: center;font-size: 35px;font-weight: bold;color: #477ACF;;height: 70%">
|
|
|
{{dayAll}}
|
|
{{dayAll}}
|
|
|
</div>
|
|
</div>
|
|
@@ -17,14 +25,7 @@
|
|
|
月调用次数
|
|
月调用次数
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div shadow="always" style="width: 33%;height: 100%;;border-radius: 10px;background-color: white;margin-left: 1%;" class="boxShadow">
|
|
|
|
|
- <div style="width: 100%;display: flex;align-items: center;justify-content: center;font-size: 35px;font-weight: bold;color: #2DBEA2;;height: 70%">
|
|
|
|
|
- {{yearAll}}
|
|
|
|
|
- </div>
|
|
|
|
|
- <div style="display: flex;align-items: center;justify-content: center;background-color: #2DBEA2;font-size: 20px;width: 100%;color: white;text-align: center;border-radius: 0 0 10px 10px;height: 30%;">
|
|
|
|
|
- 年调用次数
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+
|
|
|
</div>
|
|
</div>
|
|
|
<div style="background-color: #F7F7F7;padding-top:1%;">
|
|
<div style="background-color: #F7F7F7;padding-top:1%;">
|
|
|
<div style="margin-left: 1%;width: 98%;display: flex;height: 32vh;">
|
|
<div style="margin-left: 1%;width: 98%;display: flex;height: 32vh;">
|
|
@@ -217,7 +218,7 @@ function getMon(){
|
|
|
},
|
|
},
|
|
|
mdId:valueModMon.value
|
|
mdId:valueModMon.value
|
|
|
}
|
|
}
|
|
|
- var x = [1,2,3,4,5,6,7,8,9,10,11,12]
|
|
|
|
|
|
|
+ var x = getMonthsFromJanuaryToCurrent()
|
|
|
var y = []
|
|
var y = []
|
|
|
x.forEach(item=>{
|
|
x.forEach(item=>{
|
|
|
y.push(0)
|
|
y.push(0)
|
|
@@ -233,6 +234,35 @@ function getMon(){
|
|
|
initChartbt1(y,mdName)
|
|
initChartbt1(y,mdName)
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
|
|
+function getMonthsFromJanuaryToCurrent() {
|
|
|
|
|
+ const today = new Date();
|
|
|
|
|
+ const currentYear = today.getFullYear();
|
|
|
|
|
+ const currentMonth = today.getMonth() + 1; // 获取当前月份 (1-12)
|
|
|
|
|
+
|
|
|
|
|
+ const monthsArray = [];
|
|
|
|
|
+
|
|
|
|
|
+ // 从1月循环到当前月份
|
|
|
|
|
+ for (let month = 1; month <= currentMonth; month++) {
|
|
|
|
|
+ monthsArray.push(month);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ return monthsArray;
|
|
|
|
|
+}
|
|
|
|
|
+function getDaysFromFirstToToday() {
|
|
|
|
|
+ const today = new Date();
|
|
|
|
|
+ const currentYear = today.getFullYear();
|
|
|
|
|
+ const currentMonth = today.getMonth();
|
|
|
|
|
+ const currentDay = today.getDate(); // 获取今天是几号
|
|
|
|
|
+
|
|
|
|
|
+ const daysArray = [];
|
|
|
|
|
+
|
|
|
|
|
+ // 从1号循环到今天
|
|
|
|
|
+ for (let day = 1; day <= currentDay; day++) {
|
|
|
|
|
+ daysArray.push(day);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ return daysArray;
|
|
|
|
|
+}
|
|
|
function getDay(){
|
|
function getDay(){
|
|
|
var mdName
|
|
var mdName
|
|
|
for(var i = 0;i<optionsModel.value.length;i++){
|
|
for(var i = 0;i<optionsModel.value.length;i++){
|
|
@@ -248,8 +278,7 @@ function getDay(){
|
|
|
},
|
|
},
|
|
|
mdId:valueMod.value
|
|
mdId:valueMod.value
|
|
|
}
|
|
}
|
|
|
- console.log(Number('01'))
|
|
|
|
|
- var x = getAllDaysInMonth(valueYue.value)
|
|
|
|
|
|
|
+ var x = getDaysFromFirstToToday(valueYue.value)
|
|
|
var y = []
|
|
var y = []
|
|
|
x.forEach(item=>{
|
|
x.forEach(item=>{
|
|
|
y.push(0)
|
|
y.push(0)
|
|
@@ -290,7 +319,9 @@ function inintChartTop1(x,y,mdName){
|
|
|
},
|
|
},
|
|
|
yAxis: {
|
|
yAxis: {
|
|
|
type: 'value',
|
|
type: 'value',
|
|
|
- splitLine: { show: false }
|
|
|
|
|
|
|
+ splitLine: { show: false },
|
|
|
|
|
+ name: '单位:次',
|
|
|
|
|
+ minInterval: 1,
|
|
|
},
|
|
},
|
|
|
series: [
|
|
series: [
|
|
|
{
|
|
{
|
|
@@ -300,47 +331,6 @@ function inintChartTop1(x,y,mdName){
|
|
|
data: y,
|
|
data: y,
|
|
|
smooth: true
|
|
smooth: true
|
|
|
},
|
|
},
|
|
|
- // {
|
|
|
|
|
- // name: '上海沿海风暴潮预报模型',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // color:'rgb(51, 126, 204)',
|
|
|
|
|
- // data: [39, 37, 37, 1, 18, 19, 16, 15, 18, 16, 19, 35, 12, 10, 5, 12, 25, 2, 16, 13, 27, 14, 4, 9, 18, 27, 29, 14, 35, 22], smooth: true
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // name: '黄浦江水系水文分析预报数值模拟模型',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // smooth: true,
|
|
|
|
|
- // color:'rgb(121, 187, 255)',
|
|
|
|
|
- // data: [28, 8, 12, 34, 33, 20, 10, 3, 24, 38, 35, 20, 28, 33, 23, 10, 13, 14, 33, 3, 32, 18, 9, 3, 6, 37, 24, 5, 33, 20],
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // name: '苏州河水系水情预报模型',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // color:'rgb(121, 187, 255)',
|
|
|
|
|
- // smooth: true,
|
|
|
|
|
- // data: [19, 12, 38, 13, 9, 20, 35, 10, 32, 7, 26, 17, 23, 15, 33, 10, 27, 39, 2, 37, 19, 39, 28, 11, 33, 30, 37, 31, 13, 36],
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // name: '内涝风险实时预警与预报模型',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // smooth: true,
|
|
|
|
|
- // color:"rgb(198, 226, 255)",
|
|
|
|
|
- // data: [15, 15, 37, 35, 24, 14, 23, 13, 12, 36, 17, 20, 10, 17, 24, 39, 10, 15, 32, 23, 31, 8, 28, 3, 25, 30, 3, 25, 8, 2],
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // name: '上海市中心城区排水系统模型',
|
|
|
|
|
- // smooth: true,
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // color:'#67C23A',
|
|
|
|
|
- // data: [37, 25, 18, 35, 15, 28, 8, 24, 34, 8, 20, 8, 10, 16, 18, 23, 7, 14, 17, 13, 18, 28, 8, 37, 32, 18, 37, 8, 16, 40],
|
|
|
|
|
- // },
|
|
|
|
|
- // {
|
|
|
|
|
- // name: '温带风暴潮预报模型',
|
|
|
|
|
- // smooth: true,
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // color:'rgb(149, 212, 117)',
|
|
|
|
|
- // data: [35, 23, 35, 18, 32, 13, 34, 8, 5, 7, 21, 4, 19, 14, 10, 5, 1, 2, 26, 2, 27, 31, 18, 17, 28, 7, 26, 25, 21, 37],
|
|
|
|
|
- // }
|
|
|
|
|
]
|
|
]
|
|
|
};
|
|
};
|
|
|
|
|
|
|
@@ -367,6 +357,8 @@ function initChartbt1(y,mdName){
|
|
|
},
|
|
},
|
|
|
yAxis: {
|
|
yAxis: {
|
|
|
type: 'value',
|
|
type: 'value',
|
|
|
|
|
+ name: '单位:次',
|
|
|
|
|
+ minInterval: 1,
|
|
|
splitLine: { show: false }
|
|
splitLine: { show: false }
|
|
|
},
|
|
},
|
|
|
series: [
|
|
series: [
|
|
@@ -407,6 +399,9 @@ function initChartbt2(y){
|
|
|
},
|
|
},
|
|
|
yAxis: {
|
|
yAxis: {
|
|
|
type: 'value',
|
|
type: 'value',
|
|
|
|
|
+ name: '单位:次',
|
|
|
|
|
+ minInterval: 1,
|
|
|
|
|
+ nameLocation: 'end',
|
|
|
splitLine: { show: false }
|
|
splitLine: { show: false }
|
|
|
},
|
|
},
|
|
|
series: [
|
|
series: [
|