edit

src/app/routes/supply-management/components/vehicle/vehicle.component.html

@@ -13,15 +13,12 @@
 <nz-card>
   <div nz-row nzGutter="8">
     <div nz-col [nzXl]="_$expand ? 24 : 18" [nzLg]="24" [nzSm]="24" [nzXs]="24">
-      <sf
+      <sf #sf [schema]="schema"
-        #sf
+        [ui]="{ '*': { spanLabelFixed: 110, grid: { lg: 8, md: 12, sm: 12, xs: 24, gutter: 4 } } }" [compact]="true"
-        [schema]="schema"
+        [button]="'none'"></sf>
-        [ui]="{ '*': { spanLabelFixed: 110, grid: { lg: 8, md: 12, sm: 12, xs: 24, gutter: 4 } } }"
-        [compact]="true"
-        [button]="'none'"
-      ></sf>
     </div>
-    <div nz-col [nzXl]="_$expand ? 24 : 6" [nzLg]="24" [nzSm]="24" [nzXs]="24" [class.expend-options]="_$expand" class="text-right">
+    <div nz-col [nzXl]="_$expand ? 24 : 6" [nzLg]="24" [nzSm]="24" [nzXs]="24" [class.expend-options]="_$expand"
+      class="text-right">
       <button nz-button nzType="primary" [nzLoading]="service.http.loading" (click)="search()">查询</button>
       <button nz-button nzType="primary" [disabled]="service.http.loading">导出</button>
       <button nz-button [disabled]="service.http.loading" (click)="resetSF()">重置</button>
@@ -43,25 +40,12 @@
   <div style="margin-top: 15px">
     <!-- 选中提示框 -->
     <div style="position: relative">
-      <nz-alert
+      <nz-alert nzType="info" [nzMessage]="'当前共' + st?.total + '行记录，已选择' + selectedRows.length + '项'" nzShowIcon
-        nzType="info"
+        [ngStyle]="{ margin: '0 0 1rem 0' }">
-        [nzMessage]="'当前共' + st?.total + '行记录，已选择' + selectedRows.length + '项'"
-        nzShowIcon
-        [ngStyle]="{ margin: '0 0 1rem 0' }"
-      >
       </nz-alert>
     </div>
