能源style

accessControlSystem/src/assets/css/main.scss

@@ -664,7 +664,7 @@ div.box-40 {
 }
 .content {
     .content-right {
-        width: calc(100% - 280px);
+        width: calc(100% - #{rem(280)});
         float: right;
     }
 }

energyManagement/src/components/common/Header.vue

@@ -282,15 +282,15 @@ export default {
 };
 </script>
 <style lang='scss' scoped>
+@import '@assets/css/public-style.scss';
 .border {
     width: 1px;
-    height: 10px;
-    background: #ffffff;
-    opacity: 0.3;
+    height: rem(10);
+    background: #ffffffa5;
 }
 .header {
-    height: 46px;
-    font-size: 14px;
+    height: rem(46);
+    font-size: rem(14);
     color: #fff;
     background: #2c354a;
     display: flex;
@@ -299,8 +299,8 @@ export default {
     &.expand::before {
         content: '';
         display: inline-block;
-        width: 230px;
-        height: 46px;
+        width: rem(220);
+        height: rem(46);
         background: #2c354a;
         position: absolute;
         left: 0;
@@ -308,18 +308,18 @@ export default {
     &.collapse::before {
         content: '';
         display: inline-block;
-        width: 95px;
-        height: 46px;
+        width: rem(85);
+        height: rem(46);
         background: #2c354a;
         position: absolute;
         left: 0;
     }
 }
 .header-right {
-    padding-right: 20px;
+    padding-right: rem(20);
     color: rgba(255, 255, 255, 0.6);
     .name-txt {
-        font-size: 12px;
+        font-size: rem(12);
         font-family: PingFangSC-Regular, PingFang SC;
         font-weight: 400;
         color: #ffffff;
@@ -327,60 +327,60 @@ export default {
 }
 .header-user-con {
     display: flex;
-    height: 60px;
     align-items: center;
 }
 .logout {
-    margin-left: 20px;
-    img {
-        width: 20px;
-        height: 20px;
+    margin-left: rem(20);
+    i {
+        color: white;
+        font-size: rem(20);
     }
 }
 .iconfont {
-    font-size: 20px;
+    font-size: rem(20);
     color: rgba(255, 255, 255, 0.6);
     &:hover {
         color: rgba(255, 255, 255, 1);
     }
 }
 .user-avator {
-    margin-left: 10px;
-    margin-right: 20px;
+    margin-left: rem(10);
+    margin-right: rem(20);
 }
 .user-avator img {
     display: block;
-    width: 20px;
-    height: 20px;
+    width: rem(20);
+    height: rem(20);
     cursor: pointer;
 }
 .message {
-    margin: 10px 20px 0px 0px;
+    margin-right: rem(20);
     color: #000000;
     cursor: pointer;
     &:hover {
         .msg-content {
             display: block;
             background: #ffffff;
-            box-shadow: 0px 5px 20px 0px rgba(144, 144, 144, 0.4);
-            border-radius: 6px;
+            box-shadow: 0px rem(5) rem(20) 0px rgba(144, 144, 144, 0.4);
+            border-radius: rem(6);
             z-index: 200;
         }
     }
     .main {
-        height: 60px;
-        line-height: 60px;
+        height: rem(46);
+        line-height: rem(46);
         position: relative;
         img {
-            width: 20px;
-            height: 20px;
+            width: rem(20);
+            height: rem(20);
+            vertical-align: text-bottom;
         }
         .point {
             position: absolute;
-            top: -4px;
+            top: rem(-4);
             right: -1px;
-            width: 4px;
-            height: 4px;
+            width: rem(4);
+            height: rem(4);
             background: #fe7271;
             border-radius: 50%;
             display: block;
@@ -389,35 +389,35 @@ export default {
 
     .msg-content {
         position: absolute;
-        width: 380px;
+        width: rem(380);
         background: #ffffff;
         z-index: 20;
-        right: 20px;
-        top: 40px;
+        right: rem(20);
+        top: rem(40);
         transition: all 0.3s;
         display: none;
         p {
-            height: 40px;
-            line-height: 40px;
-            padding-left: 20px;
+            height: rem(40);
+            line-height: rem(40);
+            padding-left: rem(20);
             color: #212226;
         }
         li {
             display: flex;
             align-items: center;
-            height: 60px;
-            padding-left: 20px;
+            height: rem(60);
+            padding-left: rem(20);
             border-top: 1px solid #f6f6f6;
-            font-size: 12px;
+            font-size: rem(12);
             cursor: auto;
             span {
-                width: 300px;
+                width: rem(300);
                 overflow: hidden; //超出的文本隐藏
                 text-overflow: ellipsis; //溢出用省略号显示
                 white-space: nowrap; //溢出不换行
                 display: block;
-                line-height: 20px;
-                padding-left: 15px;
+                line-height: rem(20);
+                padding-left: 1rem (5);
             }
             .cont {
                 color: #424656;

energyManagement/src/components/common/Tags.vue

@@ -2,14 +2,11 @@
     <div class="tags" v-if="showTags">
         <ul>
             <li class="tags-li" v-for="(item, index) in tagsList" :class="{ active: isActive(item.path) }" :key="index">
-                <router-link :to="item.path" class="tags-li-title">
-                    {{ item.title }}
-                </router-link>
+                <router-link :to="{ path: item.path, query: { closeDialog: true } }" class="tags-li-title"> {{ item.title }} </router-link>
                 <span class="tags-li-icon" @click="closeTags(index)"></span>
             </li>
             <li class="tags-li close" v-if="tagsList.length > 1">
-                <div class="allclose" @click="closeOther"><span>全部关闭</span></div>
-                <!-- <span class="allclosed"></span> -->
+                <span class="allclose" @click="closeOther">全部关闭</span>
             </li>
         </ul>
     </div>
@@ -23,6 +20,7 @@ export default {
         };
     },
     methods: {
+        // 点击标签页
         isActive(path) {
             if (path instanceof Object) {
                 let fullpath = this.setFullPath(path);
@@ -77,8 +75,26 @@ export default {
         },
         // 设置标签
         setTags(route) {
-            const isExist = this.tagsList.some((item) => {
-                return item.path.indexOf(route.path) > -1;
+            let tagArr = {
+                title: route.title || route.meta.title,
+                path: route.fullPath
+            };
+            if (!!route.name) {
+                tagArr = {
+                    title: route.title || route.meta.title,
+                    path: route.fullPath,
+                    name: route.name
+                };
+            }
+
+            const isExist = this.tagsList.some((item, index) => {
+                let thisBi = item.path.indexOf(route.path) > -1;
+                if (thisBi) {
+                    this.tagsList.splice(index, 1, tagArr);
+
+                    this.$store.dispatch('tags', this.tagsList);
+                }
+                return thisBi;
             });
             if (!isExist) {
                 if (route.path === '/') {
@@ -87,18 +103,6 @@ export default {
                 if (this.tagsList.length >= 8) {
                     this.tagsList.shift();
                 }
-                let tagArr = {
-                    title: route.title || route.meta.title,
-                    path: route.fullPath
-                };
-                if (!!route.name) {
-                    tagArr = {
-                        title: route.title || route.meta.title,
-                        path: route.fullPath,
-                        name: route.name
-                    };
-                }
-
                 this.tagsList.push(tagArr);
                 this.$store.dispatch('tags', this.tagsList);
             }
@@ -124,11 +128,6 @@ export default {
 </script>
 <style lang="scss" scoped>
 @import '@assets/css/public-style.scss';
-.tags {
-    height: 60px;
-    line-height: 60px;
-}
-
 .tags ul {
     box-sizing: border-box;
     width: 100%;
@@ -138,20 +137,17 @@ export default {
 
 .tags-li {
     float: left;
-    font-size: 12px;
+    font-size: rem(12);
     cursor: pointer;
-    height: 14px;
-    line-height: 14px;
     border-right: 1px solid #a6abb6;
-    padding: 0 20px 0 20px;
-    margin: 25px 0;
+    padding: 0 rem(20) 0 rem(20);
     vertical-align: middle;
     -webkit-transition: all 0.3s ease-in;
     -moz-transition: all 0.3s ease-in;
     transition: all 0.3s ease-in;
 }
 .close {
-    padding: 0 20px 0 20px;
+    padding: 0 rem(20) 0 rem(20);
     -webkit-transition: all 0.3s ease-in;
     -moz-transition: all 0.3s ease-in;
     transition: all 0.3s ease-in;
@@ -159,18 +155,18 @@ export default {
     position: relative;
 }
 .tags-li-icon {
-    width: 14px;
-    height: 14px;
+    width: rem(14);
+    height: rem(14);
+    min-width: 14px;
+    min-height: 14px;
     display: inline-block;
     border-radius: 50%;
     background: url('../../assets/img/closed.png') no-repeat center center;
-    vertical-align: text-top;
+    vertical-align: bottom;
 }
 .active .tags-li-icon {
-    width: 12px;
-    height: 12px;
-    display: inline-block;
     background: url('../../assets/img/close.png') no-repeat center center;
+    vertical-align: bottom;
 }
 
 .tags-li.active {
@@ -178,11 +174,12 @@ export default {
 }
 
 .tags-li-title {
-    max-width: 80px;
+    max-width: rem(80);
+    font-size: rem(12);
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
-    margin-right: 5px;
+    margin-right: rem(10);
     color: #a6abb6;
 }
 
@@ -196,30 +193,29 @@ export default {
 .allclose {
     display: inline-block;
     position: absolute;
-    top: -3px;
+    top: 0;
     width: max-content;
-    height: 18px;
-    padding-top: 3px;
+    height: rem(18);
+    min-height: 18px;
+    line-height: inherit;
+    padding: 0 rem(7);
     background: $mainTextColor;
-    border-radius: 9px;
-    /* background:url("../../assets/img/allClose.png") no-repeat center center; */
+    border-radius: rem(10);
     vertical-align: middle;
-    font-size: 10px;
     font-family: PingFangSC-Regular, PingFang SC;
     font-weight: 400;
     color: #ffffff;
-    line-height: 14px;
     text-align: center;
 }
 .allclose span {
-    padding: 0px 10px;
+    padding: 0px rem(10);
 }
 .allclosed {
-    width: 14px;
-    height: 14px;
+    width: rem(14);
+    height: rem(14);
     display: inline-block;
     background: url('../../assets/img/allClosed.png') no-repeat center center;
     vertical-align: middle;
-    margin-left: 10px;
+    margin-left: rem(10);
 }
 </style>

energyManagement/src/main.js

@@ -1,11 +1,3 @@
-/*
- * @Author: zouwenying
- * @Date: 2020-10-21 18:14:35
- * @LastEditTime: 2020-11-18 16:28:23
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: \vue-manage-system-master\src\main.js
- */
 import Vue from 'vue';
 import App from './App.vue';
 import router from './router';
@@ -79,31 +71,8 @@ Vue.prototype.routerLoad = {
             }
         });
     },
-    // 获取菜单
-    // loadMenus() {
-    //     http.get('/sc-user-center/user/findUserMenu', { appId: '1003' }).then(({ status, data, msg }) => {
-    //         if (0 === status) {
-    //             store.commit('setMenuList', data[0].children)
-    //         }
-    //     });
-    // }
 };
-// router.beforeEach((to, from, next) => {
-//     document.title = store.getters['getThisDetai'].name || !!window.sessionStorage.getItem('setThisDetai') ? JSON.parse(window.sessionStorage.getItem('setThisDetai')).name : ''
-//     if (to.path !== '/404') {
-//         // console.log()
-//         let PermissionsRouter = Vue.prototype.routerLoad.findMen(store.getters.getMenuList, to.fullPath)
-//         if (PermissionsRouter) {
-//             next();
-//         } else {
-//             next({ path: 404 })
-//         }
-//         // 跳转时存储路由
-//         localStorage.setItem('path', to.fullPath)
-//     } else {
-//         next();
-//     }
-// });
+
 router.beforeEach((to, from, next) => {
     document.title = store.getters['getThisDetai'].name || !!window.sessionStorage.getItem('setThisDetai') ? JSON.parse(window.sessionStorage.getItem('setThisDetai')).name : ''
     if (localStorage.getItem("SC_token")) {
@@ -147,11 +116,6 @@ new Vue({
     router,
     store,
     render: h => h(App),
-    // created() {
-    //     if (localStorage.getItem('SC_token')) {
-    //         this.routerLoad.loadMenus();
-    //     }
-    // }
 }).$mount('#app');
 Vue.prototype.$http = http;
 Vue.prototype.$api = apiService(http);

energyManagement/src/router/index.js

@@ -1,62 +1,3 @@
-// import Vue from 'vue';
-// import Router from 'vue-router';
-
-// const original = Router.prototype.push
-// Router.prototype.push = function push(location) {
-//     return original.call(this, location).catch(err => err)
-// }
-// Vue.use(Router);
-
-
-
-// const quietRoute = [
-//     {
-//         path: '/',
-//         component: () => import(/* webpackChunkName: "home" */ '@/components/common/Home.vue'),
-//         children: [
-//             {
-//                 path: '/msg',
-//                 component: () => import(/* webpackChunkName: "messages" */ '@views/messages'),
-//                 meta: { title: '消息中心' }
-//             },
-//             {
-//                 path: '/403',
-//                 component: () => import(/* webpackChunkName: "404" */ '@views/error/403'),
-//                 meta: { title: '403' }
-//             },
-//             {
-//                 path: '/404',
-//                 component: () => import(/* webpackChunkName: "404" */ '@views/error/404'),
-//                 meta: { title: '404' }
-//             },
-//             {
-
-//             {
-//                 path: '/instrumentViewDetail',
-//                 component: () => import(/* webpackChunkName: "404" */ '@views/instrumentManagement/setPage/viewDetail.vue'),
-//                 meta: { title: '设备详情' }
-//             },
-
-//         ],
-//         redirect: '/Overview'
-//     },
-//     {
-//         path: '*',
-//         redirect: '/404'
-//     }
-// ]
-
-// const route = new Router({
-//     mode: 'history',
-//     base: process.env.BASE_URL,
-//     routes: [
-//         ...quietRoute
-//     ]
-// });
-// export default route
-
-
-
 import Vue from 'vue';
 import Router from 'vue-router';