@icreate/ics-mui
Version:
京东风格的轻量级移动端 Vue2、Vue3 组件库（支持小程序开发）
184 lines (183 loc) • 6.57 kB
JavaScript
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
import { ref, computed, resolveDirective, openBlock, createElementBlock, createElementVNode, normalizeClass, withModifiers, toDisplayString, createVNode, unref, withCtx, createCommentVNode, Fragment, renderList, withDirectives, createBlock, createTextVNode } from "vue";
import { _ as _sfc_main$2 } from "../button.vue_vue_type_script_setup_true_lang-yMATZ2Sk.js";
import { I as IcsPopup } from "../index-kY3YH8kV.js";
import { _ as _sfc_main$1 } from "../input.vue_vue_type_script_setup_true_lang-CUVjcKoZ.js";
import { P as v } from "../style_icon-C4_0S-Vm.js";
import { u as useLocale } from "../index-Dc5XFAmV.js";
import { _ as _export_sfc } from "../_plugin-vue_export-helper-1tPrXgE0.js";
import { w as withInstall } from "../with-install-DWwOiZS3.js";
const _hoisted_1 = { class: "nut-radio nut-radio--button" };
const _hoisted_2 = { key: 0 };
const _hoisted_3 = { key: 1 };
const _hoisted_4 = {
key: 0,
class: "nut-picker__bar"
};
const _hoisted_5 = { class: "nut-picker__title" };
const _hoisted_6 = { class: "ics-popup__options" };
const cN = "IcsInputSelect";
const _sfc_main = /* @__PURE__ */ Object.assign({
name: "IcsInputSelect"
}, {
__name: "index",
props: {
okText: {
type: String,
default: ""
},
cancelText: {
type: String,
default: ""
},
maxlength: {
type: [Number, String],
default: ""
},
showToolbar: {
type: Boolean,
default: true
},
modelValue: {
type: [Number, String],
default: ""
},
options: {
type: Array,
default: () => []
},
title: {
type: String,
default: ""
},
disabled: {
type: Boolean
},
props: {
type: Object,
default: () => ({
label: "label",
value: "value"
})
}
},
emits: ["update:modelValue", "change"],
setup(__props, { emit: __emit }) {
const translate = useLocale(cN);
const props = __props;
const popupValue = ref("");
const emits = __emit;
const show = ref(false);
const selectVal = computed({
get() {
return props.modelValue;
},
set(value) {
emits("update:modelValue", value);
}
});
const cancel = () => {
show.value = false;
};
const confirmHandler = (e) => {
selectVal.value = popupValue.value;
show.value = false;
emits("change", selectVal.value, e);
};
const onSelectItem = (item) => {
popupValue.value = item.label;
};
const columns = computed(() => {
return (props.options || []).map((item) => __spreadProps(__spreadValues({}, item), {
value: item[props.props.value],
label: item[[props.props.label]]
}));
});
const onPicker = () => {
if (props.disabled)
return;
show.value = true;
popupValue.value = selectVal.value;
};
return (_ctx, _cache) => {
const _directive_ripple = resolveDirective("ripple");
return openBlock(), createElementBlock("div", _hoisted_1, [
createElementVNode("div", {
class: normalizeClass(["cell", [!selectVal.value || __props.disabled ? "nut-input--disabled" : ""]]),
onClick: withModifiers(onPicker, ["stop"])
}, [
selectVal.value ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(selectVal.value), 1)) : (openBlock(), createElementBlock("span", _hoisted_3, "请选择")),
createVNode(unref(v), { class: "arrow" })
], 2),
createVNode(IcsPopup, {
visible: show.value,
"onUpdate:visible": _cache[1] || (_cache[1] = ($event) => show.value = $event),
position: "bottom"
}, {
default: withCtx(() => [
__props.showToolbar ? (openBlock(), createElementBlock("view", _hoisted_4, [
createElementVNode("view", {
class: "nut-picker__left",
onClick: cancel
}, toDisplayString(__props.cancelText || unref(translate)("cancel")), 1),
createElementVNode("view", _hoisted_5, toDisplayString(__props.title), 1),
createElementVNode("view", {
class: "nut-picker__right",
onClick: confirmHandler
}, toDisplayString(__props.okText || unref(translate)("confirm")), 1)
])) : createCommentVNode("", true),
createVNode(_sfc_main$1, {
modelValue: popupValue.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => popupValue.value = $event),
"max-length": __props.maxlength,
placeholder: "请输入",
clearable: ""
}, null, 8, ["modelValue", "max-length"]),
createElementVNode("div", _hoisted_6, [
(openBlock(true), createElementBlock(Fragment, null, renderList(columns.value, (item) => {
return withDirectives((openBlock(), createBlock(_sfc_main$2, {
key: item.value,
size: "small",
class: "ics-popup__cell",
onClick: ($event) => onSelectItem(item)
}, {
default: withCtx(() => [
createTextVNode(toDisplayString(item.label), 1)
]),
_: 2
}, 1032, ["onClick"])), [
[_directive_ripple]
]);
}), 128))
])
]),
_: 1
}, 8, ["visible"])
]);
};
}
});
const IcsInputSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-534086b5"]]);
withInstall(IcsInputSelect);
export {
IcsInputSelect,
IcsInputSelect as default
};