form-driver 0.4.26 → 0.4.28

package/lib/m3.js

@@ -24,7 +24,6 @@ var clsx = require('clsx');
 var Button = require('antd/lib/button');
 var _objectWithoutPropertiesLoose = require('@babel/runtime/helpers/objectWithoutPropertiesLoose');
 var zhCN$1 = require('antd/lib/date-picker/locale/zh_CN');
-var ReactDOM = require('react-dom');
 var debounce = require('lodash/debounce');
 require('moment/locale/zh-cn');
 var _extends = require('@babel/runtime/helpers/extends');
@@ -46,7 +45,6 @@ var clsx__default = /*#__PURE__*/_interopDefaultLegacy(clsx);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
 var zhCN__default$1 = /*#__PURE__*/_interopDefaultLegacy(zhCN$1);
-var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var OSS__default = /*#__PURE__*/_interopDefaultLegacy(OSS);
@@ -16765,7 +16763,7 @@ var ADatetimePicker = /*#__PURE__*/function (_BaseViewer) {
           },
           format: antConf.readableFormat,
           style: {
-            width: "300px"
+            width: "100%"
           },
           defaultValue: dataAsMoment,
           showTime: antConf.showTime,
@@ -22970,7 +22968,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
       ctrlVersion: 1,
       noValidate: false,
       mobileDlg: false,
-      mobileStep: 'start'
+      mobileStep: "start"
     };
     return _this;
   }
