fantasy-ngzorro 2.1.50 → 2.1.51

package/README.md

@@ -37,6 +37,7 @@
 | — | 2026-6-23 | hd-table 状态列支持 `stateField` 自定义取值字段、`isState` 按列名取值；hd-form Input 支持 `prefix` / `prefixIcon`；hd-detail-lines-page 支持 `isCrossPageSelect` 跨页勾选开关 |
 | — | 2026-7-6 | hd-form 支持 `FormListType.Checkbox`（单个复选框 / 复选框组）及 `CheckboxOption` 配置 |
 | — | 2026-9-8 | hd-form 支持 `FormListType.RegionAddress`（省市区级联 + 详细地址，双 FormControl，固定占 2 列） |
+| — | 2026-9-9 | hd-detail-form 默认固定一行 4 列；`HdOption.width` 支持占列（默认 1，最大 4） |
 | — | 2026-8-6 | hd-form-lines：`allowEmpty` + 仅删除按钮时初始化不补空行、可删至 0 行；分页页码删空校正；ViewDom 字号 14px |
 | — | 2026-8-26 | `hd-table` 默认开启虚拟滚动（`virtualScroll` / `virtualItemSize`）；文档补齐 |
 | — | 2026-8-25 | hd-status：`statusToColor` 按 sunan-server 业务状态枚举全量去重补充（排除银行 / AGV / HTTP StatusCode） |
@@ -559,12 +560,12 @@ this.hdFormLines.batchFillSelected({ remark: '批量备注' }); // 批量填充
 
 ```html
 <hd-detail-form [formCols]="formCols"></hd-detail-form>
-<!-- 固定两列：<hd-detail-form [formCols]="formCols" [nzColumn]="2"></hd-detail-form> -->
 ```
 
 ```typescript
 formCols: HdOption[] = [
   { label: '收货单号', value: '202111030001' },
+  { label: '地址', value: '江苏/南京市/玄武区 某某路', width: 2 },
   { label: '备注', value: '...' }
 ];
 ```
