@xiaou66/u-web-ui 0.0.3 → 0.0.4

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/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { ComponentOptionsMixin } from 'vue';
2
2
  import { ComponentProvideOptions } from 'vue';
3
3
  import { DefineComponent } from 'vue';
4
+ import { JSX } from 'vue/jsx-runtime';
4
5
  import { PublicProps } from 'vue';
5
6
 
6
7
  declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
@@ -14,7 +15,7 @@ declare const __VLS_component_3: DefineComponent<{}, {}, {}, {}, {}, ComponentOp
14
15
  declare const __VLS_component_4: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
15
16
 
16
17
  declare type __VLS_Props = {
17
- name?: string;
18
+ title?: string;
18
19
  desc?: string;
19
20
  click?: boolean;
20
21
  vip?: boolean;
@@ -29,7 +30,7 @@ declare type __VLS_Props_2 = {
29
30
  declare function __VLS_template(): {
30
31
  attrs: Partial<{}>;
31
32
  slots: {
32
- name?(_: {}): any;
33
+ title?(_: {}): any;
33
34
  desc?(_: {}): any;
34
35
  default?(_: {}): any;
35
36
  extra?(_: {}): any;
@@ -71,25 +72,7 @@ declare function __VLS_template_3(): {
71
72
 
72
73
  declare function __VLS_template_4(): {
73
74
  attrs: Partial<{}>;
74
- slots: Readonly<{
75
- /** Logo 插槽 - 用于显示网站 logo */
76
- logo?(): any;
77
- /** 操作区插槽 - 用于显示头部操作按钮 */
78
- operations?(): any;
79
- /** 左侧菜单插槽 - 用于自定义左侧菜单内容 */
80
- left?(): any;
81
- /** 默认插槽 - 主要内容区域 */
82
- default?(): any;
83
- }> & {
84
- /** Logo 插槽 - 用于显示网站 logo */
85
- logo?(): any;
86
- /** 操作区插槽 - 用于显示头部操作按钮 */
87
- operations?(): any;
88
- /** 左侧菜单插槽 - 用于自定义左侧菜单内容 */
89
- left?(): any;
90
- /** 默认插槽 - 主要内容区域 */
91
- default?(): any;
92
- };
75
+ slots: Readonly<WebLayoutSlot> & WebLayoutSlot;
93
76
  refs: {};
94
77
  rootEl: any;
95
78
  };
@@ -146,4 +129,15 @@ export declare const WebBaseLayout: __VLS_WithTemplateSlots_3<typeof __VLS_compo
146
129
 
147
130
  export declare const WebLayout: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
148
131
 
132
+ export declare interface WebLayoutSlot {
133
+ /** Logo 插槽 - 用于显示网站 logo */
134
+ logo?(): JSX.Element;
135
+ /** 操作区插槽 - 用于显示头部操作按钮 */
136
+ operations?(): JSX.Element;
137
+ /** 左侧菜单插槽 - 用于自定义左侧菜单内容 */
138
+ left?(): JSX.Element;
139
+ /** 默认插槽 - 主要内容区域 */
140
+ default?(): JSX.Element;
141
+ }
142
+
149
143
  export { }
package/dist/index.es.js CHANGED
@@ -1,219 +1 @@
1
- import { Menu as M, MenuItem as I, Icon as N, Button as V, Layout as W, Header as R, Aside as E, Content as H, HeadMenu as A } from "tdesign-vue-next";
2
- import { defineComponent as v, ref as k, onMounted as D, createBlock as p, openBlock as c, unref as C, withCtx as o, createElementBlock as m, Fragment as G, renderList as j, createTextVNode as y, toDisplayString as h, createVNode as r, normalizeClass as q, useCssVars as z, useAttrs as F, computed as O, mergeProps as P, toHandlers as T, createElementVNode as a, renderSlot as n, createCommentVNode as b, resolveComponent as J, createSlots as K } from "vue";
3
- import { useRouter as Q, useRoute as U } from "vue-router";
4
- const X = /* @__PURE__ */ v({
5
- __name: "LeftMenu",
6
- setup(u, { expose: e }) {
7
- const s = k(document.documentElement.clientWidth <= 800);
8
- function t() {
9
- s.value = !s.value;
10
- }
11
- const l = Q(), $ = U(), i = k([]);
12
- D(() => {
13
- i.value = l.getRoutes().filter((d) => d.meta).filter((d) => d.meta.menu);
14
- });
15
- function B(d) {
16
- l.push(d.path);
17
- }
18
- return e({
19
- changeCollapsed: t
20
- }), (d, pe) => {
21
- const g = N, L = V, w = I, S = M;
22
- return c(), p(S, {
23
- value: C($).name,
24
- collapsed: s.value,
25
- width: ["180px", "60px"]
26
- }, {
27
- operations: o(() => [
28
- r(L, {
29
- variant: "text",
30
- shape: "square",
31
- onClick: t
32
- }, {
33
- icon: o(() => [
34
- r(g, { name: "view-list" })
35
- ]),
36
- _: 1
37
- })
38
- ]),
39
- default: o(() => [
40
- (c(!0), m(G, null, j(i.value, (_) => (c(), p(w, {
41
- key: _.name,
42
- value: _.name,
43
- onClick: (me) => B(_)
44
- }, {
45
- icon: o(() => [
46
- r(g, {
47
- class: q(_.meta.icon)
48
- }, null, 8, ["class"])
49
- ]),
50
- default: o(() => [
51
- y(" " + h(_.meta.title), 1)
52
- ]),
53
- _: 2
54
- }, 1032, ["value", "onClick"]))), 128))
55
- ]),
56
- _: 1
57
- }, 8, ["value", "collapsed"]);
58
- };
59
- }
60
- }), Y = { class: "flex justify-between items-center" }, Z = { class: "name u-fx u-gap5 u-fac" }, x = { class: "tips" }, ee = /* @__PURE__ */ v({
61
- __name: "SettingItem",
62
- props: {
63
- name: {},
64
- desc: {},
65
- click: { type: Boolean },
66
- vip: { type: Boolean },
67
- minName: { type: Boolean },
68
- background: { default: "var(--u-bg-color-3)" }
69
- },
70
- setup(u) {
71
- z((t) => ({
72
- "18a9d44a": t.background
73
- }));
74
- const e = F(), s = O(() => "onClick" in e || "onClickCapture" in e);
75
- return (t, l) => (c(), m("div", P({
76
- class: ["setting-item", { "cursor-pointer": s.value }]
77
- }, T({
78
- ...s.value && { click: t.$attrs.onClick || t.$attrs.onClickCapture }
79
- }, !0)), [
80
- a("div", Y, [
81
- a("div", null, [
82
- a("div", Z, [
83
- n(t.$slots, "name", {}, () => [
84
- y(h(t.name), 1)
85
- ], !0)
86
- ]),
87
- n(t.$slots, "desc", {}, () => [
88
- a("div", x, h(t.desc), 1)
89
- ], !0)
90
- ]),
91
- a("div", null, [
92
- n(t.$slots, "default", {}, void 0, !0)
93
- ])
94
- ]),
95
- a("div", null, [
96
- n(t.$slots, "extra", {}, void 0, !0)
97
- ])
98
- ], 16));
99
- }
100
- }), f = (u, e) => {
101
- const s = u.__vccOpts || u;
102
- for (const [t, l] of e)
103
- s[t] = l;
104
- return s;
105
- }, $e = /* @__PURE__ */ f(ee, [["__scopeId", "data-v-010b3e2d"]]), te = {}, oe = { class: "division" };
106
- function ne(u, e) {
107
- return c(), m("div", oe);
108
- }
109
- const ge = /* @__PURE__ */ f(te, [["render", ne], ["__scopeId", "data-v-466ca93d"]]), se = { class: "setting-item-group" }, ae = { class: "header" }, re = { class: "title" }, ce = { key: 0 }, le = /* @__PURE__ */ v({
110
- __name: "SettingGroup",
111
- props: {
112
- title: {}
113
- },
114
- setup(u) {
115
- return (e, s) => (c(), m("div", se, [
116
- a("div", ae, [
117
- a("div", re, h(e.title), 1),
118
- e.$slots.desc ? (c(), m("div", ce, [
119
- n(e.$slots, "desc", {}, void 0, !0)
120
- ])) : b("", !0)
121
- ]),
122
- a("div", null, [
123
- n(e.$slots, "default", {}, void 0, !0)
124
- ])
125
- ]));
126
- }
127
- }), ke = /* @__PURE__ */ f(le, [["__scopeId", "data-v-610df7dd"]]), ue = /* @__PURE__ */ v({
128
- __name: "WebBaseLayout",
129
- setup(u) {
130
- return (e, s) => {
131
- const t = R, l = E, $ = H, i = W;
132
- return c(), p(i, { class: "h-screen" }, {
133
- default: o(() => [
134
- e.$slots.header ? (c(), p(t, { key: 0 }, {
135
- default: o(() => [
136
- n(e.$slots, "header", {}, void 0, !0)
137
- ]),
138
- _: 3
139
- })) : b("", !0),
140
- r(i, { class: "min-h-0" }, {
141
- default: o(() => [
142
- r(l, { width: "auto" }, {
143
- default: o(() => [
144
- n(e.$slots, "left", {}, void 0, !0)
145
- ]),
146
- _: 3
147
- }),
148
- r(i, { class: "min-h-0 u-main-content" }, {
149
- default: o(() => [
150
- r($, { class: "xl:p-4 ut:p-2 p-1 h-full overflow-hidden" }, {
151
- default: o(() => [
152
- n(e.$slots, "default", {}, void 0, !0)
153
- ]),
154
- _: 3
155
- })
156
- ]),
157
- _: 3
158
- })
159
- ]),
160
- _: 3
161
- })
162
- ]),
163
- _: 3
164
- });
165
- };
166
- }
167
- }), ie = /* @__PURE__ */ f(ue, [["__scopeId", "data-v-257ccd76"]]), de = { class: "u-main-content-inner" }, _e = /* @__PURE__ */ v({
168
- __name: "WebLayout",
169
- setup(u) {
170
- return (e, s) => {
171
- const t = A, l = J("router-view");
172
- return c(), p(ie, null, {
173
- header: o(() => [
174
- r(t, {
175
- value: "item1",
176
- height: "60px"
177
- }, K({ _: 2 }, [
178
- e.$slots.logo ? {
179
- name: "logo",
180
- fn: o(() => [
181
- n(e.$slots, "logo", {}, void 0, !0)
182
- ]),
183
- key: "0"
184
- } : void 0,
185
- e.$slots.operations ? {
186
- name: "operations",
187
- fn: o(() => [
188
- n(e.$slots, "operations", {}, void 0, !0)
189
- ]),
190
- key: "1"
191
- } : void 0
192
- ]), 1024)
193
- ]),
194
- left: o(() => [
195
- n(e.$slots, "left", {}, () => [
196
- r(C(X))
197
- ], !0)
198
- ]),
199
- default: o(() => [
200
- n(e.$slots, "default", {}, () => [
201
- a("div", de, [
202
- r(l)
203
- ])
204
- ], !0)
205
- ]),
206
- _: 3
207
- });
208
- };
209
- }
210
- }), Ce = /* @__PURE__ */ f(_e, [["__scopeId", "data-v-e8a61684"]]);
211
- export {
212
- X as LeftMenu,
213
- ge as SettingDivision,
214
- ke as SettingGroup,
215
- $e as SettingItem,
216
- ie as WebBaseLayout,
217
- Ce as WebLayout
218
- };
219
- //# sourceMappingURL=index.es.js.map
1
+ import{Aside as e,Button as t,Content as n,HeadMenu as r,Header as i,Icon as a,Layout as o,Menu as s,MenuItem as c}from"tdesign-vue-next";import{Fragment as l,computed as u,createBlock as d,createCommentVNode as f,createElementBlock as p,createElementVNode as m,createSlots as h,createTextVNode as g,createVNode as _,defineComponent as v,mergeProps as y,normalizeClass as b,onMounted as x,openBlock as S,ref as C,renderList as ee,renderSlot as w,resolveComponent as T,toDisplayString as E,toHandlers as D,unref as O,useAttrs as k,useCssVars as A,withCtx as j}from"vue";import{useRoute as M,useRouter as N}from"vue-router";var P=v({__name:`LeftMenu`,setup(e,{expose:n}){let r=C(document.documentElement.clientWidth<=800);function i(){r.value=!r.value}let o=N(),u=M(),f=C([]);x(()=>{f.value=o.getRoutes().filter(e=>e.meta).filter(e=>e.meta.menu)});function m(e){o.push(e.path)}return n({changeCollapsed:i}),(e,n)=>{let o=a,h=t,v=c,y=s;return S(),d(y,{value:O(u).name,collapsed:r.value,width:[`180px`,`60px`]},{operations:j(()=>[_(h,{variant:`text`,shape:`square`,onClick:i},{icon:j(()=>[_(o,{name:`view-list`})]),_:1})]),default:j(()=>[(S(!0),p(l,null,ee(f.value,e=>(S(),d(v,{key:e.name,value:e.name,onClick:t=>m(e)},{icon:j(()=>[_(o,{class:b(e.meta.icon)},null,8,[`class`])]),default:j(()=>[g(` `+E(e.meta.title),1)]),_:2},1032,[`value`,`onClick`]))),128))]),_:1},8,[`value`,`collapsed`])}}}),F=P;const I={class:`flex justify-between items-center`},L={class:`title u-fx u-gap5 u-fac`},R={class:`tips`};var z=v({__name:`SettingItem`,props:{title:{},desc:{},click:{type:Boolean},vip:{type:Boolean},minName:{type:Boolean},background:{default:`var(--u-bg-color-3)`}},setup(e){A(e=>({"4c1cf51b":e.background}));let t=k(),n=u(()=>`onClick`in t||`onClickCapture`in t);return(e,t)=>(S(),p(`div`,y({class:[`setting-item`,{"cursor-pointer":n.value}]},D({...n.value&&{click:e.$attrs.onClick||e.$attrs.onClickCapture}},!0)),[m(`div`,I,[m(`div`,null,[m(`div`,L,[w(e.$slots,`title`,{},()=>[g(E(e.title),1)],!0)]),w(e.$slots,`desc`,{},()=>[m(`div`,R,E(e.desc),1)],!0)]),m(`div`,null,[w(e.$slots,`default`,{},void 0,!0)])]),m(`div`,null,[w(e.$slots,`extra`,{},void 0,!0)])],16))}}),B=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},V=B(z,[[`__scopeId`,`data-v-3f239fb8`]]);const H={},U={class:`division`};function W(e,t){return S(),p(`div`,U)}var G=B(H,[[`render`,W],[`__scopeId`,`data-v-466ca93d`]]);const K={class:`setting-item-group`},q={class:`header`},J={class:`title`},Y={key:0};var X=v({__name:`SettingGroup`,props:{title:{}},setup(e){return(e,t)=>(S(),p(`div`,K,[m(`div`,q,[m(`div`,J,E(e.title),1),e.$slots.desc?(S(),p(`div`,Y,[w(e.$slots,`desc`,{},void 0,!0)])):f(``,!0)]),m(`div`,null,[w(e.$slots,`default`,{},void 0,!0)])]))}}),Z=B(X,[[`__scopeId`,`data-v-610df7dd`]]),Q=v({__name:`WebBaseLayout`,setup(t){return(t,r)=>{let a=i,s=e,c=n,l=o;return S(),d(l,{class:`h-screen`},{default:j(()=>[t.$slots.header?(S(),d(a,{key:0},{default:j(()=>[w(t.$slots,`header`,{},void 0,!0)]),_:3})):f(``,!0),_(l,{class:`min-h-0`},{default:j(()=>[_(s,{width:`auto`},{default:j(()=>[w(t.$slots,`left`,{},void 0,!0)]),_:3}),_(l,{class:`min-h-0 u-main-content`},{default:j(()=>[_(c,{class:`xl:p-4 ut:p-2 p-1 h-full overflow-hidden`},{default:j(()=>[w(t.$slots,`default`,{},void 0,!0)]),_:3})]),_:3})]),_:3})]),_:3})}}}),$=B(Q,[[`__scopeId`,`data-v-257ccd76`]]);const te={class:`u-main-content-inner`};var ne=v({__name:`WebLayout`,setup(e){return(e,t)=>{let n=r,i=T(`router-view`);return S(),d($,null,{header:j(()=>[_(n,{value:`item1`,height:`60px`},h({_:2},[e.$slots.logo?{name:`logo`,fn:j(()=>[w(e.$slots,`logo`,{},void 0,!0)]),key:`0`}:void 0,e.$slots.operations?{name:`operations`,fn:j(()=>[w(e.$slots,`operations`,{},void 0,!0)]),key:`1`}:void 0]),1024)]),left:j(()=>[w(e.$slots,`left`,{},()=>[_(O(F))],!0)]),default:j(()=>[w(e.$slots,`default`,{},()=>[m(`div`,te,[_(i)])],!0)]),_:3})}}}),re=B(ne,[[`__scopeId`,`data-v-d82bb11d`]]);export{F as LeftMenu,G as SettingDivision,Z as SettingGroup,V as SettingItem,$ as WebBaseLayout,re as WebLayout};
package/dist/u-web-ui.css CHANGED
@@ -1 +1,2 @@
1
- body[arco-theme=dark]{--u-bg-color: #26272A}:root{--u-bg-color: #F4F4F4;--u-bg-color-2: #ffffff;--u-bg-color-3: #ffffff;--u-blue-7: 13, 66, 210;--u-blue-6: 22, 93, 255;--u-blue-5: 64, 128, 255;--u-wechat-color: #2BA471;--u-hover-bg-color: #F7F8FA;--u-text-tips-color: #8A939F;--u-color-neutral-1: #F7F8FA;--u-color-neutral-2: #F2F3F5;--u-color-neutral-3: #E5E6EC;--u-shadow-sm: rgba(0, 0, 0, .1) 0px 1px 2px 0px}*,*:before,*:after{padding:0;box-sizing:border-box;margin:0;font-weight:400}*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }:root{--u-blue-1: 240, 248, 255;--u-blue-2: 224, 242, 254;--u-blue-3: 186, 230, 253;--u-blue-4: 125, 211, 252;--u-blue-5: 56, 189, 248;--u-blue-6: 14, 165, 233;--u-blue-7: 2, 132, 199;--u-blue-8: 3, 105, 161;--u-blue-9: 12, 74, 110;--u-hover-bg-color: #f5f5f5;--u-text-tips-color: #999;--u-color-neutral-2: #e5e5e5}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.hidden{display:none}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:0}.flex{display:flex}.cursor-pointer{cursor:pointer}.items-center{align-items:center}.justify-between{justify-content:space-between}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:.5rem}.p-1{padding:.25rem}.pl-2{padding-left:.5rem}.text-4{font-size:1rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}@media (min-width: 800px){.ut\:p-2{padding:.5rem}}@media (min-width: 1280px){.xl\:p-4{padding:1rem}}.setting-item[data-v-010b3e2d]{background:var(--18a9d44a);padding:15px 10px;transition:all .28s linear;-webkit-user-select:none;user-select:none}.setting-item[data-v-010b3e2d]:hover{background:var(--u-hover-bg-color)}.setting-item .name[data-v-010b3e2d]{margin-bottom:.25rem;font-size:1rem;font-weight:700}.setting-item .tips[data-v-010b3e2d]{font-size:12px;color:var(--u-text-tips-color)}.division[data-v-466ca93d]{border-bottom:1px dashed var(--u-color-neutral-2)}.setting-item-group>div[data-v-610df7dd]:last-child{border-radius:6px;overflow:hidden;transition:all .26s linear}.setting-item-group>div[data-v-610df7dd]:last-child:hover{box-shadow:#0000000a 0 3px 5px}.setting-item-group .header[data-v-610df7dd],.setting-item-group .title[data-v-610df7dd]{margin-bottom:.5rem}.setting-item-group .title[data-v-610df7dd]{padding-left:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600;border-left:2px solid rgb(var(--u-blue-7))}.u-main-content[data-v-257ccd76]{background:var(--u-bg-color)}.u-main-content-inner[data-v-e8a61684]{height:100%;border-radius:.5rem;background-color:var(--u-bg-color);overflow-y:auto;overflow-x:hidden;padding:4px}
1
+ body[arco-theme=dark]{--u-bg-color:#26272a}:root{--u-bg-color:#f4f4f4;--u-bg-color-2:#fff;--u-bg-color-3:#fff;--u-blue-7:13,66,210;--u-blue-6:22,93,255;--u-blue-5:64,128,255;--u-wechat-color:#2ba471;--u-hover-bg-color:#f7f8fa;--u-text-tips-color:#8a939f;--u-color-neutral-1:#f7f8fa;--u-color-neutral-2:#f2f3f5;--u-color-neutral-3:#e5e6ec;--u-shadow-sm:#0000001a 0px 1px 2px 0px}*,:before,:after{box-sizing:border-box;margin:0;padding:0;font-weight:400}*,:before,:after,::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 #0000;--un-ring-shadow:0 0 #0000;--un-shadow-inset: ;--un-shadow:0 0 #0000;--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:#93c5fd80;--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }:root{--u-blue-1:240,248,255;--u-blue-2:224,242,254;--u-blue-3:186,230,253;--u-blue-4:125,211,252;--u-blue-5:56,189,248;--u-blue-6:14,165,233;--u-blue-7:2,132,199;--u-blue-8:3,105,161;--u-blue-9:12,74,110;--u-hover-bg-color:#f5f5f5;--u-text-tips-color:#999;--u-color-neutral-2:#e5e5e5}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.hidden{display:none}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:0}.flex{display:flex}.cursor-pointer{cursor:pointer}.items-center{align-items:center}.justify-between{justify-content:space-between}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:.5rem}.p-1{padding:.25rem}.pl-2{padding-left:.5rem}.text-4{font-size:1rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter,backdrop-filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:800px){.ut\:p-2{padding:.5rem}}@media (min-width:1280px){.xl\:p-4{padding:1rem}}.setting-item[data-v-3f239fb8]{background:var(--4c1cf51b);-webkit-user-select:none;user-select:none;padding:15px 10px;transition:all .28s linear}.setting-item[data-v-3f239fb8]:hover{background:var(--u-hover-bg-color)}.setting-item .title[data-v-3f239fb8]{margin-bottom:.25rem;font-size:1rem;font-weight:700}.setting-item .tips[data-v-3f239fb8]{color:var(--u-text-tips-color);font-size:12px}.division[data-v-466ca93d]{border-bottom:1px dashed var(--u-color-neutral-2)}.setting-item-group>div[data-v-610df7dd]:last-child{border-radius:6px;transition:all .26s linear;overflow:hidden}.setting-item-group>div[data-v-610df7dd]:last-child:hover{box-shadow:0 3px 5px #0000000a}.setting-item-group .header[data-v-610df7dd],.setting-item-group .title[data-v-610df7dd]{margin-bottom:.5rem}.setting-item-group .title[data-v-610df7dd]{border-left:2px solid rgb(var(--u-blue-7));padding-left:.5rem;font-size:1.25rem;font-weight:600;line-height:1.75rem}.u-main-content[data-v-257ccd76]{background:var(--u-bg-color)}.u-main-content-inner[data-v-d82bb11d]{background-color:var(--u-bg-color);border-radius:.5rem;height:100%;padding:4px;overflow:hidden auto}
2
+ /*$vite$:1*/
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xiaou66/u-web-ui",
3
- "version": "0.0.3",
3
+ "version": "0.0.4",
4
4
  "description": "web-ui",
5
5
  "main": "./dist/index.cjs.js",
6
6
  "module": "./dist/index.es.js",
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.es.js","sources":["../src/Menu/LeftMenu/LeftMenu.vue","../src/Setting/SettingItem/SettingItem.vue","../src/Setting/SettingDivision/SettingDivision.vue","../src/Setting/SettingGroup/SettingGroup.vue","../src/layout/WebLayout/WebBaseLayout.vue","../src/layout/WebLayout/WebLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, ref } from 'vue'\nimport { type RouteRecord, useRoute, useRouter } from 'vue-router'\nimport type { MenuItem } from \"../Menu\";\nimport type {LeftMenuInstance} from \"./LeftMenu\";\n\nconst collapsed = ref(document.documentElement.clientWidth <= 800)\n\nfunction changeCollapsed() {\n collapsed.value = !collapsed.value\n}\n\nconst router = useRouter()\nconst route = useRoute();\ntype MenuRouterItem = (RouteRecord & { meta?: MenuItem });\nconst menuRouterList = ref<MenuRouterItem[]>([])\nonMounted(() => {\n menuRouterList.value = router.getRoutes().filter(item => item.meta)\n .filter((item) => item.meta.menu) as MenuRouterItem[];\n})\n\nfunction go(item: RouteRecord) {\n router.push(item.path)\n}\n\ndefineExpose<LeftMenuInstance>({\n changeCollapsed\n});\n</script>\n\n<template>\n <t-menu :value=\"route.name\"\n :collapsed=\"collapsed\"\n :width=\"['180px', '60px']\">\n <template #operations>\n <t-button variant=\"text\" shape=\"square\"\n @click=\"changeCollapsed\">\n <template #icon><t-icon name=\"view-list\" /></template>\n </t-button>\n </template>\n <t-menu-item v-for=\"(menuItem) in menuRouterList\"\n :key=\"menuItem.name\"\n :value=\"menuItem.name\" @click=go(menuItem)>\n <template #icon>\n <t-icon :class=\"menuItem.meta.icon\"></t-icon>\n </template>\n {{menuItem.meta.title}}\n </t-menu-item>\n </t-menu>\n</template>\n\n<style scoped></style>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nwithDefaults(defineProps<{\n name?: string;\n desc?: string;\n click?: boolean;\n vip?: boolean;\n minName?: boolean;\n background?: string;\n}>(), {\n background: 'var(--u-bg-color-3)'\n});\n\nconst attrs = useAttrs();\n// 检测是否绑定了 click 事件\nconst hasClick = computed(() => {\n return 'onClick' in attrs || 'onClickCapture' in attrs\n});\n</script>\n<template>\n <div class=\"setting-item\"\n :class=\"{ 'cursor-pointer': hasClick }\"\n v-on=\"{\n ...(hasClick && { click: $attrs.onClick || $attrs.onClickCapture })\n }\">\n <div class=\"flex justify-between items-center\">\n <div>\n <div class=\"name u-fx u-gap5 u-fac\">\n <slot name=\"name\">\n {{ name }}\n </slot>\n </div>\n <slot name=\"desc\">\n <div class=\"tips\">{{ desc }}</div>\n </slot>\n </div>\n <div>\n <slot name=\"default\"></slot>\n </div>\n </div>\n <div>\n <slot name=\"extra\"></slot>\n </div>\n </div>\n</template>\n\n<style scoped lang=\"less\">\n.setting-item {\n background: v-bind(background);\n padding: 15px 10px;\n transition: all 280ms linear;\n user-select: none;\n &:hover {\n background: var(--u-hover-bg-color);\n }\n .name {\n --at-apply: text-4 font-bold mb-1;\n }\n .tips {\n font-size: 12px;\n color: var(--u-text-tips-color);\n }\n}\n</style>\n","<script setup lang=\"ts\">\n\n</script>\n\n<template>\n <div class=\"division\"></div>\n</template>\n\n<style scoped lang=\"less\">\n.division {\n border-bottom: 1px dashed var(--u-color-neutral-2);\n}\n</style>\n","<script setup lang=\"ts\">\ndefineProps<{\n title?: string;\n}>()\n</script>\n\n<template>\n <div class=\"setting-item-group\">\n <div class=\"header\">\n <div class=\"title\">\n {{ title }}\n </div>\n <div v-if=\"$slots.desc\">\n <slot name=\"desc\" />\n </div>\n </div>\n <div>\n <slot />\n </div>\n </div>\n</template>\n\n<style scoped lang=\"less\">\n.setting-item-group {\n > div:last-child {\n border-radius: 6px;\n overflow: hidden;\n transition: all 260ms linear;\n &:hover {\n box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;\n }\n }\n .header, .title {\n --at-apply: mb-2;\n }\n .title {\n --at-apply: text-xl pl-2;\n font-weight: 600;\n border-left: 2px solid rgb(var(--u-blue-7));\n }\n}\n</style>\n","<script setup lang=\"ts\">\n\n// 定义插槽类型,提供智能提示\ndefineSlots<{\n /** 头部插槽 - 用于显示页面头部内容 */\n header?(): any\n /** 左侧插槽 - 用于显示左侧边栏内容 */\n left?(): any\n /** 默认插槽 - 主要内容区域 */\n default?(): any\n}>()\n\n</script>\n\n<template>\n <t-layout class=\"h-screen\">\n <t-header v-if=\"$slots.header\">\n <slot name=\"header\"></slot>\n </t-header>\n <t-layout class=\"min-h-0\">\n <t-aside width=\"auto\">\n <slot name=\"left\"></slot>\n </t-aside>\n <t-layout class=\"min-h-0 u-main-content\">\n <t-content class=\"xl:p-4 ut:p-2 p-1 h-full overflow-hidden\">\n <slot name=\"default\"></slot>\n </t-content>\n </t-layout>\n </t-layout>\n </t-layout>\n</template>\n\n<style scoped lang=\"less\">\n.u-main-content {\n background: var(--u-bg-color);\n}\n</style>\n","<script setup lang=\"ts\">\nimport WebBaseLayout from './WebBaseLayout.vue'\nimport { LeftMenu } from '../../Menu'\n\n// 定义插槽类型,提供智能提示\ndefineSlots<{\n /** Logo 插槽 - 用于显示网站 logo */\n logo?(): any\n /** 操作区插槽 - 用于显示头部操作按钮 */\n operations?(): any\n /** 左侧菜单插槽 - 用于自定义左侧菜单内容 */\n left?(): any\n /** 默认插槽 - 主要内容区域 */\n default?(): any\n}>()\n\n</script>\n\n<template>\n <WebBaseLayout>\n <template #header>\n <t-head-menu value=\"item1\" height=\"60px\">\n <template v-if=\"$slots.logo\" #logo>\n <slot name=\"logo\"></slot>\n </template>\n <template v-if=\"$slots.operations\" #operations>\n <slot name=\"operations\"></slot>\n </template>\n </t-head-menu>\n </template>\n <template #left>\n <slot name=\"left\">\n <LeftMenu />\n </slot>\n </template>\n <slot name=\"default\">\n <div class=\"u-main-content-inner\">\n <router-view />\n </div>\n </slot>\n </WebBaseLayout>\n</template>\n\n<style scoped lang=\"less\">\n.u-main-content-inner {\n --at-apply: h-full rounded-lg;\n background-color: var(--u-bg-color);\n overflow-y: auto;\n overflow-x: hidden;\n padding: 4px;\n}\n</style>\n"],"names":["collapsed","ref","changeCollapsed","router","useRouter","route","useRoute","menuRouterList","onMounted","item","go","__expose","_createBlock","_component_t_menu","_unref","_createVNode","_component_t_button","_component_t_icon","_createElementBlock","_Fragment","_renderList","menuItem","_component_t_menu_item","$event","_normalizeClass","_createTextVNode","_toDisplayString","attrs","useAttrs","hasClick","computed","_openBlock","_mergeProps","_toHandlers","$attrs","_createElementVNode","_hoisted_1","_hoisted_2","_renderSlot","_ctx","name","_hoisted_3","desc","title","$slots","_hoisted_4","_component_t_layout","_component_t_header","_component_t_aside","_component_t_content","WebBaseLayout","_component_t_head_menu","LeftMenu","_component_router_view"],"mappings":"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"}