-    <st
+    <st #st [data]="service.$api_get_wholePage_list" [columns]="columns" [req]="{  params: reqParams }"
-      #st
+      [res]="{ process: afterRes }" [loading]="service.http.loading" [scroll]="{ x: '1200px', y: '500px' }">
-      [scroll]="{ x: '2000px' }"
-      [data]="service.$api_get_wholePage_list"
-      [columns]="columns"
-      [req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
-      [res]="{ reName: { list: 'data.records', total: 'data.total' }, process: afterRes }"
-      [page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }"
-      [loading]="service.http.loading"
-      [scroll]="{ x: '1200px', y: '500px' }"
-    >
       <ng-template st-row="resourceCode" let-item let-index="index">
         <a [routerLink]="'vehicle-detail/' + item?.id">{{ item?.resourceCode }}</a>
         <p>{{ item?.resourceTypeLabel }}{{ item?.serviceTypeLabel }}</p>
@@ -80,16 +64,6 @@
         <div>车型: {{ item?.carModelLabel }}</div>
         <div class="error">车长: {{ item?.expand }} 米</div>
       </ng-template>
-      <ng-template #contentTemplate>
-        <div>
-          <p>预付：¥200.00</p>
-          <p>到付：¥200.00</p>
-          <p>油卡：¥200.00</p>
-          <p>回单付：¥200.00</p>
-          <p>小计：¥200.00</p>
-          <p>附加费：¥200.00</p>
-        </div>
-      </ng-template>
     </st>
   </div>
 </nz-card>
@@ -101,13 +75,16 @@
   </div>
 </ng-template>
 
-<nz-modal [(nzVisible)]="isVisible" [nzFooter]="nzModalFooter" nzTitle="货源审核" (nzOnCancel)="handleCancel('suppliersType')">
+<nz-modal [(nzVisible)]="isVisible" [nzFooter]="nzModalFooter" nzTitle="货源审核"
+  (nzOnCancel)="handleCancel('suppliersType')">
   <ng-container *nzModalContent>
     <div style="position: relative" *ngIf="auditMany">
-      <nz-alert nzType="info" [nzMessage]="'已选择' + selectedRows?.length + '项'" nzShowIcon [ngStyle]="{ margin: '0 0 1rem 0' }">
+      <nz-alert nzType="info" [nzMessage]="'已选择' + selectedRows?.length + '项'" nzShowIcon
+        [ngStyle]="{ margin: '0 0 1rem 0' }">
       </nz-alert>
     </div>
-    <sf #sfFre [schema]="freightSchema" [ui]="ui2" [compact]="false" [button]="'none'"> </sf>
+    <sf #sfFre [schema]="freightSchema" [ui]="{ '*': { spanLabelFixed: 120, grid: { span: 16 } } }" [compact]="false"
+      [button]="'none'"> </sf>
   </ng-container>
   <ng-template #nzModalFooter>
     <button nz-button nzType="primary" (click)="handleOK(1)" [disabled]="">通过</button>

src/app/routes/supply-management/components/vehicle/vehicle.component.spec.ts

@@ -1,24 +0,0 @@
-import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
-import { SupplyManagementVehicleComponent } from './vehicle.component';
-
-describe('SupplyManagementVehicleComponent', () => {
-  let component: SupplyManagementVehicleComponent;
-  let fixture: ComponentFixture<SupplyManagementVehicleComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ SupplyManagementVehicleComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(SupplyManagementVehicleComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

src/app/routes/supply-management/components/vehicle/vehicle.component.ts

@@ -18,23 +18,24 @@ import { ShipperBaseService } from '@shared';
   styleUrls: ['./vehicle.component.less']
 })
 export class SupplyManagementVehicleComponent implements OnInit {
-  ui2: SFUISchema = {};
-  schema: SFSchema = this.initSF();
-  freightSchema: SFSchema = {};
-  auditMany = false;
-  isVisible = false;
-  _$expand = false;
-  
   @ViewChild('st') private readonly st!: STComponent;
   @ViewChild('sf', { static: false }) sf!: SFComponent;
   @ViewChild('sfFre', { static: false }) sfFre!: SFComponent;
+
+  schema: SFSchema = this.initSF();
   columns: STColumn[] = this.initST();
+  _$expand = false;
   tabs = {
     totalQuantity: 0,
     cancelQuantity: 0,
     receivedQuantity: 0,
     stayQuantity: 0
   };
+
+  isVisible = false;
+  freightSchema: SFSchema = {};
+  auditMany = false;
+  
   resourceStatus: any;
   auditID: any;
   constructor(
@@ -94,7 +95,6 @@ export class SupplyManagementVehicleComponent implements OnInit {
       },
       require: ['remarks']
     };
-    this.ui2 = { '*': { spanLabelFixed: 120, grid: { span: 16 } } };
   }
 
   add(): void {

src/app/routes/sys-setting/components/basic-setting/basic-setting.component.html

@@ -1,3 +1,3 @@
 <app-dynamic-setting-h5 [tabs]="tabs" [configList]="configList" [selectedTab]="selectedTab"
-    (selectedEvent)="getConfigList($event)" (saveEvent)="saveAction($event)">
+    (selectedEvent)="getConfigList($event)" (saveEvent)="saveAction($event)" [labelWidth]="labelWidth">
 </app-dynamic-setting-h5>

src/app/routes/sys-setting/components/basic-setting/basic-setting.component.ts

@@ -21,7 +21,7 @@ import { SystemService } from '../../services/system.service';
 export class BasicSettingComponent implements OnInit {
   tabs: any[] = [];
   selectedTab: any = null;
-
+  labelWidth = 250;
   configList: any = [];
   constructor(public service: SystemService) {}
 
@@ -49,9 +49,11 @@ export class BasicSettingComponent implements OnInit {
         res = res.map(item => ({
           ...item,
           remark: item.remark ? JSON.parse(item.remark) : null,
-          itemValue: item?.itemValue ? item?.itemType !== 8? JSON.parse(item?.itemValue) : item?.itemValue : item?.itemValue,
+          itemValue: item?.itemValue ? (item?.itemType !== 8 ? JSON.parse(item?.itemValue) : item?.itemValue) : item?.itemValue,
           itemData: item.itemData ? JSON.parse(item.itemData) : item.itemData
         }));
+        const hiddenType = res.find(item => item.itemType === 7 || item.itemType === 999);
+        this.labelWidth = hiddenType ? 0 : 250;
         this.configList = res;
       } else {
         this.configList = [];

src/app/shared/components/dynamic-setting/dynamic-setting-h5/dynamic-setting-h5.component.html

@@ -24,26 +24,29 @@
                 <h2 style="font-weight: 800;">{{selectedTab?.name}}</h2>
                 <div nz-row nzGutter="8">
                     <div nz-col nzSpan="24" se-container [labelWidth]="labelWidth">
-                        <se [label]="item.name" *ngFor="let item of configList" col="1" [required]="item.requiredField" >
+                        <se [label]="item.name" *ngFor="let item of configList" col="1" [required]="item.requiredField">
                             <ng-container [ngSwitch]="item.itemType">
+                                <!-- 整型输入框 -->
                                 <ng-container *ngSwitchCase="1">
                                     <nz-input-group [nzAddOnAfter]="item.remark?.afterLable" style="width: 155px;"
                                         class="ml-md mr-xl">
                                         <input type="number" nz-input [(ngModel)]="item.itemValue" placeholder="请输入" />
                                     </nz-input-group>
                                 </ng-container>
+                                <!-- 0-1单选框 -->
                                 <ng-container *ngSwitchCase="2">
                                     <nz-radio-group [(ngModel)]="item.itemValue" class="mr-xl">
                                         <label nz-radio [nzValue]="0" class="ml-xl">{{item.remark?.[0] || '否'}}</label>
                                         <label nz-radio [nzValue]="1" class="ml-xl">{{item.remark?.[1] || '是'}}</label>
                                     </nz-radio-group>
                                 </ng-container>
-                           
+                                <!-- 时间选择器 -->
                                 <ng-container *ngSwitchCase="3">
                                     <nz-time-picker nzFormat="HH:mm" nzPlaceHolder="请选择时间" [(ngModel)]="item.itemValue"
                                         class="ml-md mr-xl">
                                     </nz-time-picker>
                                 </ng-container>
+                                <!-- 时间段选择器 -->
                                 <ng-container *ngSwitchCase="5">
                                     <div class="d-flex" style="align-items: center;justify-content: space-between;">
                                         <input type="time" [(ngModel)]="item.itemValue.startTime" placeHolder="开始时间"
@@ -53,6 +56,7 @@
                                             style="margin-left: 0;" class=" mr-xl">
                                     </div>
                                 </ng-container>
+                                <!-- 单选加配置 -->
                                 <ng-container *ngSwitchCase="6">
                                     <div class="d-flex" style="align-items: center;justify-content: space-between;">
 
@@ -70,31 +74,35 @@
                                             style="margin-left: 0;" class=" mr-xl">
                                     </div>
                                 </ng-container>
+                                <!-- 运费列表 -->
                                 <ng-container *ngSwitchCase="7">
                                     <app-freight-table></app-freight-table>
                                 </ng-container>
+                                <!-- 文本输入框 -->
                                 <ng-container *ngSwitchCase="8">
-                                    <nz-input-group  style="width: 155px;"
+                                    <nz-input-group style="width: 155px;" class="ml-md mr-xl">
-                                        class="ml-md mr-xl">
                                         <input nz-input placeholder="请输入" [(ngModel)]="item.itemValue" />
                                     </nz-input-group>
                                 </ng-container>
+                                <!-- 文件上传 -->
                                 <ng-container *ngSwitchCase="9">
-                                    <nz-upload
+                                    <nz-upload [nzAction]="service.$api_upload_url" [nzName]="'multipartFile'"
-                                    [nzAction]="service.$api_upload_url"
-                                    [nzName]="'multipartFile'"
                                         [nzHeaders]="{ authorization: 'authorization-text' }"
-                                    [(nzFileList)]="item.itemValue"
+                                        [(nzFileList)]="item.itemValue">
-                                  >
                                         <button nz-button>
                                             <i nz-icon nzType="upload"></i>
                                             上传文件
                                         </button>
                                     </nz-upload>
                                 </ng-container>
+                                <!-- 开关选项 -->
                                 <ng-container *ngSwitchCase="10">
                                     <nz-switch [(ngModel)]="item.itemValue"></nz-switch>
                                 </ng-container>
+                                <!-- 开关选项 -->
+                                <ng-container *ngSwitchCase="99">
+                                    <nz-switch [(ngModel)]="item.itemValue"></nz-switch>
+                                </ng-container>
                             </ng-container>
                         </se>
                     </div>

src/app/shared/components/dynamic-setting/dynamic-setting-h5/dynamic-setting-h5.component.less

@@ -22,6 +22,16 @@
     .ant-form-item-control-input-content {
       display: flex;
     }
+
+    .ant-form-item-label>label {
+      height: 36px;
     }
 
+    .se__horizontal>.se__item .se__label-text {
+      overflow     : auto;
+      text-overflow: unset;
+      white-space  : normal;
     }
+  }
+
+}

src/app/shared/components/dynamic-setting/dynamic-setting-h5/dynamic-setting-h5.component.ts

@@ -11,7 +11,7 @@
 import { Component, OnInit, EventEmitter, Input, Output } from '@angular/core';
 import { BaseService } from '@shared';
 
-const JSONTYPE = new Set([5, 6, 9]);
+const JSONTYPE = new Set([5, 6, 9, 999]);
 @Component({
   selector: 'app-dynamic-setting-h5',
   templateUrl: './dynamic-setting-h5.component.html',
@@ -39,8 +39,7 @@ export class DynamicSettingH5Component implements OnInit {
   listUrls: any;
   constructor(public service: BaseService) {}
 
-  ngOnInit() {
+  ngOnInit() {}
-  }
 
   changeType(type: any): void {
     this.selectedTab = type;
@@ -54,7 +53,7 @@ export class DynamicSettingH5Component implements OnInit {
     let params = [...this.configList];
     params = params.map((item: any) => {
       if (item.itemType == 9) {
-        const files = item.itemValue?.map(({ response, name }: any) => ({ url:response?.data?.fullFilePath, name }));
+        const files = item.itemValue?.map(({ response, name }: any) => ({ url: response?.data?.fullFilePath, name }));
         return {
           ...item,
           remark: item.remark ? JSON.stringify(item.remark) : null,

src/app/shared/components/dynamic-setting/dynamic-setting-modal/dynamic-setting-modal.component.ts

@@ -35,7 +35,6 @@ export class DynamicSettingModalComponent implements OnInit {
 
   ngOnInit() {
     if(this.configvalue) {
-      console.log(this.configvalue)
         this.configFullKey = this.configvalue
     }
     this.getTypeList();

src/app/shared/components/dynamic-setting/dynamic-setting.module.ts

@@ -13,14 +13,14 @@ import { CommonModule } from '@angular/common';
 import { DynamicSettingH5Component } from './dynamic-setting-h5/dynamic-setting-h5.component';
 import { SHARED_ZORRO_MODULES } from '../../shared-zorro.module';
 import { SHARED_DELON_MODULES } from '../../shared-delon.module';
-import { NzSwitchModule } from 'ng-zorro-antd/switch';
 import { FormsModule } from '@angular/forms';
 import { DynamicSettingModalComponent } from './dynamic-setting-modal/dynamic-setting-modal.component';
 import { FreightTableComponent } from './freight-table/freight-table.component';
+import { SEModule } from '@delon/abc/se';
 const COMPONENTS = [DynamicSettingH5Component, DynamicSettingModalComponent, FreightTableComponent];
 @NgModule({
   declarations: [...COMPONENTS],
-  imports: [CommonModule, FormsModule, NzSwitchModule,SHARED_ZORRO_MODULES, SHARED_DELON_MODULES],
+  imports: [CommonModule, FormsModule, SHARED_ZORRO_MODULES, SEModule],
   exports: [...COMPONENTS]
 })
 export class DynamicSettingModule {}