test slider

This commit is contained in:
Theluyuan 2023-05-18 17:07:28 +08:00
parent 220c4f1709
commit 6c966e8424
8 changed files with 197 additions and 172 deletions

View File

@ -32,8 +32,7 @@ function makeDots(props) {
return dots; return dots;
} }
const _hoisted_1$4 = ["onMousedown"]; const _hoisted_1$4 = ["onMousedown"];
const _hoisted_2$4 = /* @__PURE__ */ createElementVNode("div", { class: "layui-slider-line-v" }, null, -1); const _hoisted_2$4 = ["onClick"];
const _hoisted_3$4 = ["onClick"];
const __default__$4 = { const __default__$4 = {
name: "StandardVue" name: "StandardVue"
}; };
@ -45,7 +44,8 @@ const _sfc_main$4 = defineComponent({
step: { default: 0 }, step: { default: 0 },
min: { default: 0 }, min: { default: 0 },
max: { default: 100 }, max: { default: 100 },
showDots: { type: Boolean, default: false } showDots: { type: Boolean, default: false },
backgroundColor: { default: "#ccc" }
}, },
emits: ["link-val-hook"], emits: ["link-val-hook"],
setup(__props, { emit }) { setup(__props, { emit }) {
@ -129,14 +129,19 @@ const _sfc_main$4 = defineComponent({
style: normalizeStyle({ width: __props.val + "%" }), style: normalizeStyle({ width: __props.val + "%" }),
class: normalizeClass(["layui-slider-rate-v", [__props.disabled ? "layui-slider-disabled disable-line" : ""]]) class: normalizeClass(["layui-slider-rate-v", [__props.disabled ? "layui-slider-disabled disable-line" : ""]])
}, null, 6), }, null, 6),
_hoisted_2$4, createElementVNode("div", {
class: "layui-slider-line-v",
style: normalizeStyle({
backgroundColor: props.backgroundColor
})
}, null, 4),
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => { (openBlock(true), createElementBlock(Fragment, null, renderList(unref(dots), (item, index2) => {
return withDirectives((openBlock(), createElementBlock("div", { return withDirectives((openBlock(), createElementBlock("div", {
onClick: ($event) => focusDot(item), onClick: ($event) => focusDot(item),
class: "layui-slider-dots", class: "layui-slider-dots",
key: index2, key: index2,
style: normalizeStyle({ left: item + "%" }) style: normalizeStyle({ left: item + "%" })
}, null, 12, _hoisted_3$4)), [ }, null, 12, _hoisted_2$4)), [
[vShow, __props.showDots] [vShow, __props.showDots]
]); ]);
}), 128)) }), 128))
@ -628,7 +633,8 @@ const _sfc_main = defineComponent({
disabled: { type: Boolean, default: false }, disabled: { type: Boolean, default: false },
range: { type: Boolean }, range: { type: Boolean },
rangeValue: null, rangeValue: null,
showDots: { type: Boolean, default: false } showDots: { type: Boolean, default: false },
backgroundColor: { default: "#ccc" }
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { emit }) { setup(__props, { emit }) {
@ -680,8 +686,9 @@ const _sfc_main = defineComponent({
step: __props.step, step: __props.step,
min: __props.min, min: __props.min,
max: __props.max, max: __props.max,
showDots: __props.showDots showDots: __props.showDots,
}, null, 8, ["val", "disabled", "step", "min", "max", "showDots"]) backgroundColor: props.backgroundColor
}, null, 8, ["val", "disabled", "step", "min", "max", "showDots", "backgroundColor"])
])) ]))
])) ]))
]); ]);

File diff suppressed because one or more lines are too long

View File

@ -17,6 +17,7 @@ export interface StandardProps {
min?: number; min?: number;
max?: number; max?: number;
showDots?: boolean; showDots?: boolean;
backgroundColor:string;
} }
const props = withDefaults(defineProps<StandardProps>(), { const props = withDefaults(defineProps<StandardProps>(), {
@ -26,6 +27,7 @@ const props = withDefaults(defineProps<StandardProps>(), {
min: 0, min: 0,
max: 100, max: 100,
showDots: false, showDots: false,
backgroundColor:"#ccc"
}); });
const moveAction = throttle(standardMove); const moveAction = throttle(standardMove);
@ -117,7 +119,9 @@ const focusDot = (val: number) => {
class="layui-slider-rate-v" class="layui-slider-rate-v"
:class="[disabled ? 'layui-slider-disabled disable-line' : '']" :class="[disabled ? 'layui-slider-disabled disable-line' : '']"
></div> ></div>
<div class="layui-slider-line-v"></div> <div class="layui-slider-line-v" :style="{
backgroundColor:props.backgroundColor
}"></div>
<div <div
v-show="showDots" v-show="showDots"
@click="focusDot(item)" @click="focusDot(item)"

View File

@ -22,6 +22,7 @@ export interface SliderProps {
range?: boolean; range?: boolean;
rangeValue?: number[]; rangeValue?: number[];
showDots?: boolean; showDots?: boolean;
backgroundColor:string;
} }
const emit = defineEmits(["update:modelValue"]); const emit = defineEmits(["update:modelValue"]);
@ -34,6 +35,7 @@ const props = withDefaults(defineProps<SliderProps>(), {
min: 0, min: 0,
max: 100, max: 100,
showDots: false, showDots: false,
backgroundColor:"#ccc"
}); });
let rangeValues: Ref<number[]> | any = toRef(props, "rangeValue"); let rangeValues: Ref<number[]> | any = toRef(props, "rangeValue");
@ -94,6 +96,7 @@ function valHook(val: any) {
:min="min" :min="min"
:max="max" :max="max"
:showDots="showDots" :showDots="showDots"
:backgroundColor="props.backgroundColor"
></StandardVue> ></StandardVue>
</div> </div>
</div> </div>

View File

@ -314,8 +314,12 @@ watch(
} else { } else {
hasChecked.value = false; hasChecked.value = false;
} }
if(tableSelectedKeys.value != props.selectedKeys){ if (tableSelectedKeys.value != props.selectedKeys) {
console.log("初始化赋值触发修改",tableSelectedKeys.value,props.selectedKeys) console.log(
"初始化赋值触发修改",
tableSelectedKeys.value,
props.selectedKeys
);
emit("update:selectedKeys", tableSelectedKeys.value); emit("update:selectedKeys", tableSelectedKeys.value);
} }
}, },

View File

@ -101,8 +101,8 @@ function handleTitleClick(node: TreeData) {
if (!node.isDisabled) { if (!node.isDisabled) {
emit("node-click", node); emit("node-click", node);
} }
if(props.showCheckbox){ if (props.showCheckbox) {
node.isChecked = !node.isChecked node.isChecked = !node.isChecked;
} }
} }

View File

@ -103,13 +103,13 @@ watch(
watch( watch(
() => props.checkedKeys, () => props.checkedKeys,
() => { () => {
console.log(tree.value) console.log(tree.value);
if (!unWatch.value) { if (!unWatch.value) {
loadNodeList(); loadNodeList();
} }
}, },
{ {
deep: true deep: true,
} }
); );

File diff suppressed because one or more lines are too long