| 1 |
- {"remainingRequest":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\babel-loader\\lib\\index.js!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\style-vw-loader\\index.js??ref--0-2!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\src\\components\\common\\Sidebar.vue?vue&type=script&lang=js&","dependencies":[{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\src\\components\\common\\Sidebar.vue","mtime":1663828782923},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\babel.config.js","mtime":1663828782900},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\style-vw-loader\\index.js","mtime":1540864632000}],"contextDependencies":[],"result":["import \"core-js/modules/es6.function.name\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport MenuTree from \"./MenuTree.vue\";\nexport default {\n data: function data() {\n return {\n btnCollpaseright: require('@assets/img/btn_collpaseright.png'),\n btnCollpaseleft: require('@assets/img/btn_collpaseleft.png'),\n openList: []\n };\n },\n components: {\n MenuTree: MenuTree\n },\n computed: {\n onRoutes: function onRoutes() {\n return this.$route.path;\n },\n collapse: function collapse() {\n return this.$store.getters['getCollapse'];\n },\n menuList: function menuList() {\n var list = this.$store.getters['getMenuList'];\n return list;\n },\n openArray: function openArray() {\n return this.openList;\n },\n sessSetThisDetai: function sessSetThisDetai() {\n var text = '';\n\n if (!!window.sessionStorage.getItem('setThisDetai')) {\n text = JSON.parse(window.sessionStorage.getItem('setThisDetai')).name;\n }\n\n return text;\n }\n },\n methods: {\n // 侧边栏折叠\n collapseChage: function collapseChage() {\n this.$store.dispatch('collapse', !this.collapse);\n },\n thisfindMen: function thisfindMen(arr, indexPath) {\n var status = [];\n arr.map(function (v) {\n if (v.children) {\n v.children.map(function (s) {\n if ('/' + s.linkPath === indexPath) {\n status.push(v.linkPath, s.linkPath);\n }\n });\n } else {\n if ('/' + v.linkPath === indexPath) {\n status.push(v.linkPath);\n }\n }\n });\n return status;\n }\n },\n watch: {\n $route: function $route(newValue, oldValue) {\n this.openList = this.thisfindMen(this.$store.getters['getMenuList'], newValue.path);\n }\n },\n created: function created() {\n this.openList = this.thisfindMen(this.$store.getters['getMenuList'], this.$route.path);\n },\n mounted: function mounted() {// this.$refs.sidebarelmenu.$children[0].$children[0].$el.style.paddingLeft = 0;\n // console.log((this.$refs.sidebarelmenu.$children[0].$children[0].$el.style.paddingLeft = 0));\n }\n};",{"version":3,"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA;AACA;AACAA,MADA,kBACA;AACA;AACAC,oEADA;AAEAC,kEAFA;AAGAC;AAHA;AAKA,GAPA;AAQAC;AACAC;AADA,GARA;AAWAC;AACAC,YADA,sBACA;AACA;AACA,KAHA;AAIAC,YAJA,sBAIA;AACA;AACA,KANA;AAOAC,YAPA,sBAOA;AACA;AACA;AACA,KAVA;AAWAC,aAXA,uBAWA;AACA;AACA,KAbA;AAcAC,oBAdA,8BAcA;AACA;;AACA;AACAC;AACA;;AACA;AACA;AApBA,GAXA;AAiCAC;AACA;AACAC,iBAFA,2BAEA;AACA;AACA,KAJA;AAKAC,eALA,uBAKAC,GALA,EAKAC,SALA,EAKA;AACA;AACAD;AACA;AACAE;AACA;AACAC;AACA;AACA,WAJA;AAKA,SANA,MAMA;AACA;AACAA;AACA;AACA;AACA,OAZA;AAaA;AACA;AArBA,GAjCA;AAwDAC;AACAC,UADA,kBACAC,QADA,EACAC,QADA,EACA;AACA;AACA;AAHA,GAxDA;AA6DAC,SA7DA,qBA6DA;AACA;AACA,GA/DA;AAgEAC,SAhEA,qBAgEA,CACA;AACA;AACA;AAnEA","names":["data","btnCollpaseright","btnCollpaseleft","openList","components","MenuTree","computed","onRoutes","collapse","menuList","openArray","sessSetThisDetai","text","methods","collapseChage","thisfindMen","arr","indexPath","v","status","watch","$route","newValue","oldValue","created","mounted"],"sourceRoot":"src/components/common","sources":["Sidebar.vue"],"sourcesContent":["<template>\r\n <div class=\"sidebar\" :style=\"collapse ? 'width:4.42708vw' : 'width:11.45833vw'\">\r\n <div class=\"logo\" v-if=\"!collapse\">\r\n <img src=\"@/assets/img/img_logo2.png\" />\r\n <div class=\"title\"><span class=\"point\"></span>{{ $store.getters['getThisDetai'].name || sessSetThisDetai }}</div>\r\n </div>\r\n <div class=\"logo shrink\" v-else>\r\n <div class=\"text\">{{ $store.getters['getThisDetai'].name || sessSetThisDetai }}</div>\r\n </div>\r\n <div class=\"menu-wrap no-scrollbar\">\r\n <el-menu\r\n class=\"sidebar-el-menu\"\r\n ref=\"sidebarelmenu\"\r\n :default-active=\"onRoutes\"\r\n :collapse=\"collapse\"\r\n background-color=\"#171F32\"\r\n text-color=\"#aaadba\"\r\n active-text-color=\"#0EAEFF\"\r\n unique-opened\r\n collapse-transition\r\n router\r\n :style=\"collapse ? 'width:4.375vw' : 'width:11.45833vw'\"\r\n >\r\n <menu-tree :menuList=\"menuList\" :collapse=\"collapse\" :openArray=\"openArray\"></menu-tree>\r\n </el-menu>\r\n </div>\r\n <div class=\"footer\">\r\n <img\r\n :class=\"[collapse ? 'expandhover' : 'packuphover']\"\r\n :src=\"collapse ? btnCollpaseright : btnCollpaseleft\"\r\n @click=\"collapseChage\"\r\n />\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport MenuTree from './MenuTree.vue';\r\nexport default {\r\n data() {\r\n return {\r\n btnCollpaseright: require('@assets/img/btn_collpaseright.png'),\r\n btnCollpaseleft: require('@assets/img/btn_collpaseleft.png'),\r\n openList: []\r\n };\r\n },\r\n components: {\r\n MenuTree\r\n },\r\n computed: {\r\n onRoutes() {\r\n return this.$route.path;\r\n },\r\n collapse() {\r\n return this.$store.getters['getCollapse'];\r\n },\r\n menuList() {\r\n let list = this.$store.getters['getMenuList'];\r\n return list;\r\n },\r\n openArray() {\r\n return this.openList;\r\n },\r\n sessSetThisDetai() {\r\n let text = '';\r\n if (!!window.sessionStorage.getItem('setThisDetai')) {\r\n text = JSON.parse(window.sessionStorage.getItem('setThisDetai')).name;\r\n }\r\n return text;\r\n }\r\n },\r\n methods: {\r\n // 侧边栏折叠\r\n collapseChage() {\r\n this.$store.dispatch('collapse', !this.collapse);\r\n },\r\n thisfindMen(arr, indexPath) {\r\n let status = [];\r\n arr.map((v) => {\r\n if (v.children) {\r\n v.children.map((s) => {\r\n if ('/' + s.linkPath === indexPath) {\r\n status.push(v.linkPath, s.linkPath);\r\n }\r\n });\r\n } else {\r\n if ('/' + v.linkPath === indexPath) {\r\n status.push(v.linkPath);\r\n }\r\n }\r\n });\r\n return status;\r\n }\r\n },\r\n watch: {\r\n $route(newValue, oldValue) {\r\n this.openList = this.thisfindMen(this.$store.getters['getMenuList'], newValue.path);\r\n }\r\n },\r\n created() {\r\n this.openList = this.thisfindMen(this.$store.getters['getMenuList'], this.$route.path);\r\n },\r\n mounted() {\r\n // this.$refs.sidebarelmenu.$children[0].$children[0].$el.style.paddingLeft = 0;\r\n // console.log((this.$refs.sidebarelmenu.$children[0].$children[0].$el.style.paddingLeft = 0));\r\n }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n@import '@assets/css/public-style.scss';\r\n.sidebar {\r\n width: rem(220);\r\n display: flex;\r\n flex-direction: column;\r\n background: #171f32;\r\n border-radius: 0px rem(30) rem(30) 0px;\r\n z-index: 2;\r\n .logo {\r\n width: 100%;\r\n height: rem(110);\r\n color: #ffffff;\r\n padding: rem(35) rem(10) 0 rem(20);\r\n border-bottom: 1px solid #2a335c;\r\n margin-bottom: rem(25);\r\n img {\r\n width: rem(90);\r\n height: rem(24);\r\n display: inline-block;\r\n vertical-align: middle;\r\n margin-right: rem(6);\r\n }\r\n .title {\r\n font-size: rem(16);\r\n font-weight: 500;\r\n display: inline-block;\r\n vertical-align: middle;\r\n background: rgba(255, 255, 255, 0.1);\r\n border-radius: rem(4);\r\n border: 1px solid rgba(255, 255, 255, 0.4);\r\n padding: 0px rem(7);\r\n }\r\n .point {\r\n width: rem(4);\r\n height: rem(4);\r\n display: inline-block;\r\n // margin-right: 5px;\r\n vertical-align: middle;\r\n text-align: center;\r\n }\r\n .text {\r\n width: rem(40);\r\n margin-left: rem(-14);\r\n }\r\n }\r\n .menu-wrap {\r\n overflow: auto;\r\n flex: 1;\r\n scrollbar-width: 0;\r\n }\r\n .menu-footer.dark {\r\n bottom: 0;\r\n left: 0;\r\n width: rem(220);\r\n height: rem(30);\r\n\r\n div {\r\n width: 100%;\r\n height: 100%;\r\n border-radius: 0px 0 rem(30) 0px;\r\n background-color: #171f32;\r\n border: none;\r\n }\r\n &.dark {\r\n background-color: #070f22 !important;\r\n z-index: 1;\r\n }\r\n\r\n &.light {\r\n background-color: #f4f7f9 !important;\r\n z-index: 1;\r\n }\r\n }\r\n .footer {\r\n position: absolute;\r\n bottom: rem(30);\r\n left: rem(20);\r\n z-index: 11;\r\n width: rem(30);\r\n height: rem(30);\r\n img {\r\n display: block;\r\n width: rem(24);\r\n height: rem(24);\r\n cursor: pointer;\r\n }\r\n }\r\n}\r\n.el-menu {\r\n border: none;\r\n}\r\n\r\n.sidebar-el-menu .el-submenu.is-opened > .el-submenu__title {\r\n //设置一级菜单点开后的状态\r\n color: #fff !important;\r\n background: rgb(44, 53, 74);\r\n border-radius: 0;\r\n}\r\n.sidebar-el-menu > .el-submenu.is-opened > .el-menu--inline > .el-submenu.is-opened > .el-submenu__title {\r\n color: #fff !important;\r\n}\r\n.sidebar-el-menu > div > .el-submenu.is-opened.is-active > .el-submenu__title {\r\n background: #2c354a !important;\r\n border-radius: rem(32) 0px 0px rem(32);\r\n color: $mainTextColor !important;\r\n border-right: 2px solid $mainTextColor;\r\n .el-submenu__icon-arrow::before {\r\n color: $mainTextColor;\r\n }\r\n}\r\n.el-menu-item.is-active {\r\n color: $mainTextColor;\r\n}\r\n.el-submenu.is-active > div > span {\r\n color: $mainTextColor;\r\n}\r\n\r\n.sidebar .logo.shrink {\r\n display: flex;\r\n font-size: rem(16);\r\n justify-content: center;\r\n // color: $mainTextColor;\r\n border-bottom: 2px solid #2a335c;\r\n margin-bottom: rem(20);\r\n align-items: flex-start;\r\n .text {\r\n width: rem(48);\r\n height: rem(48);\r\n background: rgba(255, 255, 255, 0.1);\r\n border-radius: rem(4);\r\n border: 1px solid rgba(255, 255, 255, 0.4);\r\n text-align: center;\r\n }\r\n}\r\n\r\n.el-menu--collapse > .is-active {\r\n color: #2787f1;\r\n\r\n background: #2c354a;\r\n border-radius: rem(32) 0px 0px rem(32);\r\n}\r\n\r\n.el-menu--collapse > .is-active > .el-submenu__title {\r\n background: transparent !important;\r\n}\r\n.el-submenu > .el-submenu__title:hover {\r\n //设置一级菜单的鼠标经过时候的样式\r\n background: rgb(44, 53, 74) !important;\r\n border-radius: rem(32) 0px 0px rem(32) !important;\r\n}\r\n.el-menu-item:hover {\r\n border-radius: rem(32) 0px 0px rem(32);\r\n}\r\n</style>\r\n"]}]}
|