@@ -572,7 +573,7 @@ formCols: HdOption[] = [
 | 参数 | 类型 | 默认值 | 说明 |
 | ---- | ---- | ------ | ---- |
 | formCols | HdOption[] | — | 展示字段，见 [HdOption](#hdoption键值展示项) |
-| nzColumn | number \| object | `{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }` | 列数；传数字为固定列数，传对象为响应式列数 |
+| nzColumn | number \| object | `4` | 一行列数，默认固定 4 列 |
 
 ---
 
@@ -826,6 +827,7 @@ selectOption: {
 | ---- | ---- | ---- |
 | label | string | 标签 |
 | value | any | 值 |
+| width | number | 占据列数，默认 1，最大 4；未传按 1 |
 | color | string | 文字颜色 |
 | hide | boolean | 是否隐藏 |
 | clickText | string | 可点击文案 |

package/bundles/fantasy-ngzorro.umd.js

@@ -441,9 +441,9 @@
         function HdDetailFormComponent() {
             this.formCols = new Array();
             /**
-             * 列数，支持数字或响应式配置，默认按屏幕宽度自适应
+             * 一行列数，默认固定 4 列（不再按屏幕宽度自适应）
              */
-            this.nzColumn = { xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 };
+            this.nzColumn = 4;
         }
         /**
          * @return {?}
@@ -481,6 +481,25 @@
                 }
             }
         };
+        /** HdOption.width：默认 1，最大 4 */
+        /**
+         * HdOption.width：默认 1，最大 4
+         * @param {?} col
+         * @return {?}
+         */
+        HdDetailFormComponent.prototype.getColSpan = /**
+         * HdOption.width：默认 1，最大 4
+         * @param {?} col
+         * @return {?}
+         */
+        function (col) {
+            /** @type {?} */
+            var width = col && col.width != null ? Number(col.width) : 1;
+            if (!width || width < 1 || isNaN(width)) {
+                return 1;
+            }
+            return width > 4 ? 4 : Math.floor(width);
+        };
         /**
          * @param {?} fn
          * @return {?}
@@ -497,7 +516,7 @@
         HdDetailFormComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'hd-detail-form',
-                        template: "<nz-content class=\"hd-detail-form-container\">\n  <nz-descriptions [nzColumn]=\"nzColumn\">\n    <ng-container *ngFor=\"let col of formCols\">\n      <nz-descriptions-item *ngIf=\"!col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{(col.value === '0' || col.value === 0 || col.value\n          )? col.value : '&lt;\u7A7A&gt;'}}</span>\n      </nz-descriptions-item>\n      <nz-descriptions-item *ngIf=\"col.click\" [nzTitle]=\"col.label\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"col.clickText\">\n          {{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}\n          <a (click)=\"triggerEvent(col.click || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText }}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"!col.clickText\">\n          <a (click)=\"triggerEvent(col.click || null)\">{{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n      </nz-descriptions-item>\n    </ng-container>\n  </nz-descriptions>\n</nz-content>\n",
+                        template: "<nz-content class=\"hd-detail-form-container\">\n  <nz-descriptions [nzColumn]=\"nzColumn\">\n    <ng-container *ngFor=\"let col of formCols\">\n      <nz-descriptions-item *ngIf=\"!col.click\" [nzTitle]=\"col.label\" [nzSpan]=\"getColSpan(col)\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\">{{(col.value === '0' || col.value === 0 || col.value\n          )? col.value : '&lt;\u7A7A&gt;'}}</span>\n      </nz-descriptions-item>\n      <nz-descriptions-item *ngIf=\"col.click\" [nzTitle]=\"col.label\" [nzSpan]=\"getColSpan(col)\">\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"col.clickText\">\n          {{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}\n          <a (click)=\"triggerEvent(col.click || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText }}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n        <span [ngStyle]=\"{'color': col?.color ? col.color : null}\" *ngIf=\"!col.clickText\">\n          <a (click)=\"triggerEvent(col.click || null)\">{{(col.value === '0' || col.value === 0 || col.value\n            )? col.value : '&lt;\u7A7A&gt;'}}</a>\n          <a *ngIf=\"col.clickText1\" (click)=\"triggerEvent(col.click1 || null)\">&nbsp;&nbsp;&nbsp;&nbsp;{{ col.clickText1 }}</a>\n        </span>\n      </nz-descriptions-item>\n    </ng-container>\n  </nz-descriptions>\n</nz-content>\n",
                         styles: ["::ng-deep .common-btn-group>a{font-size:14px;font-weight:400;color:#20b95d!important;white-space:nowrap}::ng-deep .common-btn-group .common-danger-btn:hover{color:#f05b24!important}::ng-deep .common-btn-group>a:hover{color:#20bd62!important}::ng-deep .common-btn-group>a:not(:last-child)::after{content:'';margin:0 2px}::ng-deep .common-billNumber>a{color:#3b77e3}button{box-shadow:unset;text-shadow:unset}::ng-deep .ant-form-item-label>label{color:#4b504e;font-size:14px}::ng-deep .ant-input-number-input{height:32px}::ng-deep .ant-input-number{height:32px}textarea.ant-input{height:auto;min-height:32px}::ng-deep .ant-select-selection--multiple{min-height:32px}::ng-deep .ant-select-selection__rendered>ul>li{height:26px!important;margin-top:3px!important;line-height:26px!important}::ng-deep .ant-advanced-search-form .ant-form-item{margin-bottom:0!important}::ng-deep .ant-select-selection--single{height:32px!important}::ng-deep .ant-input{height:32px}::ng-deep .ant-input[disabled]:hover{border-color:#d9d9d9!important}::ng-deep .ant-select-selection__rendered{line-height:32px!important}::ng-deep .ant-calendar-range-picker-input{text-align:left!important}::ng-deep .ant-calendar-picker{width:100%!important}::ng-deep .ant-row{margin-right:0!important;margin-left:0!important}::ng-deep .ant-col-6{padding-left:12px;padding-right:12px}::ng-deep .ant-col-12{padding-left:12px;padding-right:12px}::ng-deep .ant-col-18{padding-left:12px;padding-right:12px}::ng-deep .ant-col-24{padding-left:12px;padding-right:12px}::ng-deep .ant-alert-info{background-color:#f5f8f6;border:1px solid #cfe3d4}::ng-deep .hd-table-container .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-th-right-sticky{z-index:2;transform:translateZ(0)}::ng-deep .hd-table-container .ant-table-thead>tr>th.ant-table-th-right-sticky{background:#f5f8f6!important}::ng-deep .hd-table-container .ant-table-tbody>tr>td.ant-table-td-right-sticky{background:#fff}::ng-deep .hd-table-container .ant-table-tbody>tr:hover>td.ant-table-td-right-sticky{background:#e6f7ff!important}::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-left .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-middle .ant-table-th-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-td-right-sticky,::ng-deep .hd-table-container .ant-table-scroll-position-right .ant-table-th-right-sticky{box-shadow:none!important}::ng-deep .hd-table-container .ant-table-fixed-right{right:0!important}:host ::ng-deep th{background:#f5f8f6!important;font-weight:700!important;white-space:nowrap;font-size:14px;font-family:PingFangSC-Medium,PingFang SC;color:#2a3634;padding:8px!important;box-sizing:border-box}:host ::ng-deep td{font-weight:400;font-style:normal;font-size:14px;color:#2a3634;text-align:left;white-space:nowrap;padding:8px!important;box-sizing:border-box}::ng-deep .ant-pagination-options{display:inline-flex;align-items:center}::ng-deep .ant-pagination-options .ant-select,::ng-deep .ant-pagination-options .ant-select-selection--single{min-width:100px}::ng-deep .ant-pagination-options-size-changer.ant-select{min-width:100px}::ng-deep .ant-time-picker{width:100%}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child{width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;min-width:var(--hd-cascader-menu-min-width,auto);max-width:560px}::ng-deep .cdk-overlay-pane .hd-cascader-menus.ant-cascader-menus>.ant-cascader-menu:only-child .ant-cascader-menu-item{white-space:nowrap}.ant-input-number-disabled,.ant-input[disabled],.ant-select-disabled{color:#4b504e}.hd-detail-form-container{font-size:14px}.hd-detail-form-container ::ng-deep td.ant-descriptions-item{vertical-align:top;padding-top:6px!important;padding-bottom:6px!important;padding-left:0!important;font-size:14px}.hd-detail-form-container ::ng-deep .ant-descriptions-item-label{color:#4b504e;font-size:14px}.hd-detail-form-container ::ng-deep .ant-descriptions-item-content{word-break:break-all;color:rgba(0,0,0,.85);font-weight:400;font-size:14px}.hd-detail-form-container ::ng-deep a{font-size:14px}.hd-detail-form-container ::ng-deep td{white-space:unset!important}"]
                     }] }
         ];
@@ -513,7 +532,7 @@
         /** @type {?} */
         HdDetailFormComponent.prototype.formCols;
         /**
-         * 列数，支持数字或响应式配置，默认按屏幕宽度自适应
+         * 一行列数，默认固定 4 列（不再按屏幕宽度自适应）
          * @type {?}
          */
         HdDetailFormComponent.prototype.nzColumn;
@@ -703,6 +722,11 @@
         HdOption.prototype.color;
         /** @type {?} */
         HdOption.prototype.hide;
+        /**
+         * 占据列数，默认 1，最大 4（一行共 4 列）；历史未传按 1
+         * @type {?}
+         */
+        HdOption.prototype.width;
         /** @type {?} */
         HdOption.prototype.clickText;
         /** @type {?} */