From 98a44e94ecc76abd72b9817648ca4b91469b936a Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期六, 08 八月 2020 16:04:16 +0800 Subject: [PATCH] 添加退出登录,布局调整 --- src/pages/gb28181/index/App.vue | 207 +++++++++++++++++++++-------- src/pages/datapush/index/RightEvent.vue | 2 src/pages/datapush/index/main.ts | 2 public/index.html | 3 src/pages/search/index/Searching.vue | 2 src/pages/desktop/index/components/DFrame.vue | 7 src/pages/desktop/index/mock/userData.json | 18 +- src/pages/cameraAccess/components/DataStackInfo.vue | 6 src/pages/ai/index/App.vue | 31 ++-- src/pages/library/index/App.vue | 1 src/pages/settings/components/BasicSetting.vue | 42 ----- src/pages/desktop/index/components/Tools.vue | 45 ++++++ src/pages/datapush/index/LeftList.vue | 3 src/pages/desktop/index/components/NoticeTip.vue | 2 src/pages/search/index/App.vue | 1 15 files changed, 242 insertions(+), 130 deletions(-) diff --git a/public/index.html b/public/index.html index bf5b551..0caaffd 100644 --- a/public/index.html +++ b/public/index.html @@ -316,6 +316,9 @@ .pl20 { padding-left: 20px; } + /* .flex-box{ + display: flex; + } */ .el-button--primary { color: #FFFFFF; background-color: #3D68E1!important; diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue index b4293e5..c01d1f3 100644 --- a/src/pages/ai/index/App.vue +++ b/src/pages/ai/index/App.vue @@ -21,16 +21,8 @@ > <el-tab-pane label="宸插畨瑁�" name="myAlgorithm"> <div class="width-new-line task-list" v-show="activeName === 'myAlgorithm'"> + <p class="src-title">绠楁硶杞欢</p> <div class="flex-list"> - <!-- <draggable - :list="installedList" - :group="{ name: 'article', pull: 'clone', put: false }" - :sort="false" - @start="startRight" - @end="endLeft" - style="display:inline" - >--> - <div class="wrap-box" v-for="item in ungradeList" :key="item.id"> <div class="list-choose-item-left"> <div class="mask"> @@ -119,7 +111,7 @@ </div> </div> </div> - <!-- 鏈笅杞� --> + <p class="src-title">搴旂敤杞欢</p> </div> </el-tab-pane> @@ -134,7 +126,7 @@ single tip tipWords="涓婁紶绠楁硶" - uploadPlaceholder="绂荤嚎瀹夎绠楁硶" + uploadPlaceholder="涓婁紶瀹夎杞欢" url="/data/api-v/sdk/upload" @complete="onFileUpload" @file-added="onFileAdded" @@ -144,7 +136,7 @@ </el-tab-pane> <el-tab-pane label="搴旂敤涓績" name="algorithmMall" v-show="activeName==='algorithmMall'"> <div class="tab-content"> - <p>绠楁硶杞欢</p> + <p class="src-title">绠楁硶杞欢</p> <div class="store-list"> <div class="wrap-box"> <div class="inner"> @@ -162,7 +154,7 @@ </div> </div> </div> - <p>搴旂敤杞欢</p> + <p class="src-title">搴旂敤杞欢</p> <div class="app-list"></div> </div> <el-drawer title="涓嬭浇" :visible.sync="actDrawerShow" :direction="direction"> @@ -1116,6 +1108,7 @@ height: 100%; box-sizing: border-box; text-align: left; + min-width: 1106px; // background-color: #f2f6fc; .s-video-manage-breadcrumb { height: 5%; @@ -1166,6 +1159,15 @@ text-align: center; color: #666; } +} +.src-title{ + color: #333; + font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC'; + font-weight: 650; + font-style: normal; + height: 36px; + font-size: 15px; + padding-left: 25px; } .task-manage { height: 100%; @@ -1249,8 +1251,9 @@ } .task-list { background: #fff; - padding: 30px 20px 20px; + padding: 20px; box-sizing: border-box; + .flex-list { display: flex; flex-direction: row; diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue index d37e430..284031c 100644 --- a/src/pages/cameraAccess/components/DataStackInfo.vue +++ b/src/pages/cameraAccess/components/DataStackInfo.vue @@ -118,7 +118,7 @@ v-show="activeName === 'uploaded' " :data="fileList" tooltip-effect="dark" - style="width: 99%" + border :header-cell-style="{background:'#f8f8f8', color:'#222222', textAlign:'center'}" @select="handleSelect" @@ -707,7 +707,8 @@ .data-stack-info { width: 100%; height: 100%; - margin-left: 20px; + padding: 20px; + box-sizing: border-box; overflow: auto; .ai-select { text-align: left; @@ -767,7 +768,6 @@ .btn-right { float: right; margin-top: -5px; - margin-right: 10px; .btn { cursor: pointer; font-size: 20px; diff --git a/src/pages/datapush/index/LeftList.vue b/src/pages/datapush/index/LeftList.vue index 0f8bfe8..ddbb75b 100644 --- a/src/pages/datapush/index/LeftList.vue +++ b/src/pages/datapush/index/LeftList.vue @@ -183,15 +183,16 @@ left: 0px; width: 355px; height: 100%; + margin-top: 20px; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; } .out-div { width: 350px; - text-align: left; padding-top: 20px; + //height: 50em; .left-list { position: absolute; left: 15px; diff --git a/src/pages/datapush/index/RightEvent.vue b/src/pages/datapush/index/RightEvent.vue index cc4c6f0..79b19d5 100644 --- a/src/pages/datapush/index/RightEvent.vue +++ b/src/pages/datapush/index/RightEvent.vue @@ -199,7 +199,7 @@ <div class="div-border">{{eventData.eventTxt}}</div> </div> <div class="save-btn"> - <el-button type="info" size="small" @click="onCancle">鍙栨秷</el-button> + <el-button type="info" size="small" @click="onCancle" style="color:#222">鍙栨秷</el-button> <el-button type="primary" @click="eventPushsSave" size="small">淇濆瓨</el-button> </div> </div> diff --git a/src/pages/datapush/index/main.ts b/src/pages/datapush/index/main.ts index fa491c4..29f47b3 100644 --- a/src/pages/datapush/index/main.ts +++ b/src/pages/datapush/index/main.ts @@ -2,7 +2,7 @@ import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; import "@/assets/css/element-variables.scss"; - +import "../../../assets/css/common.scss" import App from './App.vue' import moment from "moment"; Vue.prototype.$moment = moment; diff --git a/src/pages/desktop/index/components/DFrame.vue b/src/pages/desktop/index/components/DFrame.vue index 92b7284..28280ff 100644 --- a/src/pages/desktop/index/components/DFrame.vue +++ b/src/pages/desktop/index/components/DFrame.vue @@ -80,8 +80,11 @@ } e = e || window.event; e.preventDefault(); - this.width = this.resizeObj.startW + e.clientX - this.resizeObj.mouX; - this.height = this.resizeObj.startH + e.clientY - this.resizeObj.mouY; + let curWidth = this.resizeObj.startW + e.clientX - this.resizeObj.mouX; + let curHeight = this.resizeObj.startH + e.clientY - this.resizeObj.mouY; + + this.width = curWidth; + this.height = curHeight; }.bind(this) }, mouseup() { diff --git a/src/pages/desktop/index/components/NoticeTip.vue b/src/pages/desktop/index/components/NoticeTip.vue index c000f28..5c6b2ff 100644 --- a/src/pages/desktop/index/components/NoticeTip.vue +++ b/src/pages/desktop/index/components/NoticeTip.vue @@ -70,6 +70,8 @@ display: inline-block; padding: 8px; width: 170px; + font-size: 14px; + line-height: 22px; } .notice-tip-content-title { diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue index 8bcadc0..2cda1d5 100644 --- a/src/pages/desktop/index/components/Tools.vue +++ b/src/pages/desktop/index/components/Tools.vue @@ -31,14 +31,25 @@ <img :src="`${publicPath}images/desktop/header-icon/notice.png`" alt /> </div> <div class="tools-icon"> - <img :src="`${publicPath}images/desktop/header-icon/user.png`" alt /> + <el-dropdown size="small" placement="bottom"> + <span class="el-dropdown-link"> + <img :src="`${publicPath}images/desktop/header-icon/user.png`" alt /> + <!-- <i class="el-icon-arrow-down el-icon--right"></i> --> + </span> + <el-dropdown-menu slot="dropdown" style='top: 44px;'> + <el-dropdown-item @click.native='toLogout'> + 閫�鍑虹櫥褰� + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> + </div> </div> </div> </template> <script> - +import {logout} from "@/api/login"; export default { name: "Tools", data() { @@ -127,6 +138,33 @@ debugger this.$store.commit("desktop/refreshFrame", dock); } + }, + toLogout(){ + this.$confirm("鎻愮ず锛氱‘瀹氶��鍑哄悧锛�", { + center: true, + cancelButtonClass: "comfirm-class-cancle", + confirmButtonClass: "comfirm-class-sure" + }).then(_ => { + logout().then(res => { + if (res === "閫�鍑烘垚鍔�") { + sessionStorage.removeItem("userInfo"); + location.assign('/view/index'); + this.$notify({ + title: "鎻愮ず", + type: "success", + message: "閫�鍑烘垚鍔燂紒" + }); + } else { + this.$notify({ + title: "鎻愮ず", + type: "success", + message: "閫�鍑哄け璐�!" + }); + } + }); + }).catch(_ => { + console.log("閫�鍑哄け璐�"); + }); } } }; @@ -225,4 +263,7 @@ height: 100%; margin-right: 14px; } +.el-dropdown-menu{ + top: 40px !important; +} </style> \ No newline at end of file diff --git a/src/pages/desktop/index/mock/userData.json b/src/pages/desktop/index/mock/userData.json index 679f2f4..0f11644 100644 --- a/src/pages/desktop/index/mock/userData.json +++ b/src/pages/desktop/index/mock/userData.json @@ -12,7 +12,7 @@ "url": "/view/gb28181", "title": "GB28181閰嶇疆", "width": 600, - "height": 500 + "height": 700 }, { "id": "12", @@ -22,8 +22,8 @@ "type": "2", "url": "/view/cameraVideo", "title": "瀹炴椂鐩戞帶", - "width": 1528, - "height": 915 + "width": 1465, + "height": 763 }, { "id": "9", @@ -33,8 +33,8 @@ "type": "2", "url": "/view/ai", "title": "搴旂敤涓績", - "width": 1528, - "height": 915 + "width": 1243, + "height": 766 }, { "id": "1", @@ -65,7 +65,9 @@ "alt": "data-push", "type": "2", "url": "/view/datapush", - "title": "鏁版嵁鎺ㄩ��" + "title": "鏁版嵁鎺ㄩ��", + "width": 1024, + "height": 512 }, { "id": "7", @@ -76,7 +78,7 @@ "url": "/view/library", "title": "姣斿搴撶鐞�", "width": 1542, - "height": 800 + "height": 750 }, { "id": "11", @@ -97,7 +99,7 @@ "type": "2", "url": "/view/search", "title": "缁熻鏌ヨ", - "width": 1445, + "width": 1410, "height": 675 }, { diff --git a/src/pages/gb28181/index/App.vue b/src/pages/gb28181/index/App.vue index 10e2b47..3b6935b 100644 --- a/src/pages/gb28181/index/App.vue +++ b/src/pages/gb28181/index/App.vue @@ -16,12 +16,18 @@ </template> <el-menu-item-group class="item-group"> <!-- GB28181璁剧疆 --> - <el-form :model="gb28181" :rules="rules" label-width="130px" class="alarmSetting" ref="gb28181"> + <el-form + :model="gb28181" + :rules="rules" + label-width="130px" + class="alarmSetting" + ref="gb28181" + > <!-- <el-form-item label="鍥介檯鏈嶅姟鍣↖P" prop="ServerIp"> <ip-input :ip="gb28181.ServerIp" @on-blur="gb28181.ServerIp = arguments[0]"></ip-input> </el-form-item>--> - <div style="text-align: left;margin-bottom: 22px;"> + <div style="text-align: left;margin-bottom: 16px;"> <el-radio-group v-model="gb28181.idType"> <el-radio :label="0">杈撳叆宸叉湁ID</el-radio> <el-radio :label="1">鐢熸垚鏂扮殑ID</el-radio> @@ -76,7 +82,8 @@ style="position: absolute" v-show="gb28181.idType === 1" @click="newGBID" - >鐢熸垚ID</el-button> + >鐢熸垚ID</el-button + > </el-form-item> <!-- <el-form-item label="鍥介檯鏈嶅姟鍣ㄧ鍙�" prop="GbServerPort"> @@ -84,11 +91,19 @@ </el-form-item>--> <el-form-item label="鍥芥爣ID"> - <el-input v-model="gb28181.PublicId" placeholder="璇疯緭鍏�" size="small"></el-input> + <el-input + v-model="gb28181.PublicId" + placeholder="璇疯緭鍏�" + size="small" + ></el-input> </el-form-item> <el-form-item label="鍥芥爣绔彛" prop="ServerPort"> - <el-input v-model.number="gb28181.GbServerPort" placeholder="璇疯緭鍏�" size="small"></el-input> + <el-input + v-model.number="gb28181.GbServerPort" + placeholder="璇疯緭鍏�" + size="small" + ></el-input> </el-form-item> <el-form-item label="寮�鍚壌鏉�"> @@ -96,13 +111,80 @@ </el-form-item> <el-form-item label="閴存潈瀵嗙爜" v-show="gb28181.IsAuth"> - <el-input v-model="gb28181.Password" placeholder="璇疯緭鍏�" size="small"></el-input> + <el-input + v-model="gb28181.Password" + placeholder="璇疯緭鍏�" + size="small" + ></el-input> </el-form-item> - <el-form-item > - <el-button type="primary" @click="submitGB28281" size="small">淇濆瓨</el-button> + <el-form-item> + <el-button type="primary" @click="submitGB28281" size="small" + >淇濆瓨</el-button + > </el-form-item> </el-form> + </el-menu-item-group> + </el-submenu> + <el-submenu index="1"> + <template slot="title"> + <b class="tree-font">鎺ュ叆骞冲彴鍒楄〃</b> + </template> + <el-menu-item-group class="item-group"> + <div> + <el-table + :data="tableList" + border + fit + highlight-current-row + style="width: 100%; color:#000" + :header-cell-style="{ background: '#f8f8f8', color: '#222222', height:'30px' }" + > + <el-table-column + type="index" + label="搴忓彿" + align="center" + width="50" + ></el-table-column> + <el-table-column + prop="name" + label="鍚嶇О" + align="center" + ></el-table-column> + <el-table-column + prop="id" + label="ID" + align="center" + ></el-table-column> + <el-table-column + prop="ip" + label="IP" + align="center" + ></el-table-column> + <el-table-column + prop="status" + label="鐘舵��" + align="center" + ></el-table-column> + <el-table-column + prop="mark" + label="澶囨敞" + align="center" + ></el-table-column> + </el-table> + </div> + </el-menu-item-group> + </el-submenu> + <el-submenu index="2"> + <template slot="title"> + <b class="tree-font">鍥介檯鎽勫儚鏈�</b> + </template> + <el-menu-item-group class="item-group"> + <div> + <div> + <el-button type="primary" size="small">鍒锋柊</el-button> + </div> + </div> </el-menu-item-group> </el-submenu> </el-menu> @@ -115,57 +197,57 @@ saveGB28181Config, getGb28181AreaList, newGb28181ID -} from "./api"; +} from './api' -import { isPort, isIPv4 } from "@/scripts/validate"; +import { isPort, isIPv4 } from '@/scripts/validate' export default { - name: "Gb28181Setting", + name: 'Gb28181Setting', directives: { focus: { - inserted: function (el) { + inserted: function(el) { el.querySelector('input').focus() } } }, data() { return { - gb28181: { - - }, + openeds: ['0'], + gb28181: {}, + tableList: [], idType: 1, rules: { ip: [ { required: true, - message: "璇疯緭鍏P鍦板潃", - trigger: "change" + message: '璇疯緭鍏P鍦板潃', + trigger: 'change' }, - { validator: isIPv4, trigger: "change" } + { validator: isIPv4, trigger: 'change' } ], ServerIp: [ { required: true, - message: "璇疯緭鍏P鍦板潃", - trigger: "change" + message: '璇疯緭鍏P鍦板潃', + trigger: 'change' }, - { validator: isIPv4, trigger: "change" } + { validator: isIPv4, trigger: 'change' } ], ServerPort: [ { required: true, - message: "璇疯緭鍏ョ鍙�", - trigger: "change" + message: '璇疯緭鍏ョ鍙�', + trigger: 'change' }, - { validator: isPort, trigger: "change" } + { validator: isPort, trigger: 'change' } ], GbServerPort: [ { required: true, - message: "璇疯緭鍏ョ鍙�", - trigger: "change" + message: '璇疯緭鍏ョ鍙�', + trigger: 'change' }, - { validator: isPort, trigger: "change" } + { validator: isPort, trigger: 'change' } ] }, locationCity: { @@ -175,92 +257,100 @@ provinceOptions: [], cityOptions: [], countyOptions: [] - }, - }; + } + } }, mounted() { //this.$nextTick(()=>{ - this.initGB28181Conf(); + this.initGB28181Conf() //}) }, methods: { initGB28181Conf() { getGB28181Config().then(rsp => { if (rsp && rsp.success) { - this.gb28181 = rsp.data; + this.gb28181 = rsp.data //this.gb28181.idType = 0; - this.$set(this.gb28181,'idType',0); + this.$set(this.gb28181, 'idType', 0) } - }); + }) getGb28181AreaList().then(rsp => { if (rsp && rsp.success) { - this.locationCity.provinceOptions = rsp.data; + this.locationCity.provinceOptions = rsp.data } }) }, submitGB28281() { - this.$refs["gb28181"].validate(valid => { + this.$refs['gb28181'].validate(valid => { if (valid) { saveGB28181Config(this.gb28181).then(rsp => { if (rsp && rsp.success) { this.$notify({ - type: "success", - message: "GB28181璁剧疆淇濆瓨鎴愬姛" - }); + type: 'success', + message: 'GB28181璁剧疆淇濆瓨鎴愬姛' + }) } - }); + }) } else { - console.log("error submit!!"); - return false; + console.log('error submit!!') + return false } - }); + }) }, changeProvince() { - let pid = this.locationCity.province; + let pid = this.locationCity.province getGb28181AreaList({ parentId: pid }).then(rsp => { if (rsp && rsp.success) { - this.locationCity.cityOptions = rsp.data; - this.locationCity.city = this.locationCity.cityOptions[0].id; - this.changeCity(); + this.locationCity.cityOptions = rsp.data + this.locationCity.city = this.locationCity.cityOptions[0].id + this.changeCity() } }) }, changeCity() { - let pid = this.locationCity.city; + let pid = this.locationCity.city getGb28181AreaList({ parentId: pid }).then(rsp => { if (rsp && rsp.success) { - this.locationCity.countyOptions = rsp.data; - this.locationCity.county = this.locationCity.countyOptions[0].id; + this.locationCity.countyOptions = rsp.data + this.locationCity.county = this.locationCity.countyOptions[0].id } }) }, newGBID() { - let cCode = this.locationCity.county + ""; + let cCode = this.locationCity.county + '' newGb28181ID({ code: cCode }).then(rsp => { if (rsp && rsp.success) { - this.gb28181.PublicId = rsp.data; + this.gb28181.PublicId = rsp.data } }) + }, + menuOpen(){ + } } -}; +} </script> <style lang="scss"> .s-basic-setting { height: 100%; - padding: 30px; + padding: 20px; box-sizing: border-box; + .item-group { + padding: 0 15px; + margin-bottom: 15px; + } .el-form { .el-form-item { text-align: left; - &:last-of-type{ + margin-bottom: 16px; + &:last-of-type { width: 490px; } .el-button { float: right; } - .el-select{ - margin-right:10px; + .el-select { + margin-right: 10px; } .el-form-item__content { text-align: left; @@ -279,8 +369,11 @@ .el-form-item__label { text-align: left; } + &.el-form-item.is-required:not(.is-no-asterisk) + > .el-form-item__label:before { + margin-left: -9px; + } } - } .alarmSetting { .el-input { diff --git a/src/pages/library/index/App.vue b/src/pages/library/index/App.vue index 5623643..3bb206e 100644 --- a/src/pages/library/index/App.vue +++ b/src/pages/library/index/App.vue @@ -125,6 +125,7 @@ .s-base-manage { box-sizing: border-box; background-color: #e9ebf2; + min-width: 1315px; } .base-overflow { overflow: visible !important; diff --git a/src/pages/search/index/App.vue b/src/pages/search/index/App.vue index c90ccd5..13ae06d 100644 --- a/src/pages/search/index/App.vue +++ b/src/pages/search/index/App.vue @@ -67,6 +67,7 @@ <style lang="scss" scoped> .column { overflow: hidden; + min-width: 1402px; } .column-left { height: 100vh; diff --git a/src/pages/search/index/Searching.vue b/src/pages/search/index/Searching.vue index 62a02b7..abb77ac 100644 --- a/src/pages/search/index/Searching.vue +++ b/src/pages/search/index/Searching.vue @@ -94,7 +94,7 @@ ></el-option> </el-select> </p> - <p class="p-date" style="width:19%"> + <p class="p-date" style="width:19%;vertical-align: top;"> <el-date-picker size="mini" v-model="searchTime" diff --git a/src/pages/settings/components/BasicSetting.vue b/src/pages/settings/components/BasicSetting.vue index 3bab7ee..a862654 100644 --- a/src/pages/settings/components/BasicSetting.vue +++ b/src/pages/settings/components/BasicSetting.vue @@ -256,7 +256,7 @@ <el-tab-pane label="闆嗙兢绠$悊" name="third"> <cluster-management></cluster-management> </el-tab-pane> - <el-tab-pane label="澶栭儴缃戠粶" name="fourth"> + <el-tab-pane label="澶栭儴璁块棶" name="fourth"> <el-menu :default-openeds="openeds" background-color="#fff" @@ -294,22 +294,7 @@ </el-form> </el-menu-item-group> </el-submenu> - <el-submenu index="1"> - <template slot="title"> - <b class="tree-font">澶栭儴璁块棶鍒楄〃</b> - </template> - <el-menu-item-group class="item-group"> - <div> - <el-table :data="ipServer.fileTable" border fit style="width: 100%"> - <el-table-column type="index" label="搴忓彿" align="center" width="50"></el-table-column> - <el-table-column prop="date" label="鍚嶇О" align="center"></el-table-column> - <el-table-column prop="name" label="ID" align="center"></el-table-column> - <el-table-column prop="name" label="IP" align="center"></el-table-column> - <el-table-column prop="name" label="鍦ㄧ嚎鐘舵��" align="center"></el-table-column> - </el-table> - </div> - </el-menu-item-group> - </el-submenu> + </el-menu> </el-tab-pane> <el-tab-pane label="鏉冮檺绠$悊" name="user"> @@ -461,29 +446,6 @@ ip: "", localhost: "", localFilePort: "", - fileTable: [ - { - date: '2016-05-02', - name: '鐜嬪皬铏�', - address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�', - edit: false - }, { - date: '2016-05-04', - name: '鐜嬪皬铏�', - address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�', - edit: false - }, { - date: '2016-05-01', - name: '鐜嬪皬铏�', - address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�', - edit: false - }, { - date: '2016-05-03', - name: '鐜嬪皬铏�', - address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�', - edit: false - } - ] }, locationCity: { province: '', -- Gitblit v1.8.0