Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
2b76acdf by renchao@pashanhoo.com
Options

style:首页增加定时器

1 parent d8f268f3
Inline Side-by-side
Showing 7 changed files with 83 additions and 54 deletions
...@@ -3,12 +3,13 @@ ...@@ -3,12 +3,13 @@
3 </template> 3 </template>
4 4
5 <script> 5 <script>
6 import Chart from './Chart' 6 import Chart from './Chart'
7 import work from "@/api/work"; 7 import work from "@/api/work";
8 export default { 8 export default {
9 data () { 9 data () {
10 return { 10 return {
11 cdata: { 11 cdata: {
12 timer: null,
12 legendItem: ['接入', '上报', '登簿'], 13 legendItem: ['接入', '上报', '登簿'],
13 color: [ 14 color: [
14 "#02D9FD", 15 "#02D9FD",
...@@ -22,24 +23,31 @@ export default { ...@@ -22,24 +23,31 @@ export default {
22 components: { 23 components: {
23 Chart 24 Chart
24 }, 25 },
25 mounted() { 26 created () {
26 27 this.dataTrend()
28 this.timer = setInterval(() => {
29 this.dataTrend()
30 }, 10000) // 10s
31 },
32 mounted () {
27 window.addEventListener("resize", () => { 33 window.addEventListener("resize", () => {
28 this.dataTrend() 34 this.dataTrend()
29 }); 35 });
30 this.dataTrend()
31 }, 36 },
32 methods: { 37 methods: {
33 async dataTrend() { 38 async dataTrend () {
34 try { 39 try {
35 let { result: res } = await work.dataTrend(); 40 let { result: res } = await work.dataTrend();
36 this.cdata.echartData = []; 41 this.cdata.echartData = [];
37 this.cdata.echartData=res, 42 this.cdata.echartData = res,
38 this.cdata.echartData.reverse() 43 this.cdata.echartData.reverse()
39 } catch (error) { 44 } catch (error) {
40 console.log(error); 45 console.log(error);
41 } 46 }
42 }, 47 },
43 }, 48 },
44 } 49 destroyed () {
50 clearInterval(this.timer)
51 }
52 }
45 </script> 53 </script>
......
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-04-03 13:40:18 4 * @LastEditTime: 2023-07-03 16:50:43
5 --> 5 -->
6 <template> 6 <template>
7 <Chart :cdata="cdata" /> 7 <Chart :cdata="cdata" />
8 </template> 8 </template>
9 9
10 <script> 10 <script>
11 import Chart from "./Chart"; 11 import Chart from "./Chart";
12 import work from "@/api/work"; 12 import work from "@/api/work";
13 export default { 13 export default {
14 data () { 14 data () {
15 return { 15 return {
16 timer: null, // 定时器
16 cdata: [] 17 cdata: []
17 } 18 }
18 }, 19 },
19 components: { 20 components: {
20 Chart 21 Chart
21 }, 22 },
22 mounted () { 23 created () {
23 this.mapViews(); 24 this.mapViews();
25 this.timer = setInterval(() => {
26 this.mapViews();
27 }, 10000) // 10s
24 }, 28 },
25 methods: { 29 methods: {
26 async mapViews () { 30 async mapViews () {
...@@ -37,6 +41,9 @@ export default { ...@@ -37,6 +41,9 @@ export default {
37 this.$refs.msg.messageShow(); 41 this.$refs.msg.messageShow();
38 } 42 }
39 } 43 }
44 },
45 destroyed () {
46 clearInterval(this.timer)
47 }
40 } 48 }
41 }
42 </script> 49 </script>
......
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-07-03 16:45:40
5 -->
1 <template> 6 <template>
2 <div class="centercard"> 7 <div class="centercard">
3 <div class="card1"> 8 <div class="card1">
...@@ -11,21 +16,18 @@ ...@@ -11,21 +16,18 @@
11 </template> 16 </template>
12 17
13 <script> 18 <script>
14 import maps from "@/components/Echart/Map"; 19 import maps from "@/components/Echart/Map";
15 import brokenline from "@/components/Echart/Brokenline"; 20 import brokenline from "@/components/Echart/Brokenline";
16 export default { 21 export default {
17 data () { 22 data () {
18 return {}; 23 return {};
19 }, 24 },
20 components: { maps, brokenline }, 25 components: { maps, brokenline },
21 mounted () { }, 26 };
22 beforeDestroy () { },
23 methods: {},
24 };
25 </script> 27 </script>
26 28
27 <style lang="scss" scoped> 29 <style lang="scss" scoped>
28 .centercard { 30 .centercard {
29 width: 40%; 31 width: 40%;
30 height: calc(100vh - 114px); 32 height: calc(100vh - 114px);
31 box-sizing: border-box; 33 box-sizing: border-box;
...@@ -81,5 +83,5 @@ export default { ...@@ -81,5 +83,5 @@ export default {
81 width: 100%; 83 width: 100%;
82 } 84 }
83 } 85 }
84 } 86 }
85 </style> 87 </style>
......
1 <!-- 1 <!--
2 * @Description :工作台左侧表 2 * @Description :工作台左侧表
3 * @Autor : miaofang 3 * @Autor : miaofang
4 * @LastEditTime : 2023-05-18 11:27:22 4 * @LastEditTime: 2023-07-03 16:50:16
5 --> 5 -->
6 <template> 6 <template>
7 <div class="leftcard"> 7 <div class="leftcard">
...@@ -57,14 +57,13 @@ ...@@ -57,14 +57,13 @@
57 </div> 57 </div>
58 </div> 58 </div>
59 </template> 59 </template>
60
61 <script> 60 <script>
62
63 import columnar from "@/components/Echart/Columnar"; 61 import columnar from "@/components/Echart/Columnar";
64 import work from "@/api/work"; 62 import work from "@/api/work";
65 export default { 63 export default {
66 data () { 64 data () {
67 return { 65 return {
66 timer: null, // 定时器
68 // 日均接入量 67 // 日均接入量
69 qxerrer: "", 68 qxerrer: "",
70 qxsuccess: "", 69 qxsuccess: "",
...@@ -76,8 +75,11 @@ ...@@ -76,8 +75,11 @@
76 stcgl: "" 75 stcgl: ""
77 }; 76 };
78 }, 77 },
79 mounted () { 78 created () {
80 this.getsthjqxjrtotal(); 79 this.getsthjqxjrtotal();
80 this.timer = setInterval(() => {
81 this.getsthjqxjrtotal();
82 }, 10000) // 10s
81 }, 83 },
82 components: { columnar }, 84 components: { columnar },
83 computed: { 85 computed: {
...@@ -118,6 +120,9 @@ ...@@ -118,6 +120,9 @@
118 }); 120 });
119 }, 121 },
120 }, 122 },
123 destroyed () {
124 clearInterval(this.timer)
125 }
121 }; 126 };
122 </script> 127 </script>
123 128
......
1 <!-- 1 <!--
2 * @Description :工作台右侧表 2 * @Description :工作台右侧表
3 * @Autor : miaofang 3 * @Autor : miaofang
4 * @LastEditTime : 2023-05-18 11:26:52 4 * @LastEditTime: 2023-07-03 16:50:07
5 --> 5 -->
6 <template> 6 <template>
7 <div class="rightcard"> 7 <div class="rightcard">
...@@ -30,6 +30,7 @@ ...@@ -30,6 +30,7 @@
30 export default { 30 export default {
31 data () { 31 data () {
32 return { 32 return {
33 timer: null,
33 config: { 34 config: {
34 headerBGC: '#016AC5', 35 headerBGC: '#016AC5',
35 oddRowBGC: '#154295', 36 oddRowBGC: '#154295',
...@@ -42,8 +43,13 @@ ...@@ -42,8 +43,13 @@
42 } 43 }
43 }, 44 },
44 components: { columnarsmat, Rose }, 45 components: { columnarsmat, Rose },
46 created () {
47 this.getdjywltotal()
48 this.timer = setInterval(() => {
49 this.getdjywltotal()
50 }, 5000) // 5s
51 },
45 mounted () { 52 mounted () {
46 this.getdjywltotal();
47 window.addEventListener("resize", () => { 53 window.addEventListener("resize", () => {
48 this.config.data = []; 54 this.config.data = [];
49 this.getdjywltotal(); 55 this.getdjywltotal();
...@@ -65,19 +71,21 @@ ...@@ -65,19 +71,21 @@
65 this.config.data.push([index + 1, item.AREACODE, item.ywtotal]) 71 this.config.data.push([index + 1, item.AREACODE, item.ywtotal])
66 72
67 }); 73 });
68
69 // 遍历修改数组键，作为echars图表的参数 74 // 遍历修改数组键，作为echars图表的参数
70
71
72 } catch (error) { 75 } catch (error) {
73 console.log(error); 76 console.log(error);
74 } 77 }
75 78 }
76 },
77 }, 79 },
80 destroyed () {
81 clearInterval(this.timer)
82 }
78 } 83 }
79 </script> 84 </script>
80 <style lang="scss" scoped> 85 <style lang="scss" scoped>
86 /deep/.dv-scroll-board .rows {
87 overflow-y: auto;
88 }
81 /deep/.row-item:not(:last-child) { 89 /deep/.row-item:not(:last-child) {
82 margin-bottom: 0.026rem; 90 margin-bottom: 0.026rem;
83 } 91 }
......
1 <!-- 1 <!--
2 * @Description :工作台表内容 2 * @Description :工作台表内容
3 * @Autor : miaofang 3 * @Autor : miaofang
4 * @LastEditTime : 2023-05-18 13:09:47 4 * @LastEditTime: 2023-07-03 16:39:09
5 --> 5 -->
6 <template> 6 <template>
7 <div class="content" id="box"> 7 <div class="content" id="box">
...@@ -11,12 +11,12 @@ ...@@ -11,12 +11,12 @@
11 </div> 11 </div>
12 </template> 12 </template>
13 <script> 13 <script>
14 import "@/utils/flexible.js"; 14 import "@/utils/flexible.js";
15 import drawMixin from "@/utils/drawMixin"; 15 import drawMixin from "@/utils/drawMixin";
16 import leftcard from "./leftcard"; 16 import leftcard from "./leftcard";
17 import centercard from "./centercard"; 17 import centercard from "./centercard";
18 import rightcard from "./rightcard"; 18 import rightcard from "./rightcard";
19 export default { 19 export default {
20 mixins: [drawMixin], 20 mixins: [drawMixin],
21 data () { 21 data () {
22 return { 22 return {
...@@ -42,24 +42,16 @@ export default { ...@@ -42,24 +42,16 @@ export default {
42 }, 500); 42 }, 500);
43 }, 43 },
44 }, 44 },
45 }; 45 };
46 </script> 46 </script>
47 47
48 <style scoped lang="scss"> 48 <style scoped lang="scss">
49 .content { 49 .content {
50 width: 100%; 50 width: 100%;
51 height: calc(100% -94px); 51 height: calc(100% -94px);
52 margin: auto; 52 margin: auto;
53 display: flex; 53 display: flex;
54 justify-content: space-between; 54 justify-content: space-between;
55 margin-top: 15px; 55 margin-top: 15px;
56 56 }
57 }
58 // #box{
59 // width: 1620px;
60 // height: 680px;
61 // position: absolute;
62 // transform-origin: left top;
63 // overflow: hidden;
64 // }
65 </style> 57 </style>
......
1 <!-- 1 <!--
2 * @Description :修改登簿日志弹窗 2 * @Description :修改登簿日志弹窗
3 * @Autor : miaofang 3 * @Autor : miaofang
4 * @LastEditTime : 2023-05-18 13:16:22 4 * @LastEditTime: 2023-07-03 16:27:13
5 --> 5 -->
6 <template> 6 <template>
7 <!-- 修改登簿日志弹窗 --> 7 <!-- 修改登簿日志弹窗 -->
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
15 <el-tabs v-model="titleName" type="card"> 15 <el-tabs v-model="titleName" type="card">
16 <el-tab-pane label="登薄详情" name="sjmx"></el-tab-pane> 16 <el-tab-pane label="登薄详情" name="sjmx"></el-tab-pane>
17 <el-tab-pane label="xml报文" name="xml"></el-tab-pane> 17 <el-tab-pane label="xml报文" name="xml"></el-tab-pane>
18 <el-tab-pane label="返回结果" name="fhjg"></el-tab-pane>
18 </el-tabs> 19 </el-tabs>
19 <div class="dialog-from" v-if="titleName == 'sjmx'"> 20 <div class="dialog-from" v-if="titleName == 'sjmx'">
20 <el-row class="dialog-from_header item-content-input"> 21 <el-row class="dialog-from_header item-content-input">
...@@ -186,6 +187,9 @@ ...@@ -186,6 +187,9 @@
186 <div class="JsonEditor" v-if="titleName == 'xml'"> 187 <div class="JsonEditor" v-if="titleName == 'xml'">
187 <JsonEditor class="editXML" :resultInfo="resultInfo" :key="key" /> 188 <JsonEditor class="editXML" :resultInfo="resultInfo" :key="key" />
188 </div> 189 </div>
190 <div class="JsonEditor" v-if="titleName == 'fhjg'">
191 <JsonEditor class="editXML" :resultInfo="resultInfo" :key="key" />
192 </div>
189 </div> 193 </div>
190 </div> 194 </div>
191 <div class="d-center" v-if="titleName == 'sjmx'"> 195 <div class="d-center" v-if="titleName == 'sjmx'">
...@@ -310,6 +314,9 @@ ...@@ -310,6 +314,9 @@
310 getDetail(data).then(res => { 314 getDetail(data).then(res => {
311 let { accessLog, registerInfo, accessInfo, accessList, registerList 315 let { accessLog, registerInfo, accessInfo, accessList, registerList
312 } = res.result 316 } = res.result
317
318 console.log(res.result, 'res.resultres.resultres.result');
319
313 this.accessLog = accessLog 320 this.accessLog = accessLog
314 this.resultInfo = accessLog.LOGSXML 321 this.resultInfo = accessLog.LOGSXML
315 this.registerInfo = registerInfo 322 this.registerInfo = registerInfo
......