@@ -22990,10 +22988,9 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
 
     if (___default["default"].get(v, "[2]")) {
       // tillnow
-      var dom = ReactDOM__default["default"].findDOMNode(this._pickerRef.current);
+      var dom = this._pickerRef.current;
 
       if (dom) {
-        // @ts-ignore
         var r = dom.querySelector(":nth-child(3)");
 
         if (r) {
@@ -23047,19 +23044,19 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
 
       var show = MDateRangeType.toReadableN(assembly, this.props.schema, _Viewer.prototype.getValue.call(this)); // 根据 precision 配置确定移动端 DatePicker 精度（使用扁平化属性 dateRangePrecision）
 
-      var mobilePrecision = this.props.schema.dateRangePrecision || 'day';
+      var mobilePrecision = this.props.schema.dateRangePrecision || "day";
       return jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [jsxRuntime.jsxs("div", {
           className: "backfill",
           onClick: function onClick() {
             return _this2.setState({
               mobileDlg: true,
-              mobileStep: 'start'
+              mobileStep: "start"
             });
           },
-          children: [" ", show != null ? show : '请点击选择', " "]
+          children: [" ", show != null ? show : "请点击选择", " "]
         }), jsxRuntime.jsx(antdMobile.DatePicker, {
-          visible: this.state.mobileDlg && this.state.mobileStep === 'start',
+          visible: this.state.mobileDlg && this.state.mobileStep === "start",
           precision: mobilePrecision,
           title: "\u9009\u62E9\u5F00\u59CB\u65E5\u671F",
           min: this.props.schema.min ? new Date(this.props.schema.min) : undefined,
@@ -23069,7 +23066,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
 
             _this2.setState({
               mobileStartDate: val,
-              mobileStep: 'end'
+              mobileStep: "end"
             });
           },
           onClose: function onClose() {
@@ -23085,14 +23082,14 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
             });
           }
         }, "start_" + mobilePrecision), jsxRuntime.jsx(antdMobile.DatePicker, {
-          visible: this.state.mobileDlg && this.state.mobileStep === 'end',
+          visible: this.state.mobileDlg && this.state.mobileStep === "end",
           precision: mobilePrecision,
           title: // 如果允许"至今"且开始时间不在未来，在标题区域展示"至今"按钮
           !((_this$props$schema$da3 = this.props.schema.dateRange) != null && _this$props$schema$da3.hideTillNow) && !(this.state.mobileStartDate && this.state.mobileStartDate > new Date()) ? jsxRuntime.jsxs("div", {
             style: {
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
               gap: 12
             },
             children: [jsxRuntime.jsx("span", {
@@ -23133,7 +23130,7 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
           onClose: function onClose() {
             // 回退到第一步，让用户可以重新选择开始日期
             _this2.setState({
-              mobileStep: 'start'
+              mobileStep: "start"
             });
           }
         }, "end_" + mobilePrecision)]
@@ -23143,23 +23140,23 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
 
       // 根据 precision 配置确定 PC 端 picker 模式和 showTime（使用扁平化属性 dateRangePrecision）
       var precision = this.props.schema.dateRangePrecision;
-      var pcShowTime = precision === 'minute' || ((_this$props$schema$da4 = this.props.schema.dateRange) == null ? void 0 : _this$props$schema$da4.showTime);
+      var pcShowTime = precision === "minute" || ((_this$props$schema$da4 = this.props.schema.dateRange) == null ? void 0 : _this$props$schema$da4.showTime);
       var hideFooter = (_this$props$schema$da5 = this.props.schema.dateRange) == null ? void 0 : _this$props$schema$da5.hideTillNow; // 动态构建额外属性，避免 showTime 和 picker 同时传入导致类型冲突
 
       var extraProps = {};
 
-      if (precision === 'year') {
-        extraProps.picker = 'year';
-      } else if (precision === 'month') {
-        extraProps.picker = 'month';
+      if (precision === "year") {
+        extraProps.picker = "year";
+      } else if (precision === "month") {
+        extraProps.picker = "month";
       } else if (pcShowTime) {
         // precision 为 minute 时只展示时分，不展示秒
-        extraProps.showTime = precision === 'minute' ? {
-          format: 'HH:mm'
+        extraProps.showTime = precision === "minute" ? {
+          format: "HH:mm"
         } : true; // 同步设置输入框的显示格式，避免 showTime.format 只影响面板列而输入框仍显示秒
 
-        if (precision === 'minute') {
-          extraProps.format = 'YYYY-MM-DD HH:mm';
+        if (precision === "minute") {
+          extraProps.format = "YYYY-MM-DD HH:mm";
         }
       } // "至今"按钮的点击处理函数
 
@@ -23183,124 +23180,126 @@ var ARangePicker = /*#__PURE__*/function (_Viewer) {
 
       var showTillNow = !hideFooter; // 构造元素
 
-      return jsxRuntime.jsx(antd.DatePicker.RangePicker, _objectSpread$8({
+      return jsxRuntime.jsx("div", {
         ref: this._pickerRef,
-        panelRender: pcShowTime && showTillNow ? function (panelNode) {
-          // showTime 模式下：通过事件委托捕获面板上日期单元格的点击
-          // 同时在 footer 的"确定"按钮同一行注入"至今"按钮
-          return jsxRuntime.jsx("div", {
-            onClick: function onClick(e) {
-              var target = e.target;
-              var cell = target.closest == null ? void 0 : target.closest('.ant-picker-cell');
+        children: jsxRuntime.jsx(antd.DatePicker.RangePicker, _objectSpread$8({
+          panelRender: pcShowTime && showTillNow ? function (panelNode) {
+            // showTime 模式下：通过事件委托捕获面板上日期单元格的点击
+            // 同时在 footer 的"确定"按钮同一行注入"至今"按钮
+            return jsxRuntime.jsx("div", {
+              onClick: function onClick(e) {
+                var target = e.target;
+                var cell = target.closest == null ? void 0 : target.closest(".ant-picker-cell");
 
-              if (cell) {
-                // 排除 disabled 状态的日期单元格
-                if (cell.classList.contains('ant-picker-cell-disabled')) return;
-                var title = cell.getAttribute('title');
+                if (cell) {
+                  // 排除 disabled 状态的日期单元格
+                  if (cell.classList.contains("ant-picker-cell-disabled")) return;
+                  var title = cell.getAttribute("title");
 
-                if (title) {
-                  var parsed = moment__default["default"](title, 'YYYY-MM-DD'); // 校验 moment 解析有效性，无效日期不记录
+                  if (title) {
+                    var parsed = moment__default["default"](title, "YYYY-MM-DD"); // 校验 moment 解析有效性，无效日期不记录
 
-                  if (parsed.isValid()) {
-                    _this2._panelClickedDate = parsed;
+                    if (parsed.isValid()) {
+                      _this2._panelClickedDate = parsed;
+                    }
                   }
                 }
-              }
-            },
-            ref: function ref(el) {
-              var _ref3, _this2$_onCalendarCha2, _this2$_onCalendarCha3;
+              },
+              ref: function ref(el) {
+                var _ref3, _this2$_onCalendarCha2, _this2$_onCalendarCha3;
 
-              // 面板渲染后，将"至今"按钮注入到 .ant-picker-ok 内部，确定按钮之后
-              // 这样两者在同一个 flex item 中，确定在左、至今在右
-              if (!el) return;
-              var okLi = el.querySelector('.ant-picker-ok');
-              if (!okLi) return; // 开始时间在未来时，移除已有的至今按钮并不再注入
+                // 面板渲染后，将"至今"按钮注入到 .ant-picker-ok 内部，确定按钮之后
+                // 这样两者在同一个 flex item 中，确定在左、至今在右
+                if (!el) return;
+                var okLi = el.querySelector(".ant-picker-ok");
+                if (!okLi) return; // 开始时间在未来时，移除已有的至今按钮并不再注入
 
-              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];
+                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];
 
-              if (previewStart && previewStart.isAfter(moment__default["default"]())) {
-                var existingBtn = okLi.querySelector('.till-now-btn');
-                if (existingBtn) existingBtn.remove();
-                return;
-              }
+                if (previewStart && previewStart.isAfter(moment__default["default"]())) {
+                  var existingBtn = okLi.querySelector(".till-now-btn");
+                  if (existingBtn) existingBtn.remove();
+                  return;
+                }
 
-              if (!okLi.querySelector('.till-now-btn')) {
-                var tillNowBtn = document.createElement('button');
-                tillNowBtn.className = 'ant-btn ant-btn-sm till-now-btn';
-                tillNowBtn.textContent = '至今';
-                tillNowBtn.style.cssText = 'margin-left: 8px;'; // 使用具名函数以便于清理；先移除可能的旧监听再添加，防止重复绑定
+                if (!okLi.querySelector(".till-now-btn")) {
+                  var tillNowBtn = document.createElement("button");
+                  tillNowBtn.className = "ant-btn ant-btn-sm till-now-btn";
+                  tillNowBtn.textContent = "至今";
+                  tillNowBtn.style.cssText = "margin-left: 8px;"; // 使用具名函数以便于清理；先移除可能的旧监听再添加，防止重复绑定
 
-                var onTillNowClick = function onTillNowClick(e) {
-                  e.stopPropagation();
-                  handleTillNow();
-                };
+                  var onTillNowClick = function onTillNowClick(e) {
+                    e.stopPropagation();
+                    handleTillNow();
+                  };
 
-                tillNowBtn.addEventListener('click', onTillNowClick);
-                okLi.appendChild(tillNowBtn);
-              }
-            },
-            children: panelNode
-          });
-        } : undefined,
-        renderExtraFooter: !pcShowTime && showTillNow ? function (mode) {
-          var _this2$_onCalendarCha4, _this2$_onCalendarCha5;
+                  tillNowBtn.addEventListener("click", onTillNowClick);
+                  okLi.appendChild(tillNowBtn);
+                }
+              },
+              children: panelNode
+            });
+          } : undefined,
+          renderExtraFooter: !pcShowTime && showTillNow ? function (mode) {
+            var _this2$_onCalendarCha4, _this2$_onCalendarCha5;
 
-          // 非 showTime 模式：使用 renderExtraFooter 展示"至今"按钮
-          var previewStart = (_this2$_onCalendarCha4 = (_this2$_onCalendarCha5 = _this2._onCalendarChangeValue) == null ? void 0 : _this2$_onCalendarCha5[0]) != null ? _this2$_onCalendarCha4 : rangePickerData == null ? void 0 : rangePickerData[0];
+            // 非 showTime 模式：使用 renderExtraFooter 展示"至今"按钮
+            var previewStart = (_this2$_onCalendarCha4 = (_this2$_onCalendarCha5 = _this2._onCalendarChangeValue) == null ? void 0 : _this2$_onCalendarCha5[0]) != null ? _this2$_onCalendarCha4 : rangePickerData == null ? void 0 : rangePickerData[0];
 
-          if (previewStart && previewStart.isAfter(moment__default["default"]())) {
-            return null;
-          }
+            if (previewStart && previewStart.isAfter(moment__default["default"]())) {
+              return null;
+            }
 
-          return jsxRuntime.jsx("div", {
-            style: {
-              textAlign: "right"
-            },
-            children: jsxRuntime.jsx(antd.Button, {
-              size: "small",
+            return jsxRuntime.jsx("div", {
               style: {
-                width: "100px",
-                display: "inline-block",
-                marginTop: "5px"
+                textAlign: "right"
               },
-              onClick: handleTillNow,
-              children: "\u81F3\u4ECA"
-            })
-          });
-        } : undefined,
-        bordered: this.props.hideBorder ? false : true,
-        style: {
-          width: "300px"
-        },
-        locale: zhCN__default$1["default"],
-        defaultValue: rangePickerData,
-        onCalendarChange: function onCalendarChange(d) {
-          _this2._onCalendarChangeValue = d; // 用户开始新一轮选择时清理面板点击缓存，避免上一轮过时数据污染
+              children: jsxRuntime.jsx(antd.Button, {
+                size: "small",
+                style: {
+                  width: "100px",
+                  display: "inline-block",
+                  marginTop: "5px"
+                },
+                onClick: handleTillNow,
+                children: "\u81F3\u4ECA"
+              })
+            });
+          } : undefined,
+          bordered: this.props.hideBorder ? false : true,
+          style: {
+            width: "100%"
+          },
+          locale: zhCN__default$1["default"],
+          defaultValue: rangePickerData,
+          onCalendarChange: function onCalendarChange(d) {
+            _this2._onCalendarChangeValue = d; // 用户开始新一轮选择时清理面板点击缓存，避免上一轮过时数据污染
 
-          _this2._panelClickedDate = null;
-        },
-        onOpenChange: function onOpenChange(open) {
-          if (!open) {
             _this2._panelClickedDate = null;
-          }
-        },
-        onChange: function onChange(vv) {
-          // 用户清空日期范围时，直接置空
-          if (!vv) {
-            _Viewer.prototype.changeValueEx.call(_this2, undefined, true, true);
+          },
+          onOpenChange: function onOpenChange(open) {
+            if (!open) {
+              _this2._panelClickedDate = null;
+            }
+          },
+          onChange: function onChange(vv) {
+            // 用户清空日期范围时，直接置空
+            if (!vv) {
+              _Viewer.prototype.changeValueEx.call(_this2, undefined, true, true);
 
-            return;
-          }
+              return;
+            }
 
-          var currentData = _Viewer.prototype.getValue.call(_this2);
+            var currentData = _Viewer.prototype.getValue.call(_this2);
 
-          var isTillNow = ___default["default"].get(currentData, '[2]') === true; // 若当前是"至今"且用户只改了开始时间（结束时间仍为 null），保留 tillNow
+            var isTillNow = ___default["default"].get(currentData, "[2]") === true; // 若当前是"至今"且用户只改了开始时间（结束时间仍为 null），保留 tillNow
 
-          var newTillNow = isTillNow && vv[1] == null;
+            var newTillNow = isTillNow && vv[1] == null;
 
-          _Viewer.prototype.changeValueEx.call(_this2, _this2._rangePicker2Data(vv, newTillNow), true, true);
-        }
-      }, extraProps), this.state.ctrlVersion + "_" + ((_this$props$schema$da6 = this.props.schema.dateRangePrecision) != null ? _this$props$schema$da6 : 'day'));
+            _Viewer.prototype.changeValueEx.call(_this2, _this2._rangePicker2Data(vv, newTillNow), true, true);
+          }
+        }, extraProps), this.state.ctrlVersion + "_" + ((_this$props$schema$da6 = this.props.schema.dateRangePrecision) != null ? _this$props$schema$da6 : "day"))
+      });
     }
   };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "form-driver",
-  "version": "0.4.26",
+  "version": "0.4.28",
   "description": "An efficient framework for creating forms.",
   "license": "MIT",
   "authors": [

package/src/framework/MViewer.less

@@ -47,13 +47,21 @@
   color: lightgray;
 }
 
-/** 回填字段的样式，例如日期选择/gb2260选项下，带下划线的，显示被选中值的一行字 */
+/** 回填字段的样式，例如日期选择/gb2260选项下，与PC端一致的边框样式 */
 .MEditor_p .backfill {
-  border-bottom: 1px solid #d9d9d9;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  padding: 4px 11px;
+  line-height: 1.5715;
+  transition: all 0.3s;
 }
 
 .MEditor_p .backfill_empty {
-  border-bottom: 1px solid #d9d9d9;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  padding: 4px 11px;
+  line-height: 1.5715;
+  transition: all 0.3s;
   color: gray;
 }
 

package/src/ui/editor/basic/ADatetimePicker.tsx

@@ -126,7 +126,7 @@ export class ADatetimePicker extends BaseViewer {
               return !!d;
             }}
             format={antConf.readableFormat}
-            style={{ width: "300px" }}
+            style={{ width: "100%" }}
             defaultValue={dataAsMoment}
             showTime={antConf.showTime}
             picker={antConf.mode}