first commit
This commit is contained in:
199
unpackage/dist/dev/mp-weixin/uni_modules/wot-design-uni/components/wd-datetime-picker/types.js
vendored
Normal file
199
unpackage/dist/dev/mp-weixin/uni_modules/wot-design-uni/components/wd-datetime-picker/types.js
vendored
Normal file
@@ -0,0 +1,199 @@
|
||||
"use strict";
|
||||
const uni_modules_wotDesignUni_components_common_props = require("../common/props.js");
|
||||
const datetimePickerProps = {
|
||||
...uni_modules_wotDesignUni_components_common_props.baseProps,
|
||||
/**
|
||||
* 选择器左侧文案,label可以不传
|
||||
*/
|
||||
label: String,
|
||||
/**
|
||||
* 选择器占位符
|
||||
*/
|
||||
placeholder: String,
|
||||
/**
|
||||
* 禁用
|
||||
*/
|
||||
disabled: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 只读
|
||||
*/
|
||||
readonly: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 加载中
|
||||
*/
|
||||
loading: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 加载的颜色,只能使用十六进制的色值写法,且不能使用缩写
|
||||
*/
|
||||
loadingColor: uni_modules_wotDesignUni_components_common_props.makeStringProp("#4D80F0"),
|
||||
/**
|
||||
* 弹出层标题
|
||||
*/
|
||||
title: String,
|
||||
/**
|
||||
* 取消按钮文案
|
||||
*/
|
||||
cancelButtonText: String,
|
||||
/**
|
||||
* 确认按钮文案
|
||||
*/
|
||||
confirmButtonText: String,
|
||||
/**
|
||||
* 是否必填
|
||||
*/
|
||||
required: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 设置选择器大小,可选值:large
|
||||
*/
|
||||
size: String,
|
||||
/**
|
||||
* 设置左侧标题宽度
|
||||
*/
|
||||
labelWidth: uni_modules_wotDesignUni_components_common_props.makeStringProp("33%"),
|
||||
/**
|
||||
* 是否为错误状态,错误状态时右侧内容为红色
|
||||
*/
|
||||
error: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 选择器的值靠右展示
|
||||
*/
|
||||
alignRight: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 点击遮罩是否关闭
|
||||
*/
|
||||
closeOnClickModal: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(true),
|
||||
/**
|
||||
* 弹出面板是否设置底部安全距离(iphone X 类型的机型)
|
||||
*/
|
||||
safeAreaInsetBottom: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(true),
|
||||
/**
|
||||
* 是否超出隐藏
|
||||
*/
|
||||
ellipsis: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* picker内部滚筒高
|
||||
*/
|
||||
columnsHeight: uni_modules_wotDesignUni_components_common_props.makeNumberProp(217),
|
||||
/**
|
||||
* 选项的key
|
||||
*/
|
||||
valueKey: uni_modules_wotDesignUni_components_common_props.makeStringProp("value"),
|
||||
/**
|
||||
* 选项的label
|
||||
*/
|
||||
labelKey: uni_modules_wotDesignUni_components_common_props.makeStringProp("label"),
|
||||
/**
|
||||
* 选中项,当 type 为 time 时,类型为字符串;当 type 为 Array 时,类型为范围选择;否则为 时间戳
|
||||
*/
|
||||
modelValue: uni_modules_wotDesignUni_components_common_props.makeRequiredProp([String, Number, Array]),
|
||||
/**
|
||||
* 选择器类型,可选值为:date / year-month / time
|
||||
*/
|
||||
type: uni_modules_wotDesignUni_components_common_props.makeStringProp("datetime"),
|
||||
/**
|
||||
* 最小日期
|
||||
*/
|
||||
minDate: uni_modules_wotDesignUni_components_common_props.makeNumberProp(new Date((/* @__PURE__ */ new Date()).getFullYear() - 10, 0, 1).getTime()),
|
||||
/**
|
||||
* 最大日期
|
||||
*/
|
||||
maxDate: uni_modules_wotDesignUni_components_common_props.makeNumberProp(new Date((/* @__PURE__ */ new Date()).getFullYear() + 10, 11, 31, 23, 59, 59).getTime()),
|
||||
/**
|
||||
* 最小小时,time类型时生效
|
||||
*/
|
||||
minHour: uni_modules_wotDesignUni_components_common_props.makeNumberProp(0),
|
||||
/**
|
||||
* 最大小时,time类型时生效
|
||||
*/
|
||||
maxHour: uni_modules_wotDesignUni_components_common_props.makeNumberProp(23),
|
||||
/**
|
||||
* 最小分钟,time类型时生效
|
||||
*/
|
||||
minMinute: uni_modules_wotDesignUni_components_common_props.makeNumberProp(0),
|
||||
/**
|
||||
* 最大分钟,time类型时生效
|
||||
*/
|
||||
maxMinute: uni_modules_wotDesignUni_components_common_props.makeNumberProp(59),
|
||||
/**
|
||||
* 是否启用秒选择,仅在 time 和 datetime 类型下生效
|
||||
*/
|
||||
useSecond: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 最小秒数,仅在 time 和 datetime 类型下生效
|
||||
*/
|
||||
minSecond: uni_modules_wotDesignUni_components_common_props.makeNumberProp(0),
|
||||
/**
|
||||
* 最大秒数,仅在 time 和 datetime 类型下生效
|
||||
*/
|
||||
maxSecond: uni_modules_wotDesignUni_components_common_props.makeNumberProp(59),
|
||||
/**
|
||||
* 自定义过滤选项的函数,返回列的选项数组
|
||||
*/
|
||||
filter: Function,
|
||||
/**
|
||||
* 自定义弹出层选项文案的格式化函数,返回一个字符串
|
||||
*/
|
||||
formatter: Function,
|
||||
/**
|
||||
* 自定义展示文案的格式化函数,返回一个字符串
|
||||
*/
|
||||
displayFormat: Function,
|
||||
/**
|
||||
* 确定前校验函数,接收 (value, resolve, picker) 参数,通过 resolve 继续执行 picker,resolve 接收1个boolean参数
|
||||
*/
|
||||
beforeConfirm: Function,
|
||||
/**
|
||||
* 在区域选择模式下,自定义展示tab标签文案的格式化函数,返回一个字符串
|
||||
*/
|
||||
displayFormatTabLabel: Function,
|
||||
/**
|
||||
* 默认日期,类型保持与 value 一致,打开面板时面板自动选到默认日期
|
||||
*/
|
||||
defaultValue: [String, Number, Array],
|
||||
/**
|
||||
* 弹窗层级
|
||||
*/
|
||||
zIndex: uni_modules_wotDesignUni_components_common_props.makeNumberProp(15),
|
||||
/**
|
||||
* 表单域 model 字段名,在使用表单校验功能的情况下,该属性是必填的
|
||||
*/
|
||||
prop: String,
|
||||
/**
|
||||
* 表单验证规则,结合wd-form组件使用
|
||||
*/
|
||||
rules: uni_modules_wotDesignUni_components_common_props.makeArrayProp(),
|
||||
/**
|
||||
* picker cell 外部自定义样式
|
||||
*/
|
||||
customCellClass: uni_modules_wotDesignUni_components_common_props.makeStringProp(""),
|
||||
/**
|
||||
* pickerView 外部自定义样式
|
||||
*/
|
||||
customViewClass: uni_modules_wotDesignUni_components_common_props.makeStringProp(""),
|
||||
/**
|
||||
* label 外部自定义样式
|
||||
*/
|
||||
customLabelClass: uni_modules_wotDesignUni_components_common_props.makeStringProp(""),
|
||||
/**
|
||||
* value 外部自定义样式
|
||||
*/
|
||||
customValueClass: uni_modules_wotDesignUni_components_common_props.makeStringProp(""),
|
||||
/**
|
||||
* 是否在手指松开时立即触发picker-view的 change 事件。若不开启则会在滚动动画结束后触发 change 事件,1.2.25版本起提供,仅微信小程序和支付宝小程序支持。
|
||||
*/
|
||||
immediateChange: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 是否从页面中脱离出来,用于解决各种 fixed 失效问题 (H5: teleport, APP: renderjs, 小程序: root-portal)
|
||||
*/
|
||||
rootPortal: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 显示清空按钮
|
||||
*/
|
||||
clearable: uni_modules_wotDesignUni_components_common_props.makeBooleanProp(false),
|
||||
/**
|
||||
* 必填标记位置,可选值:before、after
|
||||
*/
|
||||
markerSide: uni_modules_wotDesignUni_components_common_props.makeStringProp("before")
|
||||
};
|
||||
exports.datetimePickerProps = datetimePickerProps;
|
||||
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/wot-design-uni/components/wd-datetime-picker/types.js.map
|
||||
@@ -0,0 +1,664 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
const uni_modules_wotDesignUni_components_common_util = require("../common/util.js");
|
||||
const uni_modules_wotDesignUni_components_composables_useTranslate = require("../composables/useTranslate.js");
|
||||
const uni_modules_wotDesignUni_components_wdDatetimePicker_types = require("./types.js");
|
||||
const uni_modules_wotDesignUni_dayjs_index = require("../../dayjs/index.js");
|
||||
const uni_modules_wotDesignUni_components_wdDatetimePickerView_util = require("../wd-datetime-picker-view/util.js");
|
||||
if (!Math) {
|
||||
(wdIcon + wdCell + wdDatetimePickerView + wdPopup)();
|
||||
}
|
||||
const wdPopup = () => "../wd-popup/wd-popup.js";
|
||||
const wdDatetimePickerView = () => "../wd-datetime-picker-view/wd-datetime-picker-view.js";
|
||||
const wdCell = () => "../wd-cell/wd-cell.js";
|
||||
const wdIcon = () => "../wd-icon/wd-icon.js";
|
||||
const __default__ = {
|
||||
name: "wd-datetime-picker",
|
||||
options: {
|
||||
virtualHost: true,
|
||||
addGlobalClass: true,
|
||||
styleIsolation: "shared"
|
||||
}
|
||||
};
|
||||
const _sfc_main = /* @__PURE__ */ common_vendor.defineComponent({
|
||||
...__default__,
|
||||
props: uni_modules_wotDesignUni_components_wdDatetimePicker_types.datetimePickerProps,
|
||||
emits: ["change", "open", "toggle", "cancel", "confirm", "clear", "update:modelValue", "close"],
|
||||
setup(__props, { expose: __expose, emit: __emit }) {
|
||||
const props = __props;
|
||||
const emit = __emit;
|
||||
const { translate } = uni_modules_wotDesignUni_components_composables_useTranslate.useTranslate("datetime-picker");
|
||||
const datetimePickerView = common_vendor.ref();
|
||||
const datetimePickerView1 = common_vendor.ref();
|
||||
const showValue = common_vendor.ref("");
|
||||
const popupShow = common_vendor.ref(false);
|
||||
const showStart = common_vendor.ref(true);
|
||||
const region = common_vendor.ref(false);
|
||||
const showTabLabel = common_vendor.ref([]);
|
||||
const innerValue = common_vendor.ref("");
|
||||
const endInnerValue = common_vendor.ref("");
|
||||
const isPicking = common_vendor.ref(false);
|
||||
const hasConfirmed = common_vendor.ref(false);
|
||||
const isLoading = common_vendor.ref(false);
|
||||
const { proxy } = common_vendor.getCurrentInstance();
|
||||
const cellClass = common_vendor.computed(() => {
|
||||
const classes = ["wd-datetime-picker__cell"];
|
||||
if (props.disabled)
|
||||
classes.push("is-disabled");
|
||||
if (props.readonly)
|
||||
classes.push("is-readonly");
|
||||
if (props.error)
|
||||
classes.push("is-error");
|
||||
return classes.join(" ");
|
||||
});
|
||||
common_vendor.watch(
|
||||
() => props.modelValue,
|
||||
(val, oldVal) => {
|
||||
if (uni_modules_wotDesignUni_components_common_util.isEqual(val, oldVal))
|
||||
return;
|
||||
if (uni_modules_wotDesignUni_components_common_util.isArray(val)) {
|
||||
region.value = true;
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true));
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, true));
|
||||
} else {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue());
|
||||
}
|
||||
common_vendor.nextTick$1(() => {
|
||||
setShowValue(false, false, true);
|
||||
});
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.displayFormat,
|
||||
(fn) => {
|
||||
if (fn && !uni_modules_wotDesignUni_components_common_util.isFunction(fn)) {
|
||||
common_vendor.index.__f__("error", "at uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue:236", "The type of displayFormat must be Function");
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.filter,
|
||||
(fn) => {
|
||||
if (fn && !uni_modules_wotDesignUni_components_common_util.isFunction(fn)) {
|
||||
common_vendor.index.__f__("error", "at uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue:248", "The type of filter must be Function");
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.formatter,
|
||||
(fn) => {
|
||||
if (fn && !uni_modules_wotDesignUni_components_common_util.isFunction(fn)) {
|
||||
common_vendor.index.__f__("error", "at uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue:260", "The type of formatter must be Function");
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.beforeConfirm,
|
||||
(fn) => {
|
||||
if (fn && !uni_modules_wotDesignUni_components_common_util.isFunction(fn)) {
|
||||
common_vendor.index.__f__("error", "at uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue:272", "The type of beforeConfirm must be Function");
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.displayFormatTabLabel,
|
||||
(fn) => {
|
||||
if (fn && !uni_modules_wotDesignUni_components_common_util.isFunction(fn)) {
|
||||
common_vendor.index.__f__("error", "at uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue:284", "The type of displayFormatTabLabel must be Function");
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
common_vendor.watch(
|
||||
() => props.defaultValue,
|
||||
(val) => {
|
||||
if (uni_modules_wotDesignUni_components_common_util.isArray(val) || region.value) {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true));
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, true));
|
||||
} else {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue());
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
const showClear = common_vendor.computed(() => {
|
||||
return props.clearable && !props.disabled && !props.readonly && (!uni_modules_wotDesignUni_components_common_util.isArray(showValue.value) && showValue.value || uni_modules_wotDesignUni_components_common_util.isArray(showValue.value) && (showValue.value[0] || showValue.value[1]));
|
||||
});
|
||||
const showArrow = common_vendor.computed(() => {
|
||||
return !props.disabled && !props.readonly && !showClear.value;
|
||||
});
|
||||
function handleBoundaryValue(isStart, columnType, value, currentArray, boundary) {
|
||||
const { type, useSecond } = props;
|
||||
switch (type) {
|
||||
case "datetime": {
|
||||
const [year, month, date, hour, minute, second] = boundary;
|
||||
if (columnType === "year") {
|
||||
return isStart ? value > year : value < year;
|
||||
}
|
||||
if (columnType === "month" && currentArray[0] === year) {
|
||||
return isStart ? value > month : value < month;
|
||||
}
|
||||
if (columnType === "date" && currentArray[0] === year && currentArray[1] === month) {
|
||||
return isStart ? value > date : value < date;
|
||||
}
|
||||
if (columnType === "hour" && currentArray[0] === year && currentArray[1] === month && currentArray[2] === date) {
|
||||
return isStart ? value > hour : value < hour;
|
||||
}
|
||||
if (columnType === "minute" && currentArray[0] === year && currentArray[1] === month && currentArray[2] === date && currentArray[3] === hour) {
|
||||
return isStart ? value > minute : value < minute;
|
||||
}
|
||||
if (useSecond && columnType === "second" && currentArray[0] === year && currentArray[1] === month && currentArray[2] === date && currentArray[3] === hour && currentArray[4] === minute) {
|
||||
return isStart ? value > second : value < second;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "year-month": {
|
||||
const [year, month] = boundary;
|
||||
if (columnType === "year") {
|
||||
return isStart ? value > year : value < year;
|
||||
}
|
||||
if (columnType === "month" && currentArray[0] === year) {
|
||||
return isStart ? value > month : value < month;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "year": {
|
||||
const [year] = boundary;
|
||||
if (columnType === "year") {
|
||||
return isStart ? value > year : value < year;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "date": {
|
||||
const [year, month, date] = boundary;
|
||||
if (columnType === "year") {
|
||||
return isStart ? value > year : value < year;
|
||||
}
|
||||
if (columnType === "month" && currentArray[0] === year) {
|
||||
return isStart ? value > month : value < month;
|
||||
}
|
||||
if (columnType === "date" && currentArray[0] === year && currentArray[1] === month) {
|
||||
return isStart ? value > date : value < date;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "time": {
|
||||
const [hour, minute, second] = boundary;
|
||||
if (columnType === "hour") {
|
||||
return isStart ? value > hour : value < hour;
|
||||
}
|
||||
if (columnType === "minute" && currentArray[0] === hour) {
|
||||
return isStart ? value > minute : value < minute;
|
||||
}
|
||||
if (useSecond && columnType === "second" && currentArray[0] === hour && currentArray[1] === minute) {
|
||||
return isStart ? value > second : value < second;
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
function startColumnFormatter(picker) {
|
||||
return customColumnFormatter(picker, "start");
|
||||
}
|
||||
function endColumnFormatter(picker) {
|
||||
return customColumnFormatter(picker, "end");
|
||||
}
|
||||
const customColumnFormatter = (picker, pickerType) => {
|
||||
if (!picker)
|
||||
return [];
|
||||
const { type } = props;
|
||||
const startSymbol = pickerType === "start";
|
||||
const { formatter } = props;
|
||||
const start = picker.correctValue(innerValue.value);
|
||||
const end = picker.correctValue(endInnerValue.value);
|
||||
const currentValue = startSymbol ? uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(start, type, props.useSecond) : uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(end, type, props.useSecond);
|
||||
const boundary = startSymbol ? uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(end, type, props.useSecond) : uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(start, type, props.useSecond);
|
||||
const columns = picker.getOriginColumns();
|
||||
return columns.map((column, _) => {
|
||||
return column.values.map((value) => {
|
||||
const disabled = handleBoundaryValue(startSymbol, column.type, value, currentValue, boundary);
|
||||
return {
|
||||
label: formatter ? formatter(column.type, uni_modules_wotDesignUni_components_common_util.padZero(value)) : uni_modules_wotDesignUni_components_common_util.padZero(value),
|
||||
value,
|
||||
disabled
|
||||
};
|
||||
});
|
||||
});
|
||||
};
|
||||
common_vendor.onBeforeMount(() => {
|
||||
const { modelValue: value } = props;
|
||||
if (uni_modules_wotDesignUni_components_common_util.isArray(value)) {
|
||||
region.value = true;
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true));
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, true));
|
||||
} else {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue());
|
||||
}
|
||||
});
|
||||
common_vendor.onMounted(() => {
|
||||
setShowValue(false, false, true);
|
||||
});
|
||||
function getSelects(picker) {
|
||||
let value = picker === "before" ? innerValue.value : endInnerValue.value;
|
||||
let selected = [];
|
||||
if (value) {
|
||||
selected = uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(value, props.type, props.useSecond);
|
||||
}
|
||||
let selects = selected.map((value2) => {
|
||||
return {
|
||||
[props.labelKey]: uni_modules_wotDesignUni_components_common_util.padZero(value2),
|
||||
[props.valueKey]: value2
|
||||
};
|
||||
});
|
||||
return selects;
|
||||
}
|
||||
function noop() {
|
||||
}
|
||||
function getDefaultInnerValue(isRegion, isEnd) {
|
||||
const { modelValue: value, defaultValue, maxDate, minDate, type } = props;
|
||||
if (isRegion) {
|
||||
const index = isEnd ? 1 : 0;
|
||||
const targetValue = uni_modules_wotDesignUni_components_common_util.isArray(value) ? value[index] : "";
|
||||
const targetDefault = uni_modules_wotDesignUni_components_common_util.isArray(defaultValue) ? defaultValue[index] : "";
|
||||
const maxValue = type === "time" ? uni_modules_wotDesignUni_dayjs_index.dayjs(maxDate).format("HH:mm") : maxDate;
|
||||
const minValue = type === "time" ? uni_modules_wotDesignUni_dayjs_index.dayjs(minDate).format("HH:mm") : minDate;
|
||||
return targetValue || targetDefault || (isEnd ? maxValue : minValue);
|
||||
} else {
|
||||
return uni_modules_wotDesignUni_components_common_util.isDef(value || defaultValue) ? value || defaultValue : "";
|
||||
}
|
||||
}
|
||||
function open() {
|
||||
showPopup();
|
||||
}
|
||||
function close() {
|
||||
onCancel();
|
||||
}
|
||||
function showPopup() {
|
||||
if (props.disabled || props.readonly)
|
||||
return;
|
||||
emit("open");
|
||||
if (region.value) {
|
||||
popupShow.value = true;
|
||||
showStart.value = true;
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, false));
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, true));
|
||||
} else {
|
||||
popupShow.value = true;
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue());
|
||||
}
|
||||
setShowValue(true, false, true);
|
||||
}
|
||||
function tabChange() {
|
||||
showStart.value = !showStart.value;
|
||||
const picker = showStart.value ? datetimePickerView.value : datetimePickerView1.value;
|
||||
picker.setColumns(picker.updateColumns());
|
||||
emit("toggle", showStart.value ? innerValue.value : endInnerValue.value);
|
||||
}
|
||||
function onChangeStart({ value }) {
|
||||
if (!datetimePickerView.value)
|
||||
return;
|
||||
if (region.value && !datetimePickerView1.value)
|
||||
return;
|
||||
if (region.value) {
|
||||
const currentArray = uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(value, props.type, props.useSecond);
|
||||
const boundaryArray = uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(endInnerValue.value, props.type, props.useSecond);
|
||||
const columns = datetimePickerView.value.getOriginColumns();
|
||||
const needsAdjust = columns.some((column, index) => {
|
||||
return handleBoundaryValue(true, column.type, currentArray[index], currentArray, boundaryArray);
|
||||
});
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(needsAdjust ? endInnerValue.value : value);
|
||||
common_vendor.nextTick$1(() => {
|
||||
showTabLabel.value = [setTabLabel(), uni_modules_wotDesignUni_components_common_util.deepClone(showTabLabel.value[1])];
|
||||
emit("change", {
|
||||
value: [innerValue.value, endInnerValue.value]
|
||||
});
|
||||
datetimePickerView.value && datetimePickerView.value.setColumns(datetimePickerView.value.updateColumns());
|
||||
datetimePickerView1.value && datetimePickerView1.value.setColumns(datetimePickerView1.value.updateColumns());
|
||||
});
|
||||
} else {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(value);
|
||||
emit("change", {
|
||||
value: innerValue.value
|
||||
});
|
||||
}
|
||||
}
|
||||
function onChangeEnd({ value }) {
|
||||
if (!datetimePickerView.value || !datetimePickerView1.value)
|
||||
return;
|
||||
const currentArray = uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(value, props.type);
|
||||
const boundaryArray = uni_modules_wotDesignUni_components_wdDatetimePickerView_util.getPickerValue(innerValue.value, props.type);
|
||||
const columns = datetimePickerView1.value.getOriginColumns();
|
||||
const needsAdjust = columns.some((column, index) => {
|
||||
return handleBoundaryValue(false, column.type, currentArray[index], currentArray, boundaryArray);
|
||||
});
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(needsAdjust ? innerValue.value : value);
|
||||
common_vendor.nextTick$1(() => {
|
||||
showTabLabel.value = [uni_modules_wotDesignUni_components_common_util.deepClone(showTabLabel.value[0]), setTabLabel(1)];
|
||||
emit("change", {
|
||||
value: [innerValue.value, endInnerValue.value]
|
||||
});
|
||||
datetimePickerView.value && datetimePickerView.value.setColumns(datetimePickerView.value.updateColumns());
|
||||
datetimePickerView1.value && datetimePickerView1.value.setColumns(datetimePickerView1.value.updateColumns());
|
||||
});
|
||||
}
|
||||
function onCancel() {
|
||||
popupShow.value = false;
|
||||
emit("close");
|
||||
setTimeout(() => {
|
||||
if (region.value) {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true));
|
||||
endInnerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue(true, true));
|
||||
} else {
|
||||
innerValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(getDefaultInnerValue());
|
||||
}
|
||||
}, 200);
|
||||
emit("cancel");
|
||||
}
|
||||
function onConfirm() {
|
||||
if (props.loading || isLoading.value)
|
||||
return;
|
||||
if (isPicking.value) {
|
||||
hasConfirmed.value = true;
|
||||
return;
|
||||
}
|
||||
const { beforeConfirm } = props;
|
||||
if (beforeConfirm) {
|
||||
beforeConfirm(
|
||||
region.value ? [innerValue.value, endInnerValue.value] : innerValue.value,
|
||||
(isPass) => {
|
||||
isPass && handleConfirm();
|
||||
},
|
||||
proxy.$.exposed
|
||||
);
|
||||
} else {
|
||||
handleConfirm();
|
||||
}
|
||||
}
|
||||
function onPickStart() {
|
||||
isPicking.value = true;
|
||||
}
|
||||
function onPickEnd() {
|
||||
isPicking.value = false;
|
||||
setTimeout(() => {
|
||||
if (hasConfirmed.value) {
|
||||
hasConfirmed.value = false;
|
||||
onConfirm();
|
||||
}
|
||||
}, 50);
|
||||
}
|
||||
function handleConfirm() {
|
||||
if (props.loading || isLoading.value || props.disabled) {
|
||||
popupShow.value = false;
|
||||
emit("close");
|
||||
return;
|
||||
}
|
||||
const value = region.value ? [innerValue.value, endInnerValue.value] : innerValue.value;
|
||||
popupShow.value = false;
|
||||
emit("close");
|
||||
emit("update:modelValue", value);
|
||||
emit("confirm", {
|
||||
value
|
||||
});
|
||||
setShowValue(false, true);
|
||||
}
|
||||
function setTabLabel(index = 0) {
|
||||
if (region.value) {
|
||||
let items = [];
|
||||
if (index === 0) {
|
||||
items = (datetimePickerView.value ? datetimePickerView.value.getSelects() : void 0) || innerValue.value && getSelects("before");
|
||||
} else {
|
||||
items = (datetimePickerView1.value ? datetimePickerView1.value.getSelects() : void 0) || endInnerValue.value && getSelects("after");
|
||||
}
|
||||
return defaultDisplayFormat(items, true);
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
}
|
||||
function setShowValue(tab = false, isConfirm = false, beforeMount = false) {
|
||||
if (region.value) {
|
||||
const items = beforeMount ? innerValue.value && getSelects("before") || [] : datetimePickerView.value && datetimePickerView.value.getSelects && datetimePickerView.value.getSelects() || [];
|
||||
const endItems = beforeMount ? endInnerValue.value && getSelects("after") || [] : datetimePickerView1.value && datetimePickerView1.value.getSelects && datetimePickerView1.value.getSelects() || [];
|
||||
showValue.value = tab ? showValue.value : [
|
||||
props.modelValue[0] || isConfirm ? defaultDisplayFormat(items) : "",
|
||||
props.modelValue[1] || isConfirm ? defaultDisplayFormat(endItems) : ""
|
||||
];
|
||||
showTabLabel.value = [defaultDisplayFormat(items, true), defaultDisplayFormat(endItems, true)];
|
||||
} else {
|
||||
const items = beforeMount ? innerValue.value && getSelects("before") || [] : datetimePickerView.value && datetimePickerView.value.getSelects && datetimePickerView.value.getSelects() || [];
|
||||
showValue.value = uni_modules_wotDesignUni_components_common_util.deepClone(props.modelValue || isConfirm ? defaultDisplayFormat(items) : "");
|
||||
}
|
||||
}
|
||||
function defaultDisplayFormat(items, tabLabel = false) {
|
||||
if (items.length === 0)
|
||||
return "";
|
||||
if (tabLabel && props.displayFormatTabLabel) {
|
||||
return props.displayFormatTabLabel(items);
|
||||
}
|
||||
if (props.displayFormat) {
|
||||
return props.displayFormat(items);
|
||||
}
|
||||
if (props.formatter) {
|
||||
const typeMaps = {
|
||||
year: ["year"],
|
||||
datetime: props.useSecond ? ["year", "month", "date", "hour", "minute", "second"] : ["year", "month", "date", "hour", "minute"],
|
||||
date: ["year", "month", "date"],
|
||||
time: props.useSecond ? ["hour", "minute", "second"] : ["hour", "minute"],
|
||||
"year-month": ["year", "month"]
|
||||
};
|
||||
return items.map((item, index) => {
|
||||
return props.formatter(typeMaps[props.type][index], item.value);
|
||||
}).join("");
|
||||
}
|
||||
switch (props.type) {
|
||||
case "year":
|
||||
return items[0].label;
|
||||
case "date":
|
||||
return `${items[0].label}-${items[1].label}-${items[2].label}`;
|
||||
case "year-month":
|
||||
return `${items[0].label}-${items[1].label}`;
|
||||
case "time":
|
||||
return props.useSecond ? `${items[0].label}:${items[1].label}:${items[2].label}` : `${items[0].label}:${items[1].label}`;
|
||||
case "datetime":
|
||||
return props.useSecond ? `${items[0].label}-${items[1].label}-${items[2].label} ${items[3].label}:${items[4].label}:${items[5].label}` : `${items[0].label}-${items[1].label}-${items[2].label} ${items[3].label}:${items[4].label}`;
|
||||
}
|
||||
}
|
||||
function setLoading(loading) {
|
||||
isLoading.value = loading;
|
||||
}
|
||||
function handleClear() {
|
||||
emit("clear");
|
||||
emit("update:modelValue", "");
|
||||
setShowValue(false, true);
|
||||
}
|
||||
__expose({
|
||||
open,
|
||||
close,
|
||||
setLoading
|
||||
});
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: !_ctx.$slots.default
|
||||
}, !_ctx.$slots.default ? common_vendor.e({
|
||||
b: _ctx.$slots.label
|
||||
}, _ctx.$slots.label ? {} : {}, {
|
||||
c: region.value
|
||||
}, region.value ? common_vendor.e({
|
||||
d: common_vendor.unref(uni_modules_wotDesignUni_components_common_util.isArray)(showValue.value)
|
||||
}, common_vendor.unref(uni_modules_wotDesignUni_components_common_util.isArray)(showValue.value) ? {
|
||||
e: common_vendor.t(showValue.value[0] ? showValue.value[0] : _ctx.placeholder || common_vendor.unref(translate)("placeholder")),
|
||||
f: common_vendor.n(showValue.value[0] ? "" : "wd-datetime-picker__placeholder"),
|
||||
g: common_vendor.t(common_vendor.unref(translate)("to")),
|
||||
h: common_vendor.t(showValue.value[1] ? showValue.value[1] : _ctx.placeholder || common_vendor.unref(translate)("placeholder")),
|
||||
i: common_vendor.n(showValue.value[1] ? "" : "wd-datetime-picker__placeholder")
|
||||
} : {
|
||||
j: common_vendor.t(_ctx.placeholder || common_vendor.unref(translate)("placeholder"))
|
||||
}) : {
|
||||
k: common_vendor.t(showValue.value ? showValue.value : _ctx.placeholder || common_vendor.unref(translate)("placeholder")),
|
||||
l: common_vendor.n(showValue.value ? "" : "wd-datetime-picker__placeholder")
|
||||
}, {
|
||||
m: showArrow.value
|
||||
}, showArrow.value ? {
|
||||
n: common_vendor.p({
|
||||
["custom-class"]: "wd-datetime-picker__arrow",
|
||||
name: "arrow-right"
|
||||
})
|
||||
} : showClear.value ? {
|
||||
p: common_vendor.p({
|
||||
["custom-class"]: "wd-datetime-picker__clear",
|
||||
name: "error-fill"
|
||||
}),
|
||||
q: common_vendor.o(handleClear)
|
||||
} : {}, {
|
||||
o: showClear.value,
|
||||
r: common_vendor.o(showPopup),
|
||||
s: common_vendor.p({
|
||||
title: _ctx.label,
|
||||
required: _ctx.required,
|
||||
size: _ctx.size,
|
||||
["title-width"]: _ctx.labelWidth,
|
||||
prop: _ctx.prop,
|
||||
rules: _ctx.rules,
|
||||
clickable: !_ctx.disabled && !_ctx.readonly,
|
||||
["value-align"]: _ctx.alignRight ? "right" : "left",
|
||||
["custom-class"]: cellClass.value,
|
||||
["custom-style"]: _ctx.customStyle,
|
||||
["custom-title-class"]: _ctx.customLabelClass,
|
||||
["custom-value-class"]: _ctx.customValueClass,
|
||||
ellipsis: _ctx.ellipsis,
|
||||
["use-title-slot"]: !!_ctx.$slots.label,
|
||||
["marker-side"]: _ctx.markerSide
|
||||
})
|
||||
}) : {
|
||||
t: common_vendor.o(showPopup)
|
||||
}, {
|
||||
v: common_vendor.t(_ctx.cancelButtonText || common_vendor.unref(translate)("cancel")),
|
||||
w: common_vendor.o(onCancel),
|
||||
x: _ctx.title
|
||||
}, _ctx.title ? {
|
||||
y: common_vendor.t(_ctx.title)
|
||||
} : {}, {
|
||||
z: common_vendor.t(_ctx.confirmButtonText || common_vendor.unref(translate)("confirm")),
|
||||
A: common_vendor.n(`wd-datetime-picker__action ${_ctx.loading || isLoading.value ? "is-loading" : ""}`),
|
||||
B: common_vendor.o(onConfirm),
|
||||
C: common_vendor.o(noop),
|
||||
D: region.value
|
||||
}, region.value ? {
|
||||
E: common_vendor.t(common_vendor.unref(translate)("start")),
|
||||
F: common_vendor.t(showTabLabel.value[0]),
|
||||
G: common_vendor.n(`wd-datetime-picker__region ${showStart.value ? "is-active" : ""} `),
|
||||
H: common_vendor.o(tabChange),
|
||||
I: common_vendor.t(common_vendor.unref(translate)("end")),
|
||||
J: common_vendor.t(showTabLabel.value[1]),
|
||||
K: common_vendor.n(`wd-datetime-picker__region ${showStart.value ? "" : "is-active"}`),
|
||||
L: common_vendor.o(tabChange)
|
||||
} : {}, {
|
||||
M: common_vendor.sr(datetimePickerView, "2a8ca3bd-4,2a8ca3bd-3", {
|
||||
"k": "datetimePickerView"
|
||||
}),
|
||||
N: common_vendor.o(onChangeStart),
|
||||
O: common_vendor.o(onPickStart),
|
||||
P: common_vendor.o(onPickEnd),
|
||||
Q: common_vendor.o(($event) => innerValue.value = $event),
|
||||
R: common_vendor.p({
|
||||
["custom-class"]: _ctx.customViewClass,
|
||||
type: _ctx.type,
|
||||
loading: _ctx.loading || isLoading.value,
|
||||
["loading-color"]: _ctx.loadingColor,
|
||||
["columns-height"]: _ctx.columnsHeight,
|
||||
["value-key"]: _ctx.valueKey,
|
||||
["label-key"]: _ctx.labelKey,
|
||||
formatter: _ctx.formatter,
|
||||
filter: _ctx.filter,
|
||||
["column-formatter"]: common_vendor.unref(uni_modules_wotDesignUni_components_common_util.isArray)(_ctx.modelValue) ? startColumnFormatter : void 0,
|
||||
["max-hour"]: _ctx.maxHour,
|
||||
["min-hour"]: _ctx.minHour,
|
||||
["max-date"]: _ctx.maxDate,
|
||||
["min-date"]: _ctx.minDate,
|
||||
["max-minute"]: _ctx.maxMinute,
|
||||
["min-minute"]: _ctx.minMinute,
|
||||
["use-second"]: _ctx.useSecond,
|
||||
["min-second"]: _ctx.minSecond,
|
||||
["max-second"]: _ctx.maxSecond,
|
||||
["immediate-change"]: _ctx.immediateChange,
|
||||
modelValue: innerValue.value
|
||||
}),
|
||||
S: common_vendor.n(showStart.value ? "wd-datetime-picker__show" : "wd-datetime-picker__hidden"),
|
||||
T: common_vendor.sr(datetimePickerView1, "2a8ca3bd-5,2a8ca3bd-3", {
|
||||
"k": "datetimePickerView1"
|
||||
}),
|
||||
U: common_vendor.o(onChangeEnd),
|
||||
V: common_vendor.o(onPickStart),
|
||||
W: common_vendor.o(onPickEnd),
|
||||
X: common_vendor.o(($event) => endInnerValue.value = $event),
|
||||
Y: common_vendor.p({
|
||||
["custom-class"]: _ctx.customViewClass,
|
||||
type: _ctx.type,
|
||||
loading: _ctx.loading || isLoading.value,
|
||||
["loading-color"]: _ctx.loadingColor,
|
||||
["columns-height"]: _ctx.columnsHeight,
|
||||
["value-key"]: _ctx.valueKey,
|
||||
["label-key"]: _ctx.labelKey,
|
||||
formatter: _ctx.formatter,
|
||||
filter: _ctx.filter,
|
||||
["column-formatter"]: common_vendor.unref(uni_modules_wotDesignUni_components_common_util.isArray)(_ctx.modelValue) ? endColumnFormatter : void 0,
|
||||
["max-hour"]: _ctx.maxHour,
|
||||
["min-hour"]: _ctx.minHour,
|
||||
["max-date"]: _ctx.maxDate,
|
||||
["min-date"]: _ctx.minDate,
|
||||
["max-minute"]: _ctx.maxMinute,
|
||||
["min-minute"]: _ctx.minMinute,
|
||||
["use-second"]: _ctx.useSecond,
|
||||
["min-second"]: _ctx.minSecond,
|
||||
["max-second"]: _ctx.maxSecond,
|
||||
["immediate-change"]: _ctx.immediateChange,
|
||||
modelValue: endInnerValue.value
|
||||
}),
|
||||
Z: common_vendor.n(showStart.value ? "wd-datetime-picker__hidden" : "wd-datetime-picker__show"),
|
||||
aa: common_vendor.o(onCancel),
|
||||
ab: common_vendor.o(($event) => popupShow.value = $event),
|
||||
ac: common_vendor.p({
|
||||
position: "bottom",
|
||||
["hide-when-close"]: false,
|
||||
["close-on-click-modal"]: _ctx.closeOnClickModal,
|
||||
["safe-area-inset-bottom"]: _ctx.safeAreaInsetBottom,
|
||||
["z-index"]: _ctx.zIndex,
|
||||
["root-portal"]: _ctx.rootPortal,
|
||||
["custom-class"]: "wd-datetime-picker__popup",
|
||||
modelValue: popupShow.value
|
||||
}),
|
||||
ad: common_vendor.n(`wd-datetime-picker ${_ctx.customClass}`),
|
||||
ae: common_vendor.s(_ctx.customStyle)
|
||||
});
|
||||
};
|
||||
}
|
||||
});
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-2a8ca3bd"]]);
|
||||
wx.createComponent(Component);
|
||||
//# sourceMappingURL=../../../../../.sourcemap/mp-weixin/uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.js.map
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"wd-popup": "../wd-popup/wd-popup",
|
||||
"wd-datetime-picker-view": "../wd-datetime-picker-view/wd-datetime-picker-view",
|
||||
"wd-cell": "../wd-cell/wd-cell",
|
||||
"wd-icon": "../wd-icon/wd-icon"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="{{['data-v-2a8ca3bd', ad]}}" style="{{ae}}"><wd-cell wx:if="{{a}}" class="data-v-2a8ca3bd" u-s="{{['title','d','right-icon']}}" bindclick="{{r}}" u-i="2a8ca3bd-0" bind:__l="__l" u-p="{{s}}"><view wx:if="{{b}}" slot="title"><slot name="label"></slot></view><view><block wx:if="{{c}}"><view wx:if="{{d}}" class="data-v-2a8ca3bd"><text class="{{['data-v-2a8ca3bd', f]}}">{{e}}</text> {{g}} <text class="{{['data-v-2a8ca3bd', i]}}">{{h}}</text></view><view wx:else class="wd-datetime-picker__cell-placeholder data-v-2a8ca3bd">{{j}}</view></block><view wx:else class="{{['data-v-2a8ca3bd', l]}}">{{k}}</view></view><view slot="right-icon"><wd-icon wx:if="{{m}}" class="data-v-2a8ca3bd" u-i="2a8ca3bd-1,2a8ca3bd-0" bind:__l="__l" u-p="{{n}}"/><view wx:elif="{{o}}" class="data-v-2a8ca3bd" catchtap="{{q}}"><wd-icon wx:if="{{p}}" class="data-v-2a8ca3bd" u-i="2a8ca3bd-2,2a8ca3bd-0" bind:__l="__l" u-p="{{p}}"/></view></view></wd-cell><view wx:else class="data-v-2a8ca3bd" bindtap="{{t}}"><slot></slot></view><wd-popup wx:if="{{ac}}" class="data-v-2a8ca3bd" u-s="{{['d']}}" bindclose="{{aa}}" u-i="2a8ca3bd-3" bind:__l="__l" bindupdateModelValue="{{ab}}" u-p="{{ac}}"><view class="wd-datetime-picker__wraper data-v-2a8ca3bd"><view class="wd-datetime-picker__toolbar data-v-2a8ca3bd" bindtouchmove="{{C}}"><view class="wd-datetime-picker__action wd-datetime-picker__action--cancel data-v-2a8ca3bd" bindtap="{{w}}">{{v}}</view><view wx:if="{{x}}" class="wd-datetime-picker__title data-v-2a8ca3bd">{{y}}</view><view class="{{['data-v-2a8ca3bd', A]}}" bindtap="{{B}}">{{z}}</view></view><view wx:if="{{D}}" class="wd-datetime-picker__region-tabs data-v-2a8ca3bd"><view class="{{['data-v-2a8ca3bd', G]}}" bindtap="{{H}}"><view class="data-v-2a8ca3bd">{{E}}</view><view class="wd-datetime-picker__region-time data-v-2a8ca3bd">{{F}}</view></view><view class="{{['data-v-2a8ca3bd', K]}}" bindtap="{{L}}"><view class="data-v-2a8ca3bd">{{I}}</view><view class="wd-datetime-picker__region-time data-v-2a8ca3bd">{{J}}</view></view></view><view class="{{['data-v-2a8ca3bd', S]}}"><wd-datetime-picker-view wx:if="{{R}}" class="r data-v-2a8ca3bd" u-r="datetimePickerView" bindchange="{{N}}" bindpickstart="{{O}}" bindpickend="{{P}}" u-i="2a8ca3bd-4,2a8ca3bd-3" bind:__l="__l" bindupdateModelValue="{{Q}}" u-p="{{R}}"/></view><view class="{{['data-v-2a8ca3bd', Z]}}"><wd-datetime-picker-view wx:if="{{Y}}" class="r data-v-2a8ca3bd" u-r="datetimePickerView1" bindchange="{{U}}" bindpickstart="{{V}}" bindpickend="{{W}}" u-i="2a8ca3bd-5,2a8ca3bd-3" bind:__l="__l" bindupdateModelValue="{{X}}" u-p="{{Y}}"/></view></view></wd-popup></view>
|
||||
@@ -0,0 +1,289 @@
|
||||
/* 水平间距 */
|
||||
/* 水平间距 */
|
||||
/**
|
||||
* 混合宏
|
||||
*/
|
||||
/**
|
||||
* SCSS 配置项:命名空间以及BEM
|
||||
*/
|
||||
/**
|
||||
* 辅助函数
|
||||
*/
|
||||
/**
|
||||
* SCSS 配置项:命名空间以及BEM
|
||||
*/
|
||||
/* 转换成字符串 */
|
||||
/* 判断是否存在 Modifier */
|
||||
/* 判断是否存在伪类 */
|
||||
/**
|
||||
* 主题色切换
|
||||
* @params $theme-color 主题色
|
||||
* @params $type 变暗’dark‘ 变亮 'light'
|
||||
* @params $mix-color 自己设置的混色
|
||||
*/
|
||||
/**
|
||||
* 颜色结果切换, 如果开启线性渐变色 使用渐变色,如果没有开启,那么使用主题色
|
||||
* @params $open-linear 是否开启线性渐变色
|
||||
* @params $deg 渐变色角度
|
||||
* @params $theme-color 当前配色
|
||||
* @params [Array] $set 主题色明暗设置,与 $color-list 数量对应
|
||||
* @params [Array] $color-list 渐变色顺序, $color-list 和 $per-list 数量相同
|
||||
* @params [Array] $per-list 渐变色比例
|
||||
*/
|
||||
/**
|
||||
* BEM,定义块(b)
|
||||
*/
|
||||
/* 定义元素(e),对于伪类,会自动将 e 嵌套在 伪类 底下 */
|
||||
/* 此方法用于生成穿透样式 */
|
||||
/* 定义元素(e),对于伪类,会自动将 e 嵌套在 伪类 底下 */
|
||||
/* 定义状态(m) */
|
||||
/* 定义状态(m) */
|
||||
/* 对于需要需要嵌套在 m 底下的 e,调用这个混合宏,一般在切换整个组件的状态,如切换颜色的时候 */
|
||||
/* 状态,生成 is-$state 类名 */
|
||||
/**
|
||||
* 常用混合宏
|
||||
*/
|
||||
/* 单行超出隐藏 */
|
||||
/* 多行超出隐藏 */
|
||||
/* 清除浮动 */
|
||||
/* 0.5px 边框 指定方向*/
|
||||
/* 0.5px 边框 环绕 */
|
||||
/**
|
||||
* 三角形实现尖角样式,适用于背景透明情况
|
||||
* @param $size 三角形高,底边为 $size * 2
|
||||
* @param $bg 三角形背景颜色
|
||||
*/
|
||||
/**
|
||||
* 正方形实现尖角样式,适用于背景不透明情况
|
||||
* @param $size 正方形边长
|
||||
* @param $bg 正方形背景颜色
|
||||
* @param $z-index z-index属性值,不得大于外部包裹器
|
||||
* @param $box-shadow 阴影
|
||||
*/
|
||||
/**
|
||||
* 辅助函数
|
||||
*/
|
||||
/**
|
||||
* SCSS 配置项:命名空间以及BEM
|
||||
*/
|
||||
/* 转换成字符串 */
|
||||
/* 判断是否存在 Modifier */
|
||||
/* 判断是否存在伪类 */
|
||||
/**
|
||||
* 主题色切换
|
||||
* @params $theme-color 主题色
|
||||
* @params $type 变暗’dark‘ 变亮 'light'
|
||||
* @params $mix-color 自己设置的混色
|
||||
*/
|
||||
/**
|
||||
* 颜色结果切换, 如果开启线性渐变色 使用渐变色,如果没有开启,那么使用主题色
|
||||
* @params $open-linear 是否开启线性渐变色
|
||||
* @params $deg 渐变色角度
|
||||
* @params $theme-color 当前配色
|
||||
* @params [Array] $set 主题色明暗设置,与 $color-list 数量对应
|
||||
* @params [Array] $color-list 渐变色顺序, $color-list 和 $per-list 数量相同
|
||||
* @params [Array] $per-list 渐变色比例
|
||||
*/
|
||||
/**
|
||||
* UI规范基础变量
|
||||
*/
|
||||
/*----------------------------------------- Theme color. start ----------------------------------------*/
|
||||
/* 主题颜色 */
|
||||
/* 辅助色 */
|
||||
/* 文字颜色(默认浅色背景下 */
|
||||
/* 暗黑模式 */
|
||||
/* 图形颜色 */
|
||||
/*----------------------------------------- Theme color. end -------------------------------------------*/
|
||||
/*-------------------------------- Theme color application size. start --------------------------------*/
|
||||
/* 文字字号 */
|
||||
/* 文字字重 */
|
||||
/* 尺寸 */
|
||||
/*-------------------------------- Theme color application size. end --------------------------------*/
|
||||
/* component var */
|
||||
/* action-sheet */
|
||||
/* badge */
|
||||
/* button */
|
||||
/* cell */
|
||||
/* calendar */
|
||||
/* checkbox */
|
||||
/* collapse */
|
||||
/* divider */
|
||||
/* drop-menu */
|
||||
/* input-number */
|
||||
/* input */
|
||||
/* textarea */
|
||||
/* loadmore */
|
||||
/* message-box */
|
||||
/* notice-bar */
|
||||
/* pagination */
|
||||
/* picker */
|
||||
/* col-picker */
|
||||
/* overlay */
|
||||
/* popup */
|
||||
/* progress */
|
||||
/* radio */
|
||||
/* search */
|
||||
/* slider */
|
||||
/* sort-button */
|
||||
/* steps */
|
||||
/* switch */
|
||||
/* tabs */
|
||||
/* tag */
|
||||
/* toast */
|
||||
/* loading */
|
||||
/* tooltip */
|
||||
/* popover */
|
||||
/* grid-item */
|
||||
/* statustip */
|
||||
/* card */
|
||||
/* upload */
|
||||
/* curtain */
|
||||
/* notify */
|
||||
/* skeleton */
|
||||
/* circle */
|
||||
/* swiper */
|
||||
/* swiper-nav */
|
||||
/* segmented */
|
||||
/* tabbar */
|
||||
/* tabbar-item */
|
||||
/* navbar */
|
||||
/* navbar-capsule */
|
||||
/* table */
|
||||
/* sidebar */
|
||||
/* sidebar-item */
|
||||
/* fab */
|
||||
/* count-down */
|
||||
/* keyboard */
|
||||
/* number-keyboard */
|
||||
/* passwod-input */
|
||||
/* form-item */
|
||||
/* backtop */
|
||||
/* index-bar */
|
||||
/* text */
|
||||
/* video-preview */
|
||||
/* img-cropper */
|
||||
/* floating-panel */
|
||||
/* signature */
|
||||
.wot-theme-dark .wd-datetime-picker__placeholder.data-v-2a8ca3bd {
|
||||
color: var(--wot-dark-color-gray, var(--wot-color-secondary, #595959));
|
||||
}
|
||||
.wot-theme-dark .wd-datetime-picker.data-v-2a8ca3bd .wd-datetime-picker__arrow,
|
||||
.wot-theme-dark .wd-datetime-picker.data-v-2a8ca3bd .wd-datetime-picker__clear {
|
||||
color: var(--wot-dark-color, var(--wot-color-white, white));
|
||||
}
|
||||
.wot-theme-dark .wd-datetime-picker__action--cancel.data-v-2a8ca3bd {
|
||||
color: var(--wot-dark-color, var(--wot-color-white, white));
|
||||
}
|
||||
.wot-theme-dark .wd-datetime-picker__region.data-v-2a8ca3bd {
|
||||
color: var(--wot-dark-color, var(--wot-color-white, white));
|
||||
}
|
||||
.wot-theme-dark .wd-datetime-picker__region.is-active.data-v-2a8ca3bd {
|
||||
background: var(--wot-picker-region-bg-active-color, var(--wot-color-theme, #4d80f0));
|
||||
color: var(--wot-dark-color, var(--wot-color-white, white));
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell.is-disabled .wd-cell__value {
|
||||
color: var(--wot-input-disabled-color, #d9d9d9);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell.is-error .wd-cell__value {
|
||||
color: var(--wot-input-error-color, var(--wot-color-danger, #fa4350));
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell.is-error .wd-datetime-picker__arrow {
|
||||
color: var(--wot-input-error-color, var(--wot-color-danger, #fa4350));
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell.is-large .wd-datetime-picker__arrow {
|
||||
font-size: var(--wot-cell-icon-size-large, 18px);
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell .wd-cell__value--ellipsis view {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__cell .wd-cell__value--ellipsis text {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 100%;
|
||||
}
|
||||
.wd-datetime-picker__placeholder.data-v-2a8ca3bd {
|
||||
color: var(--wot-input-placeholder-color, #bfbfbf);
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__arrow {
|
||||
display: block;
|
||||
font-size: var(--wot-cell-icon-size, 16px);
|
||||
color: var(--wot-cell-arrow-color, rgba(0, 0, 0, 0.25));
|
||||
line-height: var(--wot-cell-line-height, 24px);
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__clear {
|
||||
display: block;
|
||||
font-size: var(--wot-cell-icon-size, 16px);
|
||||
color: var(--wot-cell-clear-color, #585858);
|
||||
line-height: var(--wot-cell-line-height, 24px);
|
||||
}
|
||||
.data-v-2a8ca3bd .wd-datetime-picker__popup {
|
||||
border-radius: 16px 16px 0px 0px;
|
||||
}
|
||||
.wd-datetime-picker__wraper.data-v-2a8ca3bd {
|
||||
padding-bottom: var(--window-bottom);
|
||||
}
|
||||
.wd-datetime-picker__toolbar.data-v-2a8ca3bd {
|
||||
position: relative;
|
||||
display: flex;
|
||||
font-size: var(--wot-picker-toolbar-fs, var(--wot-fs-title, 16px));
|
||||
height: var(--wot-picker-toolbar-height, 54px);
|
||||
line-height: var(--wot-picker-action-height, 16px);
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.wd-datetime-picker__action.data-v-2a8ca3bd {
|
||||
display: block;
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: var(--wot-picker-toolbar-fs, var(--wot-fs-title, 16px));
|
||||
color: var(--wot-picker-toolbar-finish-color, var(--wot-color-theme, #4d80f0));
|
||||
background: transparent;
|
||||
padding: 24px 15px 14px 15px;
|
||||
}
|
||||
.wd-datetime-picker__action--cancel.data-v-2a8ca3bd {
|
||||
color: var(--wot-picker-toolbar-cancel-color, #666666);
|
||||
}
|
||||
.wd-datetime-picker__action.is-loading.data-v-2a8ca3bd {
|
||||
color: var(--wot-picker-loading-button-color, rgba(0, 0, 0, 0.25));
|
||||
}
|
||||
.wd-datetime-picker__title.data-v-2a8ca3bd {
|
||||
display: block;
|
||||
float: 1;
|
||||
color: var(--wot-picker-toolbar-title-color, rgba(0, 0, 0, 0.85));
|
||||
}
|
||||
.wd-datetime-picker__region-tabs.data-v-2a8ca3bd {
|
||||
display: flex;
|
||||
}
|
||||
.wd-datetime-picker__region.data-v-2a8ca3bd {
|
||||
width: 50%;
|
||||
display: inline-block;
|
||||
color: var(--wot-picker-region-color, rgba(0, 0, 0, 0.45));
|
||||
text-align: center;
|
||||
padding: 14px 0;
|
||||
font-size: var(--wot-picker-region-fs, 14px);
|
||||
line-height: 16px;
|
||||
transition: all 0.15s ease-out;
|
||||
}
|
||||
.wd-datetime-picker__region.is-active.data-v-2a8ca3bd {
|
||||
background: var(--wot-picker-region-bg-active-color, var(--wot-color-theme, #4d80f0));
|
||||
color: var(--wot-color-white, white);
|
||||
}
|
||||
.wd-datetime-picker__region-time.data-v-2a8ca3bd {
|
||||
font-size: 16px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.wd-datetime-picker__hidden.data-v-2a8ca3bd {
|
||||
visibility: hidden;
|
||||
overflow: hidden;
|
||||
height: 0;
|
||||
}
|
||||
.wd-datetime-picker__show.data-v-2a8ca3bd {
|
||||
visibility: visible;
|
||||
height: auto;
|
||||
}
|
||||
Reference in New Issue
Block a user