in src/ui/editor/basic/ARangePicker.tsx [80:127]
element() {
const p = this.props.schema.props ?? {};
let rangePickerData = this._data2rangePicker(this.getValue() ?? []);
if (MUtil.phoneLike()) {
let show = MDateRangeType.toReadableN(assembly, this.props.schema, super.getValue());
return <>
<div className="backfill" onClick={() => this.setState({ mobileDlg: true })}> {show ?? '请点击选择'} </div>
<Calendar
visible={this.state.mobileDlg}
pickTime={this.props.schema.dateRange?.showTime}
minDate={this.props.schema.min ? new Date(this.props.schema.min) : undefined}
maxDate={this.props.schema.min ? new Date(this.props.schema.max) : undefined}
onCancel={() => this.setState({ mobileDlg: false })}
onConfirm={(start, end) => {
super.changeValueEx(this._rangePicker2Data([moment(start), moment(end)], false), true, true)
this.setState({ mobileDlg: false })
}}
{...p}
/>
</>
} else {
// 构造元素
return <DatePicker.RangePicker
ref={this._pickerRef}
showTime={this.props.schema.dateRange?.showTime}
key={this.state.ctrlVersion}
renderExtraFooter={this.props.schema.dateRange?.hideTillNow || this.props.schema.dateRange?.showTime // TODO 显示时间时,“至今”无法支持
? undefined
: (mode) => <div style={{ textAlign: "right" }} {...p}>
<Button
size="small" style={{ width: "100px", display: "inline-block", marginTop: "5px" }}
onClick={() => {
super.changeValueEx(this._rangePicker2Data(this._onCalendarChangeValue, true), true, true);
}}>至今</Button>
</div>
}
bordered={this.props.hideBorder ? false : true}
style={{ minWidth: "240px" }}
locale={zhCN}
defaultValue={rangePickerData}
onCalendarChange={(d) => {
this._onCalendarChangeValue = d;
}}
onChange={(vv) => {
super.changeValueEx(this._rangePicker2Data(vv, false), true, true)
}} />;
}