diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue index e2f3a78..f2b74b5 100644 --- a/src/views/dataView/components/alarmStatus.vue +++ b/src/views/dataView/components/alarmStatus.vue @@ -4,36 +4,74 @@
-
报警情况
+
工单情况
-
- - + + + -
-
- - - - -
+ +
+ + + + +
+ + - - diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue index e2f3a78..f2b74b5 100644 --- a/src/views/dataView/components/alarmStatus.vue +++ b/src/views/dataView/components/alarmStatus.vue @@ -4,36 +4,74 @@
-
报警情况
+
工单情况
-
- - + + + -
-
- - - - -
+ +
+ + + + +
+ + - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue index e2f3a78..f2b74b5 100644 --- a/src/views/dataView/components/alarmStatus.vue +++ b/src/views/dataView/components/alarmStatus.vue @@ -4,36 +4,74 @@
-
报警情况
+
工单情况
-
- - + + + -
-
- - - - -
+ +
+ + + + +
+ + - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue index e2f3a78..f2b74b5 100644 --- a/src/views/dataView/components/alarmStatus.vue +++ b/src/views/dataView/components/alarmStatus.vue @@ -4,36 +4,74 @@
-
报警情况
+
工单情况
-
- - + + + -
-
- - - - -
+ +
+ + + + +
+ + - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ + + diff --git a/src/api/data/dataStatics.js b/src/api/data/dataStatics.js index b9ccd3d..e79dea3 100644 --- a/src/api/data/dataStatics.js +++ b/src/api/data/dataStatics.js @@ -49,7 +49,7 @@ // 离线设备数量 export function deviceStaticsByOnline(params) { return request({ - url: 'statics/deviceCountByOnlineStatus', + url: 'statics/deviceStaticsByStatus', method: 'get', params }) diff --git a/src/views/dataView/components/alarmStatus.vue b/src/views/dataView/components/alarmStatus.vue index e2f3a78..f2b74b5 100644 --- a/src/views/dataView/components/alarmStatus.vue +++ b/src/views/dataView/components/alarmStatus.vue @@ -4,36 +4,74 @@
-
报警情况
+
工单情况
-
- - + + + -
-
- - - - -
+ +
+ + + + +
+ + - - diff --git a/src/views/dataView/components/panelGroup.vue b/src/views/dataView/components/panelGroup.vue index 027ae62..f01f626 100644 --- a/src/views/dataView/components/panelGroup.vue +++ b/src/views/dataView/components/panelGroup.vue @@ -9,7 +9,7 @@
- +
@@ -112,6 +112,14 @@ icon: 'icon-order', color: '#f4516c', permission: '/job/list' + }, + { + title: '当前报警', + context: '--', + flags: '条', + icon: 'icon-alarm', + color: '#40c9c6', + permission: '/well/list' } ] } @@ -158,7 +166,7 @@ .flagBoxStyle { display: flex; margin-bottom: 20px; - margin-top: -30px; + margin-top: -20px; } .flagBoxStyle div:nth-child(2){ line-height: 30px; @@ -257,22 +265,72 @@ } } -@media (max-width:550px) { - .card-panel-description { - display: none; - } - - .card-panel-icon-wrapper { - float: none !important; - width: 100%; - height: 100%; - margin: 0 !important; - - .svg-icon { - display: block; - margin: 14px auto !important; - float: none !important; + @media only screen and (min-width: 768px) { + .el-col-sm-4-8 { + width: 20%; + } + .el-col-sm-offset-4-8 { + margin-left: 20%; + } + .el-col-sm-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-sm-push-4-8 { + position: relative; + left: 20%; } } -} + + @media only screen and (min-width: 992px) { + .el-col-md-4-8 { + width: 20%; + } + .el-col-md-offset-4-8 { + margin-left: 20%; + } + .el-col-md-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-md-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1200px) { + .el-col-lg-4-8 { + width: 20%; + } + .el-col-lg-offset-4-8 { + margin-left: 20%; + } + .el-col-lg-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-lg-push-4-8 { + position: relative; + left: 20%; + } + } + + @media only screen and (min-width: 1920px) { + .el-col-xl-4-8 { + width: 20%; + } + .el-col-xl-offset-4-8 { + margin-left: 20%; + } + .el-col-xl-pull-4-8 { + position: relative; + right: 20%; + } + .el-col-xl-push-4-8 { + position: relative; + left: 20%; + } + } + diff --git a/src/views/dataView/components/wellCountView.vue b/src/views/dataView/components/wellCountView.vue index 5d87b28..82fe878 100644 --- a/src/views/dataView/components/wellCountView.vue +++ b/src/views/dataView/components/wellCountView.vue @@ -4,14 +4,14 @@
井数量分析
- - + + - + { response.data.forEach((item) => { this.online += item.online this.offline += item.offline }) this.chartData.rows = response.data - this.chartDataPie.rows = [ - { 'onlineStatus': '在线', 'deviceCount': this.online }, - { 'onlineStatus': '离线', 'deviceCount': this.offline } - ] + // this.chartDataPie.rows = [ + // { 'onlineStatus': '在线', 'deviceCount': this.online }, + // { 'onlineStatus': '离线', 'deviceCount': this.offline } + // ] }) } } diff --git a/src/views/dataView/dataView.vue b/src/views/dataView/dataView.vue index e1e9977..4920908 100644 --- a/src/views/dataView/dataView.vue +++ b/src/views/dataView/dataView.vue @@ -1,42 +1,35 @@ + + diff --git a/src/views/systemConfig/alarmConfig/listAlarmConfig.vue b/src/views/systemConfig/alarmConfig/listAlarmConfig.vue index 3ef32ea..f8e5ca4 100644 --- a/src/views/systemConfig/alarmConfig/listAlarmConfig.vue +++ b/src/views/systemConfig/alarmConfig/listAlarmConfig.vue @@ -23,6 +23,7 @@ + @@ -31,10 +32,11 @@