forked from fanruan/fineui
Zhenfei.Li
2 years ago
6 changed files with 493 additions and 490 deletions
@ -1,94 +1,102 @@
|
||||
!(function () { |
||||
BI.TimePopup = BI.inherit(BI.Widget, { |
||||
props: { |
||||
import { shortcut, Widget, i18nText, CenterAdaptLayout, GridLayout, isNull, isEmptyObject, isEmptyString } from "@/core"; |
||||
import { TextButton } from "@/base"; |
||||
import { DynamicDateTimeSelect } from "../dynamicdatetime"; |
||||
|
||||
@shortcut() |
||||
export class TimePopup extends Widget { |
||||
static xtype = "bi.time_popup" |
||||
|
||||
props = { |
||||
baseCls: "bi-date-time-popup", |
||||
height: 68 |
||||
}, |
||||
render: function () { |
||||
var self = this, o = this.options; |
||||
height: 68, |
||||
}; |
||||
|
||||
static BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE" |
||||
static BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE" |
||||
static BUTTON_NOW_EVENT_CHANGE = "BUTTON_NOW_EVENT_CHANGE" |
||||
static CALENDAR_EVENT_CHANGE = "CALENDAR_EVENT_CHANGE" |
||||
|
||||
render() { |
||||
const o = this.options; |
||||
|
||||
return { |
||||
type: "bi.vtape", |
||||
items: [{ |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
type: CenterAdaptLayout.xtype, |
||||
cls: "bi-split-top", |
||||
items: [{ |
||||
type: "bi.dynamic_date_time_select", |
||||
type: DynamicDateTimeSelect.xtype, |
||||
value: o.value, |
||||
ref: function (_ref) { |
||||
self.timeSelect = _ref; |
||||
} |
||||
}] |
||||
ref: _ref => { |
||||
this.timeSelect = _ref; |
||||
}, |
||||
}], |
||||
}, |
||||
hgap: 10, |
||||
height: 44 |
||||
height: 44, |
||||
}, { |
||||
el: { |
||||
type: "bi.grid", |
||||
items: [[{ |
||||
type: "bi.text_button", |
||||
type: GridLayout.xtype, |
||||
items: [ |
||||
[{ |
||||
type: TextButton.xtype, |
||||
cls: "bi-high-light bi-split-top", |
||||
shadow: true, |
||||
text: BI.i18nText("BI-Basic_Clears"), |
||||
text: i18nText("BI-Basic_Clears"), |
||||
listeners: [{ |
||||
eventName: BI.TextButton.EVENT_CHANGE, |
||||
action: function () { |
||||
self.fireEvent(BI.TimePopup.BUTTON_CLEAR_EVENT_CHANGE); |
||||
} |
||||
}] |
||||
eventName: TextButton.EVENT_CHANGE, |
||||
action: () => { |
||||
this.fireEvent(TimePopup.BUTTON_CLEAR_EVENT_CHANGE); |
||||
}, |
||||
}], |
||||
}, { |
||||
type: "bi.text_button", |
||||
type: TextButton.xtype, |
||||
cls: "bi-split-left bi-split-right bi-high-light bi-split-top", |
||||
shadow: true, |
||||
text: BI.i18nText("BI-Basic_Now"), |
||||
text: i18nText("BI-Basic_Now"), |
||||
listeners: [{ |
||||
eventName: BI.TextButton.EVENT_CHANGE, |
||||
action: function () { |
||||
self.fireEvent(BI.TimePopup.BUTTON_NOW_EVENT_CHANGE); |
||||
} |
||||
}] |
||||
eventName: TextButton.EVENT_CHANGE, |
||||
action: () => { |
||||
this.fireEvent(TimePopup.BUTTON_NOW_EVENT_CHANGE); |
||||
}, |
||||
}], |
||||
}, { |
||||
type: "bi.text_button", |
||||
type: TextButton.xtype, |
||||
cls: "bi-high-light bi-split-top", |
||||
shadow: true, |
||||
text: BI.i18nText("BI-Basic_OK"), |
||||
text: i18nText("BI-Basic_OK"), |
||||
listeners: [{ |
||||
eventName: BI.TextButton.EVENT_CHANGE, |
||||
action: function () { |
||||
self.fireEvent(BI.TimePopup.BUTTON_OK_EVENT_CHANGE); |
||||
} |
||||
}] |
||||
}]] |
||||
eventName: TextButton.EVENT_CHANGE, |
||||
action: () => { |
||||
this.fireEvent(TimePopup.BUTTON_OK_EVENT_CHANGE); |
||||
}, |
||||
height: 24 |
||||
}], |
||||
}] |
||||
}; |
||||
], |
||||
}, |
||||
height: 24, |
||||
}], |
||||
}; |
||||
} |
||||
|
||||
setValue: function (value) { |
||||
setValue(value) { |
||||
if (this._checkValueValid(value)) { |
||||
this.timeSelect.setValue(); |
||||
} else { |
||||
this.timeSelect.setValue({ |
||||
hour: value.hour, |
||||
minute: value.minute, |
||||
second: value.second |
||||
second: value.second, |
||||
}); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.timeSelect.getValue(); |
||||
}, |
||||
} |
||||
|
||||
_checkValueValid: function (value) { |
||||
return BI.isNull(value) || BI.isEmptyObject(value) || BI.isEmptyString(value); |
||||
_checkValueValid(value) { |
||||
return isNull(value) || isEmptyObject(value) || isEmptyString(value); |
||||
} |
||||
}); |
||||
BI.TimePopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE"; |
||||
BI.TimePopup.BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE"; |
||||
BI.TimePopup.BUTTON_NOW_EVENT_CHANGE = "BUTTON_NOW_EVENT_CHANGE"; |
||||
BI.TimePopup.CALENDAR_EVENT_CHANGE = "CALENDAR_EVENT_CHANGE"; |
||||
BI.shortcut("bi.time_popup", BI.TimePopup); |
||||
})(); |
||||
} |
||||
|
||||
@ -0,0 +1,3 @@
|
||||
export { TimePopup } from "./datetime.popup"; |
||||
export { TimeCombo } from "./time.combo"; |
||||
export { TimeTrigger } from "./time.trigger"; |
||||
@ -1,202 +1,193 @@
|
||||
!(function () { |
||||
BI.TimeTrigger = BI.inherit(BI.Trigger, { |
||||
import { shortcut, i18nText, bind, isNotNull, isNotEmptyString, isEqual, AbsoluteLayout, any, print, parseDateTime, isEmptyObject, getDate, isNotEmptyObject } from "@/core"; |
||||
import { Trigger, Text } from "@/base"; |
||||
import { SignEditor } from "@/case"; |
||||
|
||||
_const: { |
||||
@shortcut() |
||||
export class TimeTrigger extends Trigger { |
||||
static xtype = "bi.time_trigger" |
||||
|
||||
_const = { |
||||
COMPARE_FORMAT: "%H:%M:%S", |
||||
COMPLETE_COMPARE_FORMAT: "%Y-%M-%d %H:%M:%S %P", |
||||
FORMAT_ARRAY: [ |
||||
"%H:%M:%S", // HH:mm:ss
|
||||
"%I:%M:%S", // hh:mm:ss
|
||||
"%l:%M:%S", // h:mm:ss
|
||||
"%k:%M:%S", // H:mm:ss
|
||||
"%l:%M:%S %p", // h:mm:ss a
|
||||
"%l:%M:%S %P", // h:mm:ss a
|
||||
"%H:%M:%S %p", // HH:mm:ss a
|
||||
"%H:%M:%S %P", // HH:mm:ss a
|
||||
"%l:%M", // h:mm
|
||||
"%k:%M", // H:mm
|
||||
"%I:%M", // hh:mm
|
||||
"%H:%M", // HH:mm
|
||||
"%M:%S" // mm:ss
|
||||
], |
||||
FORMAT_ARRAY: ["%H:%M:%S", "%I:%M:%S", "%l:%M:%S", "%k:%M:%S", "%l:%M:%S %p", "%l:%M:%S %P", "%H:%M:%S %p", "%H:%M:%S %P", "%l:%M", "%k:%M", "%I:%M", "%H:%M", "%M:%S"], |
||||
DEFAULT_DATE_STRING: "2000-01-01", |
||||
DEFAULT_HOUR: "00" |
||||
}, |
||||
DEFAULT_HOUR: "00", |
||||
}; |
||||
|
||||
props: () => ({ |
||||
props() { |
||||
return { |
||||
extraCls: "bi-time-trigger", |
||||
value: {}, |
||||
format: "", |
||||
allowEdit: false, |
||||
watermark: BI.i18nText("BI-Basic_Unrestricted"), |
||||
}), |
||||
watermark: i18nText("BI-Basic_Unrestricted"), |
||||
}; |
||||
} |
||||
|
||||
render: function () { |
||||
var self = this, o = this.options; |
||||
render() { |
||||
const o = this.options; |
||||
this.storeTriggerValue = ""; |
||||
this.storeValue = o.value; |
||||
|
||||
return { |
||||
type: "bi.absolute", |
||||
type: AbsoluteLayout.xtype, |
||||
items: [{ |
||||
el: { |
||||
type: "bi.sign_editor", |
||||
type: SignEditor.xtype, |
||||
height: o.height, |
||||
validationChecker: function (v) { |
||||
return self._dateCheck(v); |
||||
}, |
||||
quitChecker: function () { |
||||
validationChecker: v => this._dateCheck(v), |
||||
quitChecker () { |
||||
return false; |
||||
}, |
||||
ref: function (_ref) { |
||||
self.editor = _ref; |
||||
ref: _ref => { |
||||
this.editor = _ref; |
||||
}, |
||||
value: this._formatValue(o.value), |
||||
hgap: 4, |
||||
allowBlank: true, |
||||
watermark: o.watermark, |
||||
title: BI.bind(this._getTitle, this), |
||||
title: bind(this._getTitle, this), |
||||
listeners: [{ |
||||
eventName: "EVENT_KEY_DOWN", |
||||
action: function () { |
||||
self.fireEvent("EVENT_KEY_DOWN", arguments); |
||||
} |
||||
action: (...args) => { |
||||
this.fireEvent("EVENT_KEY_DOWN", ...args); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_FOCUS", |
||||
action: function () { |
||||
self.storeTriggerValue = self.getKey(); |
||||
self.fireEvent("EVENT_FOCUS"); |
||||
} |
||||
action: () => { |
||||
this.storeTriggerValue = this.getKey(); |
||||
this.fireEvent("EVENT_FOCUS"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_BLUR", |
||||
action: function () { |
||||
self.fireEvent("EVENT_BLUR"); |
||||
} |
||||
action: () => { |
||||
this.fireEvent("EVENT_BLUR"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_STOP", |
||||
action: function () { |
||||
self.fireEvent("EVENT_STOP"); |
||||
} |
||||
action: () => { |
||||
this.fireEvent("EVENT_STOP"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_VALID", |
||||
action: function () { |
||||
self.fireEvent("EVENT_VALID"); |
||||
} |
||||
action: () => { |
||||
this.fireEvent("EVENT_VALID"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_ERROR", |
||||
action: function () { |
||||
self.fireEvent("EVENT_ERROR"); |
||||
} |
||||
action: () => { |
||||
this.fireEvent("EVENT_ERROR"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_CONFIRM", |
||||
action: function () { |
||||
var value = self.editor.getValue(); |
||||
if (BI.isNotNull(value)) { |
||||
self.editor.setState(value); |
||||
} |
||||
if (BI.isNotEmptyString(value) && !BI.isEqual(self.storeTriggerValue, self.getKey())) { |
||||
var date = value.match(/\d+/g); |
||||
self.storeValue = { |
||||
action: () => { |
||||
const value = this.editor.getValue(); |
||||
if (isNotNull(value)) { |
||||
this.editor.setState(value); |
||||
} |
||||
if (isNotEmptyString(value) && !isEqual(this.storeTriggerValue, this.getKey())) { |
||||
const date = value.match(/\d+/g); |
||||
this.storeValue = { |
||||
hour: date[0] | 0, |
||||
minute: date[1] | 0, |
||||
second: date[2] | 0 |
||||
second: date[2] | 0, |
||||
}; |
||||
} |
||||
self.fireEvent("EVENT_CONFIRM"); |
||||
} |
||||
this.fireEvent("EVENT_CONFIRM"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_START", |
||||
action: function () { |
||||
self.fireEvent("EVENT_START"); |
||||
} |
||||
action: () => { |
||||
this.fireEvent("EVENT_START"); |
||||
}, |
||||
}, { |
||||
eventName: "EVENT_CHANGE", |
||||
action: function () { |
||||
self.fireEvent("EVENT_CHANGE"); |
||||
} |
||||
}] |
||||
action: () => { |
||||
this.fireEvent("EVENT_CHANGE"); |
||||
}, |
||||
}], |
||||
}, |
||||
left: 0, |
||||
right: 0, |
||||
top: 0, |
||||
bottom: 0 |
||||
bottom: 0, |
||||
}, { |
||||
el: { |
||||
type: "bi.text", |
||||
type: Text.xtype, |
||||
invisible: o.allowEdit, |
||||
cls: "show-text", |
||||
title: BI.bind(this._getTitle, this), |
||||
hgap: 4 |
||||
title: bind(this._getTitle, this), |
||||
hgap: 4, |
||||
}, |
||||
left: 0, |
||||
right: 0, |
||||
top: 0, |
||||
bottom: 0 |
||||
}] |
||||
bottom: 0, |
||||
}], |
||||
}; |
||||
}, |
||||
} |
||||
|
||||
_dateCheck: function (date) { |
||||
var c = this._const; |
||||
var self = this; |
||||
return BI.any(c.FORMAT_ARRAY, function (idx, format) { |
||||
return BI.print(BI.parseDateTime(c.DEFAULT_DATE_STRING + " " + self._getCompleteHMS(date, format), c.COMPLETE_COMPARE_FORMAT), format) === date; |
||||
}); |
||||
}, |
||||
_dateCheck(date) { |
||||
const c = this._const; |
||||
|
||||
_getCompleteHMS: function (str, format) { |
||||
var c = this._const; |
||||
return any(c.FORMAT_ARRAY, (idx, format) => print(parseDateTime(`${c.DEFAULT_DATE_STRING} ${this._getCompleteHMS(date, format)}`, c.COMPLETE_COMPARE_FORMAT), format) === date); |
||||
} |
||||
|
||||
_getCompleteHMS(str, format) { |
||||
const c = this._const; |
||||
switch (format) { |
||||
case "%M:%S": |
||||
str = c.DEFAULT_HOUR + ":" + str; |
||||
str = `${c.DEFAULT_HOUR}:${str}`; |
||||
break; |
||||
default: |
||||
break; |
||||
} |
||||
|
||||
return str; |
||||
}, |
||||
} |
||||
|
||||
_getTitle: function () { |
||||
var storeValue = this.storeValue || {}; |
||||
if (BI.isEmptyObject(storeValue)) { |
||||
_getTitle() { |
||||
const storeValue = this.storeValue || {}; |
||||
if (isEmptyObject(storeValue)) { |
||||
return this.options.watermark; |
||||
} |
||||
var date = BI.getDate(); |
||||
return BI.print(BI.getDate(date.getFullYear(), 0, 1, storeValue.hour, storeValue.minute, storeValue.second), this._getFormatString()); |
||||
}, |
||||
const date = getDate(); |
||||
|
||||
_getFormatString: function () { |
||||
return print(getDate(date.getFullYear(), 0, 1, storeValue.hour, storeValue.minute, storeValue.second), this._getFormatString()); |
||||
} |
||||
|
||||
_getFormatString() { |
||||
return this.options.format || this._const.COMPARE_FORMAT; |
||||
}, |
||||
} |
||||
|
||||
_formatValue: function (v) { |
||||
var now = BI.getDate(); |
||||
return BI.isNotEmptyObject(v) ? BI.print(BI.getDate(now.getFullYear(), now.getMonth(), now.getDay(), v.hour, v.minute, v.second), this._getFormatString()) : ""; |
||||
}, |
||||
_formatValue(v) { |
||||
const now = getDate(); |
||||
|
||||
return isNotEmptyObject(v) ? print(getDate(now.getFullYear(), now.getMonth(), now.getDay(), v.hour, v.minute, v.second), this._getFormatString()) : ""; |
||||
} |
||||
|
||||
getKey: function () { |
||||
getKey() { |
||||
return this.editor.getValue(); |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
setValue(v) { |
||||
this.storeValue = v; |
||||
this.editor.setValue(this._formatValue(v)); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.storeValue; |
||||
}, |
||||
} |
||||
|
||||
focus: function () { |
||||
focus() { |
||||
this.editor.focus(); |
||||
}, |
||||
} |
||||
|
||||
blur: function () { |
||||
blur() { |
||||
this.editor.blur(); |
||||
}, |
||||
} |
||||
|
||||
setWaterMark: function (v) { |
||||
setWaterMark(v) { |
||||
this.editor.setWaterMark(v); |
||||
} |
||||
}); |
||||
BI.shortcut("bi.time_trigger", BI.TimeTrigger); |
||||
})(); |
||||
} |
||||
|
||||
Loading…
Reference in new issue