@fecp/mobile
Version:
189 lines (188 loc) • 8.59 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
;/* empty css */
const vue = require("vue");
const index = require("../field/index.js");
const moment = require("../../../../../../node_modules/.pnpm/moment@2.30.1/node_modules/moment/dist/moment.js");
const dateUtil = require("../../../utils/dateUtil.js");
const index$2 = require("../../../../../../node_modules/.pnpm/vant@4.9.17_vue@3.5.13_typescript@5.7.3_/node_modules/vant/es/picker-group/index.js");
const index$1 = require("../../../../../../node_modules/.pnpm/vant@4.9.17_vue@3.5.13_typescript@5.7.3_/node_modules/vant/es/popup/index.js");
const index$3 = require("../../../../../../node_modules/.pnpm/vant@4.9.17_vue@3.5.13_typescript@5.7.3_/node_modules/vant/es/date-picker/index.js");
const index$4 = require("../../../../../../node_modules/.pnpm/vant@4.9.17_vue@3.5.13_typescript@5.7.3_/node_modules/vant/es/time-picker/index.js");
const index$5 = require("../../../../../../node_modules/.pnpm/vant@4.9.17_vue@3.5.13_typescript@5.7.3_/node_modules/vant/es/icon/index.js");
const dateColumnsType = "year,month,day,hour,minute";
const _sfc_main = {
__name: "FieldDateTimePicker",
props: {
modelValue: {
type: String,
default: ""
},
dateTimeTextFormat: {
//0:YYYYMMDD;1: YYYY-MM-DD;2：YYYY/MM/DD；3：YYYY年MM月DD日
type: String,
default: "1"
},
title: {
type: String,
default: ""
},
disabled: {
type: Boolean,
default: false
},
readonly: {
type: Boolean,
default: false
},
"is-link": false
},
emits: ["update:modelValue"],
setup(__props, { emit: __emit }) {
const props = __props;
const fieldTextValue = vue.ref("");
const showPicker = vue.ref(false);
const emit = __emit;
let textFormat = dateUtil.parseDateFormatter(props.dateTimeTextFormat, dateColumnsType);
let valueFormat = dateUtil.parseDateFormatter("0", dateColumnsType);
const currentDateTime = vue.computed(() => {
let date;
if (!props.modelValue) {
date = moment.default();
} else {
date = moment.default(props.modelValue, valueFormat);
}
const year = date.year();
const month = date.month() + 1;
const day = date.date();
const hours = date.hours();
const minutes = date.minutes();
date.seconds();
const dateValue = [year, month, day];
const timeValue = [hours, minutes];
return { dateValue, timeValue };
});
const dateFormatter = (type, option) => {
if (type === "year") {
option.text += "年";
} else if (type === "month") {
option.text += "月";
} else if (type === "day") {
option.text += "日";
}
return option;
};
const timeFormatter = (type, option) => {
if (type === "hour") {
option.text += "时";
} else if (type === "minute") {
option.text += "分";
} else if (type === "second") {
option.text += "秒";
}
return option;
};
vue.watch(
() => props.modelValue,
(value) => {
if (!value) {
fieldTextValue.value = "";
return;
}
fieldTextValue.value = moment.default(value, valueFormat).format(textFormat);
},
{ immediate: true }
);
const onConfirm = () => {
const date = currentDateTime.value.dateValue;
const time = currentDateTime.value.timeValue;
const val = moment.default(
`${date[0]}${date[1]}${date[2]} ${time[0]}:${time[1]}`,
"YYYYMMDD HH:mm"
).format(valueFormat);
emit("update:modelValue", val);
showPicker.value = false;
};
return (_ctx, _cache) => {
const _component_van_icon = index$5.Icon;
const _component_van_date_picker = index$3.DatePicker;
const _component_van_time_picker = index$4.TimePicker;
const _component_van_picker_group = index$2.PickerGroup;
const _component_van_popup = index$1.Popup;
return vue.openBlock(), vue.createBlock(vue.unref(index.MobileField), vue.mergeProps(_ctx.$attrs, {
modelValue: vue.unref(fieldTextValue),
"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => vue.isRef(fieldTextValue) ? fieldTextValue.value = $event : null),
isLink: __props.readonly ? false : true,
readonly: "",
disabled: __props.disabled,
onOpenPicker: _cache[6] || (_cache[6] = () => {
if (!__props.readonly) {
showPicker.value = true;
}
})
}), vue.createSlots({
default: vue.withCtx(() => [
vue.createVNode(_component_van_popup, {
show: vue.unref(showPicker),
"onUpdate:show": _cache[4] || (_cache[4] = ($event) => vue.isRef(showPicker) ? showPicker.value = $event : null),
"destroy-on-close": "",
position: "bottom"
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_van_picker_group, {
title: __props.title,
tabs: ["选择日期", "选择时间"],
"next-step-text": "下一步",
onConfirm,
onCancel: _cache[3] || (_cache[3] = ($event) => showPicker.value = false)
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_van_date_picker, {
modelValue: vue.unref(currentDateTime).dateValue,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => vue.unref(currentDateTime).dateValue = $event),
formatter: dateFormatter,
readonly: false
}, null, 8, ["modelValue"]),
vue.createVNode(_component_van_time_picker, {
modelValue: vue.unref(currentDateTime).timeValue,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => vue.unref(currentDateTime).timeValue = $event),
readonly: false,
formatter: timeFormatter
}, null, 8, ["modelValue"])
]),
_: 1
}, 8, ["title"])
]),
_: 1
}, 8, ["show"])
]),
_: 2
}, [
!__props.readonly && !__props.disabled && vue.unref(fieldTextValue) ? {
name: "right-icon",
fn: vue.withCtx(() => [
vue.createVNode(_component_van_icon, {
name: "clear",
class: "custom-close-icon",
onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => emit("update:modelValue", null), ["stop"]))
})
]),
key: "0"
} : void 0
]), 1040, ["modelValue", "isLink", "disabled"]);
};
}
};
exports.default = _sfc_main;