From a3f357e8a60443b74b64c7479113c68eb35ce1f5 Mon Sep 17 00:00:00 2001 From: ZZJ <10913410+zzj2100@user.noreply.gitee.com> Date: 星期五, 15 七月 2022 19:44:57 +0800 Subject: [PATCH] 控制轮询 --- dist.rar | 0 src/pages/cameraAccess/components/SystemInfo.vue | 79 ++++++++---- src/components/subComponents/SystemInfo.vue | 68 ++++++---- vue.config.js | 4 src/api/login.ts | 8 + src/pages/desktop/index/App.vue | 10 + src/pages/analysisPower/index/App.vue | 12 + src/pages/cameraAccess/components/SeparateRules.vue | 3 src/pages/cameraAccess/components/infoCard.vue | 176 ++++++++++++++++++----------- 9 files changed, 229 insertions(+), 131 deletions(-) diff --git a/dist.rar b/dist.rar new file mode 100644 index 0000000..28c030a --- /dev/null +++ b/dist.rar Binary files differ diff --git a/src/api/login.ts b/src/api/login.ts index 2473dce..7598e1b 100644 --- a/src/api/login.ts +++ b/src/api/login.ts @@ -48,4 +48,12 @@ url: "/data/api-v/info/getServerName", method: "get" }); +}; + +//鑾峰彇璁惧淇℃伅 +export const getDevInfo = (query: any) => { + return request({ + url: "/data/api-v/sysset/getDevInfo", + method: "get" + }); }; \ No newline at end of file diff --git a/src/components/subComponents/SystemInfo.vue b/src/components/subComponents/SystemInfo.vue index 6fa2b5f..03acc5b 100644 --- a/src/components/subComponents/SystemInfo.vue +++ b/src/components/subComponents/SystemInfo.vue @@ -1,22 +1,22 @@ <template> <div :class="showClass"> - <div class="card-box" :style="`width:${borderWidth};min-width:456px`" > + <div class="card-box" :style="`width:${borderWidth};min-width:456px`"> <ul> - <li style="max-width:30px;" v-if="ShowLocalVedio"> + <li style="max-width: 30px" v-if="ShowLocalVedio"> <div class="total-box"> - <div style="width:100%;margin-top:28px;"> + <div style="width: 100%; margin-top: 28px"> <div class="top-text"> - <em>{{"鎬荤畻鍔�"}}</em> + <em>{{ "鎬荤畻鍔�" }}</em> </div> <div class="mid-text"> - <em>{{` ${PollData.channelTotal}`}}</em> + <em>{{ ` ${PollData.channelTotal}` }}</em> </div> </div> </div> </li> - <li style="max-width:120px" v-if="showRealPoll"> + <li style="max-width: 120px" v-if="showRealPoll"> <DataStackCard - style="width:95%" + style="width: 95%" title="瀹炴椂绠楀姏" fourTip="鏁呴殰瀵艰嚧鏈鐞�" fourIcon="iconicon-test21" @@ -27,12 +27,15 @@ :NoDeal="`${PollData.RealTimeNoDeal}璺痐" /> </li> - <li style="max-width:120px" v-if="showRealPoll"> + <li + style="max-width: 120px" + v-if="showRealPoll && isShowPolling === 'show'" + > <DataStackCard title="杞绠楀姏" fourTip="绛夊緟杞澶勭悊" fourIcon="iconicon-test2" - style="width:95%" + style="width: 95%" :total="`${PollData.PollValidCount}璺痐" :ValidCount="`${PollData.PollSum}璺痐" :InValidCount="`${PollData.PollInvalid}璺痐" @@ -40,7 +43,7 @@ :NoDeal="`${PollData.PollNoDeal}璺痐" /> </li> - <li style="max-width:120px" v-if="ShowLocalVedio"> + <li style="max-width: 120px" v-if="ShowLocalVedio"> <!-- <local-vedio-card title="鏈湴绠楀姏" style="width:95%" @@ -49,8 +52,9 @@ :warning="`${PollData.PollInvalid}璺痐" />--> <DataStackCard + v-if="isShowPolling === 'show'" title="鏁版嵁鏍堢畻鍔�" - style="width:95%" + style="width: 95%" fourTip="鏈煡鍘熷洜瀵艰嚧鏈鐞�" fourIcon="iconicon-test5" :total="`${PollData.stackChannelCount}璺痐" @@ -75,15 +79,18 @@ </li> </ul> </div>--> - <div class="eCharts-box" v-if="PollData.barCharts.length>0"> - <eChartsBar ref="cpuMeneryCharts" :xAxisData="PollData.barCharts"></eChartsBar> + <div class="eCharts-box" v-if="PollData.barCharts.length > 0"> + <eChartsBar + ref="cpuMeneryCharts" + :xAxisData="PollData.barCharts" + ></eChartsBar> </div> </div> </template> <script> -import DataStackCard from "@/components/subComponents/DataStackCard" -import eChartsBar from '@/components/subComponents/eChartsBar' +import DataStackCard from "@/components/subComponents/DataStackCard"; +import eChartsBar from "@/components/subComponents/eChartsBar"; export default { name: "SystemInfo", @@ -91,46 +98,51 @@ DataStackCard, eChartsBar, }, + data() { + return { + isShowPolling: sessionStorage.getItem("isShowPolling"), + }; + }, props: { showTask: { type: Boolean, - default: false + default: false, }, showClass: { type: String, - default: 'sysinfo-box flex-box' + default: "sysinfo-box flex-box", }, ShowLocalVedio: { type: Boolean, - default: false + default: false, }, showRealPoll: { type: Boolean, - default: true + default: true, }, marginTop: { type: String, - default: 'ma' + default: "ma", }, borderWidth: { type: String, - default: '64%' + default: "64%", }, liquidWidth: { type: String, - default: '30%' - } + default: "30%", + }, }, methods: { initCpuCharts() { this.$forceUpdate(); - } + }, }, - mounted(){ + mounted() { console.log(this.PollData); // console.log('PollData.RealTimeValidCount',this.PollData.RealTimeValidCount) - } -} + }, +}; </script> <style lang="scss"> .sysinfo-box { @@ -177,7 +189,7 @@ font-weight: 700; } } - ul{ + ul { padding-left: 0; } } diff --git a/src/pages/analysisPower/index/App.vue b/src/pages/analysisPower/index/App.vue index 18819bb..bbaf21f 100644 --- a/src/pages/analysisPower/index/App.vue +++ b/src/pages/analysisPower/index/App.vue @@ -40,7 +40,7 @@ @click="pollSeach" >鎼滅储</el-button > - <div class="tip"> + <div class="tip" v-if="isShowPolling === 'show'"> <span> 杞鏃堕棿 : <b>{{ PollData.Config.poll_period }}</b @@ -66,7 +66,7 @@ type="primary" style="float: right" @click="openDrawer" - v-if="showSetting" + v-if="showSetting && isShowPolling === 'show'" >璁剧疆</el-button > </div> @@ -152,7 +152,12 @@ <span v-else-if="scope.row.status === 0">{{ "瑙勫垯涓嶅叏" }}</span> </template> </el-table-column> - <el-table-column label="瀹炴椂/杞" align="center" width="100px"> + <el-table-column + label="瀹炴椂/杞" + align="center" + width="100px" + v-if="isShowPolling === 'show'" + > <template slot-scope="scope"> <span v-if="scope.row.run_type === -1">-</span> <toggle-button @@ -347,6 +352,7 @@ formData: {}, strethTable: false, buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [], + isShowPolling: sessionStorage.getItem("isShowPolling"), }; }, mounted() { diff --git a/src/pages/cameraAccess/components/SeparateRules.vue b/src/pages/cameraAccess/components/SeparateRules.vue index ca799d2..fe51cc4 100644 --- a/src/pages/cameraAccess/components/SeparateRules.vue +++ b/src/pages/cameraAccess/components/SeparateRules.vue @@ -16,7 +16,7 @@ </div> <div - v-if="Camera.analytics" + v-if="Camera.analytics && isShowPolling === 'show'" class="flex-box" v-show="cameraType === 'camera'" > @@ -300,6 +300,7 @@ }, data() { return { + isShowPolling: sessionStorage.getItem("isShowPolling"), mockSceneData: [], loading: false, Camera: new VideoRuleData(), diff --git a/src/pages/cameraAccess/components/SystemInfo.vue b/src/pages/cameraAccess/components/SystemInfo.vue index 1f604d8..0458385 100644 --- a/src/pages/cameraAccess/components/SystemInfo.vue +++ b/src/pages/cameraAccess/components/SystemInfo.vue @@ -2,21 +2,21 @@ <div :class="showClass"> <div class="card-box"> <ul> - <li style="max-width:30px;" v-if="ShowLocalVedio"> + <li style="max-width: 30px" v-if="ShowLocalVedio"> <div class="total-box"> - <div style="width:100%;margin-top:28px;"> + <div style="width: 100%; margin-top: 28px"> <div class="top-text"> - <em>{{"鎬荤畻鍔�"}}</em> + <em>{{ "鎬荤畻鍔�" }}</em> </div> <div class="mid-text"> - <em>{{` ${PollData.channelTotal}`}}</em> + <em>{{ ` ${PollData.channelTotal}` }}</em> </div> </div> </div> </li> - <li style="max-width:120px" v-if="showRealPoll"> + <li style="max-width: 120px" v-if="showRealPoll"> <DataStackCard - style="width:95%" + style="width: 95%" title="瀹炴椂绠楀姏" fourTip="鏁呴殰瀵艰嚧鏈鐞�" fourIcon="iconicon-test21" @@ -27,12 +27,15 @@ :NoDeal="`${PollData.RealTimeNoDeal}璺痐" /> </li> - <li style="max-width:120px" v-if="showRealPoll"> + <li + style="max-width: 120px" + v-if="showRealPoll && isShowPolling === 'show'" + > <DataStackCard title="杞绠楀姏" fourTip="绛夊緟杞澶勭悊" fourIcon="iconicon-test2" - style="width:95%" + style="width: 95%" :total="`${PollData.PollValidCount}璺痐" :ValidCount="`${PollData.PollSum}璺痐" :InValidCount="`${PollData.PollInvalid}璺痐" @@ -40,7 +43,10 @@ :NoDeal="`${PollData.PollNoDeal}璺痐" /> </li> - <li style="max-width:120px" v-if="ShowLocalVedio"> + <li + style="max-width: 120px" + v-if="ShowLocalVedio && isShowPolling === 'show'" + > <!-- <local-vedio-card title="鏈湴绠楀姏" style="width:95%" @@ -50,7 +56,7 @@ />--> <DataStackCard title="鏁版嵁鏍堢畻鍔�" - style="width:95%" + style="width: 95%" fourTip="鏈煡鍘熷洜瀵艰嚧鏈鐞�" fourIcon="iconicon-test5" :total="`${PollData.stackChannelCount}璺痐" @@ -75,18 +81,25 @@ </li> </ul> </div>--> - <div class="eCharts-box" :style="`width:${liquidWidth}`" v-if="PollData.barCharts.length>0"> - <eChartsBar ref="cpuMeneryCharts" :xAxisData="PollData.barCharts"></eChartsBar> + <div + class="eCharts-box" + :style="`width:${liquidWidth}`" + v-if="PollData.barCharts.length > 0" + > + <eChartsBar + ref="cpuMeneryCharts" + :xAxisData="PollData.barCharts" + ></eChartsBar> </div> </div> </template> <script> -import DataStackCard from "@/components/subComponents/DataStackCard" -import BoardCard from "@/components/subComponents/BoardCard" -import LocalVedioCard from "@/components/subComponents/LocalVedioCard" -import LiquidFillChart from "@/components/subComponents/chartLiquid" -import eChartsBar from '@/components/subComponents/eChartsBar' +import DataStackCard from "@/components/subComponents/DataStackCard"; +import BoardCard from "@/components/subComponents/BoardCard"; +import LocalVedioCard from "@/components/subComponents/LocalVedioCard"; +import LiquidFillChart from "@/components/subComponents/chartLiquid"; +import eChartsBar from "@/components/subComponents/eChartsBar"; export default { name: "SystemInfo", @@ -97,42 +110,50 @@ props: { showTask: { type: Boolean, - default: false + default: false, }, showClass: { type: String, - default: 'sysinfo-box flex-box' + default: "sysinfo-box flex-box", }, ShowLocalVedio: { type: Boolean, - default: false + default: false, }, showRealPoll: { type: Boolean, - default: true + default: true, }, marginTop: { type: String, - default: 'ma' + default: "ma", }, borderWidth: { type: String, - default: '70%' + default: "70%", }, liquidWidth: { type: String, - default: '30%' - } + default: "30%", + }, + }, + data() { + return { + isShowPolling: sessionStorage.getItem("isShowPolling"), + }; }, methods: { initCpuCharts() { this.$forceUpdate(); - } + }, }, mounted() { - console.log('PollData.RealTimeValidCount', this.PollData.RealTimeValidCount) - } -} + console.log( + "PollData.RealTimeValidCount", + this.PollData.RealTimeValidCount + ); + }, +}; </script> <style lang="scss"> .sysinfo-box { diff --git a/src/pages/cameraAccess/components/infoCard.vue b/src/pages/cameraAccess/components/infoCard.vue index 700efe4..87f1f07 100644 --- a/src/pages/cameraAccess/components/infoCard.vue +++ b/src/pages/cameraAccess/components/infoCard.vue @@ -1,75 +1,117 @@ <template> - <el-row class="infoCard"> - <el-col :span="8"> - <p> - <i class="iconfont iconshishichuli"></i><span class="fontClass">瀹炴椂绠楀姏</span> - </p> - <p><span style="color: #f49d37;font-family: 'PingFangSC-Regular';font-size:28px;font-weight: 600;">{{realtime}}</span></p> - </el-col> - <el-col style="width: 1px;height: 80%;margin-top: 10px;background: #DCDFE6"> - </el-col> - <el-col :span="8"> - <p> - <i class="iconfont iconrolling"></i><span class="fontClass">杞绠楀姏</span> - </p> - <p><span style="color: #f49d37;font-family: 'PingFangSC-Regular';font-size:28px;font-weight: 600;">{{polling}}</span></p> - </el-col> - <el-col style="width: 1px;height: 80%;margin-top: 10px;background: #DCDFE6"> - </el-col> - <el-col :span="7"> - <p> - <i class="iconfont iconshuju"></i><span class="fontClass">鏁版嵁鏍堢畻鍔�</span> - </p> - <p><span style="color: #f49d37;font-family: 'PingFangSC-Regular';font-size:28px;font-weight: 600;">{{dataStack}}</span></p> - </el-col> - </el-row> + <el-row class="infoCard"> + <el-col :span="8"> + <p> + <i class="iconfont iconshishichuli"></i + ><span class="fontClass">瀹炴椂绠楀姏</span> + </p> + <p> + <span + style=" + color: #f49d37; + font-family: 'PingFangSC-Regular'; + font-size: 28px; + font-weight: 600; + " + >{{ realtime }}</span + > + </p> + </el-col> + <el-col + style="width: 1px; height: 80%; margin-top: 10px; background: #dcdfe6" + > + </el-col> + <el-col :span="8" v-if="isShowPolling === 'show'"> + <p> + <i class="iconfont iconrolling"></i + ><span class="fontClass">杞绠楀姏</span> + </p> + <p> + <span + style=" + color: #f49d37; + font-family: 'PingFangSC-Regular'; + font-size: 28px; + font-weight: 600; + " + >{{ polling }}</span + > + </p> + </el-col> + <el-col + style="width: 1px; height: 80%; margin-top: 10px; background: #dcdfe6" + > + </el-col> + <el-col :span="7"> + <p> + <i class="iconfont iconshuju"></i + ><span class="fontClass">鏁版嵁鏍堢畻鍔�</span> + </p> + <p> + <span + style=" + color: #f49d37; + font-family: 'PingFangSC-Regular'; + font-size: 28px; + font-weight: 600; + " + >{{ dataStack }}</span + > + </p> + </el-col> + </el-row> </template> <script> export default { - props: { - realtime: { - type: Number, - default: 10 - }, - polling: { - type: Number, - default: 0 - }, - dataStack: { - type: Number, - default: 0 - }, - } -} + props: { + realtime: { + type: Number, + default: 10, + }, + polling: { + type: Number, + default: 0, + }, + dataStack: { + type: Number, + default: 0, + }, + }, + data() { + return { + isShowPolling: sessionStorage.getItem("isShowPolling"), + }; + }, +}; </script> <style lang="scss"> - .infoCard { - width: 100%; - height: 100px; - border: 1px solid #e2e2e2; - box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); - border-radius: 3px; - i { - float: left; - margin-left:10px; - font-size: 28px; - font-weight: 600; - color: #3d68e1; - } - p { - height: 45px; - line-height: 45px; - vertical-align: middle - } - .fontClass { - float: left; - margin-left: 10px; - font-family: "PingFangSC-Regular"; - text-align: left; - font-size: 14px; - color: #222222; - font-weight: 600; - } - } +.infoCard { + width: 100%; + height: 100px; + border: 1px solid #e2e2e2; + box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.1); + border-radius: 3px; + i { + float: left; + margin-left: 10px; + font-size: 28px; + font-weight: 600; + color: #3d68e1; + } + p { + height: 45px; + line-height: 45px; + vertical-align: middle; + } + .fontClass { + float: left; + margin-left: 10px; + font-family: "PingFangSC-Regular"; + text-align: left; + font-size: 14px; + color: #222222; + font-weight: 600; + } +} </style> \ No newline at end of file diff --git a/src/pages/desktop/index/App.vue b/src/pages/desktop/index/App.vue index ee89dc5..023e7ee 100644 --- a/src/pages/desktop/index/App.vue +++ b/src/pages/desktop/index/App.vue @@ -18,6 +18,7 @@ import { getServerName } from "./api.ts"; import { getApps } from "@/api/app"; +import { getDevInfo } from "@/api/login"; import config from "../../../../package.json"; @@ -51,11 +52,12 @@ if (JSON.parse(sessionStorage.getItem("userInfo"))) { return JSON.parse(sessionStorage.getItem("userInfo")).backgroundpic; } - return "" + return ""; }, }, created() { this.getServerName(); + this.getDevInfo(); }, mounted() { document.getElementById("app").style.backgroundImage = `url(${ @@ -217,6 +219,12 @@ sessionStorage.setItem("title", res.data.serverName); } }, + async getDevInfo() { + const res = await getDevInfo(); + if (res && res.success && res.data.deviceType.substr(0, 2) === "DS") { + sessionStorage.setItem("isShowPolling", "show"); + } + }, }, }; </script> diff --git a/vue.config.js b/vue.config.js index 0a103df..103c24f 100644 --- a/vue.config.js +++ b/vue.config.js @@ -67,8 +67,8 @@ // } }); -//const serverUrl = "http://192.168.20.189:7009"; -const serverUrl = "http://192.168.20.116:7009"; +const serverUrl = "http://192.168.20.189:7009"; +//const serverUrl = "http://192.168.20.116:7009"; const iotdataServerUrl = "http://192.168.8.10:9000"; // const cir = require("circular-dependency-plugin"); -- Gitblit v1.8.0