@luzhaoqi/test 0.0.32 → 0.0.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/css/index.css +46 -35
- package/dist/lib-cjs.js +177 -91
- package/package.json +1 -1
|
@@ -509,16 +509,21 @@ $base-sub-menu-hover:#001528;
|
|
|
509
509
|
logoLightTitleColor: #001529;
|
|
510
510
|
}
|
|
511
511
|
|
|
512
|
-
.app
|
|
512
|
+
.app {
|
|
513
|
+
width: 100%;
|
|
514
|
+
height: 100%;
|
|
515
|
+
position: relative;
|
|
516
|
+
}
|
|
517
|
+
.app .main-container {
|
|
513
518
|
height: 100%;
|
|
514
519
|
transition: margin-left 0.28s;
|
|
515
520
|
margin-left: 200px;
|
|
516
521
|
position: relative;
|
|
517
522
|
}
|
|
518
|
-
.app
|
|
523
|
+
.app .sidebarHide {
|
|
519
524
|
margin-left: 0 !important;
|
|
520
525
|
}
|
|
521
|
-
.app
|
|
526
|
+
.app .sidebar-container {
|
|
522
527
|
transition: width 0.28s;
|
|
523
528
|
width: 200px !important;
|
|
524
529
|
background-color: #304156;
|
|
@@ -532,111 +537,117 @@ $base-sub-menu-hover:#001528;
|
|
|
532
537
|
overflow: hidden;
|
|
533
538
|
box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
|
|
534
539
|
}
|
|
535
|
-
.app
|
|
540
|
+
.app .sidebar-container .horizontal-collapse-transition {
|
|
536
541
|
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
|
|
537
542
|
}
|
|
538
|
-
.app
|
|
543
|
+
.app .sidebar-container .scrollbar-wrapper {
|
|
539
544
|
overflow-x: hidden !important;
|
|
540
545
|
}
|
|
541
|
-
.app
|
|
546
|
+
.app .sidebar-container .el-scrollbar__bar.is-vertical {
|
|
542
547
|
right: 0px;
|
|
543
548
|
}
|
|
544
|
-
.app
|
|
549
|
+
.app .sidebar-container .el-scrollbar {
|
|
545
550
|
height: 100%;
|
|
546
551
|
}
|
|
547
|
-
.app
|
|
552
|
+
.app .sidebar-container.has-logo .el-scrollbar {
|
|
548
553
|
height: calc(100% - 50px);
|
|
549
554
|
}
|
|
550
|
-
.app
|
|
555
|
+
.app .sidebar-container .is-horizontal {
|
|
551
556
|
display: none;
|
|
552
557
|
}
|
|
553
|
-
.app
|
|
558
|
+
.app .sidebar-container a {
|
|
554
559
|
display: inline-block;
|
|
555
560
|
width: 100%;
|
|
556
561
|
overflow: hidden;
|
|
557
562
|
text-decoration: none;
|
|
558
563
|
}
|
|
559
|
-
.app
|
|
564
|
+
.app .sidebar-container .svg-icon {
|
|
560
565
|
margin-right: 16px;
|
|
561
566
|
}
|
|
562
|
-
.app
|
|
567
|
+
.app .sidebar-container .el-menu {
|
|
563
568
|
border: none;
|
|
564
569
|
height: 100%;
|
|
565
570
|
width: 100% !important;
|
|
566
571
|
}
|
|
567
|
-
.app
|
|
572
|
+
.app .sidebar-container .el-menu-item, .app .sidebar-container .el-submenu__title {
|
|
568
573
|
overflow: hidden !important;
|
|
569
574
|
text-overflow: ellipsis !important;
|
|
570
575
|
white-space: nowrap !important;
|
|
571
576
|
}
|
|
572
|
-
.app
|
|
573
|
-
.app
|
|
577
|
+
.app .sidebar-container .submenu-title-noDropdown:hover,
|
|
578
|
+
.app .sidebar-container .el-submenu__title:hover {
|
|
574
579
|
background-color: rgba(0, 0, 0, 0.06) !important;
|
|
575
580
|
}
|
|
576
|
-
.app
|
|
581
|
+
.app .sidebar-container .theme-dark .is-active > .el-submenu__title {
|
|
577
582
|
color: #f4f4f5 !important;
|
|
578
583
|
}
|
|
579
|
-
.app
|
|
584
|
+
.app .sidebar-container .nest-menu .el-submenu > .el-submenu__title, .app .sidebar-container .el-submenu .el-menu-item {
|
|
580
585
|
min-width: 200px !important;
|
|
581
586
|
}
|
|
582
|
-
.app
|
|
587
|
+
.app .sidebar-container .nest-menu .el-submenu > .el-submenu__title:hover, .app .sidebar-container .el-submenu .el-menu-item:hover {
|
|
583
588
|
background-color: rgba(0, 0, 0, 0.06) !important;
|
|
584
589
|
}
|
|
585
|
-
.app
|
|
590
|
+
.app .sidebar-container .theme-dark .nest-menu .el-submenu > .el-submenu__title, .app .sidebar-container .theme-dark .el-submenu .el-menu-item {
|
|
586
591
|
background-color: #1f2d3d !important;
|
|
587
592
|
}
|
|
588
|
-
.app
|
|
593
|
+
.app .sidebar-container .theme-dark .nest-menu .el-submenu > .el-submenu__title:hover, .app .sidebar-container .theme-dark .el-submenu .el-menu-item:hover {
|
|
589
594
|
background-color: #001528 !important;
|
|
590
595
|
}
|
|
591
|
-
.app
|
|
596
|
+
.app .hideSidebar .sidebar-container {
|
|
592
597
|
width: 54px !important;
|
|
593
598
|
}
|
|
594
|
-
.app
|
|
599
|
+
.app .hideSidebar .main-container {
|
|
595
600
|
margin-left: 54px;
|
|
596
601
|
}
|
|
597
|
-
.app
|
|
602
|
+
.app .hideSidebar .submenu-title-noDropdown {
|
|
598
603
|
padding: 0 !important;
|
|
599
604
|
position: relative;
|
|
600
605
|
}
|
|
601
|
-
.app
|
|
606
|
+
.app .hideSidebar .submenu-title-noDropdown .el-tooltip {
|
|
602
607
|
padding: 0 !important;
|
|
603
608
|
}
|
|
604
|
-
.app
|
|
609
|
+
.app .hideSidebar .submenu-title-noDropdown .el-tooltip .svg-icon {
|
|
605
610
|
margin-left: 20px;
|
|
606
611
|
}
|
|
607
|
-
.app
|
|
612
|
+
.app .hideSidebar .submenu-title-noDropdown .el-tooltip .title-box {
|
|
613
|
+
display: none;
|
|
614
|
+
}
|
|
615
|
+
.app .hideSidebar .el-submenu {
|
|
608
616
|
overflow: hidden;
|
|
609
617
|
}
|
|
610
|
-
.app
|
|
618
|
+
.app .hideSidebar .el-submenu > .el-submenu__title {
|
|
611
619
|
padding: 0 !important;
|
|
612
620
|
}
|
|
613
|
-
.app
|
|
621
|
+
.app .hideSidebar .el-submenu > .el-submenu__title .svg-icon {
|
|
614
622
|
margin-left: 20px;
|
|
615
623
|
}
|
|
616
|
-
.app
|
|
624
|
+
.app .hideSidebar .el-menu--collapse .el-submenu > .el-submenu__title > span {
|
|
617
625
|
height: 0;
|
|
618
626
|
width: 0;
|
|
619
627
|
overflow: hidden;
|
|
620
628
|
visibility: hidden;
|
|
621
629
|
display: inline-block;
|
|
622
630
|
}
|
|
623
|
-
.app
|
|
631
|
+
.app .hideSidebar .el-menu--collapse .el-submenu > .el-submenu__title .title-box {
|
|
632
|
+
display: none;
|
|
633
|
+
}
|
|
634
|
+
.app .el-menu--collapse .el-menu .el-submenu {
|
|
624
635
|
min-width: 200px !important;
|
|
625
636
|
}
|
|
626
|
-
.app
|
|
637
|
+
.app .mobile .main-container {
|
|
627
638
|
margin-left: 0px;
|
|
628
639
|
}
|
|
629
|
-
.app
|
|
640
|
+
.app .mobile .sidebar-container {
|
|
630
641
|
transition: transform 0.28s;
|
|
631
642
|
width: 200px !important;
|
|
632
643
|
}
|
|
633
|
-
.app
|
|
644
|
+
.app .mobile.hideSidebar .sidebar-container {
|
|
634
645
|
pointer-events: none;
|
|
635
646
|
transition-duration: 0.3s;
|
|
636
647
|
transform: translate3d(-200px, 0, 0);
|
|
637
648
|
}
|
|
638
|
-
.app
|
|
639
|
-
.app
|
|
649
|
+
.app .withoutAnimation .main-container,
|
|
650
|
+
.app .withoutAnimation .sidebar-container {
|
|
640
651
|
transition: none;
|
|
641
652
|
}
|
|
642
653
|
|
package/dist/lib-cjs.js
CHANGED
|
@@ -6,7 +6,6 @@ var axios = require('axios');
|
|
|
6
6
|
var require$$0$1 = require('vue');
|
|
7
7
|
var VueRouter = require('vue-router');
|
|
8
8
|
var Vuex = require('vuex');
|
|
9
|
-
require('@/router');
|
|
10
9
|
|
|
11
10
|
/*! js-cookie v3.0.1 | MIT */
|
|
12
11
|
/* eslint-disable no-var */
|
|
@@ -40251,11 +40250,11 @@ function requireAriaDialog () {
|
|
|
40251
40250
|
var _global$1 = {exports: {}};
|
|
40252
40251
|
|
|
40253
40252
|
// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
|
|
40254
|
-
var global$
|
|
40253
|
+
var global$5 = _global$1.exports = typeof window != 'undefined' && window.Math == Math
|
|
40255
40254
|
? window : typeof self != 'undefined' && self.Math == Math ? self
|
|
40256
40255
|
// eslint-disable-next-line no-new-func
|
|
40257
40256
|
: Function('return this')();
|
|
40258
|
-
if (typeof __g == 'number') __g = global$
|
|
40257
|
+
if (typeof __g == 'number') __g = global$5; // eslint-disable-line no-undef
|
|
40259
40258
|
|
|
40260
40259
|
var _globalExports = _global$1.exports;
|
|
40261
40260
|
|
|
@@ -40390,7 +40389,7 @@ var _has = function (it, key) {
|
|
|
40390
40389
|
return hasOwnProperty.call(it, key);
|
|
40391
40390
|
};
|
|
40392
40391
|
|
|
40393
|
-
var global$
|
|
40392
|
+
var global$4 = _globalExports;
|
|
40394
40393
|
var core$2 = _coreExports;
|
|
40395
40394
|
var ctx = _ctx;
|
|
40396
40395
|
var hide$2 = _hide;
|
|
@@ -40406,7 +40405,7 @@ var $export$3 = function (type, name, source) {
|
|
|
40406
40405
|
var IS_WRAP = type & $export$3.W;
|
|
40407
40406
|
var exports = IS_GLOBAL ? core$2 : core$2[name] || (core$2[name] = {});
|
|
40408
40407
|
var expProto = exports[PROTOTYPE$2];
|
|
40409
|
-
var target = IS_GLOBAL ? global$
|
|
40408
|
+
var target = IS_GLOBAL ? global$4 : IS_STATIC ? global$4[name] : (global$4[name] || {})[PROTOTYPE$2];
|
|
40410
40409
|
var key, own, out;
|
|
40411
40410
|
if (IS_GLOBAL) source = name;
|
|
40412
40411
|
for (key in source) {
|
|
@@ -40418,7 +40417,7 @@ var $export$3 = function (type, name, source) {
|
|
|
40418
40417
|
// prevent global pollution for namespaces
|
|
40419
40418
|
exports[key] = IS_GLOBAL && typeof target[key] != 'function' ? source[key]
|
|
40420
40419
|
// bind timers to global for call from export context
|
|
40421
|
-
: IS_BIND && own ? ctx(out, global$
|
|
40420
|
+
: IS_BIND && own ? ctx(out, global$4)
|
|
40422
40421
|
// wrap global constructors for prevent change them in library
|
|
40423
40422
|
: IS_WRAP && target[key] == out ? (function (C) {
|
|
40424
40423
|
var F = function (a, b, c) {
|
|
@@ -40535,26 +40534,18 @@ var _arrayIncludes = function (IS_INCLUDES) {
|
|
|
40535
40534
|
|
|
40536
40535
|
var _shared = {exports: {}};
|
|
40537
40536
|
|
|
40538
|
-
var _library;
|
|
40539
|
-
var hasRequired_library;
|
|
40540
|
-
|
|
40541
|
-
function require_library () {
|
|
40542
|
-
if (hasRequired_library) return _library;
|
|
40543
|
-
hasRequired_library = 1;
|
|
40544
|
-
_library = true;
|
|
40545
|
-
return _library;
|
|
40546
|
-
}
|
|
40537
|
+
var _library = true;
|
|
40547
40538
|
|
|
40548
40539
|
var core$1 = _coreExports;
|
|
40549
|
-
var global$
|
|
40540
|
+
var global$3 = _globalExports;
|
|
40550
40541
|
var SHARED = '__core-js_shared__';
|
|
40551
|
-
var store$1 = global$
|
|
40542
|
+
var store$1 = global$3[SHARED] || (global$3[SHARED] = {});
|
|
40552
40543
|
|
|
40553
40544
|
(_shared.exports = function (key, value) {
|
|
40554
40545
|
return store$1[key] || (store$1[key] = value !== undefined ? value : {});
|
|
40555
40546
|
})('versions', []).push({
|
|
40556
40547
|
version: core$1.version,
|
|
40557
|
-
mode:
|
|
40548
|
+
mode: 'pure' ,
|
|
40558
40549
|
copyright: '© 2020 Denis Pushkarev (zloirock.ru)'
|
|
40559
40550
|
});
|
|
40560
40551
|
|
|
@@ -40839,7 +40830,6 @@ var _objectGpo = Object.getPrototypeOf || function (O) {
|
|
|
40839
40830
|
} return O instanceof Object ? ObjectProto$1 : null;
|
|
40840
40831
|
};
|
|
40841
40832
|
|
|
40842
|
-
var LIBRARY$1 = require_library();
|
|
40843
40833
|
var $export$1 = _export;
|
|
40844
40834
|
var redefine$1 = _redefine;
|
|
40845
40835
|
var hide$1 = _hide;
|
|
@@ -40879,8 +40869,6 @@ var _iterDefine = function (Base, NAME, Constructor, next, DEFAULT, IS_SET, FORC
|
|
|
40879
40869
|
if (IteratorPrototype !== Object.prototype && IteratorPrototype.next) {
|
|
40880
40870
|
// Set @@toStringTag to native iterators
|
|
40881
40871
|
setToStringTag$1(IteratorPrototype, TAG, true);
|
|
40882
|
-
// fix for some old engines
|
|
40883
|
-
if (!LIBRARY$1 && typeof IteratorPrototype[ITERATOR] != 'function') hide$1(IteratorPrototype, ITERATOR, returnThis);
|
|
40884
40872
|
}
|
|
40885
40873
|
}
|
|
40886
40874
|
// fix Array#{values, @@iterator}.name in V8 / FF
|
|
@@ -40889,7 +40877,7 @@ var _iterDefine = function (Base, NAME, Constructor, next, DEFAULT, IS_SET, FORC
|
|
|
40889
40877
|
$default = function values() { return $native.call(this); };
|
|
40890
40878
|
}
|
|
40891
40879
|
// Define iterator
|
|
40892
|
-
if ((
|
|
40880
|
+
if ((FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])) {
|
|
40893
40881
|
hide$1(proto, ITERATOR, $default);
|
|
40894
40882
|
}
|
|
40895
40883
|
// Plug for library
|
|
@@ -40958,7 +40946,7 @@ _iterDefine(Array, 'Array', function (iterated, kind) {
|
|
|
40958
40946
|
// argumentsList[@@iterator] is %ArrayProto_values% (9.4.4.6, 9.4.4.7)
|
|
40959
40947
|
Iterators$1.Arguments = Iterators$1.Array;
|
|
40960
40948
|
|
|
40961
|
-
var global$
|
|
40949
|
+
var global$2 = _globalExports;
|
|
40962
40950
|
var hide = _hide;
|
|
40963
40951
|
var Iterators = _iterators;
|
|
40964
40952
|
var TO_STRING_TAG = _wksExports('toStringTag');
|
|
@@ -40971,7 +40959,7 @@ var DOMIterables = ('CSSRuleList,CSSStyleDeclaration,CSSValueList,ClientRectList
|
|
|
40971
40959
|
|
|
40972
40960
|
for (var i = 0; i < DOMIterables.length; i++) {
|
|
40973
40961
|
var NAME = DOMIterables[i];
|
|
40974
|
-
var Collection = global$
|
|
40962
|
+
var Collection = global$2[NAME];
|
|
40975
40963
|
var proto = Collection && Collection.prototype;
|
|
40976
40964
|
if (proto && !proto[TO_STRING_TAG]) hide(proto, TO_STRING_TAG, NAME);
|
|
40977
40965
|
Iterators[NAME] = Iterators.Array;
|
|
@@ -41043,13 +41031,11 @@ var meta = _meta.exports = {
|
|
|
41043
41031
|
|
|
41044
41032
|
var _metaExports = _meta.exports;
|
|
41045
41033
|
|
|
41046
|
-
var global$2 = _globalExports;
|
|
41047
41034
|
var core = _coreExports;
|
|
41048
|
-
var LIBRARY = require_library();
|
|
41049
41035
|
var wksExt$1 = _wksExt;
|
|
41050
41036
|
var defineProperty = _objectDp.f;
|
|
41051
41037
|
var _wksDefine = function (name) {
|
|
41052
|
-
var $Symbol = core.Symbol || (core.Symbol =
|
|
41038
|
+
var $Symbol = core.Symbol || (core.Symbol = {} );
|
|
41053
41039
|
if (name.charAt(0) != '_' && !(name in $Symbol)) defineProperty($Symbol, name, { value: wksExt$1.f(name) });
|
|
41054
41040
|
};
|
|
41055
41041
|
|
|
@@ -41287,7 +41273,7 @@ if (!USE_NATIVE) {
|
|
|
41287
41273
|
require_objectPie().f = $propertyIsEnumerable;
|
|
41288
41274
|
$GOPS.f = $getOwnPropertySymbols;
|
|
41289
41275
|
|
|
41290
|
-
if (DESCRIPTORS && !
|
|
41276
|
+
if (DESCRIPTORS && !_library) {
|
|
41291
41277
|
redefine(ObjectProto, 'propertyIsEnumerable', $propertyIsEnumerable);
|
|
41292
41278
|
}
|
|
41293
41279
|
|
|
@@ -90711,7 +90697,7 @@ __vue_render__$B._withStripped = true;
|
|
|
90711
90697
|
//
|
|
90712
90698
|
//
|
|
90713
90699
|
|
|
90714
|
-
|
|
90700
|
+
// 隐藏侧边栏路由
|
|
90715
90701
|
const hideList = ['/user/profile'];
|
|
90716
90702
|
|
|
90717
90703
|
var script$z = {
|
|
@@ -90766,7 +90752,6 @@ var script$z = {
|
|
|
90766
90752
|
});
|
|
90767
90753
|
const routerConfig = this.$z.routerConfig || {};
|
|
90768
90754
|
const routerOption = routerConfig || {};
|
|
90769
|
-
console.log((routerOption.routes || []).concat(childrenMenus));
|
|
90770
90755
|
return (routerOption.routes || []).concat(childrenMenus)
|
|
90771
90756
|
},
|
|
90772
90757
|
// 默认激活的菜单
|
|
@@ -90920,7 +90905,7 @@ __vue_render__$A._withStripped = true;
|
|
|
90920
90905
|
/* style */
|
|
90921
90906
|
const __vue_inject_styles__$A = function (inject) {
|
|
90922
90907
|
if (!inject) return
|
|
90923
|
-
inject("data-v-
|
|
90908
|
+
inject("data-v-07185678_0", { source: ".topmenu-container.el-menu--horizontal > .el-menu-item {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n border-bottom: 2px solid var(--theme) !important;\n color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\TopNav\\index.vue","index.vue"],"names":[],"mappings":"AAgKA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC/JA;ADiKA;;EAEA,gDAAA;EACA,cAAA;AC9JA;;ADgKA,iBAAA;AACA;EACA,WAAA;EACA,uBAAA;EACA,4BAAA;EACA,yBAAA;EACA,yBAAA;EACA,yBAAA;AC7JA;;AAEA,oCAAoC","file":"index.vue","sourcesContent":["<template>\n <el-menu :default-active=\"activeMenu\" mode=\"horizontal\" @select=\"handleSelect\">\n <template v-for=\"(item, index) in topMenus\">\n <el-menu-item :style=\"{ '--theme': theme }\" :index=\"item.path\" :key=\"index\" v-if=\"index < visibleNumber\">\n <z-icon :name=\"item.meta.icon\" />\n {{ item.meta.title }}\n </el-menu-item>\n </template>\n\n <!-- 顶部菜单超出数量折叠 -->\n <el-submenu :style=\"{ '--theme': theme }\" index=\"more\" v-if=\"topMenus.length > visibleNumber\">\n <template slot=\"title\">更多菜单</template>\n <template v-for=\"(item, index) in topMenus\">\n <el-menu-item :index=\"item.path\" :key=\"index\" v-if=\"index >= visibleNumber\">\n <z-icon :name=\"item.meta.icon\" />\n {{ item.meta.title }}\n </el-menu-item>\n </template>\n </el-submenu>\n </el-menu>\n</template>\n\n<script>\n// 隐藏侧边栏路由\nconst hideList = ['/user/profile']\n\nexport default {\n data() {\n return {\n // 顶部栏初始数\n visibleNumber: 5,\n // 当前激活菜单的 index\n currentIndex: undefined\n }\n },\n computed: {\n theme() {\n return this.$store.state['z-settings'].theme\n },\n // 顶部显示菜单\n topMenus() {\n let topMenus = []\n this.routers.map((menu) => {\n if (menu.hidden !== true) {\n // 兼容顶部栏一级菜单内部跳转\n if (menu.path === '/') {\n topMenus.push(menu.children[0])\n } else {\n topMenus.push(menu)\n }\n }\n })\n return topMenus\n },\n // 所有的路由信息\n routers() {\n return this.$store.state['z-permission'].topbarRouters\n },\n // 设置子路由\n childrenMenus() {\n var childrenMenus = []\n this.routers.map((router) => {\n for (var item in router.children) {\n if (router.children[item].parentPath === undefined) {\n if (router.path === '/') {\n router.children[item].path = '/' + router.children[item].path\n } else {\n if (!this.ishttp(router.children[item].path)) {\n router.children[item].path = router.path + '/' + router.children[item].path\n }\n }\n router.children[item].parentPath = router.path\n }\n childrenMenus.push(router.children[item])\n }\n })\n const routerConfig = this.$z.routerConfig || {}\n const routerOption = routerConfig || {}\n return (routerOption.routes || []).concat(childrenMenus)\n },\n // 默认激活的菜单\n activeMenu() {\n const path = this.$route.path\n let activePath = path\n if (path !== undefined && path.lastIndexOf('/') > 0 && hideList.indexOf(path) === -1) {\n const tmpPath = path.substring(1, path.length)\n activePath = '/' + tmpPath.substring(0, tmpPath.indexOf('/'))\n if (!this.$route.meta.link) {\n this.$store.dispatch('z-app/toggleSideBarHide', false)\n }\n } else if (!this.$route.children) {\n activePath = path\n this.$store.dispatch('z-app/toggleSideBarHide', true)\n }\n this.activeRoutes(activePath)\n return activePath\n }\n },\n beforeMount() {\n window.addEventListener('resize', this.setVisibleNumber)\n },\n beforeDestroy() {\n window.removeEventListener('resize', this.setVisibleNumber)\n },\n mounted() {\n this.setVisibleNumber()\n },\n methods: {\n // 根据宽度计算设置显示栏数\n setVisibleNumber() {\n const width = document.body.getBoundingClientRect().width / 3\n this.visibleNumber = parseInt(width / 85)\n },\n // 菜单选择事件\n handleSelect(key, keyPath) {\n this.currentIndex = key\n const route = this.routers.find((item) => item.path === key)\n if (this.ishttp(key)) {\n // http(s):// 路径新窗口打开\n window.open(key, '_blank')\n } else if (!route || !route.children) {\n // 没有子路由路径内部打开\n const routeMenu = this.childrenMenus.find((item) => item.path === key)\n if (routeMenu && routeMenu.query) {\n let query = JSON.parse(routeMenu.query)\n this.$router.push({ path: key, query: query })\n } else {\n this.$router.push({ path: key })\n }\n this.$store.dispatch('z-app/toggleSideBarHide', true)\n } else {\n // 显示左侧联动菜单\n this.activeRoutes(key)\n this.$store.dispatch('z-app/toggleSideBarHide', false)\n }\n },\n // 当前激活的路由\n activeRoutes(key) {\n var routes = []\n if (this.childrenMenus && this.childrenMenus.length > 0) {\n this.childrenMenus.map((item) => {\n if (key == item.parentPath || (key == 'index' && '' == item.path)) {\n routes.push(item)\n }\n })\n }\n if (routes.length > 0) {\n this.$store.commit('z-permission/SET_SIDEBAR_ROUTERS', routes)\n } else {\n this.$store.dispatch('z-app/toggleSideBarHide', true)\n }\n },\n ishttp(url) {\n return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1\n }\n }\n}\n</script>\n\n<style lang=\"scss\">\n.topmenu-container.el-menu--horizontal > .el-menu-item {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n border-bottom: 2px solid #{'var(--theme)'} !important;\n color: #303133;\n}\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n</style>\n",".topmenu-container.el-menu--horizontal > .el-menu-item {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n\n.topmenu-container.el-menu--horizontal > .el-menu-item.is-active,\n.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {\n border-bottom: 2px solid var(--theme) !important;\n color: #303133;\n}\n\n/* submenu item */\n.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {\n float: left;\n height: 50px !important;\n line-height: 50px !important;\n color: #999093 !important;\n padding: 0 5px !important;\n margin: 0 10px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */"]}, media: undefined });
|
|
90924
90909
|
|
|
90925
90910
|
};
|
|
90926
90911
|
/* scoped */
|
|
@@ -92185,9 +92170,23 @@ __vue_render__$u._withStripped = true;
|
|
|
92185
92170
|
//
|
|
92186
92171
|
//
|
|
92187
92172
|
//
|
|
92173
|
+
//
|
|
92174
|
+
//
|
|
92175
|
+
//
|
|
92176
|
+
//
|
|
92177
|
+
//
|
|
92178
|
+
//
|
|
92179
|
+
//
|
|
92180
|
+
|
|
92188
92181
|
|
|
92189
92182
|
var script$s = {
|
|
92190
92183
|
name: 'MenuItem',
|
|
92184
|
+
computed: {
|
|
92185
|
+
...Vuex.mapState('z-app', ['sidebar']),
|
|
92186
|
+
isCollapse() {
|
|
92187
|
+
return !this.sidebar.opened
|
|
92188
|
+
}
|
|
92189
|
+
},
|
|
92191
92190
|
props: {
|
|
92192
92191
|
icon: {
|
|
92193
92192
|
type: String,
|
|
@@ -92196,6 +92195,34 @@ var script$s = {
|
|
|
92196
92195
|
title: {
|
|
92197
92196
|
type: String,
|
|
92198
92197
|
default: ''
|
|
92198
|
+
},
|
|
92199
|
+
tooltip: {
|
|
92200
|
+
type: Boolean,
|
|
92201
|
+
default: true
|
|
92202
|
+
},
|
|
92203
|
+
level: {
|
|
92204
|
+
type: Number,
|
|
92205
|
+
default: 1
|
|
92206
|
+
},
|
|
92207
|
+
leaf: {
|
|
92208
|
+
type: Boolean,
|
|
92209
|
+
default: false
|
|
92210
|
+
}
|
|
92211
|
+
},
|
|
92212
|
+
data() {
|
|
92213
|
+
return {
|
|
92214
|
+
showTitle: undefined
|
|
92215
|
+
}
|
|
92216
|
+
},
|
|
92217
|
+
methods: {
|
|
92218
|
+
getWidth(title) {
|
|
92219
|
+
const boxWidth = parseFloat(window.getComputedStyle(this.$refs.titleBox).width);
|
|
92220
|
+
const titleWidth = parseFloat(window.getComputedStyle(this.$refs.titleHide).width);
|
|
92221
|
+
if (titleWidth > boxWidth) {
|
|
92222
|
+
this.showTitle = title;
|
|
92223
|
+
} else {
|
|
92224
|
+
this.showTitle = undefined;
|
|
92225
|
+
}
|
|
92199
92226
|
}
|
|
92200
92227
|
}
|
|
92201
92228
|
};
|
|
@@ -92208,25 +92235,70 @@ var __vue_render__$t = function () {
|
|
|
92208
92235
|
var _vm = this;
|
|
92209
92236
|
var _h = _vm.$createElement;
|
|
92210
92237
|
var _c = _vm._self._c || _h;
|
|
92211
|
-
return _c(
|
|
92212
|
-
|
|
92213
|
-
|
|
92214
|
-
|
|
92215
|
-
|
|
92238
|
+
return _c(
|
|
92239
|
+
"el-tooltip",
|
|
92240
|
+
{
|
|
92241
|
+
attrs: {
|
|
92242
|
+
placement: "right",
|
|
92243
|
+
content: _vm.title,
|
|
92244
|
+
disabled: !(_vm.level === 1 && _vm.leaf && _vm.isCollapse),
|
|
92245
|
+
},
|
|
92246
|
+
},
|
|
92247
|
+
[
|
|
92248
|
+
_c("div", { staticClass: "item-box" }, [
|
|
92249
|
+
_c(
|
|
92250
|
+
"div",
|
|
92251
|
+
{ staticClass: "svg-icon" },
|
|
92252
|
+
[_c("z-icon", { attrs: { name: _vm.icon } })],
|
|
92253
|
+
1
|
|
92254
|
+
),
|
|
92255
|
+
_vm._v(" "),
|
|
92256
|
+
_c(
|
|
92257
|
+
"div",
|
|
92258
|
+
{
|
|
92259
|
+
ref: "titleBox",
|
|
92260
|
+
staticClass: "title-box",
|
|
92261
|
+
class: { margin: !_vm.leaf || _vm.level === 1 },
|
|
92262
|
+
on: {
|
|
92263
|
+
mouseenter: function ($event) {
|
|
92264
|
+
return _vm.getWidth(_vm.title)
|
|
92265
|
+
},
|
|
92266
|
+
mousedown: function ($event) {
|
|
92267
|
+
return _vm.getWidth(_vm.title)
|
|
92268
|
+
},
|
|
92269
|
+
},
|
|
92270
|
+
},
|
|
92271
|
+
[
|
|
92272
|
+
_c(
|
|
92273
|
+
"span",
|
|
92274
|
+
{ staticClass: "title-show", attrs: { title: _vm.showTitle } },
|
|
92275
|
+
[_vm._v(_vm._s(_vm.title))]
|
|
92276
|
+
),
|
|
92277
|
+
_vm._v(" "),
|
|
92278
|
+
_c("span", { ref: "titleHide", staticClass: "title-hide" }, [
|
|
92279
|
+
_vm._v(_vm._s(_vm.title)),
|
|
92280
|
+
]),
|
|
92281
|
+
]
|
|
92282
|
+
),
|
|
92283
|
+
]),
|
|
92284
|
+
]
|
|
92285
|
+
)
|
|
92216
92286
|
};
|
|
92217
92287
|
var __vue_staticRenderFns__$t = [];
|
|
92218
92288
|
__vue_render__$t._withStripped = true;
|
|
92219
92289
|
|
|
92220
92290
|
/* style */
|
|
92221
|
-
const __vue_inject_styles__$t =
|
|
92291
|
+
const __vue_inject_styles__$t = function (inject) {
|
|
92292
|
+
if (!inject) return
|
|
92293
|
+
inject("data-v-680cd004_0", { source: ".item-box[data-v-680cd004] {\n display: flex;\n align-items: center;\n height: 100%;\n}\n.item-box .svg-icon[data-v-680cd004] {\n width: 14px;\n height: 14px;\n position: relative;\n display: block;\n}\n.item-box .svg-icon .z-icon[data-v-680cd004] {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.item-box .title-box[data-v-680cd004] {\n flex: 1;\n position: relative;\n height: 100%;\n}\n.item-box .title-box.margin[data-v-680cd004] {\n margin-right: 25px;\n}\n.item-box .title-show[data-v-680cd004] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n.item-box .title-hide[data-v-680cd004] {\n position: absolute;\n top: 0;\n left: 0;\n height: 0;\n overflow: hidden;\n}\n\n/*# sourceMappingURL=Item.vue.map */", map: {"version":3,"sources":["D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\components\\Sidebar\\Item.vue","Item.vue"],"names":[],"mappings":"AAiEA;EACA,aAAA;EACA,mBAAA;EACA,YAAA;AChEA;ADkEA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,cAAA;AChEA;ADkEA;EACA,kBAAA;EACA,QAAA;EACA,SAAA;EACA,gCAAA;AChEA;ADoEA;EACA,OAAA;EACA,kBAAA;EACA,YAAA;AClEA;ADoEA;EACA,kBAAA;AClEA;ADsEA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,gBAAA;EACA,mBAAA;ACpEA;ADuEA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;EACA,SAAA;EACA,gBAAA;ACrEA;;AAEA,mCAAmC","file":"Item.vue","sourcesContent":["<template>\r\n <el-tooltip placement=\"right\" :content=\"title\" :disabled=\"!(level === 1 && leaf && isCollapse)\">\r\n <div class=\"item-box\">\r\n <div class=\"svg-icon\">\r\n <z-icon :name=\"icon\" />\r\n </div>\r\n <div class=\"title-box\" :class=\"{ margin: !leaf || level === 1 }\" ref=\"titleBox\" @mouseenter=\"getWidth(title)\" @mousedown=\"getWidth(title)\">\r\n <span class=\"title-show\" :title=\"showTitle\">{{ title }}</span>\r\n <span class=\"title-hide\" ref=\"titleHide\">{{ title }}</span>\r\n </div>\r\n </div>\r\n </el-tooltip>\r\n</template>\r\n<script>\r\nimport { mapState } from 'vuex'\r\n\r\nexport default {\r\n name: 'MenuItem',\r\n computed: {\r\n ...mapState('z-app', ['sidebar']),\r\n isCollapse() {\r\n return !this.sidebar.opened\r\n }\r\n },\r\n props: {\r\n icon: {\r\n type: String,\r\n default: ''\r\n },\r\n title: {\r\n type: String,\r\n default: ''\r\n },\r\n tooltip: {\r\n type: Boolean,\r\n default: true\r\n },\r\n level: {\r\n type: Number,\r\n default: 1\r\n },\r\n leaf: {\r\n type: Boolean,\r\n default: false\r\n }\r\n },\r\n data() {\r\n return {\r\n showTitle: undefined\r\n }\r\n },\r\n methods: {\r\n getWidth(title) {\r\n const boxWidth = parseFloat(window.getComputedStyle(this.$refs.titleBox).width)\r\n const titleWidth = parseFloat(window.getComputedStyle(this.$refs.titleHide).width)\r\n if (titleWidth > boxWidth) {\r\n this.showTitle = title\r\n } else {\r\n this.showTitle = undefined\r\n }\r\n }\r\n }\r\n}\r\n</script>\r\n<style scoped lang=\"scss\">\r\n.item-box {\r\n display: flex;\r\n align-items: center;\r\n height: 100%;\r\n\r\n .svg-icon {\r\n width: 14px;\r\n height: 14px;\r\n position: relative;\r\n display: block;\r\n\r\n .z-icon {\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n }\r\n }\r\n\r\n .title-box {\r\n flex: 1;\r\n position: relative;\r\n height: 100%;\r\n\r\n &.margin {\r\n margin-right: 25px;\r\n }\r\n }\r\n\r\n .title-show {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n }\r\n\r\n .title-hide {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n height: 0;\r\n overflow: hidden;\r\n }\r\n}\r\n</style>\r\n",".item-box {\n display: flex;\n align-items: center;\n height: 100%;\n}\n.item-box .svg-icon {\n width: 14px;\n height: 14px;\n position: relative;\n display: block;\n}\n.item-box .svg-icon .z-icon {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n.item-box .title-box {\n flex: 1;\n position: relative;\n height: 100%;\n}\n.item-box .title-box.margin {\n margin-right: 25px;\n}\n.item-box .title-show {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n.item-box .title-hide {\n position: absolute;\n top: 0;\n left: 0;\n height: 0;\n overflow: hidden;\n}\n\n/*# sourceMappingURL=Item.vue.map */"]}, media: undefined });
|
|
92294
|
+
|
|
92295
|
+
};
|
|
92222
92296
|
/* scoped */
|
|
92223
|
-
const __vue_scope_id__$t =
|
|
92297
|
+
const __vue_scope_id__$t = "data-v-680cd004";
|
|
92224
92298
|
/* module identifier */
|
|
92225
92299
|
const __vue_module_identifier__$t = undefined;
|
|
92226
92300
|
/* functional template */
|
|
92227
92301
|
const __vue_is_functional_template__$t = false;
|
|
92228
|
-
/* style inject */
|
|
92229
|
-
|
|
92230
92302
|
/* style inject SSR */
|
|
92231
92303
|
|
|
92232
92304
|
/* style inject shadow dom */
|
|
@@ -92241,7 +92313,7 @@ __vue_render__$t._withStripped = true;
|
|
|
92241
92313
|
__vue_is_functional_template__$t,
|
|
92242
92314
|
__vue_module_identifier__$t,
|
|
92243
92315
|
false,
|
|
92244
|
-
|
|
92316
|
+
__vue_create_injector__,
|
|
92245
92317
|
undefined,
|
|
92246
92318
|
undefined
|
|
92247
92319
|
);
|
|
@@ -92387,12 +92459,14 @@ var FixiOSBug = {
|
|
|
92387
92459
|
//
|
|
92388
92460
|
//
|
|
92389
92461
|
//
|
|
92462
|
+
//
|
|
92390
92463
|
|
|
92391
92464
|
|
|
92392
92465
|
var script$q = {
|
|
92393
92466
|
name: 'SidebarItem',
|
|
92394
92467
|
components: { Item: __vue_component__$t, AppLink: __vue_component__$s },
|
|
92395
92468
|
mixins: [FixiOSBug],
|
|
92469
|
+
|
|
92396
92470
|
props: {
|
|
92397
92471
|
// route object
|
|
92398
92472
|
item: {
|
|
@@ -92406,6 +92480,10 @@ var script$q = {
|
|
|
92406
92480
|
basePath: {
|
|
92407
92481
|
type: String,
|
|
92408
92482
|
default: ''
|
|
92483
|
+
},
|
|
92484
|
+
level: {
|
|
92485
|
+
type: Number,
|
|
92486
|
+
default: 1
|
|
92409
92487
|
}
|
|
92410
92488
|
},
|
|
92411
92489
|
data() {
|
|
@@ -92499,6 +92577,8 @@ var __vue_render__$r = function () {
|
|
|
92499
92577
|
_vm.onlyOneChild.meta.icon ||
|
|
92500
92578
|
(_vm.item.meta && _vm.item.meta.icon),
|
|
92501
92579
|
title: _vm.onlyOneChild.meta.title,
|
|
92580
|
+
level: _vm.level,
|
|
92581
|
+
leaf: true,
|
|
92502
92582
|
},
|
|
92503
92583
|
}),
|
|
92504
92584
|
],
|
|
@@ -92528,6 +92608,7 @@ var __vue_render__$r = function () {
|
|
|
92528
92608
|
attrs: {
|
|
92529
92609
|
icon: _vm.item.meta && _vm.item.meta.icon,
|
|
92530
92610
|
title: _vm.item.meta.title,
|
|
92611
|
+
level: _vm.level,
|
|
92531
92612
|
},
|
|
92532
92613
|
})
|
|
92533
92614
|
: _vm._e(),
|
|
@@ -92542,6 +92623,7 @@ var __vue_render__$r = function () {
|
|
|
92542
92623
|
attrs: {
|
|
92543
92624
|
"is-nest": true,
|
|
92544
92625
|
item: child,
|
|
92626
|
+
level: _vm.level + 1,
|
|
92545
92627
|
"base-path": _vm.resolvePath(child.path),
|
|
92546
92628
|
},
|
|
92547
92629
|
})
|
|
@@ -93955,6 +94037,8 @@ __vue_render__$m._withStripped = true;
|
|
|
93955
94037
|
//
|
|
93956
94038
|
//
|
|
93957
94039
|
//
|
|
94040
|
+
//
|
|
94041
|
+
//
|
|
93958
94042
|
|
|
93959
94043
|
|
|
93960
94044
|
var script$k = {
|
|
@@ -94011,55 +94095,57 @@ var __vue_render__$l = function () {
|
|
|
94011
94095
|
var _vm = this;
|
|
94012
94096
|
var _h = _vm.$createElement;
|
|
94013
94097
|
var _c = _vm._self._c || _h;
|
|
94014
|
-
return _c(
|
|
94015
|
-
|
|
94016
|
-
|
|
94017
|
-
|
|
94018
|
-
|
|
94019
|
-
|
|
94020
|
-
|
|
94021
|
-
|
|
94022
|
-
|
|
94023
|
-
|
|
94024
|
-
|
|
94025
|
-
|
|
94026
|
-
|
|
94027
|
-
|
|
94028
|
-
|
|
94029
|
-
|
|
94030
|
-
|
|
94031
|
-
|
|
94032
|
-
|
|
94033
|
-
|
|
94034
|
-
|
|
94035
|
-
|
|
94036
|
-
|
|
94037
|
-
|
|
94038
|
-
|
|
94039
|
-
|
|
94098
|
+
return _c("div", { staticClass: "app" }, [
|
|
94099
|
+
_c(
|
|
94100
|
+
"div",
|
|
94101
|
+
{
|
|
94102
|
+
staticClass: "app-wrapper",
|
|
94103
|
+
class: _vm.classObj,
|
|
94104
|
+
style: { "--current-color": _vm.theme },
|
|
94105
|
+
},
|
|
94106
|
+
[
|
|
94107
|
+
_vm.device === "mobile" && _vm.sidebar.opened
|
|
94108
|
+
? _c("div", {
|
|
94109
|
+
staticClass: "drawer-bg",
|
|
94110
|
+
on: { click: _vm.handleClickOutside },
|
|
94111
|
+
})
|
|
94112
|
+
: _vm._e(),
|
|
94113
|
+
_vm._v(" "),
|
|
94114
|
+
!_vm.sidebar.hide
|
|
94115
|
+
? _c("Sidebar", { staticClass: "sidebar-container" })
|
|
94116
|
+
: _vm._e(),
|
|
94117
|
+
_vm._v(" "),
|
|
94118
|
+
_c(
|
|
94119
|
+
"div",
|
|
94120
|
+
{
|
|
94121
|
+
staticClass: "main-container",
|
|
94122
|
+
class: {
|
|
94123
|
+
hasTagsView: _vm.needTagsView,
|
|
94124
|
+
sidebarHide: _vm.sidebar.hide,
|
|
94125
|
+
},
|
|
94040
94126
|
},
|
|
94041
|
-
|
|
94042
|
-
|
|
94043
|
-
|
|
94044
|
-
|
|
94045
|
-
|
|
94046
|
-
|
|
94047
|
-
|
|
94048
|
-
|
|
94049
|
-
|
|
94050
|
-
|
|
94051
|
-
|
|
94052
|
-
|
|
94053
|
-
|
|
94054
|
-
|
|
94055
|
-
|
|
94056
|
-
|
|
94057
|
-
|
|
94058
|
-
|
|
94059
|
-
|
|
94060
|
-
|
|
94061
|
-
|
|
94062
|
-
)
|
|
94127
|
+
[
|
|
94128
|
+
_c(
|
|
94129
|
+
"div",
|
|
94130
|
+
{ class: { "fixed-header": _vm.fixedHeader } },
|
|
94131
|
+
[
|
|
94132
|
+
_c("Navbar"),
|
|
94133
|
+
_vm._v(" "),
|
|
94134
|
+
_vm.needTagsView ? _c("TagsView") : _vm._e(),
|
|
94135
|
+
],
|
|
94136
|
+
1
|
|
94137
|
+
),
|
|
94138
|
+
_vm._v(" "),
|
|
94139
|
+
_c("AppMain"),
|
|
94140
|
+
_vm._v(" "),
|
|
94141
|
+
_c("RightPanel", [_c("Settings")], 1),
|
|
94142
|
+
],
|
|
94143
|
+
1
|
|
94144
|
+
),
|
|
94145
|
+
],
|
|
94146
|
+
1
|
|
94147
|
+
),
|
|
94148
|
+
])
|
|
94063
94149
|
};
|
|
94064
94150
|
var __vue_staticRenderFns__$l = [];
|
|
94065
94151
|
__vue_render__$l._withStripped = true;
|
|
@@ -94067,11 +94153,11 @@ __vue_render__$l._withStripped = true;
|
|
|
94067
94153
|
/* style */
|
|
94068
94154
|
const __vue_inject_styles__$l = function (inject) {
|
|
94069
94155
|
if (!inject) return
|
|
94070
|
-
inject("data-v-
|
|
94156
|
+
inject("data-v-8b5c7bd8_0", { source: "/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n[data-v-8b5c7bd8]:export {\n menuColor: #bfcbd9;\n menuLightColor: rgba(0, 0, 0, 0.7);\n menuColorActive: #f4f4f5;\n menuBackground: #304156;\n menuLightBackground: #ffffff;\n subMenuBackground: #1f2d3d;\n subMenuHover: #001528;\n sideBarWidth: 200px;\n logoTitleColor: #ffffff;\n logoLightTitleColor: #001529;\n}\n.app-wrapper[data-v-8b5c7bd8] {\n position: relative;\n height: 100%;\n width: 100%;\n}\n.app-wrapper[data-v-8b5c7bd8]:after {\n content: \"\";\n display: table;\n clear: both;\n}\n.app-wrapper.mobile.openSidebar[data-v-8b5c7bd8] {\n position: fixed;\n top: 0;\n}\n.drawer-bg[data-v-8b5c7bd8] {\n background: #000;\n opacity: 0.3;\n width: 100%;\n top: 0;\n height: 100%;\n position: absolute;\n z-index: 999;\n}\n.fixed-header[data-v-8b5c7bd8] {\n position: fixed;\n top: 0;\n right: 0;\n z-index: 9;\n width: calc(100% - 200px);\n transition: width 0.28s;\n}\n.hideSidebar .fixed-header[data-v-8b5c7bd8] {\n width: calc(100% - 54px);\n}\n.sidebarHide .fixed-header[data-v-8b5c7bd8] {\n width: 100%;\n}\n.mobile .fixed-header[data-v-8b5c7bd8] {\n width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */", map: {"version":3,"sources":["layout.vue","D:\\workspace-my\\gitee\\rollup-demo\\lib\\packages\\layout\\layout.vue"],"names":[],"mappings":"AAAA;;;;;;;;;;;;CAYC;AACD;EACE,kBAAkB;EAClB,kCAAkC;EAClC,wBAAwB;EACxB,uBAAuB;EACvB,4BAA4B;EAC5B,0BAA0B;EAC1B,qBAAqB;EACrB,mBAAmB;EACnB,uBAAuB;EACvB,4BAA4B;AAC9B;ACuDA;EAEA,kBAAA;EACA,YAAA;EACA,WAAA;ADrDA;AACA;EACE,WAAW;EACX,cAAc;EACd,WAAW;AACb;ACiDA;EACA,eAAA;EACA,MAAA;AD/CA;ACkDA;EACA,gBAAA;EACA,YAAA;EACA,WAAA;EACA,MAAA;EACA,YAAA;EACA,kBAAA;EACA,YAAA;AD/CA;ACiDA;EACA,eAAA;EACA,MAAA;EACA,QAAA;EACA,UAAA;EACA,yBAAA;EACA,uBAAA;AD9CA;ACgDA;EACA,wBAAA;AD7CA;AC+CA;EACA,WAAA;AD5CA;AC8CA;EACA,WAAA;AD3CA;;AAEA,qCAAqC","file":"layout.vue","sourcesContent":["/**\n$base-menu-color:hsla(0,0%,100%,.65);\n$base-menu-color-active:#fff;\n$base-menu-background:#001529;\n$base-logo-title-color: #ffffff;\n\n$base-menu-light-color:rgba(0,0,0,.70);\n$base-menu-light-background:#ffffff;\n$base-logo-light-title-color: #001529;\n\n$base-sub-menu-background:#000c17;\n$base-sub-menu-hover:#001528;\n*/\n:export {\n menuColor: #bfcbd9;\n menuLightColor: rgba(0, 0, 0, 0.7);\n menuColorActive: #f4f4f5;\n menuBackground: #304156;\n menuLightBackground: #ffffff;\n subMenuBackground: #1f2d3d;\n subMenuHover: #001528;\n sideBarWidth: 200px;\n logoTitleColor: #ffffff;\n logoLightTitleColor: #001529;\n}\n\n.app-wrapper {\n position: relative;\n height: 100%;\n width: 100%;\n}\n.app-wrapper:after {\n content: \"\";\n display: table;\n clear: both;\n}\n.app-wrapper.mobile.openSidebar {\n position: fixed;\n top: 0;\n}\n\n.drawer-bg {\n background: #000;\n opacity: 0.3;\n width: 100%;\n top: 0;\n height: 100%;\n position: absolute;\n z-index: 999;\n}\n\n.fixed-header {\n position: fixed;\n top: 0;\n right: 0;\n z-index: 9;\n width: calc(100% - 200px);\n transition: width 0.28s;\n}\n\n.hideSidebar .fixed-header {\n width: calc(100% - 54px);\n}\n\n.sidebarHide .fixed-header {\n width: 100%;\n}\n\n.mobile .fixed-header {\n width: 100%;\n}\n\n/*# sourceMappingURL=layout.vue.map */","<template>\r\n <div class=\"app\">\r\n <div :class=\"classObj\" class=\"app-wrapper\" :style=\"{ '--current-color': theme }\">\r\n <div v-if=\"device === 'mobile' && sidebar.opened\" class=\"drawer-bg\" @click=\"handleClickOutside\" />\r\n <Sidebar v-if=\"!sidebar.hide\" class=\"sidebar-container\" />\r\n <div :class=\"{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }\" class=\"main-container\">\r\n <div :class=\"{ 'fixed-header': fixedHeader }\">\r\n <Navbar />\r\n <TagsView v-if=\"needTagsView\" />\r\n </div>\r\n <AppMain></AppMain>\r\n <RightPanel>\r\n <Settings></Settings>\r\n </RightPanel>\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex'\r\nimport variables from './scss/variables.module.scss'\r\nimport AppMain from './components/AppMain.vue'\r\nimport Navbar from './components/Navbar.vue'\r\nimport Sidebar from './components/Sidebar/index.vue'\r\nimport TagsView from './components/TagsView/index.vue'\r\nimport RightPanel from './components/RightPanel/index.vue'\r\nimport Settings from './components/Settings/index.vue'\r\n\r\nexport default {\r\n name: 'z-layout',\r\n components: {\r\n AppMain,\r\n Navbar,\r\n Sidebar,\r\n TagsView,\r\n RightPanel,\r\n Settings\r\n },\r\n computed: {\r\n ...mapState({\r\n theme: (state) => state['z-settings'].theme,\r\n sideTheme: (state) => state['z-settings'].sideTheme,\r\n sidebar: (state) => state['z-app'].sidebar,\r\n device: (state) => state['z-app'].device,\r\n needTagsView: (state) => state['z-settings'].tagsView,\r\n fixedHeader: (state) => state['z-settings'].fixedHeader\r\n }),\r\n classObj() {\r\n return {\r\n hideSidebar: !this.sidebar.opened,\r\n openSidebar: this.sidebar.opened,\r\n withoutAnimation: this.sidebar.withoutAnimation,\r\n mobile: this.device === 'mobile'\r\n }\r\n },\r\n variables() {\r\n return variables\r\n }\r\n },\r\n methods: {\r\n handleClickOutside() {\r\n this.$store.dispatch('z-app/closeSideBar', { withoutAnimation: false })\r\n }\r\n },\r\n metaInfo() {\r\n return {\r\n title: this.$store.state['z-settings'].dynamicTitle && this.$store.state['z-settings'].title,\r\n titleTemplate: (title) => {\r\n return title ? `${title} - ${this.$z.title}` : this.$z.title\r\n }\r\n }\r\n }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n@import './scss/mixin.scss';\r\n@import './scss/variables.module.scss';\r\n.app-wrapper {\r\n @include clearfix;\r\n position: relative;\r\n height: 100%;\r\n width: 100%;\r\n &.mobile.openSidebar {\r\n position: fixed;\r\n top: 0;\r\n }\r\n}\r\n.drawer-bg {\r\n background: #000;\r\n opacity: 0.3;\r\n width: 100%;\r\n top: 0;\r\n height: 100%;\r\n position: absolute;\r\n z-index: 999;\r\n}\r\n.fixed-header {\r\n position: fixed;\r\n top: 0;\r\n right: 0;\r\n z-index: 9;\r\n width: calc(100% - #{$base-sidebar-width});\r\n transition: width 0.28s;\r\n}\r\n.hideSidebar .fixed-header {\r\n width: calc(100% - 54px);\r\n}\r\n.sidebarHide .fixed-header {\r\n width: 100%;\r\n}\r\n.mobile .fixed-header {\r\n width: 100%;\r\n}\r\n</style>\r\n"]}, media: undefined });
|
|
94071
94157
|
|
|
94072
94158
|
};
|
|
94073
94159
|
/* scoped */
|
|
94074
|
-
const __vue_scope_id__$l = "data-v-
|
|
94160
|
+
const __vue_scope_id__$l = "data-v-8b5c7bd8";
|
|
94075
94161
|
/* module identifier */
|
|
94076
94162
|
const __vue_module_identifier__$l = undefined;
|
|
94077
94163
|
/* functional template */
|