diff --git a/.eslintrc.js b/.eslintrc.js index ebebc7a..9c31832 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -11,5 +11,6 @@ module.exports = { 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 'vue/multi-word-component-names': 'off', + "no-unused-vars": "warn" }, }; diff --git a/src/assets/svg/Monitor/TopRight/OpWaitIcon.svg b/src/assets/svg/Monitor/TopRight/OpWaitIcon.svg index 8fc8585..d552ad6 100644 --- a/src/assets/svg/Monitor/TopRight/OpWaitIcon.svg +++ b/src/assets/svg/Monitor/TopRight/OpWaitIcon.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/Monitor/TopRight/OpendIcon.svg b/src/assets/svg/Monitor/TopRight/OpendIcon.svg index 7f99086..442d577 100644 --- a/src/assets/svg/Monitor/TopRight/OpendIcon.svg +++ b/src/assets/svg/Monitor/TopRight/OpendIcon.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/Monitor/TopRight/OpingIcon.svg b/src/assets/svg/Monitor/TopRight/OpingIcon.svg index 0b4ba9a..945128b 100644 --- a/src/assets/svg/Monitor/TopRight/OpingIcon.svg +++ b/src/assets/svg/Monitor/TopRight/OpingIcon.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/Monitor/TopRight/anesStart.svg b/src/assets/svg/Monitor/TopRight/anesStart.svg index e0e5bc1..c44dbc0 100644 --- a/src/assets/svg/Monitor/TopRight/anesStart.svg +++ b/src/assets/svg/Monitor/TopRight/anesStart.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/Monitor/TopRight/opEnd.svg b/src/assets/svg/Monitor/TopRight/opEnd.svg index 19e78ef..36eb806 100644 --- a/src/assets/svg/Monitor/TopRight/opEnd.svg +++ b/src/assets/svg/Monitor/TopRight/opEnd.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/svg/Monitor/TopRight/opRoom.svg b/src/assets/svg/Monitor/TopRight/opRoom.svg index 50ccb60..f91107d 100644 --- a/src/assets/svg/Monitor/TopRight/opRoom.svg +++ b/src/assets/svg/Monitor/TopRight/opRoom.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/views/pageMonitor/bottomLeft/index.vue b/src/views/pageMonitor/bottomLeft/index.vue index e38b545..9159461 100644 --- a/src/views/pageMonitor/bottomLeft/index.vue +++ b/src/views/pageMonitor/bottomLeft/index.vue @@ -6,7 +6,7 @@
-
+
@@ -21,7 +21,7 @@ diff --git a/src/views/pageMonitor/bottomRight/eMid.vue b/src/views/pageMonitor/bottomRight/eMid.vue index b20d70a..979d1fc 100644 --- a/src/views/pageMonitor/bottomRight/eMid.vue +++ b/src/views/pageMonitor/bottomRight/eMid.vue @@ -1,24 +1,125 @@ diff --git a/src/views/pageMonitor/bottomRight/eRight.vue b/src/views/pageMonitor/bottomRight/eRight.vue index 461cde3..012043d 100644 --- a/src/views/pageMonitor/bottomRight/eRight.vue +++ b/src/views/pageMonitor/bottomRight/eRight.vue @@ -31,7 +31,8 @@ export default { startDate: dayjs().subtract(7, 'day').format('YYYY-MM-DD'), endDate: dayjs().format('YYYY-MM-DD'), renderTimer: null, - getDataList: [], + pageList: [], + myChart: null }; }, methods: { @@ -52,87 +53,78 @@ export default { startDate: this.startDate, endDate: this.endDate, }).then(res => { - this.getDataList = res['data'] + this.pageList = res['data'] this.updateChart(); }); }, updateChart() { - const myChart = echarts.init(document.getElementById("chartBottomRight")); + if (!this.myChart) { + this.myChart = echarts.init(document.getElementById("chartBottomRight")); + } let categories = ['骨科', '普外科', '内科', '神经外科', '肿瘤科'] let values = [0, 0, 0, 0, 0] - let maxVal = 10; - if (this.getDataList.length) { - categories = this.getDataList.map(item => { + let maxVal = 20; + if (this.pageList.length) { + categories = this.pageList.map(item => { return item['deptName'] }) - values = this.getDataList.map(item => { + values = this.pageList.map(item => { return item['deptCount'] }) maxVal = Math.ceil(Math.max(...values) / 20) * 20; } const option = { + tooltip: { + trigger: "axis", + axisPointer: { type: "shadow" } + }, grid: { - left: 80, - right: 50, - top: 20, - bottom: 20, + left: "5%", + right: "10%", + bottom: "5%", + top: "10%", + containLabel: true }, xAxis: { - max: maxVal, - axisLabel: { - color: `rgba(0, 0, 0, 0.3)`, - fontSize: 12, - }, - }, - yAxis: { type: "category", data: categories, - axisLine: { show: false }, - axisTick: { show: false }, - axisLabel: { - color: `rgba(0, 0, 0, 0.3)`, - fontSize: 12, - }, + axisLine: { lineStyle: { color: "rgba(0, 0, 0, 0.3)" } }, + axisLabel: { color: `rgba(0, 0, 0, 0.3)`, fontSize: 12, } + }, + yAxis: { + type: "value", + axisLine: { show: true, lineStyle: { color: "rgba(0, 0, 0, 0.3)" } }, + axisLabel: { color: `rgba(0, 0, 0, 0.3)`, fontSize: 12, }, + max: maxVal }, series: [ { type: "bar", data: values, - barWidth: 20, + barWidth: 24, itemStyle: { - color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [ - { offset: 0, color: "#a066f8" }, - { offset: 1, color: "#6173f7" }, + borderRadius: [8, 8, 0, 0], + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#8e5fff" }, + { offset: 1, color: "#4a90e2" } ]), - borderRadius: 10, + shadowColor: "rgba(0,0,0,0.1)", + shadowBlur: 6, + shadowOffsetY: 3 }, - z: 2, - }, - { - type: "scatter", - data: values, - symbolSize: 24, - itemStyle: { - color: "#fff", - borderColor: "#8a6df0", - borderWidth: 1, - shadowColor: "#fff", - shadowBlur: 5, - }, - z: 3, label: { show: true, - position: "outside", - formatter: "{c}", - color: "#8a6df0", - fontSize: 14, + position: "top", + color: "#a170ff", fontWeight: "bold", - }, - }, - ], + fontSize: 16, + formatter: "{c}" + } + } + ] }; - myChart.setOption(option); + this.myChart.setOption(option); }, }, mounted() { diff --git a/src/views/pageMonitor/topRight/index.scss b/src/views/pageMonitor/topRight/index.scss index 712abec..d797114 100644 --- a/src/views/pageMonitor/topRight/index.scss +++ b/src/views/pageMonitor/topRight/index.scss @@ -63,12 +63,12 @@ &.opEnter { p { - color: #35CEFD; + color: #0F69D6; } div:last-of-type { span { - color: #35CEFD; + color: #0F69D6; } } @@ -89,12 +89,12 @@ &.opStart { p { - color: #B53FDF; + color: #8B2CAD; } div:last-of-type { span { - color: #B53FDF; + color: #8B2CAD; } } @@ -102,12 +102,12 @@ &.opEnd { p { - color: #BAE7A4; + color: #37900B; } div:last-of-type { span { - color: #BAE7A4; + color: #37900B; } } @@ -115,12 +115,12 @@ &.anesEnd { p { - color: #946FEC; + color: #5B4CAF; } div:last-of-type { span { - color: #946FEC; + color: #5B4CAF; } } diff --git a/src/views/pageMonitor/topRight/index.vue b/src/views/pageMonitor/topRight/index.vue index 09f1747..e908e0e 100644 --- a/src/views/pageMonitor/topRight/index.vue +++ b/src/views/pageMonitor/topRight/index.vue @@ -1,6 +1,6 @@