订单上报
This commit is contained in:
潘晓云
@ -0,0 +1,85 @@
|
||||
<page-header-wrapper [title]="''"></page-header-wrapper>
|
||||
|
||||
<nz-card>
|
||||
<!-- 搜索表单 -->
|
||||
<div nz-row nzGutter="8">
|
||||
<div nz-col [nzSpan]="_$expand ? 24 : 18">
|
||||
<sf #sf [schema]="schema" [ui]="ui" [compact]="true" [button]="'none'"></sf>
|
||||
</div>
|
||||
<div nz-col [nzSpan]="_$expand ? 24 : 6" [class.text-right]="_$expand">
|
||||
<button nz-button nzType="primary" [disabled]="!sf.valid" [nzLoading]="false" (click)="search()" acl
|
||||
[acl-ability]="['RiskOrder-Search']">查询</button>
|
||||
<button nz-button (click)="resetSF()">重置</button>
|
||||
<button nz-button (click)="resetSF()">导出</button>
|
||||
<button nz-button nzType="link" (click)="expandToggle()">
|
||||
{{ !_$expand ? '展开' : '收起' }}
|
||||
<i nz-icon [nzType]="!_$expand ? 'down' : 'up'"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nz-card>
|
||||
<nz-card>
|
||||
<nz-tabset [nzTabBarExtraContent]="extraTemplate" *ngIf="tabs.length>0">
|
||||
|
||||
<nz-tab *ngFor="let tab of tabs" [nzTitle]="tab.name" (nzSelect)="selectChange(tab)">
|
||||
</nz-tab>
|
||||
</nz-tabset>
|
||||
<!-- 数据列表 -->
|
||||
<st #st [scroll]="{x:'1200px'}" [data]="service.$api_order_reporting_page" [columns]="columns"
|
||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
||||
[res]="{ reName: { list: 'data.records', total: 'data.total' } }"
|
||||
[page]="{ show: true, showSize: true, pageSizes: [10,20, 50, 100] }" [loading]="false">
|
||||
<ng-template st-row="orderSn" let-item let-index="index">
|
||||
<a (click)="view(item)">{{item.billCode}}</a>
|
||||
</ng-template>
|
||||
<ng-template st-row="freightDetails" let-item>
|
||||
<div *ngFor="let item of item.freightDetails">
|
||||
<div>{{item.expenseName}}:{{item.price | currency}} </div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="loadingPlace" let-item let-index="index">
|
||||
<div *ngFor="let address of item.loadingAddressArr">{{ address }} </div>
|
||||
</ng-template>
|
||||
<ng-template st-row="dischargePlace" let-item let-index="index">
|
||||
<div *ngFor="let address of item.unloadingAddressArr">{{ address }}</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="goodsInfoVOList" let-item>
|
||||
<div *ngFor="let item of item.goodsInfoVOList">
|
||||
<div>货物名称 : {{item.goodsName}}</div>
|
||||
<div>重量/体积 : {{item.weight}}/{{item.volume}}</div>
|
||||
<div>车型/车长 :{{item.carModelLabel}}/{{item.carLengthLabel}}</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="driver" let-item>
|
||||
<div> {{item.driverName}}</div>
|
||||
<div>{{item.driverPhone}}</div>
|
||||
<div>{{item.carNo}}</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="payeeName" let-item>
|
||||
<div>{{item.payeeName}}</div>
|
||||
<div>{{item.payeePhone}}</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="transportInfo" let-item>
|
||||
<div>创建时间:{{item.createTime}}</div>
|
||||
<div>装货时间:{{item.loadTime}}</div>
|
||||
<div>卸货时间:{{item.unloadTime}}</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="billComplianceVOS" let-item>
|
||||
<div *ngFor="let item of item?.billComplianceVOS">{{item?.complianceName}}</div>
|
||||
</ng-template>
|
||||
<ng-template st-row="serviceType" let-item>
|
||||
<div>{{item?.billTypeLabel}} （{{item?.serviceTypeLabel}}） </div>
|
||||
</ng-template>
|
||||
</st>
|
||||
</nz-card>
|
||||
<ng-template #extraTemplate>
|
||||
<div class="d-flex align-items-center ">
|
||||
<div class="mr-md">
|
||||
已选择
|
||||
<strong class="text-red">{{ selectedRows.length }}</strong> 条数据
|
||||
</div>
|
||||
<button nz-button nzType="primary" (click)="upload()">上传</button>
|
||||
<button nz-button nzType="primary" (click)="recall({})">撤回</button>
|
||||
<button nz-button nzType="primary" (click)="uploadSetting()">上传设置</button>
|
||||
</div>
|
||||
</ng-template>
|
||||
@ -0,0 +1,24 @@
|
||||
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { DatatableOrderReportingComponent } from './order-reporting.component';
|
||||
|
||||
describe('DatatableOrderReportingComponent', () => {
|
||||
let component: DatatableOrderReportingComponent;
|
||||
let fixture: ComponentFixture<DatatableOrderReportingComponent>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ DatatableOrderReportingComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(DatatableOrderReportingComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,416 @@
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
import { STColumn, STComponent, STData } from '@delon/abc/st';
|
||||
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
|
||||
import { ModalHelper, _HttpClient } from '@delon/theme';
|
||||
import { ShipperBaseService } from '@shared';
|
||||
import { NzModalService } from 'ng-zorro-antd/modal';
|
||||
import { ReportingService } from '../../services/reporting.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-datatable-order-reporting',
|
||||
templateUrl: './order-reporting.component.html',
|
||||
})
|
||||
export class DatatableOrderReportingComponent implements OnInit {
|
||||
_$expand = false;
|
||||
ui!: SFUISchema;
|
||||
schema!: SFSchema;
|
||||
columns!: STColumn[];
|
||||
@ViewChild('st', { static: false }) st!: STComponent;
|
||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
||||
tabType!: string;
|
||||
tabs: any[] = [
|
||||
{ name: '待上传', value: '1' },
|
||||
{ name: '上传中', value: '2' },
|
||||
{ name: '已上传', value: '3' },
|
||||
{ name: '异常', value: '4' },
|
||||
{ name: '全部', value: '' }
|
||||
];
|
||||
selectedIndex = ''; //选择的项目
|
||||
serviceTel = '';
|
||||
constructor(
|
||||
public service: ReportingService,
|
||||
private router: Router,
|
||||
private ar: ActivatedRoute,
|
||||
private modal: NzModalService,
|
||||
public shipperSrv: ShipperBaseService
|
||||
) {
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询字段个数
|
||||
*/
|
||||
get queryFieldCount(): number {
|
||||
return Object.keys(this.schema?.properties || {}).length;
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询参数
|
||||
*/
|
||||
get reqParams() {
|
||||
const params = Object.assign({}, this.sf?.value || {}, {
|
||||
representationsStatus: this.selectedIndex,
|
||||
});
|
||||
delete params._$expand;
|
||||
return { ...params };
|
||||
}
|
||||
|
||||
/**
|
||||
* 选中行
|
||||
*/
|
||||
get selectedRows() {
|
||||
return this.st?.list.filter((item: any) => item.checked) || [];
|
||||
}
|
||||
|
||||
/**
|
||||
* 伸缩查询条件
|
||||
*/
|
||||
expandToggle() {
|
||||
this._$expand = !this._$expand;
|
||||
this.sf?.setValue('/_$expand', this._$expand);
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置表单
|
||||
*/
|
||||
resetSF() {
|
||||
this.sf.reset();
|
||||
this._$expand = false;
|
||||
}
|
||||
/**
|
||||
* 程序初始化入口
|
||||
*/
|
||||
ngOnInit() {
|
||||
this.initSF();
|
||||
this.initST();
|
||||
}
|
||||
|
||||
/**
|
||||
* 初始化查询表单
|
||||
*/
|
||||
initSF() {
|
||||
this.schema = {
|
||||
properties: {
|
||||
_$expand: { type: 'boolean', ui: { hidden: true } },
|
||||
billCode: { title: '订单号', type: 'string', ui: { placeholder: '请输入' } },
|
||||
resourceCode: {
|
||||
type: 'string',
|
||||
title: '运单号',
|
||||
ui: {
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
enterpriseInfoId: {
|
||||
title: '网络货运人',
|
||||
type: 'string',
|
||||
ui: {
|
||||
placeholder: '请选择',
|
||||
widget: 'select',
|
||||
asyncData: () => this.shipperSrv.getNetworkFreightForwarder({}, false),
|
||||
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
externalResourceCode: {
|
||||
title: '货主',
|
||||
type: 'string',
|
||||
ui: {
|
||||
placeholder: '请输入',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
driverName: {
|
||||
title: '承运司机',
|
||||
type: 'string',
|
||||
ui: {
|
||||
placeholder: '请输入司机姓名/手机号', visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
carNo: {
|
||||
title: '车牌号',
|
||||
type: 'string',
|
||||
maxLength: 9,
|
||||
ui: {
|
||||
placeholder: '请输入',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
serviceType: {
|
||||
title: '上传状态',
|
||||
type: 'string',
|
||||
ui: {
|
||||
placeholder: '请选择',
|
||||
widget: 'dict-select',
|
||||
params: { dictKey: 'service:type' },
|
||||
containsAllLabel: true,
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
serviceType1: {
|
||||
title: '本地校验',
|
||||
type: 'string',
|
||||
ui: {
|
||||
placeholder: '请选择',
|
||||
widget: 'dict-select',
|
||||
params: { dictKey: 'service:type' },
|
||||
containsAllLabel: true,
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
createTime: {
|
||||
title: '上传时间',
|
||||
type: 'string',
|
||||
ui: {
|
||||
widget: 'sl-from-to',
|
||||
type: 'date',
|
||||
format: 'yyyy-MM-dd',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
} as SFDateWidgetSchema,
|
||||
},
|
||||
createTime1: {
|
||||
title: '运单生成时间',
|
||||
type: 'string',
|
||||
ui: {
|
||||
widget: 'sl-from-to',
|
||||
type: 'date',
|
||||
format: 'yyyy-MM-dd',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
} as SFDateWidgetSchema,
|
||||
},
|
||||
createTime2: {
|
||||
title: '发货时间',
|
||||
type: 'string',
|
||||
ui: {
|
||||
widget: 'sl-from-to',
|
||||
type: 'date',
|
||||
format: 'yyyy-MM-dd',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
} as SFDateWidgetSchema,
|
||||
},
|
||||
createTime3: {
|
||||
title: '收货时间',
|
||||
type: 'string',
|
||||
ui: {
|
||||
widget: 'sl-from-to',
|
||||
type: 'date',
|
||||
format: 'yyyy-MM-dd',
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
} as SFDateWidgetSchema,
|
||||
},
|
||||
|
||||
loadingPlace: {
|
||||
title: '车辆轨迹',
|
||||
type: 'string',
|
||||
enum: [
|
||||
{ label: '全部', value: '' },
|
||||
{ label: '有', value: '1' },
|
||||
{ label: '无', value: '0' }
|
||||
],
|
||||
ui: {
|
||||
placeholder: '请选择',
|
||||
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
loadingPlace1: {
|
||||
title: '司机轨迹',
|
||||
type: 'string',
|
||||
enum: [
|
||||
{ label: '全部', value: '' },
|
||||
{ label: '有', value: '1' },
|
||||
{ label: '无', value: '0' }
|
||||
],
|
||||
ui: {
|
||||
placeholder: '请选择',
|
||||
|
||||
visibleIf: {
|
||||
_$expand: (value: boolean) => value,
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
this.ui = {
|
||||
'*': { spanLabelFixed: 120, grid: { span: 8, gutter: 4 }, enter: () => this.search() },
|
||||
$time: { grid: { span: 24 } },
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 初始化数据列表
|
||||
*/
|
||||
initST() {
|
||||
this.columns = [
|
||||
{ title: '', type: 'checkbox', className: 'text-center', width: '80px', },
|
||||
{ title: '订单状态', index: 'name', className: 'text-center', width: '120px', },
|
||||
{ title: '司机状态', index: 'name', className: 'text-center', width: '120px', },
|
||||
{ title: '车辆状态', index: 'name', className: 'text-center', width: '120px', },
|
||||
{ title: '本地校验', render: 'orderSn', className: 'text-center', width: '180px', },
|
||||
{
|
||||
title: '订单号',
|
||||
render: 'billComplianceVOS',
|
||||
className: 'text-center',
|
||||
width: '150px',
|
||||
},
|
||||
{ title: '运单号', render: 'freightDetails', className: 'text-center', width: '150px', },
|
||||
|
||||
{
|
||||
title: '网络货运人',
|
||||
render: 'serviceType',
|
||||
className: 'text-center',
|
||||
width: '120px',
|
||||
},
|
||||
{ title: '统一社会信用代码', index: 'loadingPlace', render: 'loadingPlace', className: 'text-center', width: '300px' },
|
||||
{ title: '业务类型', index: 'dischargePlace', render: 'dischargePlace', className: 'text-center', width: '300px' },
|
||||
{ title: '运单生成时间', render: 'goodsInfoVOList', className: 'text-center', width: '200px' },
|
||||
{ title: '发货时间', render: 'driver', className: 'text-center', width: '150px' },
|
||||
{ title: '收货时间', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '托运人名称', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '托运人统一社会信用代码', index: 'loadingPlace', render: 'loadingPlace', className: 'text-center', width: '300px' },
|
||||
{ title: '装货地址', index: 'dischargePlace', render: 'dischargePlace', className: 'text-center', width: '300px' },
|
||||
{ title: '运单生成时间', render: 'goodsInfoVOList', className: 'text-center', width: '200px' },
|
||||
{ title: '收货方名称', render: 'driver', className: 'text-center', width: '150px' },
|
||||
{ title: '收货地址', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '运费金额', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '车牌号', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '车牌颜色', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '司机姓名', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '司机手机号码', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '司机身份证号', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '货物信息', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '实际承运人名称', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '实际承运人证件号码', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '实际承运人道路运输许可证号', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '车辆轨迹', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '司机轨迹', render: 'payeeName', className: 'text-center', width: '150px' },
|
||||
{ title: '上传次数', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{ title: '上传时间', render: 'transportInfo', className: 'text-center', width: '250px' },
|
||||
{
|
||||
title: '操作',
|
||||
width: '200px',
|
||||
className: 'text-center',
|
||||
buttons: [
|
||||
// { text: '编辑', click: (_record: any) => this.appeal(_record) },
|
||||
{
|
||||
text: '申诉',
|
||||
// click: (record) => this.appeal(record),
|
||||
iif: (_record) => _record.representationsStatus === '1',
|
||||
acl: { 'ability': ['RiskOrder-Appeal'] }
|
||||
},
|
||||
{
|
||||
text: '撤销申诉',
|
||||
pop: {
|
||||
title: '是否确定立即撤销申诉？',
|
||||
okType: 'danger',
|
||||
},
|
||||
click: (record) => this.recall(record),
|
||||
iif: (_record) => _record.representationsStatus === '2',
|
||||
acl: { 'ability': ['RiskOrder-CancleAppeal'] }
|
||||
},
|
||||
{ text: '详情', click: (_record: any) => this.view(_record), acl: { 'ability': ['RiskOrder-Detail'] } },
|
||||
],
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 删除单个实例
|
||||
* @param record 记录实例
|
||||
*/
|
||||
recall(record: STData) {
|
||||
this.service.request(this.service.$api_recall_reporting, { id: record?.id }).subscribe((res: any) => {
|
||||
if (res) {
|
||||
this.search({ representationsStatus: '' });
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
selectChange(item: any) {
|
||||
this.selectedIndex = item?.representationsStatus || '';
|
||||
setTimeout(() => {
|
||||
this.st.load(1);
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 查看当行数据
|
||||
*/
|
||||
view(record: STData) {
|
||||
// this.router.navigate(['../view', record.uuid], { relativeTo: this.ar });
|
||||
this.router.navigate(['../detail'], {
|
||||
queryParams: {
|
||||
id: record.id,
|
||||
},
|
||||
relativeTo: this.ar
|
||||
});
|
||||
}
|
||||
|
||||
// appeal(item: any) {
|
||||
// const modalRef = this.modal.create({
|
||||
// nzTitle: '申诉',
|
||||
// nzWidth: '40%',
|
||||
// nzContent: CtcAppealComponent,
|
||||
// nzComponentParams: {
|
||||
// i: item,
|
||||
// status: 'add'
|
||||
// },
|
||||
// nzFooter: null
|
||||
// });
|
||||
// modalRef.afterClose.subscribe(res => {
|
||||
// if (res) {
|
||||
// this.search({ representationsStatus: '' });
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
|
||||
/**
|
||||
* 上传
|
||||
*/
|
||||
upload() {
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* @param params 上传设置
|
||||
*/
|
||||
uploadSetting() {
|
||||
|
||||
}
|
||||
|
||||
search(params = {}) {
|
||||
this.st.load(1);
|
||||
}
|
||||
|
||||
/**
|
||||
* 异步导出
|
||||
*/
|
||||
export() {
|
||||
this.service.exportStart(this.sf?.value, this.service.$api_async_export_order_reporting_list);
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user