hzzt-plus 2.0.4 → 2.0.6
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.full.js +19 -13
- package/dist/index.full.min.js +11 -11
- package/dist/index.full.min.js.map +1 -1
- package/dist/index.full.min.mjs +11 -11
- package/dist/index.full.min.mjs.map +1 -1
- package/dist/index.full.mjs +19 -13
- package/dist/locale/en.js +1 -1
- package/dist/locale/en.min.js +1 -1
- package/dist/locale/en.min.mjs +1 -1
- package/dist/locale/en.mjs +1 -1
- package/dist/locale/zh-cn.js +1 -1
- package/dist/locale/zh-cn.min.js +1 -1
- package/dist/locale/zh-cn.min.mjs +1 -1
- package/dist/locale/zh-cn.mjs +1 -1
- package/es/components/collapse/index.mjs +2 -2
- package/es/components/collapse/src/collapse.mjs +88 -0
- package/es/components/collapse/src/collapse.mjs.map +1 -1
- package/es/components/collapse/src/collapse2.mjs +0 -88
- package/es/components/collapse/src/collapse2.mjs.map +1 -1
- package/es/components/index.mjs +1 -1
- package/es/components/lazy-list/index.mjs +2 -2
- package/es/components/lazy-list/src/lazy-list.mjs +22 -80
- package/es/components/lazy-list/src/lazy-list.mjs.map +1 -1
- package/es/components/lazy-list/src/lazy-list2.mjs +80 -22
- package/es/components/lazy-list/src/lazy-list2.mjs.map +1 -1
- package/es/components/scroll/index.mjs +2 -2
- package/es/components/scroll/src/scroll.mjs +0 -90
- package/es/components/scroll/src/scroll.mjs.map +1 -1
- package/es/components/scroll/src/scroll2.mjs +90 -0
- package/es/components/scroll/src/scroll2.mjs.map +1 -1
- package/es/components/select/src/select2.mjs +7 -2
- package/es/components/select/src/select2.mjs.map +1 -1
- package/es/components/tab/index.d.ts +2 -0
- package/es/components/tab/src/index.mjs +10 -9
- package/es/components/tab/src/index.mjs.map +1 -1
- package/es/components/tab/src/index.vue.d.ts +2 -0
- package/es/index.mjs +1 -1
- package/es/version.d.ts +1 -1
- package/es/version.mjs +1 -1
- package/es/version.mjs.map +1 -1
- package/lib/components/collapse/index.js +2 -2
- package/lib/components/collapse/src/collapse.js +91 -0
- package/lib/components/collapse/src/collapse.js.map +1 -1
- package/lib/components/collapse/src/collapse2.js +0 -91
- package/lib/components/collapse/src/collapse2.js.map +1 -1
- package/lib/components/index.js +1 -1
- package/lib/components/lazy-list/index.js +2 -2
- package/lib/components/lazy-list/src/lazy-list.js +23 -80
- package/lib/components/lazy-list/src/lazy-list.js.map +1 -1
- package/lib/components/lazy-list/src/lazy-list2.js +80 -23
- package/lib/components/lazy-list/src/lazy-list2.js.map +1 -1
- package/lib/components/scroll/index.js +2 -2
- package/lib/components/scroll/src/scroll.js +0 -93
- package/lib/components/scroll/src/scroll.js.map +1 -1
- package/lib/components/scroll/src/scroll2.js +93 -0
- package/lib/components/scroll/src/scroll2.js.map +1 -1
- package/lib/components/select/src/select2.js +6 -1
- package/lib/components/select/src/select2.js.map +1 -1
- package/lib/components/tab/index.d.ts +2 -0
- package/lib/components/tab/src/index.js +9 -8
- package/lib/components/tab/src/index.js.map +1 -1
- package/lib/components/tab/src/index.vue.d.ts +2 -0
- package/lib/index.js +1 -1
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/package.json +1 -1
- package/web-types.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lazy-list2.mjs","sources":["../../../../../../packages/components/lazy-list/src/lazy-list.
|
|
1
|
+
{"version":3,"file":"lazy-list2.mjs","sources":["../../../../../../packages/components/lazy-list/src/lazy-list.vue"],"sourcesContent":["<template>\n <div :class=\"containerCls\" @scroll=\"scrollList\">\n <div\n :style=\"{\n height: totalHeight,\n width: 0,\n float: 'left',\n }\"\n />\n <div :style=\"{marginTop: marginTop}\">\n <div\n v-for=\"item in calcList\"\n :key=\"item[rowKey]\"\n :style=\"{\n height: height+'px'\n }\"\n :class=\"['hzzt-lazy-list__item', current === item?'is-active':'']\"\n @click=\"rowClick(item)\"\n >\n <slot :data=\"item\" />\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import {lazyListEmits, lazyListProps} from './lazy-list'\n import {computed, ref, watch} from \"vue\";\n import {useNamespace} from \"@hzzt-plus/hooks\";\n\n defineOptions({\n name: 'HzztLazyList',\n })\n\n const props = defineProps(lazyListProps)\n const emit = defineEmits(lazyListEmits)\n\n const totalHeight = ref('100%');\n const marginTop = ref('0px');\n const currentIndex = ref(1);\n const current = ref(null);\n\n const nsLazy = useNamespace('lazy-list');\n\n const containerCls = computed(() => [\n 'overflow-y-auto',\n nsLazy.b(),\n ])\n\n watch(() => props.data, () => {\n totalHeight.value = props.data.length * props.height + 'px';\n }, {\n immediate: true,\n });\n\n const calcList = computed(\n () => props.data.slice(currentIndex.value === 1 ? 0 : ((currentIndex.value - 1) * props.size -\n props.size / 2), (currentIndex.value + 1) * props.size + props.size / 2));\n\n function scrollList(e: Event) {\n const target = e.target as HTMLElement;\n const scrollTop = target.scrollTop;\n if (scrollTop < props.size / 2 * props.height) {\n currentIndex.value = 1;\n } else {\n currentIndex.value = Math.ceil((scrollTop - props.size / 2 * props.height) / props.size / props.height);\n }\n if (currentIndex.value === 1) {\n marginTop.value = '0px';\n } else {\n marginTop.value = ((currentIndex.value - 1) * props.size - props.size / 2) * props.height + 'px';\n }\n }\n\n function rowClick(row: any) {\n current.value = row;\n emit('row-click', row);\n }\n\n\n</script>\n"],"names":["_openBlock","_createElementBlock"],"mappings":";;;;;;;mCA8BgB,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAM,MAAA,WAAA,GAAc,IAAI,MAAM,CAAA,CAAA;AAC9B,IAAM,MAAA,SAAA,GAAY,IAAI,KAAK,CAAA,CAAA;AAC3B,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA,CAAA;AAC1B,IAAM,MAAA,OAAA,GAAU,IAAI,IAAI,CAAA,CAAA;AAExB,IAAM,MAAA,MAAA,GAAS,aAAa,WAAW,CAAA,CAAA;AAEvC,IAAM,MAAA,YAAA,GAAe,SAAS,MAAM;AAAA,MAClC,iBAAA;AAAA,MACA,OAAO,CAAE,EAAA;AAAA,KACV,CAAA,CAAA;AAED,IAAM,KAAA,CAAA,MAAM,KAAM,CAAA,IAAA,EAAM,MAAM;AAC5B,MAAA,WAAA,CAAY,KAAQ,GAAA,KAAA,CAAM,IAAK,CAAA,MAAA,GAAS,MAAM,MAAS,GAAA,IAAA,CAAA;AAAA,KACtD,EAAA;AAAA,MACD,SAAW,EAAA,IAAA;AAAA,KACZ,CAAA,CAAA;AAED,IAAA,MAAM,QAAW,GAAA,QAAA,CAAA,MAAA,KAAA,CAAA,IAAA,CAAA,KAAA,CAAA,YAAA,CAAA,KAAA,KAAA,CAAA,GAAA,CAAA,GAAA,CAAA,YAAA,CAAA,KAAA,GAAA,CAAA,IAAA,KAAA,CAAA,IAAA,GAAA,KAAA,CAAA,IAAA,GAAA,CAAA,EAAA,CAAA,YAAA,CAAA,KAAA,GAAA,CAAA,IAAA,KAAA,CAAA,IAAA,GAAA,KAAA,CAAA,IAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IACf,mBAAiB,CAAA,CAAA,EAAA;AACwD,MAAC,MAAA,MAAA,GAAA,CAAA,CAAA,MAAA,CAAA;AAE5E,MAAA,MAAA,YAAoB,MAAU,CAAA,SAAA,CAAA;AAC5B,MAAA,IAAA,YAAiB,KAAA,CAAA,IAAA,GAAA,CAAA,GAAA,KAAA,CAAA,MAAA,EAAA;AACjB,QAAA,kBAAyB,GAAA,CAAA,CAAA;AACzB,OAAA,MAAgB;AACd,QAAA,YAAA,CAAa,KAAQ,GAAA,IAAA,CAAA,IAAA,CAAA,CAAA,SAAA,GAAA,KAAA,CAAA,IAAA,GAAA,CAAA,GAAA,KAAA,CAAA,MAAA,IAAA,KAAA,CAAA,IAAA,GAAA,KAAA,CAAA,MAAA,CAAA,CAAA;AAAA,OAChB;AACL,MAAA,IAAA,YAAqB,CAAA,KAAA,KAAA,CAAK,EAAM;AAAsE,QACxG,SAAA,CAAA,KAAA,GAAA,KAAA,CAAA;AACA,OAAI,MAAA;AACF,QAAA,SAAA,CAAU,KAAQ,GAAA,CAAA,CAAA,YAAA,CAAA,KAAA,GAAA,CAAA,IAAA,KAAA,CAAA,IAAA,GAAA,KAAA,CAAA,IAAA,GAAA,CAAA,IAAA,KAAA,CAAA,MAAA,GAAA,IAAA,CAAA;AAAA,OACb;AACL,KAAU;AAAkF,IAC9F,SAAA,QAAA,CAAA,GAAA,EAAA;AAAA,MACF,OAAA,CAAA,KAAA,GAAA,GAAA,CAAA;AAEA,MAAA,IAAA,CAAA,WAAkB,EAAU,GAAA,CAAA,CAAA;AAC1B,KAAA;AACA,IAAA,OAAK,aAAa,KAAG;AAAA,MACvB,OAAAA,SAAA,EAAA,EAAAC,kBAAA,CAAA,KAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../../utils/index.mjs';
|
|
2
|
-
import Scroll from './src/
|
|
3
|
-
import './src/
|
|
2
|
+
import Scroll from './src/scroll2.mjs';
|
|
3
|
+
import './src/scroll.mjs';
|
|
4
4
|
import { withInstall } from '../../utils/vue/install.mjs';
|
|
5
5
|
|
|
6
6
|
const HzztScroll = withInstall(Scroll);
|
|
@@ -1,92 +1,2 @@
|
|
|
1
|
-
import { defineComponent, ref, onUpdated, openBlock, createElementBlock, normalizeClass, createVNode, createCommentVNode, createElementVNode, normalizeStyle, renderSlot } from 'vue';
|
|
2
|
-
import { useResizeObserver } from '@vueuse/core';
|
|
3
|
-
import HzztIcon from '../../icon/src/index.mjs';
|
|
4
|
-
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
|
5
1
|
|
|
6
|
-
const __default__ = defineComponent({
|
|
7
|
-
name: "HzztScroll"
|
|
8
|
-
});
|
|
9
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
10
|
-
...__default__,
|
|
11
|
-
setup(__props) {
|
|
12
|
-
const navTranslateX = ref(0);
|
|
13
|
-
const scrollMainRef = ref(null);
|
|
14
|
-
const scrollRef = ref(null);
|
|
15
|
-
const scrollContentRef = ref(null);
|
|
16
|
-
const scrollable = ref(false);
|
|
17
|
-
function update() {
|
|
18
|
-
if (!scrollRef.value || !scrollContentRef.value)
|
|
19
|
-
return;
|
|
20
|
-
const scrollWidth = scrollRef.value ? scrollRef.value.offsetWidth : 0;
|
|
21
|
-
const contentWidth = scrollContentRef.value ? scrollContentRef.value.offsetWidth : 0;
|
|
22
|
-
if (scrollWidth >= contentWidth) {
|
|
23
|
-
scrollable.value = false;
|
|
24
|
-
navTranslateX.value = 0;
|
|
25
|
-
return;
|
|
26
|
-
}
|
|
27
|
-
scrollable.value = true;
|
|
28
|
-
}
|
|
29
|
-
useResizeObserver(scrollMainRef, update);
|
|
30
|
-
useResizeObserver(scrollContentRef, update);
|
|
31
|
-
onUpdated(() => update());
|
|
32
|
-
function btnNavPrev() {
|
|
33
|
-
var _a;
|
|
34
|
-
const containerSize = ((_a = scrollRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
35
|
-
const currentOffset = navTranslateX.value;
|
|
36
|
-
if (!currentOffset)
|
|
37
|
-
return;
|
|
38
|
-
const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;
|
|
39
|
-
navTranslateX.value = newOffset;
|
|
40
|
-
}
|
|
41
|
-
function btnNavNext() {
|
|
42
|
-
var _a, _b;
|
|
43
|
-
const navSize = ((_a = scrollContentRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
44
|
-
const currentOffset = navTranslateX.value;
|
|
45
|
-
const containerSize = ((_b = scrollRef.value) == null ? void 0 : _b.offsetWidth) || 0;
|
|
46
|
-
if (navSize - currentOffset < containerSize)
|
|
47
|
-
return;
|
|
48
|
-
const newOffset = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize;
|
|
49
|
-
navTranslateX.value = newOffset;
|
|
50
|
-
}
|
|
51
|
-
return (_ctx, _cache) => {
|
|
52
|
-
return openBlock(), createElementBlock("div", {
|
|
53
|
-
ref_key: "scrollMainRef",
|
|
54
|
-
ref: scrollMainRef,
|
|
55
|
-
class: normalizeClass([{ "is-scrollable": scrollable.value }, "relative hzzt-scroll"])
|
|
56
|
-
}, [
|
|
57
|
-
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
58
|
-
key: 0,
|
|
59
|
-
class: "hzzt-scroll__nav-prev",
|
|
60
|
-
onClick: btnNavPrev
|
|
61
|
-
}, [
|
|
62
|
-
createVNode(HzztIcon, { name: "arrow-left" })
|
|
63
|
-
])) : createCommentVNode("v-if", true),
|
|
64
|
-
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
65
|
-
key: 1,
|
|
66
|
-
class: "hzzt-scroll__nav-next",
|
|
67
|
-
onClick: btnNavNext
|
|
68
|
-
}, [
|
|
69
|
-
createVNode(HzztIcon, { name: "arrow-right" })
|
|
70
|
-
])) : createCommentVNode("v-if", true),
|
|
71
|
-
createElementVNode("div", {
|
|
72
|
-
ref_key: "scrollRef",
|
|
73
|
-
ref: scrollRef,
|
|
74
|
-
class: "overflow-hidden"
|
|
75
|
-
}, [
|
|
76
|
-
createElementVNode("div", {
|
|
77
|
-
ref_key: "scrollContentRef",
|
|
78
|
-
ref: scrollContentRef,
|
|
79
|
-
style: normalizeStyle({ transform: `translateX(${-navTranslateX.value}px)` }),
|
|
80
|
-
class: "hzzt-scroll__content"
|
|
81
|
-
}, [
|
|
82
|
-
renderSlot(_ctx.$slots, "default")
|
|
83
|
-
], 4)
|
|
84
|
-
], 512)
|
|
85
|
-
], 2);
|
|
86
|
-
};
|
|
87
|
-
}
|
|
88
|
-
});
|
|
89
|
-
var Scroll = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scroll.vue"]]);
|
|
90
|
-
|
|
91
|
-
export { Scroll as default };
|
|
92
2
|
//# sourceMappingURL=scroll.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.mjs","sources":[
|
|
1
|
+
{"version":3,"file":"scroll.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,2 +1,92 @@
|
|
|
1
|
+
import { defineComponent, ref, onUpdated, openBlock, createElementBlock, normalizeClass, createVNode, createCommentVNode, createElementVNode, normalizeStyle, renderSlot } from 'vue';
|
|
2
|
+
import { useResizeObserver } from '@vueuse/core';
|
|
3
|
+
import HzztIcon from '../../icon/src/index.mjs';
|
|
4
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
|
1
5
|
|
|
6
|
+
const __default__ = defineComponent({
|
|
7
|
+
name: "HzztScroll"
|
|
8
|
+
});
|
|
9
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
10
|
+
...__default__,
|
|
11
|
+
setup(__props) {
|
|
12
|
+
const navTranslateX = ref(0);
|
|
13
|
+
const scrollMainRef = ref(null);
|
|
14
|
+
const scrollRef = ref(null);
|
|
15
|
+
const scrollContentRef = ref(null);
|
|
16
|
+
const scrollable = ref(false);
|
|
17
|
+
function update() {
|
|
18
|
+
if (!scrollRef.value || !scrollContentRef.value)
|
|
19
|
+
return;
|
|
20
|
+
const scrollWidth = scrollRef.value ? scrollRef.value.offsetWidth : 0;
|
|
21
|
+
const contentWidth = scrollContentRef.value ? scrollContentRef.value.offsetWidth : 0;
|
|
22
|
+
if (scrollWidth >= contentWidth) {
|
|
23
|
+
scrollable.value = false;
|
|
24
|
+
navTranslateX.value = 0;
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
scrollable.value = true;
|
|
28
|
+
}
|
|
29
|
+
useResizeObserver(scrollMainRef, update);
|
|
30
|
+
useResizeObserver(scrollContentRef, update);
|
|
31
|
+
onUpdated(() => update());
|
|
32
|
+
function btnNavPrev() {
|
|
33
|
+
var _a;
|
|
34
|
+
const containerSize = ((_a = scrollRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
35
|
+
const currentOffset = navTranslateX.value;
|
|
36
|
+
if (!currentOffset)
|
|
37
|
+
return;
|
|
38
|
+
const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;
|
|
39
|
+
navTranslateX.value = newOffset;
|
|
40
|
+
}
|
|
41
|
+
function btnNavNext() {
|
|
42
|
+
var _a, _b;
|
|
43
|
+
const navSize = ((_a = scrollContentRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
44
|
+
const currentOffset = navTranslateX.value;
|
|
45
|
+
const containerSize = ((_b = scrollRef.value) == null ? void 0 : _b.offsetWidth) || 0;
|
|
46
|
+
if (navSize - currentOffset < containerSize)
|
|
47
|
+
return;
|
|
48
|
+
const newOffset = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize;
|
|
49
|
+
navTranslateX.value = newOffset;
|
|
50
|
+
}
|
|
51
|
+
return (_ctx, _cache) => {
|
|
52
|
+
return openBlock(), createElementBlock("div", {
|
|
53
|
+
ref_key: "scrollMainRef",
|
|
54
|
+
ref: scrollMainRef,
|
|
55
|
+
class: normalizeClass([{ "is-scrollable": scrollable.value }, "relative hzzt-scroll"])
|
|
56
|
+
}, [
|
|
57
|
+
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
58
|
+
key: 0,
|
|
59
|
+
class: "hzzt-scroll__nav-prev",
|
|
60
|
+
onClick: btnNavPrev
|
|
61
|
+
}, [
|
|
62
|
+
createVNode(HzztIcon, { name: "arrow-left" })
|
|
63
|
+
])) : createCommentVNode("v-if", true),
|
|
64
|
+
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
65
|
+
key: 1,
|
|
66
|
+
class: "hzzt-scroll__nav-next",
|
|
67
|
+
onClick: btnNavNext
|
|
68
|
+
}, [
|
|
69
|
+
createVNode(HzztIcon, { name: "arrow-right" })
|
|
70
|
+
])) : createCommentVNode("v-if", true),
|
|
71
|
+
createElementVNode("div", {
|
|
72
|
+
ref_key: "scrollRef",
|
|
73
|
+
ref: scrollRef,
|
|
74
|
+
class: "overflow-hidden"
|
|
75
|
+
}, [
|
|
76
|
+
createElementVNode("div", {
|
|
77
|
+
ref_key: "scrollContentRef",
|
|
78
|
+
ref: scrollContentRef,
|
|
79
|
+
style: normalizeStyle({ transform: `translateX(${-navTranslateX.value}px)` }),
|
|
80
|
+
class: "hzzt-scroll__content"
|
|
81
|
+
}, [
|
|
82
|
+
renderSlot(_ctx.$slots, "default")
|
|
83
|
+
], 4)
|
|
84
|
+
], 512)
|
|
85
|
+
], 2);
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
var Scroll = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scroll.vue"]]);
|
|
90
|
+
|
|
91
|
+
export { Scroll as default };
|
|
2
92
|
//# sourceMappingURL=scroll2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"scroll2.mjs","sources":["../../../../../../packages/components/scroll/src/scroll.vue"],"sourcesContent":["<template>\n <div ref=\"scrollMainRef\" :class=\"{'is-scrollable':scrollable}\" class=\"relative hzzt-scroll\">\n <div v-if=\"scrollable\" class=\"hzzt-scroll__nav-prev\" @click=\"btnNavPrev\">\n <hzzt-icon name=\"arrow-left\" />\n </div>\n <div v-if=\"scrollable\" class=\"hzzt-scroll__nav-next\" @click=\"btnNavNext\">\n <hzzt-icon name=\"arrow-right\" />\n </div>\n <div ref=\"scrollRef\" class=\"overflow-hidden\">\n <div ref=\"scrollContentRef\" :style=\"{transform: `translateX(${-navTranslateX}px)`}\" class=\"hzzt-scroll__content\">\n <slot />\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import {onUpdated, ref} from 'vue';\n import {useResizeObserver} from '@vueuse/core';\n import HzztIcon from \"@hzzt-plus/components/icon/src/index.vue\";\n\n defineOptions({\n name: 'HzztScroll',\n })\n\n const navTranslateX = ref(0);\n const scrollMainRef = ref<HTMLElement | null>(null);\n const scrollRef = ref<HTMLElement | null>(null);\n const scrollContentRef = ref<HTMLElement | null>(null);\n const scrollable = ref(false);\n\n function update() {\n if (!scrollRef.value || !scrollContentRef.value) return;\n const scrollWidth = scrollRef.value ? scrollRef.value.offsetWidth : 0;\n const contentWidth = scrollContentRef.value ? scrollContentRef.value.offsetWidth : 0;\n if (scrollWidth >= contentWidth) {\n scrollable.value = false;\n navTranslateX.value = 0;\n return;\n }\n scrollable.value = true;\n }\n\n useResizeObserver(scrollMainRef, update);\n useResizeObserver(scrollContentRef, update);\n\n onUpdated(() => update());\n\n function btnNavPrev() {\n const containerSize = scrollRef.value?.offsetWidth || 0;\n const currentOffset = navTranslateX.value;\n if (!currentOffset) return;\n const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;\n navTranslateX.value = newOffset;\n }\n\n function btnNavNext() {\n const navSize = scrollContentRef.value?.offsetWidth || 0;\n const currentOffset = navTranslateX.value;\n const containerSize = scrollRef.value?.offsetWidth || 0;\n if (navSize - currentOffset < containerSize) return;\n const newOffset = navSize - currentOffset > containerSize * 2 ?\n currentOffset + containerSize :\n navSize - containerSize;\n navTranslateX.value = newOffset;\n }\n</script>\n"],"names":[],"mappings":";;;;;mCAqBgB,CAAA;AAAA,EACZ,IAAM,EAAA,YAAA;AACR,CAAA,CAAA,CAAA;;;;AAEA,IAAM,MAAA,aAAA,GAAgB,IAAI,CAAC,CAAA,CAAA;AAC3B,IAAM,MAAA,aAAA,GAAgB,IAAwB,IAAI,CAAA,CAAA;AAClD,IAAM,MAAA,SAAA,GAAY,IAAwB,IAAI,CAAA,CAAA;AAC9C,IAAM,MAAA,gBAAA,GAAmB,IAAwB,IAAI,CAAA,CAAA;AACrD,IAAM,MAAA,UAAA,GAAa,IAAI,KAAK,CAAA,CAAA;AAE5B,IAAA,SAAS,MAAS,GAAA;AAChB,MAAA,IAAI,CAAC,SAAA,CAAU,KAAS,IAAA,CAAC,gBAAiB,CAAA,KAAA;AAAO,QAAA,OAAA;AACjD,MAAA,MAAM,WAAc,GAAA,SAAA,CAAU,KAAQ,GAAA,SAAA,CAAU,MAAM,WAAc,GAAA,CAAA,CAAA;AACpE,MAAA,MAAM,YAAe,GAAA,gBAAA,CAAiB,KAAQ,GAAA,gBAAA,CAAiB,MAAM,WAAc,GAAA,CAAA,CAAA;AACnF,MAAA,IAAI,eAAe,YAAc,EAAA;AAC/B,QAAA,UAAA,CAAW,KAAQ,GAAA,KAAA,CAAA;AACnB,QAAA,aAAA,CAAc,KAAQ,GAAA,CAAA,CAAA;AACtB,QAAA,OAAA;AAAA,OACF;AACA,MAAA,UAAA,CAAW,KAAQ,GAAA,IAAA,CAAA;AAAA,KACrB;AAEA,IAAA,iBAAA,CAAkB,eAAe,MAAM,CAAA,CAAA;AACvC,IAAA,iBAAA,CAAkB,kBAAkB,MAAM,CAAA,CAAA;AAE1C,IAAU,SAAA,CAAA,MAAM,QAAQ,CAAA,CAAA;AAExB,IAAA,SAAS,UAAa,GAAA;AACpB,MAAM,IAAA,EAAA,CAAA;AACN,MAAA,MAAM,gBAAgB,CAAc,CAAA,EAAA,GAAA,SAAA,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA,KAAA,CAAA,CAAA;AACpC,MAAA,MAAK,aAAA,GAAA,aAAA,CAAA,KAAA,CAAA;AAAe,MAAA,IAAA,CAAA,aAAA;AACpB,QAAA,OAAkB;AAClB,MAAA,MAAA,SAAsB,GAAA,aAAA,GAAA,aAAA,GAAA,aAAA,GAAA,aAAA,GAAA,CAAA,CAAA;AAAA,MACxB,aAAA,CAAA,KAAA,GAAA,SAAA,CAAA;AAEA,KAAA;AACE,IAAM,SAAA,UAA2B,GAAA;AACjC,MAAA,IAAA,EAAM;AACN,MAAM,MAAA,OAAA,GAAA,CAAA,CAAA,EAAA,GAA0B,gBAAO,CAAe,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA,KAAA,CAAA,CAAA;AACtD,MAAA,mBAA8B,GAAA,aAAA,CAAA,KAAA,CAAA;AAAe,MAAA,MAAA,aAAA,GAAA,CAAA,CAAA,EAAA,GAAA,SAAA,CAAA,KAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,WAAA,KAAA,CAAA,CAAA;AAC7C,MAAA,IAAA,uBAA4B,GAAA,aAAA;AAG5B,QAAA,OAAA;AAAsB,MACxB,MAAA,SAAA,GAAA,OAAA,GAAA,aAAA,GAAA,aAAA,GAAA,CAAA,GAAA,aAAA,GAAA,aAAA,GAAA,OAAA,GAAA,aAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent, useAttrs, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createVNode, mergeProps, withCtx, createBlock, createCommentVNode } from 'vue';
|
|
1
|
+
import { defineComponent, useAttrs, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createVNode, mergeProps, withCtx, createBlock, createCommentVNode, renderSlot } from 'vue';
|
|
2
2
|
import { selectProps, selectEmits } from './select.mjs';
|
|
3
3
|
import { useFormSize, useFormDisabled, ElInput, ElSelectV2 } from 'element-plus';
|
|
4
4
|
import '../../../hooks/index.mjs';
|
|
@@ -182,7 +182,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
182
182
|
}, unref(_selectProps), {
|
|
183
183
|
onChange: selectChange,
|
|
184
184
|
onVisibleChange: selectVisibleChange
|
|
185
|
-
}),
|
|
185
|
+
}), {
|
|
186
|
+
default: withCtx(({ item }) => [
|
|
187
|
+
renderSlot(_ctx.$slots, "default", { item })
|
|
188
|
+
]),
|
|
189
|
+
_: 3
|
|
190
|
+
}, 16, ["class", "modelValue"])) : createCommentVNode("v-if", true)
|
|
186
191
|
], 6);
|
|
187
192
|
};
|
|
188
193
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select2.mjs","sources":["../../../../../../packages/components/select/src/select.vue"],"sourcesContent":["<template>\n <div :class=\"containerCls\" :style=\"containerStyle\">\n <el-input\n :class=\"inputCls\"\n v-model=\"inputVal\"\n ref=\"inputRef\"\n v-bind=\"_inputProps\"\n @input=\"input\"\n @change=\"change\"\n @focus=\"focus\"\n @keydown=\"keydown\"\n >\n <template #suffix>\n <hzzt-icon v-if=\"!trueReadonly\" class=\"pointer\" :name=\"arrowName\"\n @click=\"showSelect\"></hzzt-icon>\n </template>\n </el-input>\n <el-select-v2 v-if=\"!trueReadonly\" :class=\"selectCls\" v-model=\"selectVal\" ref=\"selectRef\" v-bind=\"_selectProps\"\n @change=\"selectChange\" @visible-change=\"selectVisibleChange\">\n </el-select-v2>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import {selectEmits, selectProps} from './select'\n import {computed, ref, useAttrs, watch} from \"vue\";\n import {useFormDisabled, useFormSize} from \"element-plus\";\n import {useGlobalSize, useNamespace} from \"@hzzt-plus/hooks\";\n import {ElInput, ElSelectV2} from 'element-plus'\n import type {CSSProperties} from 'vue'\n import HzztIcon from \"@hzzt-plus/components/icon/src/index.vue\";\n\n\n defineOptions({\n name: 'HzztSelect',\n inheritAttrs: false,\n })\n\n const props = defineProps(selectProps)\n const emit = defineEmits(selectEmits)\n\n const attrs = useAttrs();\n\n const inputVal = ref(props.modelValue);\n const selectVal = ref();\n const inputRef = ref();\n const selectRef = ref();\n const arrowName = ref('arrow-down');\n\n const nsSelect = useNamespace('select');\n\n const formSize = useFormSize()\n const formDisabled = useFormDisabled()\n\n const trueSize = computed(\n () => props.size || formSize.value || useGlobalSize().value\n )\n\n const trueDisabled = computed(() => props.disabled || formDisabled.value)\n\n const trueReadonly = computed(() => props.readonly || trueDisabled.value)\n\n const containerCls = computed(() => [\n 'relative',\n 'line-height-1',\n attrs.class,\n nsSelect.b(),\n nsSelect.m(trueSize.value),\n ])\n\n const containerStyle = computed(() => attrs.style as CSSProperties)\n\n const inputCls = computed(() => [\n nsSelect.e('input'),\n 'width-100%'\n ])\n\n const selectCls = computed(() => [\n nsSelect.e('select'),\n 'width-100%'\n ])\n\n const _inputProps = computed(() => ({\n disabled: trueDisabled.value,\n size: trueSize.value,\n clearable: props.clearable,\n placeholder: props.placeholder,\n readonly: props.readonly,\n ...attrs,\n class: '',\n style: {\n position: trueReadonly.value ? 'static' : 'absolute',\n left: 0,\n top: 0,\n right: 0,\n zIndex: 2,\n },\n }))\n\n const _selectProps = computed(() => ({\n options: props.options,\n size: trueSize.value,\n filterable: true,\n popperClass: 'select-v2-popper-min-width-100',\n ...props.selectProps,\n }))\n\n watch(() => props.modelValue, (v) => {\n inputVal.value = v;\n })\n\n watch(() => inputVal.value, (v) => {\n selectVal.value = v;\n })\n\n function input(str: string) {\n if (selectRef.value?.dropdownMenuVisible) {\n selectRef.value.states.inputValue = inputVal.value;\n selectRef.value.debouncedOnInputChange();\n }\n emit('update:modelValue', str)\n emit('input', str)\n }\n\n function change(str: string) {\n emit('change', str)\n }\n\n function focus() {\n if (selectRef.value && props.autoPullDown) {\n setTimeout(() => {\n selectRef.value.dropdownMenuVisible = true;\n }, 200)\n }\n }\n\n function keydown(e: KeyboardEvent | Event) {\n const key = \"key\" in e && e.key;\n if (key === 'ArrowDown') {\n emit('arrow-down', e);\n selectRef.value.dropdownMenuVisible = false;\n } else if (key === 'ArrowUp') {\n emit('arrow-up', e);\n selectRef.value.dropdownMenuVisible = false;\n } else if (key === 'ArrowLeft') {\n const index = inputRef.value.input.selectionStart;\n if (index === 0) {\n emit('arrow-left', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n } else if (key === 'ArrowRight') {\n const index = inputRef.value.input.selectionStart;\n if ((inputVal.value?.length ?? 0) === index) {\n emit('arrow-right', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n } else if (key === 'Enter') {\n emit('enter', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n }\n\n function showSelect() {\n if (selectRef.value) {\n selectRef.value.dropdownMenuVisible = !selectRef.value.dropdownMenuVisible;\n }\n }\n\n function selectChange(v: string) {\n let str = inputVal.value || '';\n if (props.replace) {\n str = v;\n } else {\n str += v;\n }\n emit('update:modelValue', str);\n emit('input', str)\n inputVal.value = str;\n setTimeout(() => {\n inputRef.value.focus();\n setTimeout(() => {\n selectRef.value.dropdownMenuVisible = false;\n }, 250)\n emit('change', str);\n });\n }\n\n function selectVisibleChange(v: boolean) {\n arrowName.value = v ? 'arrow-up' : 'arrow-down'\n }\n\n\n</script>\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select2.mjs","sources":["../../../../../../packages/components/select/src/select.vue"],"sourcesContent":["<template>\n <div :class=\"containerCls\" :style=\"containerStyle\">\n <el-input\n :class=\"inputCls\"\n v-model=\"inputVal\"\n ref=\"inputRef\"\n v-bind=\"_inputProps\"\n @input=\"input\"\n @change=\"change\"\n @focus=\"focus\"\n @keydown=\"keydown\"\n >\n <template #suffix>\n <hzzt-icon v-if=\"!trueReadonly\" class=\"pointer\" :name=\"arrowName\"\n @click=\"showSelect\"></hzzt-icon>\n </template>\n </el-input>\n <el-select-v2 v-if=\"!trueReadonly\" :class=\"selectCls\" v-model=\"selectVal\" ref=\"selectRef\" v-bind=\"_selectProps\"\n @change=\"selectChange\" @visible-change=\"selectVisibleChange\">\n <template #default=\"{ item }\">\n <slot :item=\"item\" />\n </template>\n </el-select-v2>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import {selectEmits, selectProps} from './select'\n import {computed, ref, useAttrs, watch} from \"vue\";\n import {useFormDisabled, useFormSize} from \"element-plus\";\n import {useGlobalSize, useNamespace} from \"@hzzt-plus/hooks\";\n import {ElInput, ElSelectV2} from 'element-plus'\n import type {CSSProperties} from 'vue'\n import HzztIcon from \"@hzzt-plus/components/icon/src/index.vue\";\n\n\n defineOptions({\n name: 'HzztSelect',\n inheritAttrs: false,\n })\n\n const props = defineProps(selectProps)\n const emit = defineEmits(selectEmits)\n\n const attrs = useAttrs();\n\n const inputVal = ref(props.modelValue);\n const selectVal = ref();\n const inputRef = ref();\n const selectRef = ref();\n const arrowName = ref('arrow-down');\n\n const nsSelect = useNamespace('select');\n\n const formSize = useFormSize()\n const formDisabled = useFormDisabled()\n\n const trueSize = computed(\n () => props.size || formSize.value || useGlobalSize().value\n )\n\n const trueDisabled = computed(() => props.disabled || formDisabled.value)\n\n const trueReadonly = computed(() => props.readonly || trueDisabled.value)\n\n const containerCls = computed(() => [\n 'relative',\n 'line-height-1',\n attrs.class,\n nsSelect.b(),\n nsSelect.m(trueSize.value),\n ])\n\n const containerStyle = computed(() => attrs.style as CSSProperties)\n\n const inputCls = computed(() => [\n nsSelect.e('input'),\n 'width-100%'\n ])\n\n const selectCls = computed(() => [\n nsSelect.e('select'),\n 'width-100%'\n ])\n\n const _inputProps = computed(() => ({\n disabled: trueDisabled.value,\n size: trueSize.value,\n clearable: props.clearable,\n placeholder: props.placeholder,\n readonly: props.readonly,\n ...attrs,\n class: '',\n style: {\n position: trueReadonly.value ? 'static' : 'absolute',\n left: 0,\n top: 0,\n right: 0,\n zIndex: 2,\n },\n }))\n\n const _selectProps = computed(() => ({\n options: props.options,\n size: trueSize.value,\n filterable: true,\n popperClass: 'select-v2-popper-min-width-100',\n ...props.selectProps,\n }))\n\n watch(() => props.modelValue, (v) => {\n inputVal.value = v;\n })\n\n watch(() => inputVal.value, (v) => {\n selectVal.value = v;\n })\n\n function input(str: string) {\n if (selectRef.value?.dropdownMenuVisible) {\n selectRef.value.states.inputValue = inputVal.value;\n selectRef.value.debouncedOnInputChange();\n }\n emit('update:modelValue', str)\n emit('input', str)\n }\n\n function change(str: string) {\n emit('change', str)\n }\n\n function focus() {\n if (selectRef.value && props.autoPullDown) {\n setTimeout(() => {\n selectRef.value.dropdownMenuVisible = true;\n }, 200)\n }\n }\n\n function keydown(e: KeyboardEvent | Event) {\n const key = \"key\" in e && e.key;\n if (key === 'ArrowDown') {\n emit('arrow-down', e);\n selectRef.value.dropdownMenuVisible = false;\n } else if (key === 'ArrowUp') {\n emit('arrow-up', e);\n selectRef.value.dropdownMenuVisible = false;\n } else if (key === 'ArrowLeft') {\n const index = inputRef.value.input.selectionStart;\n if (index === 0) {\n emit('arrow-left', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n } else if (key === 'ArrowRight') {\n const index = inputRef.value.input.selectionStart;\n if ((inputVal.value?.length ?? 0) === index) {\n emit('arrow-right', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n } else if (key === 'Enter') {\n emit('enter', e);\n selectRef.value.dropdownMenuVisible = false;\n }\n }\n\n function showSelect() {\n if (selectRef.value) {\n selectRef.value.dropdownMenuVisible = !selectRef.value.dropdownMenuVisible;\n }\n }\n\n function selectChange(v: string) {\n let str = inputVal.value || '';\n if (props.replace) {\n str = v;\n } else {\n str += v;\n }\n emit('update:modelValue', str);\n emit('input', str)\n inputVal.value = str;\n setTimeout(() => {\n inputRef.value.focus();\n setTimeout(() => {\n selectRef.value.dropdownMenuVisible = false;\n }, 250)\n emit('change', str);\n });\n }\n\n function selectVisibleChange(v: boolean) {\n arrowName.value = v ? 'arrow-up' : 'arrow-down'\n }\n\n\n</script>\n"],"names":[],"mappings":"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"}
|
|
@@ -32,6 +32,7 @@ export declare const HzztTab: import("hzzt-plus/es/utils").SFCWithInstall<import
|
|
|
32
32
|
customTabList: import("vue").ComputedRef<{
|
|
33
33
|
number: number;
|
|
34
34
|
hide: boolean;
|
|
35
|
+
bgColor: string;
|
|
35
36
|
name: string;
|
|
36
37
|
label: string;
|
|
37
38
|
key: string;
|
|
@@ -41,6 +42,7 @@ export declare const HzztTab: import("hzzt-plus/es/utils").SFCWithInstall<import
|
|
|
41
42
|
label: string;
|
|
42
43
|
number: number;
|
|
43
44
|
hide: boolean;
|
|
45
|
+
bgColor: string;
|
|
44
46
|
}, event: Event) => void;
|
|
45
47
|
close: (index: number, event: Event) => void;
|
|
46
48
|
HzztIcon: import("vue").DefineComponent<{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, Fragment, renderList, unref, normalizeClass, toDisplayString, createCommentVNode, createBlock, renderSlot } from 'vue';
|
|
1
|
+
import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, Fragment, renderList, unref, normalizeClass, toDisplayString, normalizeStyle, createCommentVNode, createBlock, renderSlot } from 'vue';
|
|
2
2
|
import HzztIcon from '../../icon/src/index.mjs';
|
|
3
3
|
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
|
4
4
|
|
|
@@ -7,11 +7,7 @@ const _hoisted_2 = { class: "flex align-items-center" };
|
|
|
7
7
|
const _hoisted_3 = { class: "flex" };
|
|
8
8
|
const _hoisted_4 = ["onClick"];
|
|
9
9
|
const _hoisted_5 = { class: "hzzt-tab-badge" };
|
|
10
|
-
const _hoisted_6 = {
|
|
11
|
-
key: 0,
|
|
12
|
-
class: "hzzt-tab-badge-count"
|
|
13
|
-
};
|
|
14
|
-
const _hoisted_7 = { class: "flex wrap" };
|
|
10
|
+
const _hoisted_6 = { class: "flex wrap" };
|
|
15
11
|
const __default__ = defineComponent({
|
|
16
12
|
name: "HzztTab"
|
|
17
13
|
});
|
|
@@ -39,7 +35,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
39
35
|
key: `${tab.name}-${tab.number}`,
|
|
40
36
|
...tab,
|
|
41
37
|
number: Number(tab.number || 0),
|
|
42
|
-
hide: tab.hide
|
|
38
|
+
hide: tab.hide,
|
|
39
|
+
bgColor: tab.bgColor || ""
|
|
43
40
|
};
|
|
44
41
|
}).filter((tab) => !tab.hide));
|
|
45
42
|
function tabClick(tab, event) {
|
|
@@ -66,7 +63,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
66
63
|
createElementVNode("p", {
|
|
67
64
|
class: normalizeClass([{ active: __props.modelValue === tab.name }, "hzzt-tab-badge-text"])
|
|
68
65
|
}, toDisplayString(tab.label), 3),
|
|
69
|
-
tab.number && tab.number !== 0 ? (openBlock(), createElementBlock("p",
|
|
66
|
+
tab.number && tab.number !== 0 ? (openBlock(), createElementBlock("p", {
|
|
67
|
+
key: 0,
|
|
68
|
+
class: "hzzt-tab-badge-count",
|
|
69
|
+
style: normalizeStyle({ backgroundColor: tab.bgColor })
|
|
70
|
+
}, toDisplayString(tab.number > 999 ? "999+" : tab.number), 5)) : createCommentVNode("v-if", true),
|
|
70
71
|
__props.closable ? (openBlock(), createBlock(HzztIcon, {
|
|
71
72
|
key: 1,
|
|
72
73
|
class: "is-icon-close",
|
|
@@ -80,7 +81,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
80
81
|
renderSlot(_ctx.$slots, "filter"),
|
|
81
82
|
renderSlot(_ctx.$slots, "extra")
|
|
82
83
|
]),
|
|
83
|
-
createElementVNode("div",
|
|
84
|
+
createElementVNode("div", _hoisted_6, [
|
|
84
85
|
renderSlot(_ctx.$slots, "right")
|
|
85
86
|
])
|
|
86
87
|
]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/tab/src/index.vue"],"sourcesContent":["<template>\n <div class=\"hzzt-tab flex align-items-center justify-content-between wrap\">\n <div class=\"flex align-items-center\">\n <div class=\"flex\">\n <div\n v-for=\"(tab, index) in customTabList\"\n :key=\"tab.key\"\n class=\"hzzt-tab-pane\"\n @click=\"tabClick(tab, $event)\"\n >\n <div class=\"hzzt-tab-badge\">\n <p\n :class=\"{ active: modelValue === tab.name }\"\n class=\"hzzt-tab-badge-text\"\n >\n {{ tab.label }}\n </p>\n <p\n v-if=\"tab.number && tab.number !== 0\"\n class=\"hzzt-tab-badge-count\"\n >\n {{ tab.number > 999 ? '999+' : tab.number }}\n </p>\n <hzzt-icon\n v-if=\"closable\"\n class=\"is-icon-close\"\n name=\"close\"\n @click=\"close(index, $event)\"\n />\n </div>\n </div>\n </div>\n <slot name=\"filter\" />\n <slot name=\"extra\" />\n </div>\n <div class=\"flex wrap\">\n <slot name=\"right\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport HzztIcon from '@hzzt-plus/components/icon/src/index.vue'\n\ndefineOptions({\n name: 'HzztTab',\n})\n\ndeclare type Tab = {\n name: string\n label: string\n number: number\n hide: boolean\n}\n\nconst props = defineProps({\n tabList: {\n type: Array,\n default: () => [],\n },\n modelValue: {\n type: [Number, String, Array],\n },\n closable: {\n type: Boolean,\n default: () => false,\n },\n})\n\nconst emit = defineEmits(['update:modelValue', 'tab-click', 'tab-close'])\n\nconst customTabList = computed(() =>\n props.tabList\n .map((value) => {\n const tab = value as Tab\n return {\n key: `${tab.name}-${tab.number}` as string,\n ...tab,\n number: Number(tab.number || 0),\n hide: tab.hide,\n }\n })\n .filter((tab) => !tab.hide)\n)\n\nfunction tabClick(tab: Tab, event: Event) {\n if (tab.name === props.modelValue) return\n emit('update:modelValue', tab.name)\n emit('tab-click', tab, event)\n}\n\nfunction close(index: number, event: Event) {\n event.stopPropagation()\n emit('tab-close', index)\n}\n</script>\n"],"names":["_openBlock","_createElementBlock"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/tab/src/index.vue"],"sourcesContent":["<template>\n <div class=\"hzzt-tab flex align-items-center justify-content-between wrap\">\n <div class=\"flex align-items-center\">\n <div class=\"flex\">\n <div\n v-for=\"(tab, index) in customTabList\"\n :key=\"tab.key\"\n class=\"hzzt-tab-pane\"\n @click=\"tabClick(tab, $event)\"\n >\n <div class=\"hzzt-tab-badge\">\n <p\n :class=\"{ active: modelValue === tab.name }\"\n class=\"hzzt-tab-badge-text\"\n >\n {{ tab.label }}\n </p>\n <p\n v-if=\"tab.number && tab.number !== 0\"\n class=\"hzzt-tab-badge-count\"\n :style=\"{ backgroundColor: tab.bgColor }\"\n >\n {{ tab.number > 999 ? '999+' : tab.number }}\n </p>\n <hzzt-icon\n v-if=\"closable\"\n class=\"is-icon-close\"\n name=\"close\"\n @click=\"close(index, $event)\"\n />\n </div>\n </div>\n </div>\n <slot name=\"filter\" />\n <slot name=\"extra\" />\n </div>\n <div class=\"flex wrap\">\n <slot name=\"right\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport HzztIcon from '@hzzt-plus/components/icon/src/index.vue'\n\ndefineOptions({\n name: 'HzztTab',\n})\n\ndeclare type Tab = {\n name: string\n label: string\n number: number\n hide: boolean\n bgColor: string\n}\n\nconst props = defineProps({\n tabList: {\n type: Array,\n default: () => [],\n },\n modelValue: {\n type: [Number, String, Array],\n },\n closable: {\n type: Boolean,\n default: () => false,\n },\n})\n\nconst emit = defineEmits(['update:modelValue', 'tab-click', 'tab-close'])\n\nconst customTabList = computed(() =>\n props.tabList\n .map((value) => {\n const tab = value as Tab\n return {\n key: `${tab.name}-${tab.number}` as string,\n ...tab,\n number: Number(tab.number || 0),\n hide: tab.hide,\n bgColor: tab.bgColor || '',\n }\n })\n .filter((tab) => !tab.hide)\n)\n\nfunction tabClick(tab: Tab, event: Event) {\n if (tab.name === props.modelValue) return\n emit('update:modelValue', tab.name)\n emit('tab-click', tab, event)\n}\n\nfunction close(index: number, event: Event) {\n event.stopPropagation()\n emit('tab-close', index)\n}\n</script>\n"],"names":["_openBlock","_createElementBlock"],"mappings":";;;;;;;;;;mCA8Cc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AACR,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;AA0BA,IAAA,MAAM,aAAgB,GAAA,QAAA,CAAA,MAAA,KAAA,CAAA,OAAA,CAAA,GAAA,CAAA,CAAA,KAAA,KAAA;AAAA,MAAS,MAC7B,GAAA,GAAM,KACH,CAAA;AACC,MAAA,OAAA;AACA,QAAO,GAAA,EAAA,CAAA,EAAA,GAAA,CAAA,IAAA,CAAA,CAAA,EAAA,GAAA,CAAA,MAAA,CAAA,CAAA;AAAA,QAAA;AACyB,QAAA,MAC3B,EAAA,MAAA,CAAA,GAAA,CAAA,MAAA,IAAA,CAAA,CAAA;AAAA,QAAA,IACK,EAAA,GAAA,CAAA,IAAA;AAAsB,QAAA,SACpB,GAAA,CAAA,OAAA,IAAA,EAAA;AAAA,OACV,CAAA;AAAwB,KAC1B,CAAA,CAAA,MAAA,CAAA,CAAA,GAAA,KAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,CAAA;AAAA,IAAA,SAED,QAAgB,CAAA,GAAA,OAAS,EAAA;AAAA,MAC9B,IAAA,GAAA,CAAA,IAAA,KAAA,KAAA,CAAA,UAAA;AAEA,QAAS,OAAA;AACP,MAAI,IAAA,CAAA,mBAAmB,EAAA,GAAA,CAAA,IAAA,CAAA,CAAA;AAAY,MAAA,IAAA,CAAA,WAAA,EAAA,GAAA,EAAA,KAAA,CAAA,CAAA;AACnC,KAAK;AACL,IAAK,SAAA,KAAA,CAAA,KAAa,OAAU,EAAA;AAAA,MAC9B,KAAA,CAAA,eAAA,EAAA,CAAA;AAEA,MAAS,IAAA,CAAA,kBAAmC,CAAA,CAAA;AAC1C,KAAA;AACA,IAAA,OAAK,aAAa,KAAK;AAAA,MACzB,OAAAA,SAAA,EAAA,EAAAC,kBAAA,CAAA,KAAA,EAAA,UAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -3,6 +3,7 @@ declare type Tab = {
|
|
|
3
3
|
label: string;
|
|
4
4
|
number: number;
|
|
5
5
|
hide: boolean;
|
|
6
|
+
bgColor: string;
|
|
6
7
|
};
|
|
7
8
|
declare const _default: import("vue").DefineComponent<{
|
|
8
9
|
tabList: {
|
|
@@ -38,6 +39,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
38
39
|
customTabList: import("vue").ComputedRef<{
|
|
39
40
|
number: number;
|
|
40
41
|
hide: boolean;
|
|
42
|
+
bgColor: string;
|
|
41
43
|
name: string;
|
|
42
44
|
label: string;
|
|
43
45
|
key: string;
|
package/es/index.mjs
CHANGED
|
@@ -36,7 +36,7 @@ export { HzztSelect } from './components/select/index.mjs';
|
|
|
36
36
|
export { clickInputEmits, clickInputProps } from './components/click-input/src/click-input.mjs';
|
|
37
37
|
export { HzztClickInput } from './components/click-input/index.mjs';
|
|
38
38
|
export { HzztScroll } from './components/scroll/index.mjs';
|
|
39
|
-
export { lazyListEmits, lazyListProps } from './components/lazy-list/src/lazy-
|
|
39
|
+
export { lazyListEmits, lazyListProps } from './components/lazy-list/src/lazy-list.mjs';
|
|
40
40
|
export { HzztLazyList } from './components/lazy-list/index.mjs';
|
|
41
41
|
export { INSTALLED_KEY } from './constants/key.mjs';
|
|
42
42
|
export { componentSizeMap, componentSizes } from './constants/size.mjs';
|
package/es/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const version = "2.0.
|
|
1
|
+
export declare const version = "2.0.6";
|
package/es/version.mjs
CHANGED
package/es/version.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.mjs","sources":["../../../packages/hzzt-plus/version.ts"],"sourcesContent":["export const version = '2.0.
|
|
1
|
+
{"version":3,"file":"version.mjs","sources":["../../../packages/hzzt-plus/version.ts"],"sourcesContent":["export const version = '2.0.6'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
require('../../utils/index.js');
|
|
6
|
-
var collapse = require('./src/
|
|
7
|
-
require('./src/
|
|
6
|
+
var collapse = require('./src/collapse.js');
|
|
7
|
+
require('./src/collapse2.js');
|
|
8
8
|
var install = require('../../utils/vue/install.js');
|
|
9
9
|
|
|
10
10
|
const HzztCollapse = install.withInstall(collapse["default"]);
|
|
@@ -1,3 +1,94 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var vue = require('vue');
|
|
6
|
+
require('../../../hooks/index.js');
|
|
7
|
+
var index$1 = require('../../icon/src/index.js');
|
|
8
|
+
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
|
|
9
|
+
var index = require('../../../hooks/use-locale/index.js');
|
|
10
|
+
|
|
11
|
+
const _hoisted_1 = { class: "hzzt-collapse flex column" };
|
|
12
|
+
const _hoisted_2 = { class: "hzzt-collapse__top" };
|
|
13
|
+
const _hoisted_3 = { class: "hzzt-collapse__title" };
|
|
14
|
+
const _hoisted_4 = {
|
|
15
|
+
key: 0,
|
|
16
|
+
class: "hzzt-collapse__line"
|
|
17
|
+
};
|
|
18
|
+
const _hoisted_5 = { class: "hzzt-collapse__content flex-1" };
|
|
19
|
+
const __default__ = vue.defineComponent({
|
|
20
|
+
name: "HzztCollapse"
|
|
21
|
+
});
|
|
22
|
+
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
23
|
+
...__default__,
|
|
24
|
+
props: {
|
|
25
|
+
defaultActive: {
|
|
26
|
+
type: Boolean,
|
|
27
|
+
default: true
|
|
28
|
+
},
|
|
29
|
+
title: {
|
|
30
|
+
type: String,
|
|
31
|
+
default: ""
|
|
32
|
+
},
|
|
33
|
+
showLine: {
|
|
34
|
+
type: Boolean,
|
|
35
|
+
default: true
|
|
36
|
+
},
|
|
37
|
+
modelValue: {
|
|
38
|
+
type: Boolean,
|
|
39
|
+
default: true
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
emits: ["update:modelValue"],
|
|
43
|
+
setup(__props, { emit }) {
|
|
44
|
+
const props = __props;
|
|
45
|
+
const { t } = index.useLocale();
|
|
46
|
+
const expand = vue.ref(props.modelValue);
|
|
47
|
+
if (!props.defaultActive) {
|
|
48
|
+
emit("update:modelValue", false);
|
|
49
|
+
expand.value = false;
|
|
50
|
+
}
|
|
51
|
+
vue.watch(() => props.modelValue, (v) => {
|
|
52
|
+
expand.value = v;
|
|
53
|
+
});
|
|
54
|
+
function toggle() {
|
|
55
|
+
expand.value = !expand.value;
|
|
56
|
+
emit("update:modelValue", expand.value);
|
|
57
|
+
}
|
|
58
|
+
return (_ctx, _cache) => {
|
|
59
|
+
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
|
|
60
|
+
vue.createElementVNode("div", _hoisted_2, [
|
|
61
|
+
vue.createElementVNode("div", _hoisted_3, [
|
|
62
|
+
vue.renderSlot(_ctx.$slots, "title", {}, () => [
|
|
63
|
+
vue.createTextVNode(vue.toDisplayString(__props.title), 1)
|
|
64
|
+
])
|
|
65
|
+
]),
|
|
66
|
+
__props.showLine ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4)) : vue.createCommentVNode("v-if", true),
|
|
67
|
+
vue.renderSlot(_ctx.$slots, "toggle-btn", {}, () => [
|
|
68
|
+
vue.createElementVNode("div", {
|
|
69
|
+
class: "hzzt-collapse__btn",
|
|
70
|
+
onClick: toggle
|
|
71
|
+
}, [
|
|
72
|
+
vue.createVNode(index$1["default"], {
|
|
73
|
+
name: !expand.value ? "hzzt-plus-square-outline" : "hzzt-minus-square-outline",
|
|
74
|
+
class: "hzzt-collapse__icon",
|
|
75
|
+
size: "14"
|
|
76
|
+
}, null, 8, ["name"]),
|
|
77
|
+
vue.createElementVNode("span", null, vue.toDisplayString(expand.value ? vue.unref(t)("hzzt.collapse.retract") : vue.unref(t)("hzzt.collapse.expand")), 1)
|
|
78
|
+
])
|
|
79
|
+
])
|
|
80
|
+
]),
|
|
81
|
+
vue.withDirectives(vue.createElementVNode("div", _hoisted_5, [
|
|
82
|
+
vue.renderSlot(_ctx.$slots, "default")
|
|
83
|
+
], 512), [
|
|
84
|
+
[vue.vShow, expand.value]
|
|
85
|
+
]),
|
|
86
|
+
vue.renderSlot(_ctx.$slots, "active", { active: expand.value })
|
|
87
|
+
]);
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
var Collapse = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "collapse.vue"]]);
|
|
92
|
+
|
|
93
|
+
exports["default"] = Collapse;
|
|
3
94
|
//# sourceMappingURL=collapse.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapse.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"collapse.js","sources":["../../../../../../packages/components/collapse/src/collapse.vue"],"sourcesContent":["<template>\n <div class=\"hzzt-collapse flex column\">\n <div class=\"hzzt-collapse__top\">\n <div class=\"hzzt-collapse__title\">\n <slot name=\"title\">\n {{ title }}\n </slot>\n </div>\n <div v-if=\"showLine\" class=\"hzzt-collapse__line\" />\n <slot name=\"toggle-btn\">\n <div class=\"hzzt-collapse__btn\" @click=\"toggle\">\n <hzzt-icon :name=\"!expand ? 'hzzt-plus-square-outline' : 'hzzt-minus-square-outline'\"\n class=\"hzzt-collapse__icon\" size=\"14\" />\n <span>{{ expand ? t('hzzt.collapse.retract') : t('hzzt.collapse.expand') }}</span>\n </div>\n </slot>\n </div>\n <div v-show=\"expand\" class=\"hzzt-collapse__content flex-1\">\n <slot />\n </div>\n\n <slot :active=\"expand\" name=\"active\" />\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import {useLocale} from '@hzzt-plus/hooks'\n import HzztIcon from '@hzzt-plus/components/icon/src/index.vue'\n import {ref, watch} from 'vue'\n\n defineOptions({\n name: 'HzztCollapse',\n })\n const {t} = useLocale()\n const props = defineProps({\n defaultActive: {\n type: Boolean,\n default: true,\n },\n title: {\n type: String,\n default: '',\n },\n showLine: {\n type: Boolean,\n default: true,\n },\n modelValue: {\n type: Boolean,\n default: true,\n },\n })\n const emit = defineEmits(['update:modelValue'])\n\n const expand = ref(props.modelValue)\n\n if (!props.defaultActive) {\n emit('update:modelValue', false);\n expand.value = false;\n }\n\n watch(() => props.modelValue, (v) => {\n expand.value = v;\n })\n\n function toggle() {\n expand.value = !expand.value;\n emit('update:modelValue', expand.value);\n }\n\n</script>\n"],"names":["useLocale","ref","watch"],"mappings":";;;;;;;;;;;;;;;;;;uCA8BgB,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;AACA,IAAM,MAAA,EAAC,CAAC,EAAA,GAAIA,eAAU,EAAA,CAAA;AAqBtB,IAAM,MAAA,MAAA,GAASC,OAAI,CAAA,KAAA,CAAM,UAAU,CAAA,CAAA;AAEnC,IAAI,IAAA,CAAC,MAAM,aAAe,EAAA;AACxB,MAAA,IAAA,CAAK,qBAAqB,KAAK,CAAA,CAAA;AAC/B,MAAA,MAAA,CAAO,KAAQ,GAAA,KAAA,CAAA;AAAA,KACjB;AAEA,IAAAC,SAAA,CAAM,MAAM,KAAA,CAAM,UAAY,EAAA,CAAC,CAAM,KAAA;AACnC,MAAA,MAAA,CAAO,KAAQ,GAAA,CAAA,CAAA;AAAA,KAChB,CAAA,CAAA;AAED,IAAA,SAAS,MAAS,GAAA;AAChB,MAAO,MAAA,CAAA,KAAA,GAAQ,CAAC,MAAO,CAAA,KAAA,CAAA;AACvB,MAAK,IAAA,CAAA,mBAAA,EAAqB,OAAO,KAAK,CAAA,CAAA;AAAA,KACxC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|