form-driver 0.4.26 → 0.4.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/m3.css +11 -3
- package/dist/m3.js +1 -1
- package/es/m3.css +11 -3
- package/es/m3.js +118 -118
- package/lib/m3.css +11 -3
- package/lib/m3.js +118 -119
- package/package.json +1 -1
- package/src/framework/MViewer.less +11 -3
- package/src/ui/editor/basic/ADatetimePicker.tsx +1 -1
- package/src/ui/editor/basic/ARangePicker.tsx +295 -179
- package/types/ui/editor/basic/ARangePicker.d.ts +3 -3
package/es/m3.css
CHANGED
|
@@ -38,12 +38,20 @@
|
|
|
38
38
|
.MEditor_p .AForm_removeBtn_disabled {
|
|
39
39
|
color: lightgray;
|
|
40
40
|
}
|
|
41
|
-
/** 回填字段的样式,例如日期选择/gb2260
|
|
41
|
+
/** 回填字段的样式,例如日期选择/gb2260选项下,与PC端一致的边框样式 */
|
|
42
42
|
.MEditor_p .backfill {
|
|
43
|
-
border
|
|
43
|
+
border: 1px solid #d9d9d9;
|
|
44
|
+
border-radius: 2px;
|
|
45
|
+
padding: 4px 11px;
|
|
46
|
+
line-height: 1.5715;
|
|
47
|
+
transition: all 0.3s;
|
|
44
48
|
}
|
|
45
49
|
.MEditor_p .backfill_empty {
|
|
46
|
-
border
|
|
50
|
+
border: 1px solid #d9d9d9;
|
|
51
|
+
border-radius: 2px;
|
|
52
|
+
padding: 4px 11px;
|
|
53
|
+
line-height: 1.5715;
|
|
54
|
+
transition: all 0.3s;
|
|
47
55
|
color: gray;
|
|
48
56
|
}
|
|
49
57
|
.MEditor_p input,
|
package/es/m3.js
CHANGED
|
@@ -20,7 +20,6 @@ import clsx from 'clsx';
|
|
|
20
20
|
import Button$1 from 'antd/lib/button';
|
|
21
21
|
import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
|
|
22
22
|
import zhCN$1 from 'antd/lib/date-picker/locale/zh_CN';
|
|
23
|
-
import ReactDOM from 'react-dom';
|
|
24
23
|
import debounce from 'lodash/debounce';
|
|
25
24
|
import 'moment/locale/zh-cn';
|
|
26
25
|
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
@@ -16740,7 +16739,7 @@ var ADatetimePicker = /*#__PURE__*/function (_BaseViewer) {
|
|
|
16740
16739
|
},
|
|
16741
16740
|
format: antConf.readableFormat,
|
|
16742
16741
|
style: {
|
|
16743
|
-
width: "
|
|
16742
|
+
width: "100%"
|
|
16744
16743
|
},
|
|
16745
16744
|
defaultValue: dataAsMoment,
|
|
16746
16745
|
showTime: antConf.showTime,
|
|
@@ -22945,7 +22944,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
22945
22944
|
ctrlVersion: 1,
|
|
22946
22945
|
noValidate: false,
|
|
22947
22946
|
mobileDlg: false,
|
|
22948
|
-
mobileStep:
|
|
22947
|
+
mobileStep: "start"
|
|
22949
22948
|
};
|
|
22950
22949
|
return _this;
|
|
22951
22950
|
}
|
|
@@ -22965,10 +22964,9 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
22965
22964
|
|
|
22966
22965
|
if (_.get(v, "[2]")) {
|
|
22967
22966
|
// tillnow
|
|
22968
|
-
var dom =
|
|
22967
|
+
var dom = this._pickerRef.current;
|
|
22969
22968
|
|
|
22970
22969
|
if (dom) {
|
|
22971
|
-
// @ts-ignore
|
|
22972
22970
|
var r = dom.querySelector(":nth-child(3)");
|
|
22973
22971
|
|
|
22974
22972
|
if (r) {
|
|
@@ -23022,19 +23020,19 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23022
23020
|
|
|
23023
23021
|
var show = MDateRangeType.toReadableN(assembly, this.props.schema, _Viewer.prototype.getValue.call(this)); // 根据 precision 配置确定移动端 DatePicker 精度(使用扁平化属性 dateRangePrecision)
|
|
23024
23022
|
|
|
23025
|
-
var mobilePrecision = this.props.schema.dateRangePrecision ||
|
|
23023
|
+
var mobilePrecision = this.props.schema.dateRangePrecision || "day";
|
|
23026
23024
|
return jsxs(Fragment, {
|
|
23027
23025
|
children: [jsxs("div", {
|
|
23028
23026
|
className: "backfill",
|
|
23029
23027
|
onClick: function onClick() {
|
|
23030
23028
|
return _this2.setState({
|
|
23031
23029
|
mobileDlg: true,
|
|
23032
|
-
mobileStep:
|
|
23030
|
+
mobileStep: "start"
|
|
23033
23031
|
});
|
|
23034
23032
|
},
|
|
23035
|
-
children: [" ", show != null ? show :
|
|
23033
|
+
children: [" ", show != null ? show : "请点击选择", " "]
|
|
23036
23034
|
}), jsx(DatePicker, {
|
|
23037
|
-
visible: this.state.mobileDlg && this.state.mobileStep ===
|
|
23035
|
+
visible: this.state.mobileDlg && this.state.mobileStep === "start",
|
|
23038
23036
|
precision: mobilePrecision,
|
|
23039
23037
|
title: "\u9009\u62E9\u5F00\u59CB\u65E5\u671F",
|
|
23040
23038
|
min: this.props.schema.min ? new Date(this.props.schema.min) : undefined,
|
|
@@ -23044,7 +23042,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23044
23042
|
|
|
23045
23043
|
_this2.setState({
|
|
23046
23044
|
mobileStartDate: val,
|
|
23047
|
-
mobileStep:
|
|
23045
|
+
mobileStep: "end"
|
|
23048
23046
|
});
|
|
23049
23047
|
},
|
|
23050
23048
|
onClose: function onClose() {
|
|
@@ -23060,14 +23058,14 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23060
23058
|
});
|
|
23061
23059
|
}
|
|
23062
23060
|
}, "start_" + mobilePrecision), jsx(DatePicker, {
|
|
23063
|
-
visible: this.state.mobileDlg && this.state.mobileStep ===
|
|
23061
|
+
visible: this.state.mobileDlg && this.state.mobileStep === "end",
|
|
23064
23062
|
precision: mobilePrecision,
|
|
23065
23063
|
title: // 如果允许"至今"且开始时间不在未来,在标题区域展示"至今"按钮
|
|
23066
23064
|
!((_this$props$schema$da3 = this.props.schema.dateRange) != null && _this$props$schema$da3.hideTillNow) && !(this.state.mobileStartDate && this.state.mobileStartDate > new Date()) ? jsxs("div", {
|
|
23067
23065
|
style: {
|
|
23068
|
-
display:
|
|
23069
|
-
alignItems:
|
|
23070
|
-
justifyContent:
|
|
23066
|
+
display: "flex",
|
|
23067
|
+
alignItems: "center",
|
|
23068
|
+
justifyContent: "center",
|
|
23071
23069
|
gap: 12
|
|
23072
23070
|
},
|
|
23073
23071
|
children: [jsx("span", {
|
|
@@ -23108,7 +23106,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23108
23106
|
onClose: function onClose() {
|
|
23109
23107
|
// 回退到第一步,让用户可以重新选择开始日期
|
|
23110
23108
|
_this2.setState({
|
|
23111
|
-
mobileStep:
|
|
23109
|
+
mobileStep: "start"
|
|
23112
23110
|
});
|
|
23113
23111
|
}
|
|
23114
23112
|
}, "end_" + mobilePrecision)]
|
|
@@ -23118,23 +23116,23 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23118
23116
|
|
|
23119
23117
|
// 根据 precision 配置确定 PC 端 picker 模式和 showTime(使用扁平化属性 dateRangePrecision)
|
|
23120
23118
|
var precision = this.props.schema.dateRangePrecision;
|
|
23121
|
-
var pcShowTime = precision ===
|
|
23119
|
+
var pcShowTime = precision === "minute" || ((_this$props$schema$da4 = this.props.schema.dateRange) == null ? void 0 : _this$props$schema$da4.showTime);
|
|
23122
23120
|
var hideFooter = (_this$props$schema$da5 = this.props.schema.dateRange) == null ? void 0 : _this$props$schema$da5.hideTillNow; // 动态构建额外属性,避免 showTime 和 picker 同时传入导致类型冲突
|
|
23123
23121
|
|
|
23124
23122
|
var extraProps = {};
|
|
23125
23123
|
|
|
23126
|
-
if (precision ===
|
|
23127
|
-
extraProps.picker =
|
|
23128
|
-
} else if (precision ===
|
|
23129
|
-
extraProps.picker =
|
|
23124
|
+
if (precision === "year") {
|
|
23125
|
+
extraProps.picker = "year";
|
|
23126
|
+
} else if (precision === "month") {
|
|
23127
|
+
extraProps.picker = "month";
|
|
23130
23128
|
} else if (pcShowTime) {
|
|
23131
23129
|
// precision 为 minute 时只展示时分,不展示秒
|
|
23132
|
-
extraProps.showTime = precision ===
|
|
23133
|
-
format:
|
|
23130
|
+
extraProps.showTime = precision === "minute" ? {
|
|
23131
|
+
format: "HH:mm"
|
|
23134
23132
|
} : true; // 同步设置输入框的显示格式,避免 showTime.format 只影响面板列而输入框仍显示秒
|
|
23135
23133
|
|
|
23136
|
-
if (precision ===
|
|
23137
|
-
extraProps.format =
|
|
23134
|
+
if (precision === "minute") {
|
|
23135
|
+
extraProps.format = "YYYY-MM-DD HH:mm";
|
|
23138
23136
|
}
|
|
23139
23137
|
} // "至今"按钮的点击处理函数
|
|
23140
23138
|
|
|
@@ -23158,124 +23156,126 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
|
|
|
23158
23156
|
|
|
23159
23157
|
var showTillNow = !hideFooter; // 构造元素
|
|
23160
23158
|
|
|
23161
|
-
return jsx(
|
|
23159
|
+
return jsx("div", {
|
|
23162
23160
|
ref: this._pickerRef,
|
|
23163
|
-
|
|
23164
|
-
|
|
23165
|
-
|
|
23166
|
-
|
|
23167
|
-
|
|
23168
|
-
|
|
23169
|
-
|
|
23161
|
+
children: jsx(DatePicker$1.RangePicker, _objectSpread$8({
|
|
23162
|
+
panelRender: pcShowTime && showTillNow ? function (panelNode) {
|
|
23163
|
+
// showTime 模式下:通过事件委托捕获面板上日期单元格的点击
|
|
23164
|
+
// 同时在 footer 的"确定"按钮同一行注入"至今"按钮
|
|
23165
|
+
return jsx("div", {
|
|
23166
|
+
onClick: function onClick(e) {
|
|
23167
|
+
var target = e.target;
|
|
23168
|
+
var cell = target.closest == null ? void 0 : target.closest(".ant-picker-cell");
|
|
23170
23169
|
|
|
23171
|
-
|
|
23172
|
-
|
|
23173
|
-
|
|
23174
|
-
|
|
23170
|
+
if (cell) {
|
|
23171
|
+
// 排除 disabled 状态的日期单元格
|
|
23172
|
+
if (cell.classList.contains("ant-picker-cell-disabled")) return;
|
|
23173
|
+
var title = cell.getAttribute("title");
|
|
23175
23174
|
|
|
23176
|
-
|
|
23177
|
-
|
|
23175
|
+
if (title) {
|
|
23176
|
+
var parsed = moment(title, "YYYY-MM-DD"); // 校验 moment 解析有效性,无效日期不记录
|
|
23178
23177
|
|
|
23179
|
-
|
|
23180
|
-
|
|
23178
|
+
if (parsed.isValid()) {
|
|
23179
|
+
_this2._panelClickedDate = parsed;
|
|
23180
|
+
}
|
|
23181
23181
|
}
|
|
23182
23182
|
}
|
|
23183
|
-
}
|
|
23184
|
-
|
|
23185
|
-
|
|
23186
|
-
var _ref3, _this2$_onCalendarCha2, _this2$_onCalendarCha3;
|
|
23183
|
+
},
|
|
23184
|
+
ref: function ref(el) {
|
|
23185
|
+
var _ref3, _this2$_onCalendarCha2, _this2$_onCalendarCha3;
|
|
23187
23186
|
|
|
23188
|
-
|
|
23189
|
-
|
|
23190
|
-
|
|
23191
|
-
|
|
23192
|
-
|
|
23187
|
+
// 面板渲染后,将"至今"按钮注入到 .ant-picker-ok 内部,确定按钮之后
|
|
23188
|
+
// 这样两者在同一个 flex item 中,确定在左、至今在右
|
|
23189
|
+
if (!el) return;
|
|
23190
|
+
var okLi = el.querySelector(".ant-picker-ok");
|
|
23191
|
+
if (!okLi) return; // 开始时间在未来时,移除已有的至今按钮并不再注入
|
|
23193
23192
|
|
|
23194
|
-
|
|
23193
|
+
var previewStart = (_ref3 = (_this2$_onCalendarCha2 = (_this2$_onCalendarCha3 = _this2._onCalendarChangeValue) == null ? void 0 : _this2$_onCalendarCha3[0]) != null ? _this2$_onCalendarCha2 : _this2._panelClickedDate) != null ? _ref3 : rangePickerData == null ? void 0 : rangePickerData[0];
|
|
23195
23194
|
|
|
23196
|
-
|
|
23197
|
-
|
|
23198
|
-
|
|
23199
|
-
|
|
23200
|
-
|
|
23195
|
+
if (previewStart && previewStart.isAfter(moment())) {
|
|
23196
|
+
var existingBtn = okLi.querySelector(".till-now-btn");
|
|
23197
|
+
if (existingBtn) existingBtn.remove();
|
|
23198
|
+
return;
|
|
23199
|
+
}
|
|
23201
23200
|
|
|
23202
|
-
|
|
23203
|
-
|
|
23204
|
-
|
|
23205
|
-
|
|
23206
|
-
|
|
23201
|
+
if (!okLi.querySelector(".till-now-btn")) {
|
|
23202
|
+
var tillNowBtn = document.createElement("button");
|
|
23203
|
+
tillNowBtn.className = "ant-btn ant-btn-sm till-now-btn";
|
|
23204
|
+
tillNowBtn.textContent = "至今";
|
|
23205
|
+
tillNowBtn.style.cssText = "margin-left: 8px;"; // 使用具名函数以便于清理;先移除可能的旧监听再添加,防止重复绑定
|
|
23207
23206
|
|
|
23208
|
-
|
|
23209
|
-
|
|
23210
|
-
|
|
23211
|
-
|
|
23207
|
+
var onTillNowClick = function onTillNowClick(e) {
|
|
23208
|
+
e.stopPropagation();
|
|
23209
|
+
handleTillNow();
|
|
23210
|
+
};
|
|
23212
23211
|
|
|
23213
|
-
|
|
23214
|
-
|
|
23215
|
-
|
|
23216
|
-
|
|
23217
|
-
|
|
23218
|
-
|
|
23219
|
-
|
|
23220
|
-
|
|
23221
|
-
|
|
23212
|
+
tillNowBtn.addEventListener("click", onTillNowClick);
|
|
23213
|
+
okLi.appendChild(tillNowBtn);
|
|
23214
|
+
}
|
|
23215
|
+
},
|
|
23216
|
+
children: panelNode
|
|
23217
|
+
});
|
|
23218
|
+
} : undefined,
|
|
23219
|
+
renderExtraFooter: !pcShowTime && showTillNow ? function (mode) {
|
|
23220
|
+
var _this2$_onCalendarCha4, _this2$_onCalendarCha5;
|
|
23222
23221
|
|
|
23223
|
-
|
|
23224
|
-
|
|
23222
|
+
// 非 showTime 模式:使用 renderExtraFooter 展示"至今"按钮
|
|
23223
|
+
var previewStart = (_this2$_onCalendarCha4 = (_this2$_onCalendarCha5 = _this2._onCalendarChangeValue) == null ? void 0 : _this2$_onCalendarCha5[0]) != null ? _this2$_onCalendarCha4 : rangePickerData == null ? void 0 : rangePickerData[0];
|
|
23225
23224
|
|
|
23226
|
-
|
|
23227
|
-
|
|
23228
|
-
|
|
23225
|
+
if (previewStart && previewStart.isAfter(moment())) {
|
|
23226
|
+
return null;
|
|
23227
|
+
}
|
|
23229
23228
|
|
|
23230
|
-
|
|
23231
|
-
style: {
|
|
23232
|
-
textAlign: "right"
|
|
23233
|
-
},
|
|
23234
|
-
children: jsx(Button, {
|
|
23235
|
-
size: "small",
|
|
23229
|
+
return jsx("div", {
|
|
23236
23230
|
style: {
|
|
23237
|
-
|
|
23238
|
-
display: "inline-block",
|
|
23239
|
-
marginTop: "5px"
|
|
23231
|
+
textAlign: "right"
|
|
23240
23232
|
},
|
|
23241
|
-
|
|
23242
|
-
|
|
23243
|
-
|
|
23244
|
-
|
|
23245
|
-
|
|
23246
|
-
|
|
23247
|
-
|
|
23248
|
-
|
|
23249
|
-
|
|
23250
|
-
|
|
23251
|
-
|
|
23252
|
-
|
|
23253
|
-
|
|
23233
|
+
children: jsx(Button, {
|
|
23234
|
+
size: "small",
|
|
23235
|
+
style: {
|
|
23236
|
+
width: "100px",
|
|
23237
|
+
display: "inline-block",
|
|
23238
|
+
marginTop: "5px"
|
|
23239
|
+
},
|
|
23240
|
+
onClick: handleTillNow,
|
|
23241
|
+
children: "\u81F3\u4ECA"
|
|
23242
|
+
})
|
|
23243
|
+
});
|
|
23244
|
+
} : undefined,
|
|
23245
|
+
bordered: this.props.hideBorder ? false : true,
|
|
23246
|
+
style: {
|
|
23247
|
+
width: "100%"
|
|
23248
|
+
},
|
|
23249
|
+
locale: zhCN$1,
|
|
23250
|
+
defaultValue: rangePickerData,
|
|
23251
|
+
onCalendarChange: function onCalendarChange(d) {
|
|
23252
|
+
_this2._onCalendarChangeValue = d; // 用户开始新一轮选择时清理面板点击缓存,避免上一轮过时数据污染
|
|
23254
23253
|
|
|
23255
|
-
_this2._panelClickedDate = null;
|
|
23256
|
-
},
|
|
23257
|
-
onOpenChange: function onOpenChange(open) {
|
|
23258
|
-
if (!open) {
|
|
23259
23254
|
_this2._panelClickedDate = null;
|
|
23260
|
-
}
|
|
23261
|
-
|
|
23262
|
-
|
|
23263
|
-
|
|
23264
|
-
|
|
23265
|
-
|
|
23255
|
+
},
|
|
23256
|
+
onOpenChange: function onOpenChange(open) {
|
|
23257
|
+
if (!open) {
|
|
23258
|
+
_this2._panelClickedDate = null;
|
|
23259
|
+
}
|
|
23260
|
+
},
|
|
23261
|
+
onChange: function onChange(vv) {
|
|
23262
|
+
// 用户清空日期范围时,直接置空
|
|
23263
|
+
if (!vv) {
|
|
23264
|
+
_Viewer.prototype.changeValueEx.call(_this2, undefined, true, true);
|
|
23266
23265
|
|
|
23267
|
-
|
|
23268
|
-
|
|
23266
|
+
return;
|
|
23267
|
+
}
|
|
23269
23268
|
|
|
23270
|
-
|
|
23269
|
+
var currentData = _Viewer.prototype.getValue.call(_this2);
|
|
23271
23270
|
|
|
23272
|
-
|
|
23271
|
+
var isTillNow = _.get(currentData, "[2]") === true; // 若当前是"至今"且用户只改了开始时间(结束时间仍为 null),保留 tillNow
|
|
23273
23272
|
|
|
23274
|
-
|
|
23273
|
+
var newTillNow = isTillNow && vv[1] == null;
|
|
23275
23274
|
|
|
23276
|
-
|
|
23277
|
-
|
|
23278
|
-
|
|
23275
|
+
_Viewer.prototype.changeValueEx.call(_this2, _this2._rangePicker2Data(vv, newTillNow), true, true);
|
|
23276
|
+
}
|
|
23277
|
+
}, extraProps), this.state.ctrlVersion + "_" + ((_this$props$schema$da6 = this.props.schema.dateRangePrecision) != null ? _this$props$schema$da6 : "day"))
|
|
23278
|
+
});
|
|
23279
23279
|
}
|
|
23280
23280
|
};
|
|
23281
23281
|
|
package/lib/m3.css
CHANGED
|
@@ -38,12 +38,20 @@
|
|
|
38
38
|
.MEditor_p .AForm_removeBtn_disabled {
|
|
39
39
|
color: lightgray;
|
|
40
40
|
}
|
|
41
|
-
/** 回填字段的样式,例如日期选择/gb2260
|
|
41
|
+
/** 回填字段的样式,例如日期选择/gb2260选项下,与PC端一致的边框样式 */
|
|
42
42
|
.MEditor_p .backfill {
|
|
43
|
-
border
|
|
43
|
+
border: 1px solid #d9d9d9;
|
|
44
|
+
border-radius: 2px;
|
|
45
|
+
padding: 4px 11px;
|
|
46
|
+
line-height: 1.5715;
|
|
47
|
+
transition: all 0.3s;
|
|
44
48
|
}
|
|
45
49
|
.MEditor_p .backfill_empty {
|
|
46
|
-
border
|
|
50
|
+
border: 1px solid #d9d9d9;
|
|
51
|
+
border-radius: 2px;
|
|
52
|
+
padding: 4px 11px;
|
|
53
|
+
line-height: 1.5715;
|
|
54
|
+
transition: all 0.3s;
|
|
47
55
|
color: gray;
|
|
48
56
|
}
|
|
49
57
|
.MEditor_p input,
|