@icreate/ics-mui
Version:
京东风格的轻量级移动端 Vue2、Vue3 组件库（支持小程序开发）
399 lines (398 loc) • 14.1 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 { defineComponent, toRef, ref, computed, openBlock, createElementBlock, Fragment, createElementVNode, createVNode, unref, withCtx, renderList, normalizeClass, toDisplayString, createCommentVNode } from "vue";
import "../input/Input.js";
import { u as useFormDisabled } from "../common-DXugw-he.js";
import { I as IcsPopup } from "../index-kY3YH8kV.js";
import { _ as _sfc_main$2 } from "../form.vue_vue_type_script_setup_true_lang-_R4v_pqp.js";
import { _ as _sfc_main$3 } from "../form-item.vue_vue_type_script_setup_true_lang-CZ2WA8l9.js";
import NutNumberKeyboard from "../numberkeyboard/NumberKeyboard.js";
import { _ as _sfc_main$1 } from "../input.vue_vue_type_script_setup_true_lang-CUVjcKoZ.js";
import { w as withInstall } from "../with-install-DWwOiZS3.js";
const _hoisted_1 = { class: "ics-input-picker" };
const _hoisted_2 = { class: "quick-box" };
const _hoisted_3 = { class: "quick" };
const _hoisted_4 = ["onClick"];
const _hoisted_5 = { class: "quick-fiexd" };
const _hoisted_6 = ["onClick"];
const _hoisted_7 = { class: "number-keyboard" };
const _hoisted_8 = {
key: 0,
class: "temp-list-box"
};
const _hoisted_9 = { class: "temp-list" };
const _hoisted_10 = ["onClick"];
const _hoisted_11 = { class: "nut-key" };
const _hoisted_12 = { class: "number-keyboard-box" };
const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, {
name: "IcsTemperature"
}), {
__name: "index",
props: {
modelValue: {
type: [String, Number],
default: () => ""
},
isTempType: {
type: Boolean,
default: false
},
quickOptions: {
type: Array,
default: [
{
label: "未测",
value: -2
},
{
label: "拒测",
value: -1
}
]
},
tempTypeOptions: {
type: Array,
default: [
{
label: "腋温",
value: 1,
checked: true
},
{
label: "额温",
value: 2
},
{
label: "耳温",
value: 3
},
{
label: "口温",
value: 4
},
{
label: "肛温",
value: 5
}
]
},
limit: {
type: Object,
default: () => ({
min: 34,
max: 42,
range: { rangeColor: "#000", minColor: "red", maxColor: "red" }
})
},
disabled: {
type: Boolean,
default: false
}
},
emits: ["update:modelValue", "confirm"],
setup(__props, { emit: __emit }) {
var _a;
const props = __props;
const disabled = useFormDisabled(toRef(props, "disabled"));
const emits = __emit;
const quickOptions = ref(props.quickOptions);
const temperatureType = ref(props.tempTypeOptions);
const list = ref([
{
label: "36.",
value: "36."
},
{
label: "37.",
value: "37."
},
{
label: "38.",
value: "38."
},
{
label: "39.",
value: "39."
},
{
label: "40.",
value: "40."
},
{
label: "41.",
value: "41."
}
]);
const tempTypeNmae = computed(() => {
var _a2, _b;
const value = ((_a2 = props.quickOptions.filter((item) => item.value === currentTemp.value)[0]) == null ? void 0 : _a2.label) || currentTemp.value;
return ((_b = temperatureType.value.filter((item) => item.value === tempType.value)[0]) == null ? void 0 : _b.label) + " " + value;
});
const show = ref(false);
const customKey = ref(["."]);
const currentTemp = ref(props.modelValue || "");
const tempType = ref((_a = props.tempTypeOptions[0]) == null ? void 0 : _a.value);
const quickValue = ref();
const showData = computed({
get() {
var _a2;
const value = (_a2 = props.quickOptions.filter((item) => item.value === props.modelValue)[0]) == null ? void 0 : _a2.label;
return value || props.modelValue || "";
},
set(val) {
console.log(val);
}
});
const clickTempType = (index) => {
var _a2;
temperatureType.value.forEach((item, i) => {
item.checked = i === index;
});
tempType.value = (_a2 = temperatureType.value[index]) == null ? void 0 : _a2.value;
};
const closeQuickTemp = () => {
list.value.forEach((item) => {
item.checked = false;
});
};
const closeQuick = () => {
quickOptions.value.forEach((item) => {
item.checked = false;
});
};
const clickQuickTemp = (index) => {
var _a2, _b;
closeQuick();
list.value.forEach((item, i) => {
item.checked = i === index;
});
currentTemp.value = (_a2 = list.value[index]) == null ? void 0 : _a2.label;
quickValue.value = (_b = list.value[index]) == null ? void 0 : _b.value;
};
const clickQuick = (index) => {
closeQuickTemp();
quickOptions.value.forEach((item, i) => {
item.checked = i === index;
});
const currentItem = quickOptions.value[index];
currentTemp.value = currentItem == null ? void 0 : currentItem.label;
quickValue.value = currentItem == null ? void 0 : currentItem.value;
};
const quickOptionsLabel = computed(() => {
return props.quickOptions.map((item) => item.label);
});
const getRangecolor = () => {
const style = { color: "" };
let { min, max, range } = props.limit;
const { minColor, maxColor, rangeColor } = range;
if (!currentTemp.value) {
style.color = rangeColor;
return style.color;
}
const value = Number(currentTemp.value);
if (min === void 0 && max !== void 0) {
min = max;
} else if (max === void 0 && min !== void 0) {
max = min;
}
if (!value && value !== 0) {
style.color = rangeColor;
} else {
if (value < min) {
style.color = minColor;
} else if (value > max) {
style.color = maxColor;
} else if (value >= min && value <= max && rangeColor) {
style.color = rangeColor;
}
}
return style.color;
};
const onInput = (val) => {
if (currentTemp.value === -1 || currentTemp.value === -2) {
currentTemp.value = "";
}
let temp = currentTemp.value.toString();
if (val === ".") {
if (!!temp || temp.indexOf(".") > 0) {
return;
}
}
if (temp.length >= 4) {
return;
}
if (quickOptionsLabel.value.includes(temp)) {
temp = "";
}
temp += val;
if (temp.length >= 2 && temp.indexOf(".") === -1) {
let cleanedValue = temp.replace(/^0+/, "");
temp = `${cleanedValue.slice(0, 2)}.${cleanedValue.slice(2)}`;
}
currentTemp.value = temp;
};
const IsEndsWithDot = (str) => {
if (str.endsWith(".")) {
str += "0";
}
return str;
};
const onConfirm = () => {
var _a2;
if (currentTemp.value !== -1 && currentTemp.value !== -2) {
if (Number(currentTemp.value) < props.limit.min || Number(currentTemp.value) > props.limit.max) {
return;
}
}
show.value = false;
const val = IsEndsWithDot(currentTemp.value.toString());
const tempTypeItem = props.tempTypeOptions.filter((item) => item.value === tempType.value)[0] || null;
const quickItem = props.quickOptions.filter((item) => item.value === quickValue.value)[0] || null;
const selectItem = [
props.isTempType && tempTypeItem ? { value: Number(tempTypeItem.value), label: tempTypeItem.label } : null,
quickItem ? { value: Number(quickItem.value), label: quickItem.label } : { value: Number(val), label: Number(val) }
];
emits("update:modelValue", (_a2 = selectItem[1]) == null ? void 0 : _a2.value);
emits("confirm", selectItem[0], selectItem[1]);
};
const onDelete = () => {
if (currentTemp.value === -1 || currentTemp.value === -2) {
currentTemp.value = "";
return;
}
currentTemp.value = currentTemp.value.toString().slice(0, -1);
};
const onPicker = () => {
var _a2;
if (disabled.value)
return;
show.value = true;
tempType.value = (_a2 = props.tempTypeOptions[0]) == null ? void 0 : _a2.value;
currentTemp.value = props.modelValue || "";
closeQuick();
closeQuickTemp();
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
createElementVNode("div", _hoisted_1, [
createVNode(unref(_sfc_main$1), {
modelValue: showData.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => showData.value = $event),
border: false,
placeholder: "请选择",
readonly: "",
disabled: unref(disabled),
suffix: "℃",
onClick: onPicker
}, null, 8, ["modelValue", "disabled"])
]),
createVNode(IcsPopup, {
visible: show.value,
"onUpdate:visible": _cache[4] || (_cache[4] = ($event) => show.value = $event),
"safe-area-inset-bottom": true,
position: "bottom",
"pop-class": "number-keyboard-popup",
"overlay-class": "number-keyboard-overlay"
}, {
default: withCtx(() => [
createVNode(_sfc_main$2, { class: "temp-input" }, {
default: withCtx(() => [
createVNode(_sfc_main$3, {
label: "体温",
suffix: "℃"
}, {
default: withCtx(() => [
createVNode(unref(_sfc_main$1), {
modelValue: tempTypeNmae.value,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => tempTypeNmae.value = $event),
readonly: "",
"input-color": getRangecolor()
}, null, 8, ["modelValue", "input-color"])
]),
_: 1
})
]),
_: 1
}),
createElementVNode("div", _hoisted_2, [
createElementVNode("div", _hoisted_3, [
(openBlock(true), createElementBlock(Fragment, null, renderList(list.value, (item, index) => {
return openBlock(), createElementBlock("div", {
key: item.value,
class: normalizeClass(["quick-item", item.checked ? "quick-item--checked" : ""]),
onClick: ($event) => clickQuickTemp(index)
}, [
createElementVNode("span", null, toDisplayString(item.label), 1)
], 10, _hoisted_4);
}), 128))
]),
createElementVNode("div", _hoisted_5, [
(openBlock(true), createElementBlock(Fragment, null, renderList(quickOptions.value, (item, index) => {
return openBlock(), createElementBlock("div", {
key: item.value,
class: normalizeClass(["quick-item", item.checked ? "quick-item--checked" : ""]),
onClick: ($event) => clickQuick(index)
}, [
createElementVNode("span", null, toDisplayString(item.label), 1)
], 10, _hoisted_6);
}), 128))
])
]),
createElementVNode("div", _hoisted_7, [
__props.isTempType ? (openBlock(), createElementBlock("div", _hoisted_8, [
createElementVNode("div", _hoisted_9, [
(openBlock(true), createElementBlock(Fragment, null, renderList(temperatureType.value, (item, index) => {
return openBlock(), createElementBlock("div", {
key: item.value,
class: normalizeClass(["nut-key__wrapper", item.checked ? "nut-key__wrapper--checked" : ""]),
onClick: ($event) => clickTempType(index)
}, [
createElementVNode("div", _hoisted_11, toDisplayString(item.label), 1)
], 10, _hoisted_10);
}), 128))
])
])) : createCommentVNode("", true),
createElementVNode("div", _hoisted_12, [
createVNode(NutNumberKeyboard, {
visible: true,
type: "rightColumn",
"custom-key": customKey.value,
"confirm-text": "确定",
"pop-class": "number-keyboard-style",
onInput,
onBlur: _cache[2] || (_cache[2] = ($event) => show.value = false),
onClose: _cache[3] || (_cache[3] = ($event) => show.value = false),
onDelete,
onConfirm
}, null, 8, ["custom-key"])
])
])
]),
_: 1
}, 8, ["visible"])
], 64);
};
}
}));
withInstall(_sfc_main);
export {
_sfc_main as Temperature,
_sfc_main as default
};