@charrue/layout
Version:
基于vue2与element-ui, 解决中后台布局的问题,提供自动生成菜单与定制页面布局, 提供自动生成菜单与定制页面布局
3 lines (2 loc) • 16.9 kB
JavaScript
(function(p,C){typeof exports=="object"&&typeof module<"u"?C(exports):typeof define=="function"&&define.amd?define(["exports"],C):(p=typeof globalThis<"u"?globalThis:p||self,C(p.CharrueLayout={}))})(this,function(p){"use strict";var C=Object.defineProperty,G=Object.defineProperties,J=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,Q=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable,O=(e,r,t)=>r in e?C(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,Y=(e,r)=>{for(var t in r||(r={}))Q.call(r,t)&&O(e,t,r[t]);if(M)for(var t of M(r))X.call(r,t)&&O(e,t,r[t]);return e},k=(e,r)=>G(e,J(r));function D(e){return e.replace(/\/\//g,"/")}function T(e){return typeof e=="function"}const V=/(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/g;function ee(e){return V.test(e)}function j(e){const r=e.split("/").filter(t=>t);return r.map((t,n)=>`/${r.slice(0,n+1).join("/")}`)}function F(e,r=""){return e.map(t=>{let{path:n}=t;if(r=D(r),n&&!ee(n)){const i=n[0]==="/";n&&(n=r&&i?n:`${r}/${n}`)}n=D(n);const s=k(Y({},t),{path:n,parentPath:r});return t.children&&(s.children=F(t.children,`${r}/${t.path}`)),s})}function te(e){const r={},t=s=>{const i=[];return s.forEach(o=>{r[o.path]=o,o.children&&Array.isArray(o.children)&&o.children.length>0&&i.push(...o.children)}),i};let n=t(e);for(;n&&n.length>0;)n=t(n);return r}function re(e){for(var r=[],t=0;t<e.length;){var n=e[t];if(n==="*"||n==="+"||n==="?"){r.push({type:"MODIFIER",index:t,value:e[t++]});continue}if(n==="\\"){r.push({type:"ESCAPED_CHAR",index:t++,value:e[t++]});continue}if(n==="{"){r.push({type:"OPEN",index:t,value:e[t++]});continue}if(n==="}"){r.push({type:"CLOSE",index:t,value:e[t++]});continue}if(n===":"){for(var s="",i=t+1;i<e.length;){var o=e.charCodeAt(i);if(o>=48&&o<=57||o>=65&&o<=90||o>=97&&o<=122||o===95){s+=e[i++];continue}break}if(!s)throw new TypeError("Missing parameter name at ".concat(t));r.push({type:"NAME",index:t,value:s}),t=i;continue}if(n==="("){var c=1,a="",i=t+1;if(e[i]==="?")throw new TypeError('Pattern cannot start with "?" at '.concat(i));for(;i<e.length;){if(e[i]==="\\"){a+=e[i++]+e[i++];continue}if(e[i]===")"){if(c--,c===0){i++;break}}else if(e[i]==="("&&(c++,e[i+1]!=="?"))throw new TypeError("Capturing groups are not allowed at ".concat(i));a+=e[i++]}if(c)throw new TypeError("Unbalanced pattern at ".concat(t));if(!a)throw new TypeError("Missing pattern at ".concat(t));r.push({type:"PATTERN",index:t,value:a}),t=i;continue}r.push({type:"CHAR",index:t,value:e[t++]})}return r.push({type:"END",index:t,value:""}),r}function ne(e,r){r===void 0&&(r={});for(var t=re(e),n=r.prefixes,s=n===void 0?"./":n,i="[^".concat(g(r.delimiter||"/#?"),"]+?"),o=[],c=0,a=0,f="",l=function(_){if(a<t.length&&t[a].type===_)return t[a++].value},x=function(_){var m=l(_);if(m!==void 0)return m;var y=t[a],E=y.type,A=y.index;throw new TypeError("Unexpected ".concat(E," at ").concat(A,", expected ").concat(_))},P=function(){for(var _="",m;m=l("CHAR")||l("ESCAPED_CHAR");)_+=m;return _};a<t.length;){var w=l("CHAR"),S=l("NAME"),b=l("PATTERN");if(S||b){var h=w||"";s.indexOf(h)===-1&&(f+=h,h=""),f&&(o.push(f),f=""),o.push({name:S||c++,prefix:h,suffix:"",pattern:b||i,modifier:l("MODIFIER")||""});continue}var d=w||l("ESCAPED_CHAR");if(d){f+=d;continue}f&&(o.push(f),f="");var R=l("OPEN");if(R){var h=P(),I=l("NAME")||"",u=l("PATTERN")||"",v=P();x("CLOSE"),o.push({name:I||(u?c++:""),pattern:I&&!u?i:u,prefix:h,suffix:v,modifier:l("MODIFIER")||""});continue}x("END")}return o}function g(e){return e.replace(/([.+*?=^!:${}()[\]|/\\])/g,"\\$1")}function z(e){return e&&e.sensitive?"":"i"}function ae(e,r){if(!r)return e;for(var t=/\((?:\?<(.*?)>)?(?!\?)/g,n=0,s=t.exec(e.source);s;)r.push({name:s[1]||n++,prefix:"",suffix:"",modifier:"",pattern:""}),s=t.exec(e.source);return e}function ie(e,r,t){var n=e.map(function(s){return L(s,r,t).source});return new RegExp("(?:".concat(n.join("|"),")"),z(t))}function oe(e,r,t){return se(ne(e,t),r,t)}function se(e,r,t){t===void 0&&(t={});for(var n=t.strict,s=n===void 0?!1:n,i=t.start,o=i===void 0?!0:i,c=t.end,a=c===void 0?!0:c,f=t.encode,l=f===void 0?function(A){return A}:f,x=t.delimiter,P=x===void 0?"/#?":x,w=t.endsWith,S=w===void 0?"":w,b="[".concat(g(S),"]|$"),h="[".concat(g(P),"]"),d=o?"^":"",R=0,I=e;R<I.length;R++){var u=I[R];if(typeof u=="string")d+=g(l(u));else{var v=g(l(u.prefix)),_=g(l(u.suffix));if(u.pattern)if(r&&r.push(u),v||_)if(u.modifier==="+"||u.modifier==="*"){var m=u.modifier==="*"?"?":"";d+="(?:".concat(v,"((?:").concat(u.pattern,")(?:").concat(_).concat(v,"(?:").concat(u.pattern,"))*)").concat(_,")").concat(m)}else d+="(?:".concat(v,"(").concat(u.pattern,")").concat(_,")").concat(u.modifier);else u.modifier==="+"||u.modifier==="*"?d+="((?:".concat(u.pattern,")").concat(u.modifier,")"):d+="(".concat(u.pattern,")").concat(u.modifier);else d+="(?:".concat(v).concat(_,")").concat(u.modifier)}}if(a)s||(d+="".concat(h,"?")),d+=t.endsWith?"(?=".concat(b,")"):"$";else{var y=e[e.length-1],E=typeof y=="string"?h.indexOf(y[y.length-1])>-1:y===void 0;s||(d+="(?:".concat(h,"(?=").concat(b,"))?")),E||(d+="(?=".concat(h,"|").concat(b,")"))}return new RegExp(d,z(t))}function L(e,r,t){return e instanceof RegExp?ae(e,r):Array.isArray(e)?ie(e,r,t):oe(e,r,t)}var ue={name:"SidebarItem",props:{menuItem:{type:Object,required:!0},prefixIconClass:String,menuTextClass:String,route:Boolean},computed:{subMenuComponent(){return this.charrueLayoutConfig.subMenu}}};const ce=ue;var W=function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("div",{staticClass:"charrue-sidebar-menu-children"},[e.menuItem.children&&e.menuItem.children.length>0?t(e.subMenuComponent,{tag:"component",attrs:{index:e.menuItem.path,"popper-append-to-body":""},scopedSlots:e._u([{key:"title",fn:function(){return[t("div",{staticClass:"charrue-submenu-title",class:[e.menuItem.icon?"charrue-submenu-title-with-icon":""]},[t("i",{staticClass:"charrue-sidebar-menu-icon",class:[e.prefixIconClass,e.menuItem.icon]}),e._v(" "),t("span",{staticClass:"charrue-sidebar-menu-title",class:[e.menuTextClass]},[e._v(e._s(e.menuItem.title))])])]},proxy:!0}],null,!1,415423893)},[e._v(" "),e._l(e.menuItem.children,function(n){return t("sidebar-item",{key:n.path,attrs:{route:e.route,"is-nest":!0,"menu-item":n,"sub-menu-component":e.subMenuComponent}})})],2):[e.route?t("router-link",{staticClass:"charrue-menu-router-link",attrs:{to:e.menuItem.path}},[t("el-menu-item",{attrs:{index:e.menuItem.path},scopedSlots:e._u([{key:"title",fn:function(){return[t("span",{staticClass:"charrue-sidebar-menu-title",class:[e.menuTextClass]},[e._v(e._s(e.menuItem.title))])]},proxy:!0}],null,!1,1324301685)},[t("i",{staticClass:"charrue-sidebar-menu-icon",class:[e.prefixIconClass,e.menuItem.icon]})])],1):t("el-menu-item",{attrs:{index:e.menuItem.path},scopedSlots:e._u([{key:"title",fn:function(){return[t("span",{staticClass:"charrue-sidebar-menu-title",class:[e.menuTextClass]},[e._v(e._s(e.menuItem.title))])]},proxy:!0}])},[t("i",{staticClass:"charrue-sidebar-menu-icon",class:[e.prefixIconClass,e.menuItem.icon]})])]],2)},le=[];W._withStripped=!0;const de=void 0,_e=void 0,fe=!1;function he(e,r,t,n,s,i,o,c){const a=(typeof t=="function"?t.options:t)||{};return a.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/SidebarItem.vue",a.render||(a.render=e.render,a.staticRenderFns=e.staticRenderFns,a._compiled=!0,s&&(a.functional=!0)),a._scopeId=n,a}var pe=he({render:W,staticRenderFns:le},de,ce,_e,fe),ve=Object.defineProperty,H=Object.getOwnPropertySymbols,me=Object.prototype.hasOwnProperty,ye=Object.prototype.propertyIsEnumerable,B=(e,r,t)=>r in e?ve(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,N=(e,r)=>{for(var t in r||(r={}))me.call(r,t)&&B(e,t,r[t]);if(H)for(var t of H(r))ye.call(r,t)&&B(e,t,r[t]);return e},ge={name:"GlobalAside",components:{SidebarItem:pe},props:{data:{type:Array,default(){return[]}},collapsed:{type:Boolean,default:!1},logo:String,title:String,route:{type:Boolean,default:!0},absolute:{type:Boolean,default:!1},authorized:Function,sidebarWidth:{type:Array,default(){return[54,200]}},regexToPath:{type:Object},homeUrl:{type:String,default:"/"}},data(){return{openKeys:[],activeRoutePath:"",menuData:[],menuDataPathMapping:{}}},computed:{width(){return this.collapsed?`${this.sidebarWidth[0]}px`:`${this.sidebarWidth[1]}px`},computedMenuData(){const e=[];return this.menuData.forEach((r,t)=>{const n=this.formatMenuData({menu:r,index:t,deep:0,path:r.path,parent:null});n&&e.push(n)}),e}},watch:{data:{handler(){this.filterAsideMenuData()},immediate:!0,deep:!0}},created(){this.route&&this.$watch("$route.path",e=>{const r=this.regexToPath?Object.keys(this.regexToPath).find(s=>L(s).test(e)):null;r?this.activeRoutePath=this.regexToPath[r]:this.activeRoutePath=e;const t=j(this.activeRoutePath),n=this.menuDataPathMapping[this.activeRoutePath];n&&n.parentPath&&j(n.parentPath).forEach(s=>{t.includes(s)||t.push(s)}),this.openKeys=t},{immediate:!0})},methods:{filterAsideMenuData(){const e=this.data.filter(r=>r.title&&!r.hide).map(r=>(this.authorized&&this.authorized(r.authority,r),r)).filter(r=>!!r);this.menuData=F(e),this.menuDataPathMapping=te(this.menuData)},_formatMenuData({menu:e,deep:r,index:t,path:n,parent:s}={}){const i=e?N({},e):{};return this.authorized?T(this.authorized)&&!this.authorized({menu:i,deep:r,index:t,path:n,parent:s})?!1:(i.children=i.children||[],Array.isArray(i.children)&&i.children.length>0&&(i.children=i.children.map(o=>{const c=n.startsWith("/")?o.path:`${n}/${o.path}`;return this._formatMenuData({menu:o,deep:r+1,index:t,path:c,parent:i})}).filter(o=>o)),i):i},formatMenuData({menu:e,deep:r,index:t,path:n,parent:s}={}){const i=e?N({},e):{};return this.authorized?T(this.authorized)&&!this.authorized({menu:i,deep:r,index:t,path:n,parent:s})?!1:(i.children=i.children||[],Array.isArray(i.children)&&i.children.length>0&&(i.children=i.children.map(o=>{const c=n.startsWith("/")?o.path:`${n}/${o.path}`;return this.formatMenuData({menu:o,deep:r+1,index:t,path:c,parent:i})}).filter(o=>o)),i):i}}};const be=ge;var U=function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("div",{staticClass:"charrue-sidebar-root"},[t("div",{staticClass:"charrue-sidebar-placeholder",style:{width:e.width}}),e._v(" "),t("div",{staticClass:"charrue-sidebar-inner",style:{width:e.width,position:e.absolute?"absolute":"fixed"}},[e.logo||e.title?t("div",{staticClass:"charrue-logo-container"},[t("router-link",{staticClass:"menu-router-link",attrs:{to:e.homeUrl}},[e.logo?t("img",{attrs:{src:e.logo,alt:"logo"}}):e._e(),e._v(" "),e.title?t("h1",[e._v(e._s(e.title))]):e._e()])],1):e._e(),e._v(" "),e._t("sidebar-top"),e._v(" "),t("el-menu",{staticClass:"charrue-sidebar-menu-root",attrs:{mode:"vertical","unique-opened":"",collapse:e.collapsed,"default-active":e.activeRoutePath,"default-openeds":e.openKeys}},e._l(e.computedMenuData,function(n){return t("sidebar-item",{key:n.path,attrs:{route:e.route,"menu-item":n}})}),1),e._v(" "),e._t("sidebar-bottom")],2)])},Ce=[];U._withStripped=!0;const $e=void 0,xe=void 0,we=!1;function Re(e,r,t,n,s,i,o,c){const a=(typeof t=="function"?t.options:t)||{};return a.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/LayoutSidebar.vue",a.render||(a.render=e.render,a.staticRenderFns=e.staticRenderFns,a._compiled=!0,s&&(a.functional=!0)),a._scopeId=n,a}var Ie=Re({render:U,staticRenderFns:Ce},$e,be,xe,we),Pe={name:"LayoutContent",props:{animation:{type:Boolean,default:!0}}};const Se=Pe;var K=function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("section",{staticClass:"charrue-content"},[t("div",{staticClass:"charrue-content-header"},[e._t("content-header")],2),e._v(" "),t("div",{staticClass:"charrue-content-body"},[e.animation?[t("transition",{attrs:{name:"fade-transform",mode:"out-in"}},[e._t("content")],2)]:[e._t("content")]],2),e._v(" "),t("div",{staticClass:"charrue-content-footer"},[e._t("content-footer")],2)])},Ee=[];K._withStripped=!0;const Ae=void 0,Me=void 0,Oe=!1;function De(e,r,t,n,s,i,o,c){const a=(typeof t=="function"?t.options:t)||{};return a.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/LayoutContent.vue",a.render||(a.render=e.render,a.staticRenderFns=e.staticRenderFns,a._compiled=!0,s&&(a.functional=!0)),a._scopeId=n,a}var Te=De({render:K,staticRenderFns:Ee},Ae,Se,Me,Oe),je={name:"HamburgerTrigger",props:{isActive:{type:Boolean,default:!1}},emits:["toggle-click"],methods:{toggleClick(){this.$emit("toggle-click",this.isActive)}}};const Fe=je;var q=function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("div",{staticClass:"charrue-layout-trigger",on:{click:e.toggleClick}},[t("svg",{staticClass:"charrue-layout-default-trigger",class:{"is-active":e.isActive},attrs:{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",width:"64",height:"64"}},[t("path",{attrs:{d:"M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z"}})])])},ze=[];q._withStripped=!0;const Le=void 0,We=void 0,He=!1;function Be(e,r,t,n,s,i,o,c){const a=(typeof t=="function"?t.options:t)||{};return a.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/Hamburger.vue",a.render||(a.render=e.render,a.staticRenderFns=e.staticRenderFns,a._compiled=!0,s&&(a.functional=!0)),a._scopeId=n,a}var Ne=Be({render:q,staticRenderFns:ze},Le,Fe,We,He),Ue={name:"CharrueLayout",components:{LayoutSidebar:Ie,LayoutContent:Te,Hamburger:Ne},props:{collapsed:{type:Boolean,default:!1},fixedHeader:{type:Boolean,default:!0},data:{type:Array,required:!0,default(){return[]}},logo:String,title:String,sidebarWidth:{type:Array,default(){return[54,200]}},animation:{type:Boolean,default:!0},absolute:{type:Boolean,default:!1},route:{type:Boolean,default:!0},authorized:Function,homeUrl:{type:String,default:"/"},regexToPath:{type:Object}},emits:["update:collapsed"],data(){return{innerCollapse:!1}},computed:{mainWidthStyle(){return{width:`calc(100% - ${this.collapsed?this.sidebarWidth[0]:this.sidebarWidth[1]}px)`}},headerWidthStyle(){let e="100%";return this.fixedHeader&&(e=`calc(100% - ${this.collapsed?this.sidebarWidth[0]:this.sidebarWidth[1]}px)`),{width:e}}},watch:{collapsed:{handler(e){this.innerCollapse=e},immediate:!0},innerCollapse(e){this.$emit("update:collapsed",e)}},methods:{toggleSideBar(){this.innerCollapse=!this.innerCollapse}}};const Ke=Ue;var Z=function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("div",{staticClass:"charrue-layout",class:[e.collapsed?"charrue-layout--collapsed":"charrue-layout--opened"]},[t("layout-sidebar",{attrs:{collapsed:e.innerCollapse,data:e.data,logo:e.logo,title:e.title,route:e.route,absolute:e.absolute,authorized:e.authorized,"sidebar-width":e.sidebarWidth,"home-url":e.homeUrl,"regex-to-path":e.regexToPath},scopedSlots:e._u([{key:"sidebar-top",fn:function(){return[e._t("sidebar-top")]},proxy:!0},{key:"sidebar-bottom",fn:function(){return[e._t("sidebar-bottom")]},proxy:!0}],null,!0)}),e._v(" "),t("div",{staticClass:"charrue-layout-body",style:e.mainWidthStyle},[t("div",{staticClass:"charrue-header",class:{"fixed-header":e.fixedHeader},style:e.headerWidthStyle},[t("div",{staticClass:"charrue-header-inner"},[t("div",{staticClass:"charrue-header-left"},[e._t("header-left",function(){return[t("hamburger",{on:{"toggle-click":e.toggleSideBar}})]})],2),e._v(" "),t("div",{staticClass:"charrue-header-right"},[e._t("header-right")],2)])]),e._v(" "),t("layout-content",{attrs:{animation:e.animation},scopedSlots:e._u([{key:"content-header",fn:function(){return[e._t("content-header")]},proxy:!0},{key:"content",fn:function(){return[e._t("default")]},proxy:!0},{key:"content-footer",fn:function(){return[e._t("content-footer")]},proxy:!0}],null,!0)})],1)],1)},qe=[];Z._withStripped=!0;const Ze=void 0,Ge=void 0,Je=!1;function Qe(e,r,t,n,s,i,o,c){const a=(typeof t=="function"?t.options:t)||{};return a.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/Layout.vue",a.render||(a.render=e.render,a.staticRenderFns=e.staticRenderFns,a._compiled=!0,s&&(a.functional=!0)),a._scopeId=n,a}var $=Qe({render:Z,staticRenderFns:qe},Ze,Ke,Ge,Je),Xe={install(e){e.version.charAt(0)==="2"?(e.prototype.charrueLayoutConfig={subMenu:"el-submenu"},e.component($.name,$)):(e.config.globalProperties.charrueLayoutConfig={subMenu:"el-sub-menu"},e.component($.name,$))}};const Ye=$;p.Layout=Ye,p.default=Xe,Object.defineProperty(p,"__esModule",{value:!0})});
//# sourceMappingURL=index.min.js.map