edit
This commit is contained in:
Taric Xin
@ -14,9 +14,6 @@
|
||||
<h2 style="font-weight: 800;">{{selectedTab?.name}}</h2>
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col nzSpan="24" se-container [labelWidth]="labelWidth">
|
||||
<!-- <se col="1">
|
||||
<app-freight-table></app-freight-table>
|
||||
</se> -->
|
||||
<se [label]="item.name" *ngFor="let item of configList" col="1">
|
||||
<ng-container [ngSwitch]="item.itemType">
|
||||
<ng-container *ngSwitchCase="1">
|
||||
@ -62,6 +59,9 @@
|
||||
style="margin-left: 0;" class=" mr-xl">
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngSwitchCase="7">
|
||||
<app-freight-table></app-freight-table>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
|
||||
</se>
|
||||
@ -71,7 +71,8 @@
|
||||
|
||||
|
||||
<div class="mb-md save-btn">
|
||||
<button class="ml-lg" nz-button nzSize="large" nzType="primary" (click)="saveAction()">保存</button>
|
||||
<button class="ml-lg" nz-button nzSize="large" nzType="primary" (click)="saveAction()"
|
||||
*ngIf="selectedTab?.configKey!=='freight'">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -33,6 +33,8 @@ export class DynamicSettingH5Component implements OnInit {
|
||||
|
||||
changeType(type: any): void {
|
||||
this.selectedTab = type;
|
||||
console.log(type);
|
||||
|
||||
this.selectedEvent.emit(this.selectedTab);
|
||||
}
|
||||
|
||||
|
||||
@ -1,22 +1,63 @@
|
||||
<nz-table #groupingTable [nzData]="data" nzBordered nzSize="small" [nzFrontPagination]="false"
|
||||
[nzScroll]="{ x: '500px' }" [nzShowPagination]="false">
|
||||
<thead>
|
||||
<tr>
|
||||
<th nzWidth="200px" nzAlign="center">公里数</th>
|
||||
<th nzWidth="130px" nzAlign="center">计算方式</th>
|
||||
<th nzWidth="200px" nzAlign="center" *ngFor="let item of headers">车长（米）</th>
|
||||
<th nzWidth="60px" nzAlign="center" nzRight>操作</th>
|
||||
</tr>
|
||||
<tr>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let item of groupingTable.data">
|
||||
<td nzWidth="200px" nzAlign="center">{{ item.startKm }} - {{ item.endKm }}</td>
|
||||
<td nzWidth="130px" nzAlign="center">{{ item.computeMode }}</td>
|
||||
<td nzWidth="200px" nzAlign="center" *ngFor="let node of item.configValue">最高{{ node.maxPrice }} 预警{{
|
||||
node.ewPrice }}</td>
|
||||
<td nzWidth="60px" nzAlign="center" nzRight>删除</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</nz-table>
|
||||
<div nz-row>
|
||||
<div nz-col nzSpan="24">
|
||||
<div class="mb-md ml-xl" style="text-align: right;">
|
||||
<button nz-button nzType="primary" (click)="add()">新增公里数</button>
|
||||
<button class="ml-md" nz-button nzType="primary" (click)="save()">保存</button>
|
||||
</div>
|
||||
|
||||
<nz-table #groupingTable [nzData]="data" nzBordered nzSize="small" [nzFrontPagination]="false"
|
||||
[nzScroll]="{ x: '1200px' }" [nzShowPagination]="false" class="ml-xl" style="max-width: 1100px;">
|
||||
<thead>
|
||||
<tr>
|
||||
<th rowspan="2" nzWidth="200px" nzAlign="center" nzLeft>公里数</th>
|
||||
<th rowspan="2" nzWidth="130px" nzAlign="center">计算方式</th>
|
||||
<th nzWidth="220px" nzAlign="center" *ngFor="let item of headers">车长（米）</th>
|
||||
<th rowspan="2" nzWidth="60px" nzAlign="center" nzRight>操作</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th nzWidth="220px" nzAlign="center" *ngFor="let item of headers;let i = index">
|
||||
<div style="display: flex;align-items: center;justify-content: space-between;">
|
||||
<label style="width: 65px;text-align: right;"> {{item.startLength}}</label>
|
||||
<label>-</label>
|
||||
<nz-input-number [ngModel]="item.endLength" (ngModelChange)="changeEndLength($event,i)"
|
||||
[nzMin]="0" [nzFormatter]="formatterDollar" nzSize="small" class="mr-sm" disabled>
|
||||
</nz-input-number>
|
||||
</div>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let item of groupingTable.data;let i = index">
|
||||
<td nzWidth="200px" nzAlign="center" nzLeft>
|
||||
<div style="display: flex;align-items: center;justify-content: space-between;">
|
||||
<label style="width: 65px;text-align: right;"> {{item.startKm}}</label>
|
||||
<label>-</label>
|
||||
<nz-input-number [ngModel]="item.endKm" (ngModelChange)="changeEndKm($event,i)" [nzMin]="0"
|
||||
[nzFormatter]="formatterDollar" nzSize="small">
|
||||
</nz-input-number>
|
||||
</div>
|
||||
</td>
|
||||
<td nzWidth="130px" nzAlign="center">{{computeMode[item.computeMode] }}</td>
|
||||
<td nzWidth="220px" nzAlign="center" *ngFor="let node of item.configValue">
|
||||
<div style="display: flex;align-items: center;justify-content: center;">
|
||||
<label>最高</label>
|
||||
<nz-input-number [(ngModel)]="node.maxPrice" [nzMin]="0" nzSize="small" style="width: 55px;"
|
||||
class="ml-sm mr-sm">
|
||||
</nz-input-number>
|
||||
<label>预警</label>
|
||||
<nz-input-number [(ngModel)]="node.ewPrice" [nzMin]="0" nzSize="small" style="width: 55px;"
|
||||
class="ml-sm">
|
||||
</nz-input-number>
|
||||
</div>
|
||||
</td>
|
||||
<td nzWidth="60px" nzAlign="center" nzRight>
|
||||
<a *ngIf="i === groupingTable.data.length-1 && groupingTable.data.length>2" nz-popconfirm
|
||||
nzPopconfirmTitle="是否确认删除?" (nzOnConfirm)="deleteRow(i)">删除</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</nz-table>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,14 @@
|
||||
:host::ng-deep {
|
||||
nz-input-number {
|
||||
width: 85px;
|
||||
|
||||
input {
|
||||
width : 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ant-input-number-handler-wrap {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -9,6 +9,12 @@ import { BaseService } from '@shared';
|
||||
export class FreightTableComponent implements OnInit {
|
||||
data: any[] = [];
|
||||
headers: any[] = [];
|
||||
|
||||
formatterDollar = (value: number): string => `${value} （含）`;
|
||||
computeMode: any = {
|
||||
0: '总运价',
|
||||
1: '单公里运价'
|
||||
};
|
||||
constructor(public service: BaseService) {}
|
||||
|
||||
ngOnInit(): void {
|
||||
@ -32,7 +38,99 @@ export class FreightTableComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改结束车长
|
||||
* @param event 车长
|
||||
* @param i 下标
|
||||
*/
|
||||
changeEndLength(event: any, i: number) {
|
||||
console.log(event, i);
|
||||
if (event <= this.headers[i].startLength) {
|
||||
this.headers[i].endLength = this.headers[i].startLength + 1;
|
||||
this.changeNextStartLength(event, i + 1);
|
||||
return;
|
||||
}
|
||||
this.headers[i].endLength = event;
|
||||
this.changeNextStartLength(event, i + 1);
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改结束公里数
|
||||
* @param event 车长
|
||||
* @param i 下标
|
||||
*/
|
||||
changeEndKm(event: any, i: number) {
|
||||
if (event <= this.data[i].startKm) {
|
||||
this.data[i].endKm = this.data[i].startKm + 1;
|
||||
this.changeNextStartKm(event, i + 1);
|
||||
return;
|
||||
}
|
||||
this.data[i].endKm = event;
|
||||
this.changeNextStartKm(event, i + 1);
|
||||
}
|
||||
|
||||
add() {
|
||||
console.log(this.data);
|
||||
|
||||
const tem = this.data[this.data?.length - 1];
|
||||
if (tem && tem.endKm) {
|
||||
const list = this.headers.map(item => ({
|
||||
ewPrice: null,
|
||||
itemId: item.id,
|
||||
maxPrice: null
|
||||
}));
|
||||
this.data.push({
|
||||
computeMode: 1,
|
||||
configValue: list,
|
||||
endKm: '',
|
||||
startKm: tem.endKm
|
||||
});
|
||||
this.data = [...this.data];
|
||||
} else {
|
||||
this.service.msgSrv.warning('请填写完整公里数');
|
||||
}
|
||||
}
|
||||
|
||||
deleteRow(index: number) {
|
||||
this.data = this.data.filter((d, i) => index !== i);
|
||||
}
|
||||
|
||||
save() {
|
||||
this.service.request('/api/mdc/cuc/freightConfig/saveBatch', this.data).subscribe(res => {
|
||||
if (res) {
|
||||
console.log(res);
|
||||
this.service.msgSrv.success('修改成功');
|
||||
this.loadData();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 遍历同步后置位车长
|
||||
* @param event 车长
|
||||
* @param i 下标
|
||||
*/
|
||||
private changeNextStartLength(event: number, i: number) {
|
||||
if (this.headers[i]) {
|
||||
this.headers[i].startLength = event;
|
||||
if (this.headers[i].endLength <= event) {
|
||||
this.headers[i].endLength = this.headers[i].startLength + 0.5;
|
||||
this.changeNextStartLength(event + 0.5, i + 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 遍历同步后置位公里数
|
||||
* @param event 车长
|
||||
* @param i 下标
|
||||
*/
|
||||
private changeNextStartKm(event: number, i: number) {
|
||||
if (this.data[i]) {
|
||||
this.data[i].startKm = event;
|
||||
if (this.data[i].endKm <= event) {
|
||||
this.data[i].endKm = this.data[i].startKm + 1;
|
||||
this.changeNextStartKm(event + 1, i + 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user