@gez/date-time-kit
Version:
132 lines (131 loc) • 4.14 kB
JavaScript
var __freeze = Object.freeze;
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
var __template = (cooked, raw) => __freeze(__defProp(cooked, "raw", { value: __freeze(raw || cooked.slice()) }));
var _a, _b;
import { granHelper } from "../../utils/index.mjs";
import {
UiBase
} from "../web-component-base/index.mjs";
import { echoCss } from "./css.mjs";
import { echoHtml } from "./html.mjs";
import {
defaultFormatter
} from "./utils.mjs";
export const iconTypeList = ["date", "time", "datetime"];
export class Ele extends UiBase {
constructor() {
super(...arguments);
__publicField(this, "_render", super._genRenderFn(() => {
const { _els, iconType } = this;
_els.icon.setAttribute("icon-type", iconType);
_els.text.textContent = this._currentFormatter[iconType](
this.currentTime,
this._minmaxGran
);
}));
__publicField(this, "_currentFormatter", {
time: defaultFormatter.time,
date: defaultFormatter.date,
datetime: defaultFormatter.datetime
});
}
static get observedAttributes() {
return [
...super.observedAttributes,
"active",
"current-time",
"min-granularity",
"max-granularity"
];
}
get active() {
return this.hasAttribute("active");
}
set active(v) {
this.toggleAttribute("active", !!v);
}
get currentTime() {
const v = this._getAttr("current-time", "" + Date.now());
return new Date(Number.isNaN(+v) ? v : +v);
}
set currentTime(val) {
const v = new Date(val);
if (Number.isNaN(+v)) return;
this.setAttribute("current-time", +v + "");
}
get minGranularity() {
return this._getAttr("min-granularity");
}
set minGranularity(v) {
if (!granHelper.dateTime.has(v)) return;
this.setAttribute("min-granularity", v);
}
get maxGranularity() {
return this._getAttr("max-granularity");
}
set maxGranularity(v) {
if (!granHelper.dateTime.has(v)) return;
this.setAttribute("max-granularity", v);
}
get _minmaxGran() {
const [min, max] = granHelper.dateTime.minmax(
this.minGranularity,
this.maxGranularity
);
return { min, max };
}
get iconType() {
const { min, max } = this._minmaxGran;
if (granHelper.isDateGran(max) && granHelper.isDateGran(min))
return "date";
if (granHelper.isTimeGran(max) && granHelper.isTimeGran(min))
return "time";
return "datetime";
}
get _staticEls() {
return {
...super._staticEls,
icon: this.$0(_a || (_a = __template([".icon"]))),
text: this.$0(_b || (_b = __template([".text"])))
};
}
connectedCallback() {
if (!super.connectedCallback()) return;
this._render();
return true;
}
_onAttrChanged(name, oldValue, newValue) {
super._onAttrChanged(name, oldValue, newValue);
this._render();
}
/** 时分秒毫秒回显格式化函数。设置为 `null` 则重置为默认值 */
get timeFormatter() {
return this._currentFormatter.time;
}
set timeFormatter(fn) {
this._currentFormatter.time = typeof fn === "function" ? fn : defaultFormatter.time;
this._render();
}
/** 年月日回显格式化函数。设置为 `null` 则重置为默认值 */
get dateFormatter() {
return this._currentFormatter.date;
}
set dateFormatter(fn) {
this._currentFormatter.date = typeof fn === "function" ? fn : defaultFormatter.date;
this._render();
}
/** 日期时间回显格式化函数。设置为 `null` 则重置为默认值 */
get dateTimeFormatter() {
return this._currentFormatter.datetime;
}
set dateTimeFormatter(fn) {
this._currentFormatter.datetime = typeof fn === "function" ? fn : defaultFormatter.datetime;
this._render();
}
}
__publicField(Ele, "tagName", "dt-echo");
__publicField(Ele, "_style", echoCss);
__publicField(Ele, "_template", echoHtml);
Ele.define();