@ditari/bsui 1.0.64 → 1.0.66
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/cjs/components/layout/Main.vue.cjs.js +1 -1
- package/dist/cjs/components/menu/Menu.cjs.js +1 -1
- package/dist/cjs/components/select/Select.vue.cjs.js +1 -1
- package/dist/esm/components/layout/Main.vue.esm.js +18 -16
- package/dist/esm/components/menu/Menu.esm.js +32 -31
- package/dist/esm/components/select/Select.vue.esm.js +46 -50
- package/package.json +1 -1
- package/src/components/layout/Main.vue +9 -6
- package/src/components/menu/Menu.jsx +14 -11
- package/src/components/select/Select.vue +14 -32
- package/src/components/menu/Menu-bak.jsx +0 -98
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),i=require("@ant-design/icons-vue");require("../../store/modules/Breadcrumb.cjs.js");require("../../store/modules/DataDictionary.cjs.js");const y=require("../../store/modules/KeepAlive.cjs.js");require("../../store/modules/Menu.cjs.js");require("../../store/modules/NavTab.cjs.js");const g=require("../../store/modules/Settings.cjs.js");require("../../store/modules/User.cjs.js");const k=require("./NavTabs.vue.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),i=require("@ant-design/icons-vue");require("../../store/modules/Breadcrumb.cjs.js");require("../../store/modules/DataDictionary.cjs.js");const y=require("../../store/modules/KeepAlive.cjs.js");require("../../store/modules/Menu.cjs.js");require("../../store/modules/NavTab.cjs.js");const g=require("../../store/modules/Settings.cjs.js");require("../../store/modules/User.cjs.js");const k=require("./NavTabs.vue.cjs.js"),N=require("./Breadcrumb.vue.cjs.js"),h=require("../menu/Menu.cjs.js"),C={class:"ditari-logo"},V={class:"ditari-menu"},b={class:"ditari-layout-header"},w={class:"ditari-layout-header-left"},S={class:"ditari-user-menu"},B={name:"DMainLayout"},q=e.defineComponent({...B,props:{showConfig:{default:{backBtn:"LeftOutlined"}},breadcrumbStatus:{type:Boolean}},setup(u){const c=u,d=y.useKeepAliveStore(),p=e.computed(()=>d.get),r=g.useSettingsStore(),{switchCollapsed:a}=r,t=e.computed(()=>r.getCollapsed);return e.provide("showConfig",c.showConfig),(n,l)=>{const _=e.resolveComponent("a-layout-sider"),f=e.resolveComponent("router-view"),m=e.resolveComponent("a-layout-content"),s=e.resolveComponent("a-layout"),v=e.resolveComponent("a-back-top");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(s,{class:"ditari-layout"},{default:e.withCtx(()=>[e.createVNode(_,{collapsed:e.unref(t),"onUpdate:collapsed":l[0]||(l[0]=o=>e.isRef(t)?t.value=o:null),trigger:null,collapsible:"",class:"ditari-layout-sider"},{default:e.withCtx(()=>[e.createElementVNode("div",null,[e.createElementVNode("div",C,[e.renderSlot(n.$slots,"logo")]),e.createElementVNode("div",V,[e.createVNode(e.unref(h.default))])])]),_:3},8,["collapsed"]),e.createVNode(s,null,{default:e.withCtx(()=>[e.createElementVNode("div",{class:"ditari-top-layout",style:e.normalizeStyle({left:e.unref(t)?"80px":"200px"})},[e.createVNode(k.default),e.createElementVNode("div",b,[e.createElementVNode("div",w,[e.createElementVNode("div",{class:"ditari-side-collapsed",onClick:l[1]||(l[1]=(...o)=>e.unref(a)&&e.unref(a)(...o))},[e.unref(t)?(e.openBlock(),e.createBlock(e.unref(i.MenuUnfoldOutlined),{key:0,class:"trigger",style:{"font-size":"16px","font-weight":"bold",cursor:"pointer"}})):(e.openBlock(),e.createBlock(e.unref(i.MenuFoldOutlined),{key:1,style:{"font-size":"16px","font-weight":"bold",cursor:"pointer"}}))]),e.createVNode(N.default)]),e.createElementVNode("div",S,[e.renderSlot(n.$slots,"operation")])])],4),e.createVNode(m,{class:"ditari-layout-content",style:e.normalizeStyle({marginLeft:e.unref(t)?"80px":"200px"})},{default:e.withCtx(()=>[e.createVNode(f,null,{default:e.withCtx(({Component:o})=>[e.createVNode(e.Transition,{name:"main",mode:"out-in",appear:""},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.KeepAlive,{ref:"keepAliveRef",include:e.unref(p)},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o),{key:n.$route.path}))],1032,["include"]))]),_:2},1024)]),_:1}),e.renderSlot(n.$slots,"micro")]),_:3},8,["style"])]),_:3})]),_:3}),e.createVNode(v,{class:"ditari-ant-back-top","visibility-height":50})],64)}}});exports.default=q;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),h=require("vue-router"),f=require("pinia"),K=require("../../store/modules/Menu.cjs.js"),U=require("../../store/modules/Settings.cjs.js");function j(o){return typeof o=="function"||Object.prototype.toString.call(o)==="[object Object]"&&!t.isVNode(o)}const q=t.defineComponent({name:"DMenu",setup(){const o=h.useRouter(),g=h.useRoute(),{componentName:c,prop:N}=t.inject("menuIcon"),S=K.useMenuStore(),{list:s,openMenusKeys:u,selectedMenuKeys:l}=f.storeToRefs(S),m=U.useSettingsStore(),{getCollapsed:a}=f.storeToRefs(m);t.watchEffect(()=>{if(a.value)return;const e=l.value.length>0?l.value[0]:"",n=i(s.value,e);u.value=n||[]});function i(e,n){for(let r=0;r<e.length;r++){if(e[r].url===n||n.startsWith(e[r].url))return[e[r].url];if(e[r].children&&e[r].children.length>0){const v=i(e[r].children,n);if(v)return[e[r].url,...v]}}return null}const V=({key:e,keyPath:n})=>{u.value=n,l.value=[e],g.path!==e&&o.push(e).then(r=>r?console.warn(r):null)},M=e=>t.createVNode(t.Fragment,null,[t.createVNode(t.resolveComponent("a-menu-item"),{key:e.url},{icon:()=>d(e),default:()=>e.title})]),y=["anticon","anticon-menu","ant-menu-item-icon"],d=e=>t.createVNode(t.Fragment,null,[e.icon?C(e.icon):t.withDirectives(t.createVNode("div",{className:y},[e.title.substring(0,1)]),[[t.vShow,a.value]])]),C=e=>c==="nativeHtml"?t.createVNode("span",{innerHTML:e},null):t.h(t.resolveComponent(c),{[`${N}`]:e}),p=e=>t.createVNode(t.Fragment,null,[t.createVNode(t.resolveComponent("a-sub-menu"),{key:e.url},{title:()=>e.title,icon:()=>d(e),default:()=>e.children.map(n=>!n.children||n.children.length===0?b(n):p(n))})]),b=e=>t.createVNode(t.Fragment,null,[t.createVNode(t.resolveComponent("a-menu-item"),{key:e.url},{default:()=>e.title})]);return()=>{let e;return t.createVNode(t.Fragment,null,[t.createVNode(t.resolveComponent("a-menu"),{mode:"inline",theme:"dark",openKeys:u.value,"onUpdate:openKeys":n=>u.value=n,selectedKeys:l.value,"onUpdate:selectedKeys":n=>l.value=n,onClick:V},j(e=s.value.map(n=>{var r;return!n.children||((r=n.children)==null?void 0:r.length)===0?M(n):p(n)}))?e:{default:()=>[e]})])}}});exports.default=q;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),x=require("../../store/modules/DataDictionary.cjs.js"),B={name:"DSelect"},y=n.defineComponent({...B,props:{value:{default:null},name:{default:""},disabled:{type:Boolean,default:!1},placeholder:{default:"请填写默认占位符啊！老铁"},include:{default:[]}},emits:["update:value","change","select"],setup(r,{emit:u}){const s=r,{getDicByKey:f}=x.useDataDicStore(),{modelValue:i,data:h,onSearch:M,onSelect:p,onChange:v}=S();function S(){const l=[...f(s.name)],t=n.ref(l),o=n.ref(s.value);n.watch(()=>s.value,e=>{o.value=e,m(e)});const d=e=>{g(e)};function g(e){e=e??"",t.value=l.filter(a=>a.value.toLowerCase().indexOf(e.toLowerCase())!==-1||a.label.toLowerCase().includes(e.toLowerCase())).splice(0,10),t.value.length===0&&(t.value=[...l].splice(0,10))}function m(e){e=e||"";const a=l.findIndex(c=>c.value.toLowerCase().indexOf(e.toLowerCase())!==-1||c.label.toLowerCase().includes(e));a===-1?t.value=[...l].splice(0,10):t.value=b(l,a)}function b(e,a){const c=Math.max(0,a-5),_=Math.min(e.length,a+6);return e.slice(c,_)}const L=e=>{u("update:value",e),D()},w=()=>{u("update:value",o.value),u("change",o.value)};function D(){const a=f(s.name).find(c=>c.value===o.value);u("select",a)}return{data:t,modelValue:o,onSearch:d,onSelect:L,onChange:w}}const C=(l,t)=>t.label.includes(l);return(l,t)=>{const o=n.resolveComponent("a-select");return n.openBlock(),n.createBlock(o,{value:n.unref(i),"onUpdate:value":t[0]||(t[0]=d=>n.isRef(i)?i.value=d:null),"allow-clear":"","show-search":"",options:n.unref(h),placeholder:r.placeholder,disabled:r.disabled,"filter-option":C,onSelect:n.unref(p),onChange:n.unref(v)},null,8,["value","options","placeholder","disabled","onSelect","onChange"])}}});exports.default=y;
|
|
@@ -18,26 +18,28 @@ const V = { class: "ditari-logo" }, T = { class: "ditari-menu" }, j = { class: "
|
|
|
18
18
|
showConfig: { default: { backBtn: "LeftOutlined" } },
|
|
19
19
|
breadcrumbStatus: { type: Boolean }
|
|
20
20
|
},
|
|
21
|
-
setup(
|
|
22
|
-
const
|
|
23
|
-
return x("showConfig",
|
|
21
|
+
setup(v) {
|
|
22
|
+
const g = v, h = E(), k = f(() => h.get), u = F(), { switchCollapsed: m } = u, l = f(() => u.getCollapsed);
|
|
23
|
+
return x("showConfig", g.showConfig), (r, d) => {
|
|
24
24
|
const b = n("a-layout-sider"), C = n("router-view"), w = n("a-layout-content"), _ = n("a-layout"), S = n("a-back-top");
|
|
25
25
|
return a(), B(A, null, [
|
|
26
26
|
t(_, { class: "ditari-layout" }, {
|
|
27
27
|
default: i(() => [
|
|
28
28
|
t(b, {
|
|
29
|
-
collapsed: e(
|
|
30
|
-
"onUpdate:collapsed": d[0] || (d[0] = (
|
|
29
|
+
collapsed: e(l),
|
|
30
|
+
"onUpdate:collapsed": d[0] || (d[0] = (s) => M(l) ? l.value = s : null),
|
|
31
31
|
trigger: null,
|
|
32
32
|
collapsible: "",
|
|
33
33
|
class: "ditari-layout-sider"
|
|
34
34
|
}, {
|
|
35
35
|
default: i(() => [
|
|
36
|
-
o("div",
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
36
|
+
o("div", null, [
|
|
37
|
+
o("div", V, [
|
|
38
|
+
p(r.$slots, "logo")
|
|
39
|
+
]),
|
|
40
|
+
o("div", T, [
|
|
41
|
+
t(e(U))
|
|
42
|
+
])
|
|
41
43
|
])
|
|
42
44
|
]),
|
|
43
45
|
_: 3
|
|
@@ -46,7 +48,7 @@ const V = { class: "ditari-logo" }, T = { class: "ditari-menu" }, j = { class: "
|
|
|
46
48
|
default: i(() => [
|
|
47
49
|
o("div", {
|
|
48
50
|
class: "ditari-top-layout",
|
|
49
|
-
style: y({ left: e(
|
|
51
|
+
style: y({ left: e(l) ? "80px" : "200px" })
|
|
50
52
|
}, [
|
|
51
53
|
t(K),
|
|
52
54
|
o("div", j, [
|
|
@@ -54,9 +56,9 @@ const V = { class: "ditari-logo" }, T = { class: "ditari-menu" }, j = { class: "
|
|
|
54
56
|
o("div", {
|
|
55
57
|
class: "ditari-side-collapsed",
|
|
56
58
|
onClick: d[1] || (d[1] = //@ts-ignore
|
|
57
|
-
(...
|
|
59
|
+
(...s) => e(m) && e(m)(...s))
|
|
58
60
|
}, [
|
|
59
|
-
e(
|
|
61
|
+
e(l) ? (a(), c(e(O), {
|
|
60
62
|
key: 0,
|
|
61
63
|
class: "trigger",
|
|
62
64
|
style: { "font-size": "16px", "font-weight": "bold", cursor: "pointer" }
|
|
@@ -74,11 +76,11 @@ const V = { class: "ditari-logo" }, T = { class: "ditari-menu" }, j = { class: "
|
|
|
74
76
|
], 4),
|
|
75
77
|
t(w, {
|
|
76
78
|
class: "ditari-layout-content",
|
|
77
|
-
style: y({ marginLeft: e(
|
|
79
|
+
style: y({ marginLeft: e(l) ? "80px" : "200px" })
|
|
78
80
|
}, {
|
|
79
81
|
default: i(() => [
|
|
80
82
|
t(C, null, {
|
|
81
|
-
default: i(({ Component:
|
|
83
|
+
default: i(({ Component: s }) => [
|
|
82
84
|
t(z, {
|
|
83
85
|
name: "main",
|
|
84
86
|
mode: "out-in",
|
|
@@ -89,7 +91,7 @@ const V = { class: "ditari-logo" }, T = { class: "ditari-menu" }, j = { class: "
|
|
|
89
91
|
ref: "keepAliveRef",
|
|
90
92
|
include: e(k)
|
|
91
93
|
}, [
|
|
92
|
-
(a(), c(N(
|
|
94
|
+
(a(), c(N(s), {
|
|
93
95
|
key: r.$route.path
|
|
94
96
|
}))
|
|
95
97
|
], 1032, ["include"]))
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { defineComponent as j, inject as k, watchEffect as N, createVNode as r, Fragment as
|
|
1
|
+
import { defineComponent as j, inject as k, watchEffect as N, createVNode as r, Fragment as u, resolveComponent as c, isVNode as I, withDirectives as R, vShow as D, h as H } from "vue";
|
|
2
2
|
import { useRouter as O, useRoute as P } from "vue-router";
|
|
3
|
-
import { storeToRefs as
|
|
3
|
+
import { storeToRefs as m } from "pinia";
|
|
4
4
|
import { useMenuStore as T } from "../../store/modules/Menu.esm.js";
|
|
5
5
|
import { useSettingsStore as V } from "../../store/modules/Settings.esm.js";
|
|
6
6
|
function _(l) {
|
|
@@ -9,50 +9,51 @@ function _(l) {
|
|
|
9
9
|
const $ = /* @__PURE__ */ j({
|
|
10
10
|
name: "DMenu",
|
|
11
11
|
setup() {
|
|
12
|
-
const l = O(),
|
|
13
|
-
componentName:
|
|
14
|
-
prop:
|
|
15
|
-
} = k("menuIcon"),
|
|
16
|
-
list:
|
|
17
|
-
openMenusKeys:
|
|
12
|
+
const l = O(), g = P(), {
|
|
13
|
+
componentName: s,
|
|
14
|
+
prop: S
|
|
15
|
+
} = k("menuIcon"), y = T(), {
|
|
16
|
+
list: a,
|
|
17
|
+
openMenusKeys: i,
|
|
18
18
|
selectedMenuKeys: o
|
|
19
|
-
} =
|
|
20
|
-
getCollapsed:
|
|
21
|
-
} =
|
|
19
|
+
} = m(y), M = V(), {
|
|
20
|
+
getCollapsed: d
|
|
21
|
+
} = m(M);
|
|
22
22
|
N(() => {
|
|
23
|
-
|
|
24
|
-
|
|
23
|
+
if (d.value)
|
|
24
|
+
return;
|
|
25
|
+
const e = o.value.length > 0 ? o.value[0] : "", t = p(a.value, e);
|
|
26
|
+
i.value = t || [];
|
|
25
27
|
});
|
|
26
28
|
function p(e, t) {
|
|
27
29
|
for (let n = 0; n < e.length; n++) {
|
|
28
30
|
if (e[n].url === t || t.startsWith(e[n].url))
|
|
29
31
|
return [e[n].url];
|
|
30
32
|
if (e[n].children && e[n].children.length > 0) {
|
|
31
|
-
const
|
|
32
|
-
if (
|
|
33
|
-
return [e[n].url, ...
|
|
33
|
+
const v = p(e[n].children, t);
|
|
34
|
+
if (v)
|
|
35
|
+
return [e[n].url, ...v];
|
|
34
36
|
}
|
|
35
37
|
}
|
|
36
38
|
return null;
|
|
37
39
|
}
|
|
38
40
|
const b = ({
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
keyPath: n
|
|
41
|
+
key: e,
|
|
42
|
+
keyPath: t
|
|
42
43
|
}) => {
|
|
43
|
-
|
|
44
|
-
}, C = (e) => r(
|
|
44
|
+
i.value = t, o.value = [e], g.path !== e && l.push(e).then((n) => n ? console.warn(n) : null);
|
|
45
|
+
}, C = (e) => r(u, null, [r(c("a-menu-item"), {
|
|
45
46
|
key: e.url
|
|
46
47
|
}, {
|
|
47
48
|
icon: () => f(e),
|
|
48
49
|
default: () => e.title
|
|
49
|
-
})]), K = ["anticon", "anticon-menu", "ant-menu-item-icon"], f = (e) => r(
|
|
50
|
+
})]), K = ["anticon", "anticon-menu", "ant-menu-item-icon"], f = (e) => r(u, null, [e.icon ? U(e.icon) : R(r("div", {
|
|
50
51
|
className: K
|
|
51
|
-
}, [e.title.substring(0, 1)]), [[D,
|
|
52
|
+
}, [e.title.substring(0, 1)]), [[D, d.value]])]), U = (e) => s === "nativeHtml" ? r("span", {
|
|
52
53
|
innerHTML: e
|
|
53
|
-
}, null) : H(
|
|
54
|
-
[`${
|
|
55
|
-
}), h = (e) => r(
|
|
54
|
+
}, null) : H(c(s), {
|
|
55
|
+
[`${S}`]: e
|
|
56
|
+
}), h = (e) => r(u, null, [r(c("a-sub-menu"), {
|
|
56
57
|
key: e.url
|
|
57
58
|
}, {
|
|
58
59
|
title: () => e.title,
|
|
@@ -61,22 +62,22 @@ const $ = /* @__PURE__ */ j({
|
|
|
61
62
|
(t) => !t.children || t.children.length === 0 ? w(t) : h(t)
|
|
62
63
|
// 递归调用
|
|
63
64
|
)
|
|
64
|
-
})]), w = (e) => r(
|
|
65
|
+
})]), w = (e) => r(u, null, [r(c("a-menu-item"), {
|
|
65
66
|
key: e.url
|
|
66
67
|
}, {
|
|
67
68
|
default: () => e.title
|
|
68
69
|
})]);
|
|
69
70
|
return () => {
|
|
70
71
|
let e;
|
|
71
|
-
return r(
|
|
72
|
+
return r(u, null, [r(c("a-menu"), {
|
|
72
73
|
mode: "inline",
|
|
73
74
|
theme: "dark",
|
|
74
|
-
openKeys:
|
|
75
|
-
"onUpdate:openKeys": (t) =>
|
|
75
|
+
openKeys: i.value,
|
|
76
|
+
"onUpdate:openKeys": (t) => i.value = t,
|
|
76
77
|
selectedKeys: o.value,
|
|
77
78
|
"onUpdate:selectedKeys": (t) => o.value = t,
|
|
78
79
|
onClick: b
|
|
79
|
-
}, _(e =
|
|
80
|
+
}, _(e = a.value.map((t) => {
|
|
80
81
|
var n;
|
|
81
82
|
return !t.children || ((n = t.children) == null ? void 0 : n.length) === 0 ? C(t) : h(t);
|
|
82
83
|
})) ? e : {
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useDataDicStore as
|
|
3
|
-
const
|
|
1
|
+
import { defineComponent as _, ref as p, watch as O, resolveComponent as V, openBlock as y, createBlock as M, unref as s, isRef as A } from "vue";
|
|
2
|
+
import { useDataDicStore as F } from "../../store/modules/DataDictionary.esm.js";
|
|
3
|
+
const H = {
|
|
4
4
|
name: "DSelect"
|
|
5
|
-
}, U = /* @__PURE__ */
|
|
6
|
-
...
|
|
5
|
+
}, U = /* @__PURE__ */ _({
|
|
6
|
+
...H,
|
|
7
7
|
props: {
|
|
8
8
|
value: { default: null },
|
|
9
9
|
name: { default: "" },
|
|
@@ -12,67 +12,63 @@ const I = {
|
|
|
12
12
|
include: { default: [] }
|
|
13
13
|
},
|
|
14
14
|
emits: ["update:value", "change", "select"],
|
|
15
|
-
setup(r, { emit:
|
|
16
|
-
const
|
|
17
|
-
function
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
() =>
|
|
21
|
-
() => {
|
|
22
|
-
f(l.value);
|
|
23
|
-
}
|
|
24
|
-
), v(
|
|
25
|
-
() => c.value,
|
|
15
|
+
setup(r, { emit: c }) {
|
|
16
|
+
const u = r, { getDicByKey: f } = F(), { modelValue: i, data: h, onSearch: I, onSelect: v, onChange: m } = C();
|
|
17
|
+
function C() {
|
|
18
|
+
const l = [...f(u.name)], n = p(l), t = p(u.value);
|
|
19
|
+
O(
|
|
20
|
+
() => u.value,
|
|
26
21
|
(e) => {
|
|
27
|
-
|
|
22
|
+
t.value = e, L(e);
|
|
28
23
|
}
|
|
29
|
-
)
|
|
30
|
-
const
|
|
31
|
-
|
|
24
|
+
);
|
|
25
|
+
const d = (e) => {
|
|
26
|
+
g(e);
|
|
32
27
|
};
|
|
33
|
-
function
|
|
34
|
-
e = e ?? "", n.value =
|
|
28
|
+
function g(e) {
|
|
29
|
+
e = e ?? "", n.value = l.filter((a) => a.value.toLowerCase().indexOf(e.toLowerCase()) !== -1 || a.label.toLowerCase().includes(e.toLowerCase())).splice(0, 10), n.value.length === 0 && (n.value = [...l].splice(0, 10));
|
|
35
30
|
}
|
|
36
|
-
function
|
|
37
|
-
|
|
38
|
-
a
|
|
31
|
+
function L(e) {
|
|
32
|
+
e = e || "";
|
|
33
|
+
const a = l.findIndex((o) => o.value.toLowerCase().indexOf(e.toLowerCase()) !== -1 || o.label.toLowerCase().includes(e));
|
|
34
|
+
a === -1 ? n.value = [...l].splice(0, 10) : n.value = b(l, a);
|
|
39
35
|
}
|
|
40
|
-
function
|
|
41
|
-
const o = Math.max(0, a - 5),
|
|
42
|
-
return e.slice(o,
|
|
36
|
+
function b(e, a) {
|
|
37
|
+
const o = Math.max(0, a - 5), D = Math.min(e.length, a + 6);
|
|
38
|
+
return e.slice(o, D);
|
|
43
39
|
}
|
|
44
|
-
const
|
|
45
|
-
|
|
46
|
-
},
|
|
47
|
-
|
|
40
|
+
const w = (e) => {
|
|
41
|
+
c("update:value", e), B();
|
|
42
|
+
}, x = () => {
|
|
43
|
+
c("update:value", t.value), c("change", t.value);
|
|
48
44
|
};
|
|
49
|
-
function
|
|
50
|
-
const a =
|
|
51
|
-
|
|
45
|
+
function B() {
|
|
46
|
+
const a = f(u.name).find((o) => o.value === t.value);
|
|
47
|
+
c("select", a);
|
|
52
48
|
}
|
|
53
49
|
return {
|
|
54
50
|
data: n,
|
|
55
|
-
modelValue:
|
|
56
|
-
onSearch:
|
|
57
|
-
onSelect:
|
|
58
|
-
onChange:
|
|
51
|
+
modelValue: t,
|
|
52
|
+
onSearch: d,
|
|
53
|
+
onSelect: w,
|
|
54
|
+
onChange: x
|
|
59
55
|
};
|
|
60
56
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
57
|
+
const S = (l, n) => n.label.includes(l);
|
|
58
|
+
return (l, n) => {
|
|
59
|
+
const t = V("a-select");
|
|
60
|
+
return y(), M(t, {
|
|
61
|
+
value: s(i),
|
|
62
|
+
"onUpdate:value": n[0] || (n[0] = (d) => A(i) ? i.value = d : null),
|
|
66
63
|
"allow-clear": "",
|
|
67
64
|
"show-search": "",
|
|
68
|
-
|
|
69
|
-
options: u(S),
|
|
65
|
+
options: s(h),
|
|
70
66
|
placeholder: r.placeholder,
|
|
71
67
|
disabled: r.disabled,
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
onChange:
|
|
75
|
-
}, null, 8, ["value", "options", "placeholder", "disabled", "onSelect", "
|
|
68
|
+
"filter-option": S,
|
|
69
|
+
onSelect: s(v),
|
|
70
|
+
onChange: s(m)
|
|
71
|
+
}, null, 8, ["value", "options", "placeholder", "disabled", "onSelect", "onChange"]);
|
|
76
72
|
};
|
|
77
73
|
}
|
|
78
74
|
});
|
package/package.json
CHANGED
|
@@ -12,6 +12,7 @@ import DNavTabs from "./NavTabs.vue";
|
|
|
12
12
|
import DBreadcrumb from "./Breadcrumb.vue";
|
|
13
13
|
// 菜单组件
|
|
14
14
|
import Menu from "../menu/Menu";
|
|
15
|
+
import CollapsedMenu from "../menu/CollapsedMenu.vue";
|
|
15
16
|
|
|
16
17
|
interface Props {
|
|
17
18
|
showConfig?: ShowConfig;
|
|
@@ -36,7 +37,6 @@ const keepAliveNames = computed(() => store.get);
|
|
|
36
37
|
const settingsStore = useSettingsStore();
|
|
37
38
|
const { switchCollapsed } = settingsStore;
|
|
38
39
|
const collapsedStatus = computed(() => settingsStore.getCollapsed);
|
|
39
|
-
|
|
40
40
|
// 注入show组件的配置文件
|
|
41
41
|
provide("showConfig", props.showConfig);
|
|
42
42
|
</script>
|
|
@@ -53,11 +53,14 @@ export default {
|
|
|
53
53
|
collapsible
|
|
54
54
|
class="ditari-layout-sider"
|
|
55
55
|
>
|
|
56
|
-
<div
|
|
57
|
-
<
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
<
|
|
56
|
+
<div>
|
|
57
|
+
<div class="ditari-logo">
|
|
58
|
+
<slot name="logo"></slot>
|
|
59
|
+
</div>
|
|
60
|
+
<div class="ditari-menu">
|
|
61
|
+
<Menu />
|
|
62
|
+
|
|
63
|
+
</div>
|
|
61
64
|
</div>
|
|
62
65
|
</a-layout-sider>
|
|
63
66
|
<a-layout>
|
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
computed,
|
|
3
|
+
defineComponent,
|
|
4
|
+
h,
|
|
5
|
+
inject,
|
|
6
|
+
resolveComponent,
|
|
7
|
+
watchEffect
|
|
8
|
+
} from "vue";
|
|
2
9
|
import { useRouter, useRoute } from "vue-router";
|
|
3
10
|
|
|
4
11
|
import { storeToRefs } from "pinia";
|
|
@@ -20,6 +27,11 @@ export default defineComponent({
|
|
|
20
27
|
const { getCollapsed } = storeToRefs(settingsStore);
|
|
21
28
|
|
|
22
29
|
watchEffect(() => {
|
|
30
|
+
if (getCollapsed.value) {
|
|
31
|
+
// 如果菜单是收缩的状态，则不匹配激活的菜单
|
|
32
|
+
// 否则 在切换标签的时候，收缩菜单会自动激活悬浮的动作
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
23
35
|
// 会被触发两次
|
|
24
36
|
// 当前激活的url
|
|
25
37
|
const activatedUrl =
|
|
@@ -51,9 +63,8 @@ export default defineComponent({
|
|
|
51
63
|
* @param key
|
|
52
64
|
* @param keyPath
|
|
53
65
|
*/
|
|
54
|
-
const onClick = ({
|
|
66
|
+
const onClick = ({ key, keyPath }) => {
|
|
55
67
|
openMenusKeys.value = keyPath;
|
|
56
|
-
|
|
57
68
|
selectedMenuKeys.value = [key];
|
|
58
69
|
// 判断目标路由和当前路由是否相等
|
|
59
70
|
// 不相等的时候再跳转
|
|
@@ -61,14 +72,6 @@ export default defineComponent({
|
|
|
61
72
|
? router.push(key).then((r) => (r ? console.warn(r) : null))
|
|
62
73
|
: null;
|
|
63
74
|
};
|
|
64
|
-
/**
|
|
65
|
-
* 监听菜单展开事件
|
|
66
|
-
* @param keys
|
|
67
|
-
*/
|
|
68
|
-
const openChange = (keys) => {
|
|
69
|
-
//TODO 暂时先不处理
|
|
70
|
-
console.log(keys);
|
|
71
|
-
};
|
|
72
75
|
|
|
73
76
|
// 渲染菜单
|
|
74
77
|
const renderMenu = (menu) => {
|
|
@@ -37,38 +37,12 @@ const { getDicByKey } = useDataDicStore();
|
|
|
37
37
|
const { modelValue, data, onSearch, onSelect, onChange } = useSelect();
|
|
38
38
|
|
|
39
39
|
function useSelect() {
|
|
40
|
-
//
|
|
41
|
-
// let workerStatus = true;
|
|
40
|
+
// 字典数据
|
|
42
41
|
const dicData: any[] = [...getDicByKey(props.name)];
|
|
43
|
-
const data = ref<any>(
|
|
42
|
+
const data = ref<any>(dicData);
|
|
44
43
|
// 取值
|
|
45
44
|
const modelValue = ref(props.value);
|
|
46
45
|
|
|
47
|
-
/**
|
|
48
|
-
* web worker 启动失败
|
|
49
|
-
*/
|
|
50
|
-
// workerInstance.onerror = () => {
|
|
51
|
-
// workerStatus = false;
|
|
52
|
-
// // 启动失败使用store
|
|
53
|
-
// dicData = getDicByKey(props.name);
|
|
54
|
-
// };
|
|
55
|
-
/**
|
|
56
|
-
* 监听web worker发送的数据
|
|
57
|
-
* @param e
|
|
58
|
-
*/
|
|
59
|
-
// workerInstance.onmessage = (e: any) => {
|
|
60
|
-
// // 赋值给下拉选择数据变量
|
|
61
|
-
// data.value = e.data;
|
|
62
|
-
// };
|
|
63
|
-
|
|
64
|
-
// 当include变化的时候，需要重新发送搜索事件 返回对应的下拉数据
|
|
65
|
-
watch(
|
|
66
|
-
() => props.include,
|
|
67
|
-
() => {
|
|
68
|
-
sendWorkerSearch(modelValue.value);
|
|
69
|
-
}
|
|
70
|
-
);
|
|
71
|
-
|
|
72
46
|
// 监听value值的变化
|
|
73
47
|
watch(
|
|
74
48
|
() => props.value,
|
|
@@ -78,8 +52,7 @@ function useSelect() {
|
|
|
78
52
|
}
|
|
79
53
|
);
|
|
80
54
|
|
|
81
|
-
//
|
|
82
|
-
sendWorkerSearch(modelValue.value);
|
|
55
|
+
//initSearch(modelValue.value);
|
|
83
56
|
|
|
84
57
|
//监听用户搜索事件
|
|
85
58
|
const onSearch = (keywords: string) => {
|
|
@@ -107,6 +80,7 @@ function useSelect() {
|
|
|
107
80
|
* @param val
|
|
108
81
|
*/
|
|
109
82
|
function initSearch(val: any) {
|
|
83
|
+
val = val || "";
|
|
110
84
|
const index = dicData.findIndex((item: any) => {
|
|
111
85
|
return (
|
|
112
86
|
item.value.toLowerCase().indexOf(val.toLowerCase()) !== -1 ||
|
|
@@ -159,6 +133,15 @@ function useSelect() {
|
|
|
159
133
|
onChange
|
|
160
134
|
};
|
|
161
135
|
}
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* 过滤筛选
|
|
139
|
+
* @param inputValue
|
|
140
|
+
* @param options
|
|
141
|
+
*/
|
|
142
|
+
const onFilterOption = (inputValue: any, options: any) => {
|
|
143
|
+
return options.label.includes(inputValue);
|
|
144
|
+
};
|
|
162
145
|
</script>
|
|
163
146
|
<script lang="ts">
|
|
164
147
|
export default {
|
|
@@ -170,12 +153,11 @@ export default {
|
|
|
170
153
|
v-model:value="modelValue"
|
|
171
154
|
allow-clear
|
|
172
155
|
show-search
|
|
173
|
-
:filter-option="false"
|
|
174
156
|
:options="data"
|
|
175
157
|
:placeholder="placeholder"
|
|
176
158
|
:disabled="disabled"
|
|
159
|
+
:filter-option="onFilterOption"
|
|
177
160
|
@select="onSelect"
|
|
178
|
-
@search="onSearch"
|
|
179
161
|
@change="onChange"
|
|
180
162
|
>
|
|
181
163
|
</a-select>
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
import { defineComponent, h, ref, resolveComponent } from "vue";
|
|
2
|
-
import { useMenuStore } from "../../store";
|
|
3
|
-
|
|
4
|
-
export default defineComponent({
|
|
5
|
-
name: "DMenu",
|
|
6
|
-
setup() {
|
|
7
|
-
const { list } = useMenuStore();
|
|
8
|
-
// 当前展开的菜单
|
|
9
|
-
const openKeys = ref(["/labelList", "/label"]);
|
|
10
|
-
// 当前选中的菜单
|
|
11
|
-
const selectedKeys = ref(["/label"]);
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* 监听菜单点击事件
|
|
15
|
-
* @param item
|
|
16
|
-
* @param key
|
|
17
|
-
* @param keyPath
|
|
18
|
-
*/
|
|
19
|
-
const onClick = ({ item, key, keyPath }) => {
|
|
20
|
-
console.log(item, key, keyPath);
|
|
21
|
-
openKeys.value = keyPath;
|
|
22
|
-
selectedKeys.value = [key];
|
|
23
|
-
};
|
|
24
|
-
/**
|
|
25
|
-
* 监听菜单展开事件
|
|
26
|
-
* @param keys
|
|
27
|
-
*/
|
|
28
|
-
const openChange = (keys) => {
|
|
29
|
-
//TODO 暂时先不处理
|
|
30
|
-
console.log(keys);
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
// 递归渲染子菜单
|
|
34
|
-
const renderSubMenu = (menuList, parent) => {
|
|
35
|
-
if (!menuList || !menuList.length) {
|
|
36
|
-
return null;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
return (
|
|
40
|
-
<a-sub-menu>
|
|
41
|
-
{{
|
|
42
|
-
title: () => parent.title,
|
|
43
|
-
default: () => {
|
|
44
|
-
return menuList.map((menu) => (
|
|
45
|
-
<a-menu-item key={menu.url}>{menu.title}</a-menu-item>
|
|
46
|
-
));
|
|
47
|
-
}
|
|
48
|
-
}}
|
|
49
|
-
</a-sub-menu>
|
|
50
|
-
);
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
return () => (
|
|
54
|
-
<a-menu
|
|
55
|
-
mode="inline"
|
|
56
|
-
theme="dark"
|
|
57
|
-
v-model:openKeys={openKeys.value}
|
|
58
|
-
v-model:selectedKeys={selectedKeys.value}
|
|
59
|
-
onClick={onClick}
|
|
60
|
-
>
|
|
61
|
-
{list.map((menu) => {
|
|
62
|
-
menu.children.length === 0 ? <>ok</> : <>ww</>;
|
|
63
|
-
})}
|
|
64
|
-
{/*{list.map((menu) => (*/}
|
|
65
|
-
{/* <a-sub-menu key={menu.url}>*/}
|
|
66
|
-
{/* {{*/}
|
|
67
|
-
{/* title: () => <>{menu.title}</>,*/}
|
|
68
|
-
{/* icon: () => (*/}
|
|
69
|
-
{/* <>*/}
|
|
70
|
-
{/* <span>*/}
|
|
71
|
-
{/* {menu.icon ? h(resolveComponent(menu.icon)) : undefined}*/}
|
|
72
|
-
{/* </span>*/}
|
|
73
|
-
{/* </>*/}
|
|
74
|
-
{/* ),*/}
|
|
75
|
-
{/* default: () => {*/}
|
|
76
|
-
{/* if (menu.children && menu.children.length) {*/}
|
|
77
|
-
{/* return menu.children.map((child) => {*/}
|
|
78
|
-
{/* return (*/}
|
|
79
|
-
{/* <>*/}
|
|
80
|
-
{/* {child.children ? (*/}
|
|
81
|
-
{/* renderSubMenu(child.children, menu)*/}
|
|
82
|
-
{/* ) : (*/}
|
|
83
|
-
{/* <a-menu-item key={child.url}>*/}
|
|
84
|
-
{/* {child.title}*/}
|
|
85
|
-
{/* </a-menu-item>*/}
|
|
86
|
-
{/* )}*/}
|
|
87
|
-
{/* </>*/}
|
|
88
|
-
{/* );*/}
|
|
89
|
-
{/* });*/}
|
|
90
|
-
{/* }*/}
|
|
91
|
-
{/* }*/}
|
|
92
|
-
{/* }}*/}
|
|
93
|
-
{/* </a-sub-menu>*/}
|
|
94
|
-
{/*))}*/}
|
|
95
|
-
</a-menu>
|
|
96
|
-
);
|
|
97
|
-
}
|
|
98
|
-
});
|