UNPKG

@charrue/layout

Version:

基于vue2与element-ui, 解决中后台布局的问题,提供自动生成菜单与定制页面布局, 提供自动生成菜单与定制页面布局

3 lines (2 loc) 16.6 kB
var q=Object.defineProperty,Z=Object.defineProperties,G=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,J=Object.prototype.hasOwnProperty,Q=Object.prototype.propertyIsEnumerable,A=(e,r,t)=>r in e?q(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,X=(e,r)=>{for(var t in r||(r={}))J.call(r,t)&&A(e,t,r[t]);if(E)for(var t of E(r))Q.call(r,t)&&A(e,t,r[t]);return e},Y=(e,r)=>Z(e,G(r));function M(e){return e.replace(/\/\//g,"/")}function O(e){return typeof e=="function"}const k=/(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/g;function V(e){return k.test(e)}function D(e){const r=e.split("/").filter(t=>t);return r.map((t,a)=>`/${r.slice(0,a+1).join("/")}`)}function T(e,r=""){return e.map(t=>{let{path:a}=t;if(r=M(r),a&&!V(a)){const i=a[0]==="/";a&&(a=r&&i?a:`${r}/${a}`)}a=M(a);const s=Y(X({},t),{path:a,parentPath:r});return t.children&&(s.children=T(t.children,`${r}/${t.path}`)),s})}function ee(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 a=t(e);for(;a&&a.length>0;)a=t(a);return r}function te(e){for(var r=[],t=0;t<e.length;){var a=e[t];if(a==="*"||a==="+"||a==="?"){r.push({type:"MODIFIER",index:t,value:e[t++]});continue}if(a==="\\"){r.push({type:"ESCAPED_CHAR",index:t++,value:e[t++]});continue}if(a==="{"){r.push({type:"OPEN",index:t,value:e[t++]});continue}if(a==="}"){r.push({type:"CLOSE",index:t,value:e[t++]});continue}if(a===":"){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(a==="("){var c=1,n="",i=t+1;if(e[i]==="?")throw new TypeError('Pattern cannot start with "?" at '.concat(i));for(;i<e.length;){if(e[i]==="\\"){n+=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));n+=e[i++]}if(c)throw new TypeError("Unbalanced pattern at ".concat(t));if(!n)throw new TypeError("Missing pattern at ".concat(t));r.push({type:"PATTERN",index:t,value:n}),t=i;continue}r.push({type:"CHAR",index:t,value:e[t++]})}return r.push({type:"END",index:t,value:""}),r}function re(e,r){r===void 0&&(r={});for(var t=te(e),a=r.prefixes,s=a===void 0?"./":a,i="[^".concat(g(r.delimiter||"/#?"),"]+?"),o=[],c=0,n=0,h="",l=function(_){if(n<t.length&&t[n].type===_)return t[n++].value},b=function(_){var v=l(_);if(v!==void 0)return v;var m=t[n],S=m.type,P=m.index;throw new TypeError("Unexpected ".concat(S," at ").concat(P,", expected ").concat(_))},R=function(){for(var _="",v;v=l("CHAR")||l("ESCAPED_CHAR");)_+=v;return _};n<t.length;){var C=l("CHAR"),I=l("NAME"),y=l("PATTERN");if(I||y){var f=C||"";s.indexOf(f)===-1&&(h+=f,f=""),h&&(o.push(h),h=""),o.push({name:I||c++,prefix:f,suffix:"",pattern:y||i,modifier:l("MODIFIER")||""});continue}var d=C||l("ESCAPED_CHAR");if(d){h+=d;continue}h&&(o.push(h),h="");var x=l("OPEN");if(x){var f=R(),$=l("NAME")||"",u=l("PATTERN")||"",p=R();b("CLOSE"),o.push({name:$||(u?c++:""),pattern:$&&!u?i:u,prefix:f,suffix:p,modifier:l("MODIFIER")||""});continue}b("END")}return o}function g(e){return e.replace(/([.+*?=^!:${}()[\]|/\\])/g,"\\$1")}function F(e){return e&&e.sensitive?"":"i"}function ae(e,r){if(!r)return e;for(var t=/\((?:\?<(.*?)>)?(?!\?)/g,a=0,s=t.exec(e.source);s;)r.push({name:s[1]||a++,prefix:"",suffix:"",modifier:"",pattern:""}),s=t.exec(e.source);return e}function ne(e,r,t){var a=e.map(function(s){return j(s,r,t).source});return new RegExp("(?:".concat(a.join("|"),")"),F(t))}function ie(e,r,t){return oe(re(e,t),r,t)}function oe(e,r,t){t===void 0&&(t={});for(var a=t.strict,s=a===void 0?!1:a,i=t.start,o=i===void 0?!0:i,c=t.end,n=c===void 0?!0:c,h=t.encode,l=h===void 0?function(P){return P}:h,b=t.delimiter,R=b===void 0?"/#?":b,C=t.endsWith,I=C===void 0?"":C,y="[".concat(g(I),"]|$"),f="[".concat(g(R),"]"),d=o?"^":"",x=0,$=e;x<$.length;x++){var u=$[x];if(typeof u=="string")d+=g(l(u));else{var p=g(l(u.prefix)),_=g(l(u.suffix));if(u.pattern)if(r&&r.push(u),p||_)if(u.modifier==="+"||u.modifier==="*"){var v=u.modifier==="*"?"?":"";d+="(?:".concat(p,"((?:").concat(u.pattern,")(?:").concat(_).concat(p,"(?:").concat(u.pattern,"))*)").concat(_,")").concat(v)}else d+="(?:".concat(p,"(").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(p).concat(_,")").concat(u.modifier)}}if(n)s||(d+="".concat(f,"?")),d+=t.endsWith?"(?=".concat(y,")"):"$";else{var m=e[e.length-1],S=typeof m=="string"?f.indexOf(m[m.length-1])>-1:m===void 0;s||(d+="(?:".concat(f,"(?=").concat(y,"))?")),S||(d+="(?=".concat(f,"|").concat(y,")"))}return new RegExp(d,F(t))}function j(e,r,t){return e instanceof RegExp?ae(e,r):Array.isArray(e)?ne(e,r,t):ie(e,r,t)}var se={name:"SidebarItem",props:{menuItem:{type:Object,required:!0},prefixIconClass:String,menuTextClass:String,route:Boolean},computed:{subMenuComponent(){return this.charrueLayoutConfig.subMenu}}};const ue=se;var z=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(a){return t("sidebar-item",{key:a.path,attrs:{route:e.route,"is-nest":!0,"menu-item":a,"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)},ce=[];z._withStripped=!0;const le=void 0,de=void 0,_e=!1;function he(e,r,t,a,s,i,o,c){const n=(typeof t=="function"?t.options:t)||{};return n.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/SidebarItem.vue",n.render||(n.render=e.render,n.staticRenderFns=e.staticRenderFns,n._compiled=!0,s&&(n.functional=!0)),n._scopeId=a,n}var fe=he({render:z,staticRenderFns:ce},le,ue,de,_e),pe=Object.defineProperty,L=Object.getOwnPropertySymbols,ve=Object.prototype.hasOwnProperty,me=Object.prototype.propertyIsEnumerable,W=(e,r,t)=>r in e?pe(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,H=(e,r)=>{for(var t in r||(r={}))ve.call(r,t)&&W(e,t,r[t]);if(L)for(var t of L(r))me.call(r,t)&&W(e,t,r[t]);return e},ye={name:"GlobalAside",components:{SidebarItem:fe},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 a=this.formatMenuData({menu:r,index:t,deep:0,path:r.path,parent:null});a&&e.push(a)}),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=>j(s).test(e)):null;r?this.activeRoutePath=this.regexToPath[r]:this.activeRoutePath=e;const t=D(this.activeRoutePath),a=this.menuDataPathMapping[this.activeRoutePath];a&&a.parentPath&&D(a.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=T(e),this.menuDataPathMapping=ee(this.menuData)},_formatMenuData({menu:e,deep:r,index:t,path:a,parent:s}={}){const i=e?H({},e):{};return this.authorized?O(this.authorized)&&!this.authorized({menu:i,deep:r,index:t,path:a,parent:s})?!1:(i.children=i.children||[],Array.isArray(i.children)&&i.children.length>0&&(i.children=i.children.map(o=>{const c=a.startsWith("/")?o.path:`${a}/${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:a,parent:s}={}){const i=e?H({},e):{};return this.authorized?O(this.authorized)&&!this.authorized({menu:i,deep:r,index:t,path:a,parent:s})?!1:(i.children=i.children||[],Array.isArray(i.children)&&i.children.length>0&&(i.children=i.children.map(o=>{const c=a.startsWith("/")?o.path:`${a}/${o.path}`;return this.formatMenuData({menu:o,deep:r+1,index:t,path:c,parent:i})}).filter(o=>o)),i):i}}};const ge=ye;var B=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(a){return t("sidebar-item",{key:a.path,attrs:{route:e.route,"menu-item":a}})}),1),e._v(" "),e._t("sidebar-bottom")],2)])},be=[];B._withStripped=!0;const Ce=void 0,xe=void 0,$e=!1;function we(e,r,t,a,s,i,o,c){const n=(typeof t=="function"?t.options:t)||{};return n.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/LayoutSidebar.vue",n.render||(n.render=e.render,n.staticRenderFns=e.staticRenderFns,n._compiled=!0,s&&(n.functional=!0)),n._scopeId=a,n}var Re=we({render:B,staticRenderFns:be},Ce,ge,xe,$e),Ie={name:"LayoutContent",props:{animation:{type:Boolean,default:!0}}};const Se=Ie;var N=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)])},Pe=[];N._withStripped=!0;const Ee=void 0,Ae=void 0,Me=!1;function Oe(e,r,t,a,s,i,o,c){const n=(typeof t=="function"?t.options:t)||{};return n.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/LayoutContent.vue",n.render||(n.render=e.render,n.staticRenderFns=e.staticRenderFns,n._compiled=!0,s&&(n.functional=!0)),n._scopeId=a,n}var De=Oe({render:N,staticRenderFns:Pe},Ee,Se,Ae,Me),Te={name:"HamburgerTrigger",props:{isActive:{type:Boolean,default:!1}},emits:["toggle-click"],methods:{toggleClick(){this.$emit("toggle-click",this.isActive)}}};const Fe=Te;var U=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"}})])])},je=[];U._withStripped=!0;const ze=void 0,Le=void 0,We=!1;function He(e,r,t,a,s,i,o,c){const n=(typeof t=="function"?t.options:t)||{};return n.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/Hamburger.vue",n.render||(n.render=e.render,n.staticRenderFns=e.staticRenderFns,n._compiled=!0,s&&(n.functional=!0)),n._scopeId=a,n}var Be=He({render:U,staticRenderFns:je},ze,Fe,Le,We),Ne={name:"CharrueLayout",components:{LayoutSidebar:Re,LayoutContent:De,Hamburger:Be},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 Ue=Ne;var K=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)},Ke=[];K._withStripped=!0;const qe=void 0,Ze=void 0,Ge=!1;function Je(e,r,t,a,s,i,o,c){const n=(typeof t=="function"?t.options:t)||{};return n.__file="/usr/charrue/charrue-layout/packages/layout-internal/src/Layout.vue",n.render||(n.render=e.render,n.staticRenderFns=e.staticRenderFns,n._compiled=!0,s&&(n.functional=!0)),n._scopeId=a,n}var w=Je({render:K,staticRenderFns:Ke},qe,Ue,Ze,Ge),Qe={install(e){e.version.charAt(0)==="2"?(e.prototype.charrueLayoutConfig={subMenu:"el-submenu"},e.component(w.name,w)):(e.config.globalProperties.charrueLayoutConfig={subMenu:"el-sub-menu"},e.component(w.name,w))}};const Xe=w,Ye=Xe;export{Ye as Layout,Qe as default}; //# sourceMappingURL=index.min.mjs.map