126 lines
		
	
	
		
			7.7 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			126 lines
		
	
	
		
			7.7 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!--
 | 
						|
 * @Description  : 
 | 
						|
 * @Version      : 1.0
 | 
						|
 * @Author       : Shiming
 | 
						|
 * @Date         : 2022-01-25 16:03:45
 | 
						|
 * @LastEditors  : Shiming
 | 
						|
 * @LastEditTime : 2022-03-01 15:31:23
 | 
						|
 * @FilePath     : \\tms-obc-web\\src\\app\\shared\\components\\dynamic-setting\\dynamic-setting-h5\\dynamic-setting-h5.component.html
 | 
						|
 * Copyright (C) 2022 huzhenhong. All rights reserved.
 | 
						|
-->
 | 
						|
<nz-card [nzLoading]="service.http.loading">
 | 
						|
    <div nz-row [nzGutter]="8">
 | 
						|
        <div nz-col [nzSpan]="tabSpan">
 | 
						|
            <ul nz-menu nzMode="inline" class="card-height">
 | 
						|
                <li nz-menu-item [nzSelected]="idx === 0" (click)="changeType(item)"
 | 
						|
                    *ngFor="let item of tabs; let idx = index">
 | 
						|
                    {{ item.name }}
 | 
						|
                </li>
 | 
						|
            </ul>
 | 
						|
        </div>
 | 
						|
 | 
						|
        <div nz-col [nzSpan]="24-tabSpan" style="overflow: scroll">
 | 
						|
            <nz-card class="card-height" [nzBordered]="null" nzSize="small">
 | 
						|
                <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">
 | 
						|
                            <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="开始时间"
 | 
						|
                                            style="margin-left: 23px;">
 | 
						|
                                        <label class="ml-sm mr-sm"> --</label>
 | 
						|
                                        <input type="time" [(ngModel)]="item.itemValue.endTime" placeHolder="结束时间"
 | 
						|
                                            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;">
 | 
						|
 | 
						|
                                        <nz-radio-group [(ngModel)]="item.itemValue.radio" 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>
 | 
						|
 | 
						|
                                        <input type="time" [(ngModel)]="item.itemValue.startTime" placeHolder="开始时间"
 | 
						|
                                            style="margin-left: 23px;">
 | 
						|
                                        <label class="ml-sm mr-sm"> --</label>
 | 
						|
                                        <input type="time" [(ngModel)]="item.itemValue.endTime" placeHolder="结束时间"
 | 
						|
                                            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;" class="ml-md mr-xl">
 | 
						|
                                        <input nz-input placeholder="请输入" [(ngModel)]="item.itemValue" />
 | 
						|
                                    </nz-input-group>
 | 
						|
                                </ng-container>
 | 
						|
                                <!-- 文件上传 -->
 | 
						|
                                <ng-container *ngSwitchCase="9">
 | 
						|
                                    <nz-upload [nzAction]="service.$api_upload_url" [nzName]="'multipartFile'"
 | 
						|
                                        [nzHeaders]="{ authorization: 'authorization-text' }"
 | 
						|
                                        [(nzFileList)]="item.itemValue" style="margin-left: 26px;">
 | 
						|
                                        <button nz-button>
 | 
						|
                                            <i nz-icon nzType="upload"></i>
 | 
						|
                                            上传文件
 | 
						|
                                        </button>
 | 
						|
                                    </nz-upload>
 | 
						|
                                </ng-container>
 | 
						|
                                <!-- 开关选项 -->
 | 
						|
                                <ng-container *ngSwitchCase="10">
 | 
						|
                                    <nz-switch [ngModel]="item.itemValue" style="margin-left: 26px;"></nz-switch>
 | 
						|
                                </ng-container>
 | 
						|
                                <!-- 下拉单选 -->
 | 
						|
                                <ng-container *ngSwitchCase="11">
 | 
						|
                                    <nz-select [(ngModel)]="item.itemValue" style="width: 146px;margin-left: 31px;">
 | 
						|
                                        <nz-option [nzValue]="re.value" [nzLabel]="re.label"
 | 
						|
                                            *ngFor="let re of item.remark"></nz-option>
 | 
						|
                                    </nz-select>
 | 
						|
                                </ng-container>
 | 
						|
                                <!-- 开关选项 -->
 | 
						|
                                <ng-container *ngSwitchCase="999">
 | 
						|
                                    <ng-content select="custom-element"></ng-content>
 | 
						|
                                </ng-container>
 | 
						|
                            </ng-container>
 | 
						|
                        </se>
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
            </nz-card>
 | 
						|
 | 
						|
 | 
						|
            <div class="mb-md save-btn">
 | 
						|
                <button class="ml-lg" nz-button nzSize="large" nzType="primary" (click)="saveAction()"
 | 
						|
                    *ngIf="selectedTab?.configKey!=='freight' && labelWidth!==0">保存</button>
 | 
						|
            </div>
 | 
						|
        </div>
 | 
						|
    </div>
 | 
						|
</nz-card> |