hzzt-plus 2.0.0 → 2.0.1
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/attributes.json +1 -1
- package/dist/index.full.js +20 -14
- package/dist/index.full.min.js +3 -3
- package/dist/index.full.min.js.map +1 -1
- package/dist/index.full.min.mjs +8 -8
- package/dist/index.full.min.mjs.map +1 -1
- package/dist/index.full.mjs +20 -14
- 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/index.mjs +2 -2
- package/es/components/input-range/index.mjs +2 -2
- package/es/components/input-range/src/input-range.mjs +76 -26
- package/es/components/input-range/src/input-range.mjs.map +1 -1
- package/es/components/input-range/src/input-range2.mjs +26 -76
- package/es/components/input-range/src/input-range2.mjs.map +1 -1
- package/es/components/scroll/index.mjs +2 -2
- package/es/components/scroll/src/scroll.mjs +86 -0
- package/es/components/scroll/src/scroll.mjs.map +1 -1
- package/es/components/scroll/src/scroll2.mjs +0 -86
- package/es/components/scroll/src/scroll2.mjs.map +1 -1
- package/es/components/select-input/index.d.ts +4 -4
- package/es/components/select-input/src/select-input.d.ts +1 -1
- package/es/components/select-input/src/select-input.mjs +1 -1
- package/es/components/select-input/src/select-input.mjs.map +1 -1
- package/es/components/select-input/src/select-input.vue.d.ts +4 -4
- package/es/components/select-input/src/select-input2.mjs +2 -2
- package/es/components/select-input/src/select-input2.mjs.map +1 -1
- package/es/components/select-textarea/index.mjs +2 -2
- package/es/components/select-textarea/src/select-textarea.d.ts +2 -1
- package/es/components/select-textarea/src/select-textarea.mjs +31 -100
- package/es/components/select-textarea/src/select-textarea.mjs.map +1 -1
- package/es/components/select-textarea/src/select-textarea.vue.d.ts +14 -4
- package/es/components/select-textarea/src/select-textarea2.mjs +105 -30
- package/es/components/select-textarea/src/select-textarea2.mjs.map +1 -1
- package/es/index.mjs +2 -2
- package/es/version.d.ts +1 -1
- package/es/version.mjs +1 -1
- package/es/version.mjs.map +1 -1
- package/lib/components/index.js +2 -2
- package/lib/components/input-range/index.js +2 -2
- package/lib/components/input-range/src/input-range.js +76 -27
- package/lib/components/input-range/src/input-range.js.map +1 -1
- package/lib/components/input-range/src/input-range2.js +27 -76
- package/lib/components/input-range/src/input-range2.js.map +1 -1
- package/lib/components/scroll/index.js +2 -2
- package/lib/components/scroll/src/scroll.js +89 -0
- package/lib/components/scroll/src/scroll.js.map +1 -1
- package/lib/components/scroll/src/scroll2.js +0 -89
- package/lib/components/scroll/src/scroll2.js.map +1 -1
- package/lib/components/select-input/index.d.ts +4 -4
- package/lib/components/select-input/src/select-input.d.ts +1 -1
- package/lib/components/select-input/src/select-input.js +1 -1
- package/lib/components/select-input/src/select-input.js.map +1 -1
- package/lib/components/select-input/src/select-input.vue.d.ts +4 -4
- package/lib/components/select-input/src/select-input2.js +2 -2
- package/lib/components/select-input/src/select-input2.js.map +1 -1
- package/lib/components/select-textarea/index.js +2 -2
- package/lib/components/select-textarea/src/select-textarea.d.ts +2 -1
- package/lib/components/select-textarea/src/select-textarea.js +32 -100
- package/lib/components/select-textarea/src/select-textarea.js.map +1 -1
- package/lib/components/select-textarea/src/select-textarea.vue.d.ts +14 -4
- package/lib/components/select-textarea/src/select-textarea2.js +105 -31
- package/lib/components/select-textarea/src/select-textarea2.js.map +1 -1
- package/lib/index.js +2 -2
- 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/tags.json +1 -1
- package/web-types.json +1 -1
package/dist/index.full.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! Hzzt Plus v2.0.
|
|
1
|
+
/*! Hzzt Plus v2.0.1 */
|
|
2
2
|
|
|
3
3
|
import { getCurrentScope, onScopeDispose, unref, getCurrentInstance, onMounted, nextTick, readonly, shallowRef, watchEffect, watch, ref, computed, defineComponent, openBlock, createElementBlock, createElementVNode, warn, isRef, inject, provide, renderSlot, mergeProps, toRef, onUnmounted, useAttrs as useAttrs$1, useSlots, normalizeClass, normalizeStyle, createCommentVNode, Fragment, createBlock, withCtx, resolveDynamicComponent, withModifiers, createVNode, toDisplayString, onBeforeUnmount, Transition, withDirectives, vShow, reactive, onActivated, onUpdated, cloneVNode, Text, Comment, Teleport as Teleport$1, onBeforeMount, onDeactivated, toRaw, vModelCheckbox, createTextVNode, toRefs, vModelRadio, h, resolveComponent, renderList, onBeforeUpdate, withKeys, vModelText, createSlots, resolveDirective, toHandlerKey, normalizeProps, guardReactiveProps } from 'vue';
|
|
4
4
|
|
|
@@ -12961,7 +12961,7 @@ var ConfigProvider$1 = ConfigProvider;
|
|
|
12961
12961
|
|
|
12962
12962
|
const HzztConfigProvider = withInstall$1(ConfigProvider$1);
|
|
12963
12963
|
|
|
12964
|
-
const version$1 = "2.0.
|
|
12964
|
+
const version$1 = "2.0.1";
|
|
12965
12965
|
|
|
12966
12966
|
const makeInstaller = (components = []) => {
|
|
12967
12967
|
const install = (app, options) => {
|
|
@@ -27249,7 +27249,7 @@ const selectInputProps = buildProps$1({
|
|
|
27249
27249
|
disabled: Boolean,
|
|
27250
27250
|
replace: Boolean,
|
|
27251
27251
|
label: String,
|
|
27252
|
-
|
|
27252
|
+
options: {
|
|
27253
27253
|
type: definePropType$1(Array),
|
|
27254
27254
|
default: () => []
|
|
27255
27255
|
},
|
|
@@ -27370,8 +27370,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
|
27370
27370
|
_: 3
|
|
27371
27371
|
}, 16, ["class", "modelValue"])
|
|
27372
27372
|
], 2),
|
|
27373
|
-
_ctx.
|
|
27374
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.
|
|
27373
|
+
_ctx.options.length && !unref(trueDisabled) ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
|
|
27374
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (item, index) => {
|
|
27375
27375
|
return openBlock(), createBlock(unref(ElLink), mergeProps({
|
|
27376
27376
|
key: index,
|
|
27377
27377
|
class: "margin-r-4"
|
|
@@ -27397,11 +27397,12 @@ const selectTextareaProps = buildProps$1({
|
|
|
27397
27397
|
size: useSizeProp$1,
|
|
27398
27398
|
disabled: Boolean,
|
|
27399
27399
|
label: String,
|
|
27400
|
-
|
|
27400
|
+
options: {
|
|
27401
27401
|
type: definePropType$1(Array),
|
|
27402
27402
|
default: () => []
|
|
27403
27403
|
},
|
|
27404
27404
|
inputProps: Object,
|
|
27405
|
+
selectProps: Object,
|
|
27405
27406
|
replace: Boolean,
|
|
27406
27407
|
modelValue: {
|
|
27407
27408
|
type: definePropType$1([
|
|
@@ -27447,6 +27448,14 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
27447
27448
|
...props.inputProps,
|
|
27448
27449
|
type: "textarea"
|
|
27449
27450
|
}));
|
|
27451
|
+
const _selectProps = computed(() => ({
|
|
27452
|
+
options: props.options,
|
|
27453
|
+
size: trueSize.value,
|
|
27454
|
+
filterable: true,
|
|
27455
|
+
clearable: true,
|
|
27456
|
+
allowCreate: true,
|
|
27457
|
+
...props.selectProps
|
|
27458
|
+
}));
|
|
27450
27459
|
watch(() => props.modelValue, (v) => {
|
|
27451
27460
|
inputVal.value = v;
|
|
27452
27461
|
});
|
|
@@ -27478,21 +27487,18 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
|
27478
27487
|
createElementVNode("div", _hoisted_2, [
|
|
27479
27488
|
renderSlot(_ctx.$slots, "title", {}, () => [
|
|
27480
27489
|
createVNode(HzztTitle$1, {
|
|
27490
|
+
size: unref(trueSize),
|
|
27481
27491
|
class: "margin-l-1",
|
|
27482
27492
|
label: _ctx.label
|
|
27483
|
-
}, null, 8, ["label"])
|
|
27493
|
+
}, null, 8, ["size", "label"])
|
|
27484
27494
|
]),
|
|
27485
|
-
!unref(trueDisabled) ? (openBlock(), createBlock(unref(ElSelectV2), {
|
|
27495
|
+
!unref(trueDisabled) ? (openBlock(), createBlock(unref(ElSelectV2), mergeProps({
|
|
27486
27496
|
key: 0,
|
|
27487
27497
|
class: "flex-1",
|
|
27488
27498
|
modelValue: selectValue.value,
|
|
27489
27499
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectValue.value = $event),
|
|
27490
|
-
|
|
27491
|
-
|
|
27492
|
-
clearable: "",
|
|
27493
|
-
onChange: selectChange,
|
|
27494
|
-
options: _ctx.data
|
|
27495
|
-
}, null, 8, ["modelValue", "options"])) : createCommentVNode("v-if", true),
|
|
27500
|
+
onChange: selectChange
|
|
27501
|
+
}, unref(_selectProps)), null, 16, ["modelValue"])) : createCommentVNode("v-if", true),
|
|
27496
27502
|
renderSlot(_ctx.$slots, "right")
|
|
27497
27503
|
]),
|
|
27498
27504
|
createVNode(unref(ElInput), mergeProps({
|
package/dist/locale/en.js
CHANGED
package/dist/locale/en.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! Hzzt Plus v2.0.
|
|
1
|
+
/*! Hzzt Plus v2.0.1 */(function(e,r){typeof exports=="object"&&typeof module!="undefined"?module.exports=r():typeof define=="function"&&define.amd?define(r):(e=typeof globalThis!="undefined"?globalThis:e||self,e.HzztPlusLocaleEn=r())})(this,function(){"use strict";var e={name:"en",hzzt:{collapse:{expand:"expand",retract:"retract"},pagination:{total:"",strip:""},pageSize:{total:"Total ",strip:"",page:"page",d:"",per_page:"per page"},quarterpicker:{prevYear:"Previous Year",nextYear:"Next Year",year:"",firstQuarter:"First quarter",secondQuarter:"Second quarter",thirdQuarter:"Third quarter",fourthQuarter:"Fourth quarter"}}};return e});
|
|
2
2
|
//# sourceMappingURL=en.min.js.map
|
package/dist/locale/en.min.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! Hzzt Plus v2.0.
|
|
1
|
+
/*! Hzzt Plus v2.0.1 */var r={name:"en",hzzt:{collapse:{expand:"expand",retract:"retract"},pagination:{total:"",strip:""},pageSize:{total:"Total ",strip:"",page:"page",d:"",per_page:"per page"},quarterpicker:{prevYear:"Previous Year",nextYear:"Next Year",year:"",firstQuarter:"First quarter",secondQuarter:"Second quarter",thirdQuarter:"Third quarter",fourthQuarter:"Fourth quarter"}}};export{r as default};
|
|
2
2
|
//# sourceMappingURL=en.min.mjs.map
|
package/dist/locale/en.mjs
CHANGED
package/dist/locale/zh-cn.js
CHANGED
package/dist/locale/zh-cn.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! Hzzt Plus v2.0.
|
|
1
|
+
/*! Hzzt Plus v2.0.1 */(function(u,e){typeof exports=="object"&&typeof module!="undefined"?module.exports=e():typeof define=="function"&&define.amd?define(e):(u=typeof globalThis!="undefined"?globalThis:u||self,u.HzztPlusLocaleZhCn=e())})(this,function(){"use strict";var u={name:"zh-cn",hzzt:{collapse:{expand:"\u5C55\u5F00",retract:"\u6536\u8D77"},pagination:{total:"\u5171",strip:"\u6761"},pageSize:{total:"\u5171",strip:"\u6761",d:"\u7B2C",page:"\u9875",per_page:"\u6BCF\u9875"},quarterpicker:{prevYear:"\u524D\u4E00\u5E74",nextYear:"\u540E\u4E00\u5E74",year:"\u5E74",firstQuarter:"\u7B2C\u4E00\u5B63\u5EA6",secondQuarter:"\u7B2C\u4E8C\u5B63\u5EA6",thirdQuarter:"\u7B2C\u4E09\u5B63\u5EA6",fourthQuarter:"\u7B2C\u56DB\u5B63\u5EA6"}}};return u});
|
|
2
2
|
//# sourceMappingURL=zh-cn.min.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! Hzzt Plus v2.0.
|
|
1
|
+
/*! Hzzt Plus v2.0.1 */var u={name:"zh-cn",hzzt:{collapse:{expand:"\u5C55\u5F00",retract:"\u6536\u8D77"},pagination:{total:"\u5171",strip:"\u6761"},pageSize:{total:"\u5171",strip:"\u6761",d:"\u7B2C",page:"\u9875",per_page:"\u6BCF\u9875"},quarterpicker:{prevYear:"\u524D\u4E00\u5E74",nextYear:"\u540E\u4E00\u5E74",year:"\u5E74",firstQuarter:"\u7B2C\u4E00\u5B63\u5EA6",secondQuarter:"\u7B2C\u4E8C\u5B63\u5EA6",thirdQuarter:"\u7B2C\u4E09\u5B63\u5EA6",fourthQuarter:"\u7B2C\u56DB\u5B63\u5EA6"}}};export{u as default};
|
|
2
2
|
//# sourceMappingURL=zh-cn.min.mjs.map
|
package/dist/locale/zh-cn.mjs
CHANGED
package/es/components/index.mjs
CHANGED
|
@@ -24,8 +24,8 @@ export { configProviderContextKey } from './config-provider/src/constants.mjs';
|
|
|
24
24
|
export { provideGlobalConfig, useGlobalConfig } from './config-provider/src/hooks/use-global-config.mjs';
|
|
25
25
|
export { scanEmits, scanProps } from './scan/src/scan.mjs';
|
|
26
26
|
export { selectInputEmits, selectInputProps } from './select-input/src/select-input.mjs';
|
|
27
|
-
export { selectTextareaEmits, selectTextareaProps } from './select-textarea/src/select-
|
|
28
|
-
export { inputRangeEmits, inputRangeProps } from './input-range/src/input-
|
|
27
|
+
export { selectTextareaEmits, selectTextareaProps } from './select-textarea/src/select-textarea.mjs';
|
|
28
|
+
export { inputRangeEmits, inputRangeProps } from './input-range/src/input-range2.mjs';
|
|
29
29
|
export { cascaderEmits, cascaderProps } from './cascader/src/cascader.mjs';
|
|
30
30
|
export { selectEmits, selectProps } from './select/src/select.mjs';
|
|
31
31
|
export { clickInputEmits, clickInputProps } from './click-input/src/click-input.mjs';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../../utils/index.mjs';
|
|
2
|
-
import InputRange from './src/input-
|
|
3
|
-
export { inputRangeEmits, inputRangeProps } from './src/input-
|
|
2
|
+
import InputRange from './src/input-range.mjs';
|
|
3
|
+
export { inputRangeEmits, inputRangeProps } from './src/input-range2.mjs';
|
|
4
4
|
import { withInstall } from '../../utils/vue/install.mjs';
|
|
5
5
|
|
|
6
6
|
const HzztInputRange = withInstall(InputRange);
|
|
@@ -1,31 +1,81 @@
|
|
|
1
|
-
import '
|
|
1
|
+
import { createElementVNode, defineComponent, ref, computed, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, mergeProps } from 'vue';
|
|
2
|
+
import { inputRangeProps, inputRangeEmits } from './input-range2.mjs';
|
|
3
|
+
import { useFormSize, useFormDisabled } from 'element-plus';
|
|
2
4
|
import '../../../hooks/index.mjs';
|
|
3
|
-
import '../../../
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
|
|
7
|
-
import { isArray } from '@vue/shared';
|
|
5
|
+
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
|
6
|
+
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
|
|
7
|
+
import { useGlobalSize } from '../../../hooks/use-size/index.mjs';
|
|
8
8
|
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
default: () => []
|
|
13
|
-
},
|
|
14
|
-
size: useSizeProp,
|
|
15
|
-
disabled: Boolean,
|
|
16
|
-
clearable: {
|
|
17
|
-
type: Boolean,
|
|
18
|
-
default: false
|
|
19
|
-
},
|
|
20
|
-
startPlaceholder: String,
|
|
21
|
-
endPlaceholder: String,
|
|
22
|
-
startProps: Object,
|
|
23
|
-
endProps: Object
|
|
9
|
+
const _hoisted_1 = /* @__PURE__ */ createElementVNode("span", { class: "margin-h-1" }, "\u2014\u2014", -1);
|
|
10
|
+
const __default__ = defineComponent({
|
|
11
|
+
name: "HzztInputRange"
|
|
24
12
|
});
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
13
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
14
|
+
...__default__,
|
|
15
|
+
props: inputRangeProps,
|
|
16
|
+
emits: inputRangeEmits,
|
|
17
|
+
setup(__props, { emit }) {
|
|
18
|
+
const props = __props;
|
|
19
|
+
const startValue = ref(props.modelValue[0]);
|
|
20
|
+
const endValue = ref(props.modelValue[1]);
|
|
21
|
+
const nsInput = useNamespace("input-range");
|
|
22
|
+
const formSize = useFormSize();
|
|
23
|
+
const formDisabled = useFormDisabled();
|
|
24
|
+
const trueSize = computed(() => props.size || formSize.value || useGlobalSize().value);
|
|
25
|
+
const trueDisabled = computed(() => props.disabled || formDisabled.value);
|
|
26
|
+
const containerCls = computed(() => [
|
|
27
|
+
nsInput.b(),
|
|
28
|
+
nsInput.m(trueSize.value)
|
|
29
|
+
]);
|
|
30
|
+
watch(() => props.modelValue, (v) => {
|
|
31
|
+
startValue.value = v[0];
|
|
32
|
+
endValue.value = v[1];
|
|
33
|
+
}, {
|
|
34
|
+
deep: true
|
|
35
|
+
});
|
|
36
|
+
function change() {
|
|
37
|
+
if (startValue.value || endValue.value) {
|
|
38
|
+
const modelValue = [startValue.value, endValue.value];
|
|
39
|
+
emit("update:modelValue", modelValue);
|
|
40
|
+
emit("change", modelValue);
|
|
41
|
+
} else if (!startValue.value && !endValue.value) {
|
|
42
|
+
emit("update:modelValue", []);
|
|
43
|
+
emit("change", []);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
return (_ctx, _cache) => {
|
|
47
|
+
const _component_el_input = resolveComponent("el-input");
|
|
48
|
+
return openBlock(), createElementBlock("div", {
|
|
49
|
+
class: normalizeClass(["flex align-items-center", unref(containerCls)])
|
|
50
|
+
}, [
|
|
51
|
+
createVNode(_component_el_input, mergeProps({
|
|
52
|
+
modelValue: startValue.value,
|
|
53
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => startValue.value = $event)
|
|
54
|
+
}, _ctx.startProps, {
|
|
55
|
+
clearable: _ctx.clearable,
|
|
56
|
+
placeholder: _ctx.startPlaceholder,
|
|
57
|
+
size: unref(trueSize),
|
|
58
|
+
disabled: unref(trueDisabled),
|
|
59
|
+
class: "flex-1",
|
|
60
|
+
onChange: change
|
|
61
|
+
}), null, 16, ["modelValue", "clearable", "placeholder", "size", "disabled"]),
|
|
62
|
+
_hoisted_1,
|
|
63
|
+
createVNode(_component_el_input, mergeProps({
|
|
64
|
+
modelValue: endValue.value,
|
|
65
|
+
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => endValue.value = $event)
|
|
66
|
+
}, _ctx.endProps, {
|
|
67
|
+
clearable: _ctx.clearable,
|
|
68
|
+
placeholder: _ctx.endPlaceholder,
|
|
69
|
+
size: unref(trueSize),
|
|
70
|
+
disabled: unref(trueDisabled),
|
|
71
|
+
class: "flex-1",
|
|
72
|
+
onChange: change
|
|
73
|
+
}), null, 16, ["modelValue", "clearable", "placeholder", "size", "disabled"])
|
|
74
|
+
], 2);
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
var InputRange = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "input-range.vue"]]);
|
|
29
79
|
|
|
30
|
-
export {
|
|
80
|
+
export { InputRange as default };
|
|
31
81
|
//# sourceMappingURL=input-range.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-range.mjs","sources":["../../../../../../packages/components/input-range/src/input-range.
|
|
1
|
+
{"version":3,"file":"input-range.mjs","sources":["../../../../../../packages/components/input-range/src/input-range.vue"],"sourcesContent":["<template>\n <div class=\"flex align-items-center\" :class=\"containerCls\">\n <el-input\n v-model=\"startValue\"\n v-bind=\"startProps\"\n :clearable=\"clearable\"\n :placeholder=\"startPlaceholder\"\n :size=\"trueSize\"\n :disabled=\"trueDisabled\"\n class=\"flex-1\"\n @change=\"change\"\n />\n <span class=\"margin-h-1\">——</span>\n <el-input\n v-model=\"endValue\"\n v-bind=\"endProps\"\n :clearable=\"clearable\"\n :placeholder=\"endPlaceholder\"\n :size=\"trueSize\"\n :disabled=\"trueDisabled\"\n class=\"flex-1\"\n @change=\"change\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import {inputRangeEmits, inputRangeProps} from './input-range'\n import {useFormDisabled, useFormSize} from \"element-plus\";\n import {computed, ref, watch} from \"vue\";\n import {useGlobalSize, useNamespace} from \"@hzzt-plus/hooks\";\n\n defineOptions({\n name: 'HzztInputRange',\n })\n\n const props = defineProps(inputRangeProps)\n const emit = defineEmits(inputRangeEmits)\n\n const startValue = ref(props.modelValue[0])\n const endValue = ref(props.modelValue[1])\n\n const nsInput = useNamespace('input-range')\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 containerCls = computed(() => [\n nsInput.b(),\n nsInput.m(trueSize.value),\n ])\n\n watch(() => props.modelValue, (v) => {\n startValue.value = v[0];\n endValue.value = v[1];\n }, {\n deep: true,\n })\n\n function change() {\n if (startValue.value || endValue.value) {\n const modelValue = [startValue.value, endValue.value] as Array<string>;\n emit('update:modelValue', modelValue);\n emit('change', modelValue);\n } else if (!startValue.value && !endValue.value) {\n emit('update:modelValue', []);\n emit('change', []);\n }\n }\n\n</script>\n"],"names":["_defineComponent","_resolveComponent","_openBlock","_createElementBlock","_unref","_createVNode","_mergeProps"],"mappings":";;;;;;;;;;AA2BE,EAAA,IAAA,EAAA;AACA,CAAA,CAAA,CAAA;AACA,MAAQ,SAAA,mBAA2BA,eAAA,CAAA;AACnC,EAAA,GAAA;;wBAEc;AAAA,EACZ,KAAM,CAAA,OAAA,EAAA,EAAA,IAAA,EAAA,EAAA;AACR,IAAA,MAAA,KAAA,GAAA,OAAA,CAAA;;;;;;;AAKA,IAAA,MAAM,YAAa,GAAA,QAAU,CAAA,MAAA,KAAY,CAAC,QAAA,IAAA,YAAA,CAAA,KAAA,CAAA,CAAA;AAC1C,IAAA,MAAM,YAAW,GAAI,QAAM,CAAA,MAAA;AAE3B,MAAM,OAAA,CAAA,CAAA,EAAA;AAEN,MAAA,kBAA6B,CAAA,KAAA,CAAA;AAC7B,KAAA,CAAA,CAAA;AAEA,IAAA,KAAA,CAAM,MAAW,KAAA,CAAA,UAAA,EAAA,CAAA,CAAA,KAAA;AAAA,MACf,UAAY,CAAA,KAAA,GAAA,CAAQ,CAAS,CAAA,CAAA,CAAA;AAAyB,MACxD,QAAA,CAAA,KAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAEA,KAAA,EAAA;AAEA,MAAM,IAAA,EAAA,IAAA;AAA8B,KAAA,CAClC;AAAU,IACV,SAAA,MAAU,GAAA;AAAc,MACzB,IAAA,UAAA,CAAA,KAAA,IAAA,QAAA,CAAA,KAAA,EAAA;AAED,QAAA,MAAY,UAAkB,GAAA,CAAA,UAAO,CAAA,KAAA,EAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AACnC,QAAW,IAAA,CAAA,mBAAW,EAAA,UAAA,CAAA,CAAA;AACtB,QAAS,IAAA,CAAA,QAAA,EAAQ,UAAG,CAAA,CAAA;AAAA,OACnB,MAAA,IAAA,CAAA,UAAA,CAAA,KAAA,IAAA,CAAA,QAAA,CAAA,KAAA,EAAA;AAAA,QACK,IAAA,CAAA,mBAAA,EAAA,EAAA,CAAA,CAAA;AAAA,QACP,IAAA,CAAA,QAAA,EAAA,EAAA,CAAA,CAAA;AAED,OAAA;AACE,KAAI;AACF,IAAA,OAAA,CAAA,IAAmB,EAAA,MAAA,KAAY;AAC/B,MAAA,MAAA,sBAA0BC,gBAAU,CAAA,UAAA,CAAA,CAAA;AACpC,MAAA,OAAKC,SAAU,EAAU,EAAAC,kBAAA,CAAA,KAAA,EAAA;AAAA,6BACK,CAAA,CAAA,yBAAiB,EAAAC,KAAA,CAAA,YAAA,CAAA,CAAA,CAAA;AAC/C,OAAK,EAAA;AACL,QAAKC,WAAA,CAAA,mBAAY,EAAAC,UAAA,CAAA;AAAA,UACnB,UAAA,EAAA,UAAA,CAAA,KAAA;AAAA,UACF,qBAAA,EAAA,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,MAAA,KAAA,UAAA,CAAA,KAAA,GAAA,MAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,81 +1,31 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { inputRangeProps, inputRangeEmits } from './input-range.mjs';
|
|
3
|
-
import { useFormSize, useFormDisabled } from 'element-plus';
|
|
1
|
+
import '../../../utils/index.mjs';
|
|
4
2
|
import '../../../hooks/index.mjs';
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
3
|
+
import '../../../constants/index.mjs';
|
|
4
|
+
import { buildProps } from '../../../utils/vue/props/runtime.mjs';
|
|
5
|
+
import { useSizeProp } from '../../../hooks/use-size/index.mjs';
|
|
6
|
+
import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
|
|
7
|
+
import { isArray } from '@vue/shared';
|
|
8
8
|
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
const inputRangeProps = buildProps({
|
|
10
|
+
modelValue: {
|
|
11
|
+
type: Array,
|
|
12
|
+
default: () => []
|
|
13
|
+
},
|
|
14
|
+
size: useSizeProp,
|
|
15
|
+
disabled: Boolean,
|
|
16
|
+
clearable: {
|
|
17
|
+
type: Boolean,
|
|
18
|
+
default: false
|
|
19
|
+
},
|
|
20
|
+
startPlaceholder: String,
|
|
21
|
+
endPlaceholder: String,
|
|
22
|
+
startProps: Object,
|
|
23
|
+
endProps: Object
|
|
12
24
|
});
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
setup(__props, { emit }) {
|
|
18
|
-
const props = __props;
|
|
19
|
-
const startValue = ref(props.modelValue[0]);
|
|
20
|
-
const endValue = ref(props.modelValue[1]);
|
|
21
|
-
const nsInput = useNamespace("input-range");
|
|
22
|
-
const formSize = useFormSize();
|
|
23
|
-
const formDisabled = useFormDisabled();
|
|
24
|
-
const trueSize = computed(() => props.size || formSize.value || useGlobalSize().value);
|
|
25
|
-
const trueDisabled = computed(() => props.disabled || formDisabled.value);
|
|
26
|
-
const containerCls = computed(() => [
|
|
27
|
-
nsInput.b(),
|
|
28
|
-
nsInput.m(trueSize.value)
|
|
29
|
-
]);
|
|
30
|
-
watch(() => props.modelValue, (v) => {
|
|
31
|
-
startValue.value = v[0];
|
|
32
|
-
endValue.value = v[1];
|
|
33
|
-
}, {
|
|
34
|
-
deep: true
|
|
35
|
-
});
|
|
36
|
-
function change() {
|
|
37
|
-
if (startValue.value || endValue.value) {
|
|
38
|
-
const modelValue = [startValue.value, endValue.value];
|
|
39
|
-
emit("update:modelValue", modelValue);
|
|
40
|
-
emit("change", modelValue);
|
|
41
|
-
} else if (!startValue.value && !endValue.value) {
|
|
42
|
-
emit("update:modelValue", []);
|
|
43
|
-
emit("change", []);
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
return (_ctx, _cache) => {
|
|
47
|
-
const _component_el_input = resolveComponent("el-input");
|
|
48
|
-
return openBlock(), createElementBlock("div", {
|
|
49
|
-
class: normalizeClass(["flex align-items-center", unref(containerCls)])
|
|
50
|
-
}, [
|
|
51
|
-
createVNode(_component_el_input, mergeProps({
|
|
52
|
-
modelValue: startValue.value,
|
|
53
|
-
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => startValue.value = $event)
|
|
54
|
-
}, _ctx.startProps, {
|
|
55
|
-
clearable: _ctx.clearable,
|
|
56
|
-
placeholder: _ctx.startPlaceholder,
|
|
57
|
-
size: unref(trueSize),
|
|
58
|
-
disabled: unref(trueDisabled),
|
|
59
|
-
class: "flex-1",
|
|
60
|
-
onChange: change
|
|
61
|
-
}), null, 16, ["modelValue", "clearable", "placeholder", "size", "disabled"]),
|
|
62
|
-
_hoisted_1,
|
|
63
|
-
createVNode(_component_el_input, mergeProps({
|
|
64
|
-
modelValue: endValue.value,
|
|
65
|
-
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => endValue.value = $event)
|
|
66
|
-
}, _ctx.endProps, {
|
|
67
|
-
clearable: _ctx.clearable,
|
|
68
|
-
placeholder: _ctx.endPlaceholder,
|
|
69
|
-
size: unref(trueSize),
|
|
70
|
-
disabled: unref(trueDisabled),
|
|
71
|
-
class: "flex-1",
|
|
72
|
-
onChange: change
|
|
73
|
-
}), null, 16, ["modelValue", "clearable", "placeholder", "size", "disabled"])
|
|
74
|
-
], 2);
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
var InputRange = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "input-range.vue"]]);
|
|
25
|
+
const inputRangeEmits = {
|
|
26
|
+
[UPDATE_MODEL_EVENT]: (val) => isArray(val),
|
|
27
|
+
[CHANGE_EVENT]: (val) => isArray(val)
|
|
28
|
+
};
|
|
79
29
|
|
|
80
|
-
export {
|
|
30
|
+
export { inputRangeEmits, inputRangeProps };
|
|
81
31
|
//# sourceMappingURL=input-range2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-range2.mjs","sources":["../../../../../../packages/components/input-range/src/input-range.
|
|
1
|
+
{"version":3,"file":"input-range2.mjs","sources":["../../../../../../packages/components/input-range/src/input-range.ts"],"sourcesContent":["import {buildProps, isArray} from '@hzzt-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type InputRange from './input-range.vue'\nimport {useSizeProp} from \"@hzzt-plus/hooks\";\nimport {CHANGE_EVENT, UPDATE_MODEL_EVENT} from \"@hzzt-plus/constants\";\n\nexport const inputRangeProps = buildProps({\n modelValue: {\n type: Array,\n default: () => [],\n },\n size: useSizeProp,\n disabled: Boolean,\n clearable: {\n type: Boolean,\n default: false,\n },\n startPlaceholder: String,\n endPlaceholder: String,\n startProps: Object,\n endProps: Object,\n})\n\nexport type InputRangeProps = ExtractPropTypes<typeof inputRangeProps>\n\nexport const inputRangeEmits = {\n [UPDATE_MODEL_EVENT]: (val: Array<string>) => isArray(val),\n [CHANGE_EVENT]: (val: Array<string>) => isArray(val),\n}\nexport type InputRangeEmits = typeof inputRangeEmits\n\nexport type InputRangeInstance = InstanceType<typeof InputRange>\n"],"names":[],"mappings":";;;;;;;;AAGY,MAAC,eAAe,GAAG,UAAU,CAAC;AAC1C,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,OAAO,EAAE,MAAM,EAAE;AACrB,GAAG;AACH,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,gBAAgB,EAAE,MAAM;AAC1B,EAAE,cAAc,EAAE,MAAM;AACxB,EAAE,UAAU,EAAE,MAAM;AACpB,EAAE,QAAQ,EAAE,MAAM;AAClB,CAAC,EAAE;AACS,MAAC,eAAe,GAAG;AAC/B,EAAE,CAAC,kBAAkB,GAAG,CAAC,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC;AAC7C,EAAE,CAAC,YAAY,GAAG,CAAC,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC;AACvC;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../../utils/index.mjs';
|
|
2
|
-
import Scroll from './src/
|
|
3
|
-
import './src/
|
|
2
|
+
import Scroll from './src/scroll.mjs';
|
|
3
|
+
import './src/scroll2.mjs';
|
|
4
4
|
import { withInstall } from '../../utils/vue/install.mjs';
|
|
5
5
|
|
|
6
6
|
const HzztScroll = withInstall(Scroll);
|
|
@@ -1,2 +1,88 @@
|
|
|
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 scrollRef = ref(null);
|
|
14
|
+
const scrollContentRef = ref(null);
|
|
15
|
+
const scrollable = ref(false);
|
|
16
|
+
function update() {
|
|
17
|
+
if (!scrollRef.value || !scrollContentRef.value)
|
|
18
|
+
return;
|
|
19
|
+
const scrollWidth = scrollRef.value ? scrollRef.value.offsetWidth : 0;
|
|
20
|
+
const contentWidth = scrollContentRef.value ? scrollContentRef.value.offsetWidth : 0;
|
|
21
|
+
if (scrollWidth >= contentWidth) {
|
|
22
|
+
scrollable.value = false;
|
|
23
|
+
navTranslateX.value = 0;
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
scrollable.value = true;
|
|
27
|
+
}
|
|
28
|
+
useResizeObserver(scrollContentRef, update);
|
|
29
|
+
onUpdated(() => update());
|
|
30
|
+
function btnNavPrev() {
|
|
31
|
+
var _a;
|
|
32
|
+
const containerSize = ((_a = scrollRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
33
|
+
const currentOffset = navTranslateX.value;
|
|
34
|
+
if (!currentOffset)
|
|
35
|
+
return;
|
|
36
|
+
const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;
|
|
37
|
+
navTranslateX.value = newOffset;
|
|
38
|
+
}
|
|
39
|
+
function btnNavNext() {
|
|
40
|
+
var _a, _b;
|
|
41
|
+
const navSize = ((_a = scrollContentRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
42
|
+
const currentOffset = navTranslateX.value;
|
|
43
|
+
const containerSize = ((_b = scrollRef.value) == null ? void 0 : _b.offsetWidth) || 0;
|
|
44
|
+
if (navSize - currentOffset < containerSize)
|
|
45
|
+
return;
|
|
46
|
+
const newOffset = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize;
|
|
47
|
+
navTranslateX.value = newOffset;
|
|
48
|
+
}
|
|
49
|
+
return (_ctx, _cache) => {
|
|
50
|
+
return openBlock(), createElementBlock("div", {
|
|
51
|
+
class: normalizeClass([{ "is-scrollable": scrollable.value }, "relative hzzt-scroll"])
|
|
52
|
+
}, [
|
|
53
|
+
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
54
|
+
key: 0,
|
|
55
|
+
class: "hzzt-scroll__nav-prev",
|
|
56
|
+
onClick: btnNavPrev
|
|
57
|
+
}, [
|
|
58
|
+
createVNode(HzztIcon, { name: "arrow-left" })
|
|
59
|
+
])) : createCommentVNode("v-if", true),
|
|
60
|
+
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
61
|
+
key: 1,
|
|
62
|
+
class: "hzzt-scroll__nav-next",
|
|
63
|
+
onClick: btnNavNext
|
|
64
|
+
}, [
|
|
65
|
+
createVNode(HzztIcon, { name: "arrow-right" })
|
|
66
|
+
])) : createCommentVNode("v-if", true),
|
|
67
|
+
createElementVNode("div", {
|
|
68
|
+
ref_key: "scrollRef",
|
|
69
|
+
ref: scrollRef,
|
|
70
|
+
class: "overflow-hidden"
|
|
71
|
+
}, [
|
|
72
|
+
createElementVNode("div", {
|
|
73
|
+
ref_key: "scrollContentRef",
|
|
74
|
+
ref: scrollContentRef,
|
|
75
|
+
style: normalizeStyle({ transform: `translateX(${-navTranslateX.value}px)` }),
|
|
76
|
+
class: "hzzt-scroll__content"
|
|
77
|
+
}, [
|
|
78
|
+
renderSlot(_ctx.$slots, "default")
|
|
79
|
+
], 4)
|
|
80
|
+
], 512)
|
|
81
|
+
], 2);
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
});
|
|
85
|
+
var Scroll = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scroll.vue"]]);
|
|
86
|
+
|
|
87
|
+
export { Scroll as default };
|
|
2
88
|
//# sourceMappingURL=scroll.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"scroll.mjs","sources":["../../../../../../packages/components/scroll/src/scroll.vue"],"sourcesContent":["<template>\n <div :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 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(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,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,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,88 +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 scrollRef = ref(null);
|
|
14
|
-
const scrollContentRef = ref(null);
|
|
15
|
-
const scrollable = ref(false);
|
|
16
|
-
function update() {
|
|
17
|
-
if (!scrollRef.value || !scrollContentRef.value)
|
|
18
|
-
return;
|
|
19
|
-
const scrollWidth = scrollRef.value ? scrollRef.value.offsetWidth : 0;
|
|
20
|
-
const contentWidth = scrollContentRef.value ? scrollContentRef.value.offsetWidth : 0;
|
|
21
|
-
if (scrollWidth >= contentWidth) {
|
|
22
|
-
scrollable.value = false;
|
|
23
|
-
navTranslateX.value = 0;
|
|
24
|
-
return;
|
|
25
|
-
}
|
|
26
|
-
scrollable.value = true;
|
|
27
|
-
}
|
|
28
|
-
useResizeObserver(scrollContentRef, update);
|
|
29
|
-
onUpdated(() => update());
|
|
30
|
-
function btnNavPrev() {
|
|
31
|
-
var _a;
|
|
32
|
-
const containerSize = ((_a = scrollRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
33
|
-
const currentOffset = navTranslateX.value;
|
|
34
|
-
if (!currentOffset)
|
|
35
|
-
return;
|
|
36
|
-
const newOffset = currentOffset > containerSize ? currentOffset - containerSize : 0;
|
|
37
|
-
navTranslateX.value = newOffset;
|
|
38
|
-
}
|
|
39
|
-
function btnNavNext() {
|
|
40
|
-
var _a, _b;
|
|
41
|
-
const navSize = ((_a = scrollContentRef.value) == null ? void 0 : _a.offsetWidth) || 0;
|
|
42
|
-
const currentOffset = navTranslateX.value;
|
|
43
|
-
const containerSize = ((_b = scrollRef.value) == null ? void 0 : _b.offsetWidth) || 0;
|
|
44
|
-
if (navSize - currentOffset < containerSize)
|
|
45
|
-
return;
|
|
46
|
-
const newOffset = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize;
|
|
47
|
-
navTranslateX.value = newOffset;
|
|
48
|
-
}
|
|
49
|
-
return (_ctx, _cache) => {
|
|
50
|
-
return openBlock(), createElementBlock("div", {
|
|
51
|
-
class: normalizeClass([{ "is-scrollable": scrollable.value }, "relative hzzt-scroll"])
|
|
52
|
-
}, [
|
|
53
|
-
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
54
|
-
key: 0,
|
|
55
|
-
class: "hzzt-scroll__nav-prev",
|
|
56
|
-
onClick: btnNavPrev
|
|
57
|
-
}, [
|
|
58
|
-
createVNode(HzztIcon, { name: "arrow-left" })
|
|
59
|
-
])) : createCommentVNode("v-if", true),
|
|
60
|
-
scrollable.value ? (openBlock(), createElementBlock("div", {
|
|
61
|
-
key: 1,
|
|
62
|
-
class: "hzzt-scroll__nav-next",
|
|
63
|
-
onClick: btnNavNext
|
|
64
|
-
}, [
|
|
65
|
-
createVNode(HzztIcon, { name: "arrow-right" })
|
|
66
|
-
])) : createCommentVNode("v-if", true),
|
|
67
|
-
createElementVNode("div", {
|
|
68
|
-
ref_key: "scrollRef",
|
|
69
|
-
ref: scrollRef,
|
|
70
|
-
class: "overflow-hidden"
|
|
71
|
-
}, [
|
|
72
|
-
createElementVNode("div", {
|
|
73
|
-
ref_key: "scrollContentRef",
|
|
74
|
-
ref: scrollContentRef,
|
|
75
|
-
style: normalizeStyle({ transform: `translateX(${-navTranslateX.value}px)` }),
|
|
76
|
-
class: "hzzt-scroll__content"
|
|
77
|
-
}, [
|
|
78
|
-
renderSlot(_ctx.$slots, "default")
|
|
79
|
-
], 4)
|
|
80
|
-
], 512)
|
|
81
|
-
], 2);
|
|
82
|
-
};
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
|
-
var Scroll = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scroll.vue"]]);
|
|
86
|
-
|
|
87
|
-
export { Scroll as default };
|
|
88
2
|
//# sourceMappingURL=scroll2.mjs.map
|