element()

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)
        }} />;
    }