mine-h5-ui
Version:
一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍
98 lines (97 loc) • 3.8 kB
JavaScript
import { defineComponent as T, mergeModels as $, useModel as D, createElementBlock as u, openBlock as a, normalizeClass as M, createCommentVNode as r, withDirectives as F, createBlock as p, normalizeStyle as m, createTextVNode as L, toDisplayString as V, createElementVNode as N, unref as l, vModelDynamic as A } from "vue";
import f from "../MeIcon/index.vue.js";
import { useSms as E, useInput as W, useIcon as R } from "./hooks.js";
/*!
* mine-h5-ui v2.15.0
* Copyright (c) 2025 biaov
* @license MIT
*/
const U = ["type", "placeholder", "readonly", "disabled"], H = /* @__PURE__ */ T({
name: "MeInput",
__name: "index",
props: /* @__PURE__ */ $({
type: { default: "text" },
placeholder: { default: "请输入..." },
readonly: { type: Boolean, default: !1 },
disabled: { type: Boolean, default: !1 },
label: { default: "" },
labelWidth: { default: "" },
labelAlign: { default: "left" },
labelColor: { default: "" },
labelIcon: { default: "" },
focusType: { default: "default" },
focusColor: { default: "" },
icon: { default: "" },
password: { type: Boolean, default: !1 },
digit: { type: Boolean, default: !1 },
smsMsg: { default: "" },
smsColor: { default: "" },
smsIs: { type: Boolean, default: !1 }
}, {
modelValue: { default: "" },
modelModifiers: {}
}),
emits: /* @__PURE__ */ $(["focus", "blur", "change", "input", "click-sms", "click-icon"], ["update:modelValue"]),
setup(y, { emit: h }) {
const s = h, t = y, d = D(y, "modelValue"), { sms: b, handleSMS: c } = E(t, s), { inputLabel: w, inputType: i, paddingLeft: v, paddingRight: S, isFocus: z, onFocus: g, onBlur: k, onChange: C, onInput: I } = W({ props: t, emit: s, sms: b, inputVal: d }), { handleIcon: B } = R(t, s, i);
return (e, o) => (a(), u("div", {
class: M(["me-input", `me-input-${e.focusType}`])
}, [
e.label ? (a(), u("div", {
key: 0,
class: "label",
style: m(`width:${e.labelWidth};text-align-last:${e.labelAlign};color:${e.labelColor};`),
ref_key: "inputLabel",
ref: w
}, [
e.labelIcon ? (a(), p(f, {
key: 0,
name: e.labelIcon,
color: e.labelColor,
size: "inherit"
}, null, 8, ["name", "color"])) : r("", !0),
L(" " + V(e.label), 1)
], 4)) : r("", !0),
F(N("input", {
type: l(i),
"onUpdate:modelValue": o[0] || (o[0] = (n) => d.value = n),
class: "input",
placeholder: e.placeholder,
style: m(`${l(z) && `border-color:${e.focusColor};`};padding-right:${l(S)}px;padding-left:${l(v)}px;`),
onFocus: o[1] || (o[1] = //@ts-ignore
(...n) => l(g) && l(g)(...n)),
onBlur: o[2] || (o[2] = //@ts-ignore
(...n) => l(k) && l(k)(...n)),
onChange: o[3] || (o[3] = //@ts-ignore
(...n) => l(C) && l(C)(...n)),
onInput: o[4] || (o[4] = //@ts-ignore
(...n) => l(I) && l(I)(...n)),
readonly: e.readonly,
disabled: e.disabled
}, null, 44, U), [
[A, d.value]
]),
e.password ? (a(), p(f, {
key: 1,
name: l(i) == "password" ? "icon-in_biyan" : "icon-in_zhengyan",
onClick: l(B)
}, null, 8, ["name", "onClick"])) : (a(), p(f, {
key: 2,
name: e.icon,
onClick: l(B)
}, null, 8, ["name", "onClick"])),
!e.password && e.smsMsg ? (a(), u("span", {
key: 3,
class: M(["sms", { countdown: e.smsIs }]),
onClick: o[5] || (o[5] = //@ts-ignore
(...n) => l(c) && l(c)(...n)),
ref_key: "sms",
ref: b,
style: m(`color:${e.smsColor};`)
}, V(e.smsMsg), 7)) : r("", !0)
], 2));
}
});
export {
H as default
};