订单

src/app/routes/order-management/components/additionalc-detail/additionalc-detail.component.html

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-12-03 15:31:52
- * @LastEditTime: 2021-12-07 14:17:30
+ * @LastEditTime: 2021-12-07 14:22:22
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html
@@ -137,12 +137,14 @@
   
   <div nz-row>
     <nz-card nzTitle="轨迹信息" style="width: 100%;" >
-   <div>
+      <div nz-row > 
+        <div nz-col [nzSpan]='12'>
     <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }">
     </st>
   </div>
-   <div>
+  <div nz-col [nzSpan]='12'>
-     <!-- <app-ordermanage-map></app-ordermanage-map> -->
+     <amap-path-simplifier></amap-path-simplifier>
+   </div>
    </div>
     </nz-card>
   </div>

src/app/routes/order-management/components/bulk-detail/bulk-detail.component.html

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-12-03 15:31:52
- * @LastEditTime: 2021-12-07 09:50:21
+ * @LastEditTime: 2021-12-07 15:09:32
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html
@@ -136,13 +136,15 @@
   <nz-divider></nz-divider>
   
   <div nz-row>
-    <nz-card nzTitle="轨迹信息77" style="width: 100%;" >
+    <nz-card nzTitle="轨迹信息" style="width: 100%;" >
-   <div>
+      <div nz-row > 
+        <div nz-col [nzSpan]='12'>
     <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }">
     </st>
   </div>
-   <div>
+  <div nz-col [nzSpan]='12'>
-     <!-- <app-ordermanage-map></app-ordermanage-map> -->
+     <amap-path-simplifier></amap-path-simplifier>
+   </div>
    </div>
     </nz-card>
   </div>

src/app/routes/order-management/components/complaint/complaint.component.html

@@ -0,0 +1,91 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-03 11:10:14
+ * @LastEditTime: 2021-12-07 14:42:43
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\supply-management\components\vehicle\vehicle.component.html
+-->
+<!-- 搜索表单 -->
+<page-header-wrapper [title]="''">
+</page-header-wrapper>
+<nz-card>
+  <div nz-row nzGutter="8">
+    <!-- 查询字段小于或等于3个时，不显示伸缩按钮 -->
+    <div nz-col nzSpan="24" *ngIf="queryFieldCount <= 4">
+      <sf #sf [schema]="schema" [ui]="ui" [mode]="'search'" [disabled]="!sf?.valid" [loading]="service.http.loading"
+        (formSubmit)="st?.load(1)" (formReset)="resetSF()"></sf>
+    </div>
+
+    <!-- 查询字段大于3个时，根据展开状态调整布局 -->
+    <ng-container *ngIf="queryFieldCount > 4">
+      <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]="service.http.loading"
+          (click)="st?.load(1)">查询</button>
+        <button nz-button nzType="primary" 
+         >导出</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>
+    </ng-container>
+  </div>
+</nz-card>
+
+<nz-card>
+  <nz-tabset (nzSelectedIndexChange)="selectChange($event)" >
+    <nz-tab *ngFor="let tab of tabs; let i = index"  [nzTitle]="tab.name + ' (' + tab.count + ') '" (nzClick)="tabChange(i)">
+    </nz-tab>
+  </nz-tabset>
+  <div style="margin-top: 15px;">
+    <!-- [req]="{ method: 'GET', 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, 30, 50, 100, 200, 300, 500, 1000] }"
+      [loadingDelay]="500" [loading]="service.http.loading" -->
+    <st #st [scroll]="{ x: '1200px' }" [data]="service.$api_get_catalogue_member" [columns]="columns">
+      <ng-template st-row="goodsId" let-item let-index="index">
+        <a [routerLink]="'/order-management/vehicle-detail/'+item.id">{{item.no}}</a>
+      </ng-template>
+      <!-- <ng-template st-row="externalSn" let-item let-index="index">
+        <span class="mr-xs">{{111111}}</span>
+        <a (click)="editEnternalSn(item)">编辑</a>
+      </ng-template> -->
+      <ng-template st-row="enStatusStr27878" let-item let-index="index">
+        <div class="mr-xs" nzPopoverTitle="Title" nz-popover [nzPopoverContent]="contentTemplate">{{item.no}}</div>
+      </ng-template>
+      <ng-template st-row="feiong" let-item let-index="index">
+        <div style="color: aqua;" >
+          {{item.no}}
+        </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>
+
+<nz-modal [(nzVisible)]="isVisibleRE"  [nzWidth]="600" [nzFooter]="nzModalFooterview2"  (nzOnOk)="handleOK()" nzTitle="处理" (nzOnCancel)="handleCancel('1')">
+  <ng-container *nzModalContent>
+    <sf #sfView [schema]="schemaView" [ui]="uiView" [compact]="true" [button]="'none'">
+    </sf>
+  </ng-container>
+  <ng-template #nzModalFooterview2>
+    <button nz-button nzType="default" (click)="handleCancel('1')">取消</button>
+    <button nz-button nzType="primary" (click)="handleOK()">确定</button>
+  </ng-template>
+</nz-modal>
+
+

src/app/routes/order-management/components/complaint/complaint.component.spec.ts

@@ -0,0 +1,32 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-07 14:27:59
+ * @LastEditTime: 2021-12-07 14:28:59
+ * @LastEditors: your name
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\components\risk\risk.component.spec.ts
+ */
+import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { OrderManagementComplaintComponent } from './complaint.component';
+
+describe('OrderManagementComplaintComponent', () => {
+  let component: OrderManagementComplaintComponent;
+  let fixture: ComponentFixture<OrderManagementComplaintComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ OrderManagementComplaintComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OrderManagementComplaintComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/routes/order-management/components/complaint/complaint.component.ts

@@ -0,0 +1,265 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { STColumn, STComponent } from '@delon/abc/st';
+import { SFComponent, SFDateWidgetSchema, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
+import { ModalHelper, _HttpClient } from '@delon/theme';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { map } from 'rxjs/operators';
+import { SupplyManagementService } from '../../services/order-management.service';
+
+
+@Component({
+  selector: 'app-supply-management-complaint',
+  templateUrl: './complaint.component.html',
+  styleUrls: ['./complaint.component.less']
+})
+export class OrderManagementComplaintComponent implements OnInit {
+  url = `/user?_allow_anonymous=true`;
+  ui: SFUISchema = {};
+  uiView: SFUISchema = {};
+  schema: SFSchema = {};
+  schemaView: SFSchema = {};
+  auditMany = false;
+  isVisibleRE = false;
+  _$expand = false;
+  @ViewChild('st') private readonly st!: STComponent;
+  @ViewChild('sf', { static: false }) sf!: SFComponent;
+  @ViewChild('sfView', { static: false }) sfView!: SFComponent;
+  columns: STColumn[] = [];
+  datass: any = [
+    {
+    one: '1',
+    two: '1',
+    three: '1',
+    id: 1
+   },
+    {
+    one: '2',
+    two: '2',
+    three: '2',
+    id: 2
+   },
+];
+  tabs = [  {
+    name: '全部',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '待处理',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '已处理',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '已撤销',
+    type: 5,
+    count: 0,
+  }
+  ];
+  constructor(public service: SupplyManagementService, private modal: NzModalService) { }
+
+  /**
+ * 查询参数
+ */
+  get reqParams() {
+    return {
+      ...this.sf?.value,
+    };
+  }
+  get selectedRows() {
+    return this.st?.list.filter((item) => item.checked) || [];
+  }
+  ngOnInit(): void {
+    this.initSF();
+    this.initST();
+    this.initSTAudit();
+  }
+
+
+
+  /**
+ * 初始化查询表单
+ */
+  initSF() {
+    this.schema = {
+      properties: {
+        no: {
+          type: 'string',
+          title: '投诉单号',
+        },
+        createTime: {
+          title: '投诉时间',
+          type: 'string',
+          ui: {
+            widget: 'date',
+            mode: 'range',
+            format: 'yyyy-MM-dd',
+          } as SFDateWidgetSchema,
+        },
+      },
+    };
+    this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
+  }
+
+  /**
+   * 初始化数据列表
+   */
+  initST() {
+    this.columns = [
+      {
+        title: '投诉单号',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '运单号',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '投诉时间',
+        width: '100px',
+        className: 'text-center',
+      },
+      { title: '托运方', index: 'externalSn', width: '120px', className: 'text-center' },
+      { title: '司机', index: 'linkUrl', width: '120px', className: 'text-center' },
+      {
+        title: '投诉原因',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '投诉状态',
+        className: 'text-center',
+        width: '120px',
+      }, {
+        title: '处理结果',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '投诉方',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '投诉人',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '操作',
+        fixed: 'right',
+        width: '200px',
+        className: 'text-left',
+        buttons: [
+          {
+            text: '处理',
+            click: (_record) => this.viewEvaluate(_record),
+          },
+          {
+            text: '查看',
+            click: (_record) => this.viewEvaluate(_record),
+          },
+        ],
+      },
+    ];
+  }
+  initSTAudit() {
+    this.schemaView = {
+      properties: {
+        roleDescription: {
+          title: '处理结果',
+          type: 'string',
+          maxLength: 50,
+          ui: {
+            placeholder: '最多不超过50字',
+            widget: 'textarea',
+            autosize: { minRows: 3, maxRows: 6 }
+          },
+        },
+      },
+    };
+    this.uiView = { '*': { spanLabelFixed: 110, grid: { span: 24 } } };
+  }
+  /**
+   * 查询字段个数
+   */
+  get queryFieldCount(): number {
+    return Object.keys(this.schema?.properties || {}).length;
+  }
+  /**
+  * 伸缩查询条件
+  */
+  expandToggle(): void {
+    this._$expand = !this._$expand;
+    this.sf?.setValue('/_$expand', this._$expand);
+  }
+  tabChange(item: any) {
+    console.log(item)
+  }
+  /**
+   * 重置表单
+   */
+  resetSF(): void {
+    this.sf.reset();
+    this._$expand = false;
+  }
+
+
+
+  // 获取录单员 
+  getCatalogueMember() {
+    const params = {
+    };
+    return this.service.request(this.service.$api_get_catalogue_member, params, 'GET').pipe(
+      map((res) => {
+        if (res) {
+          console.log(res)
+        }
+      }),
+    );
+  }
+
+  selectChange(e: number) {
+    console.log(e);
+  }
+  /**
+   * 导入货源
+   */
+  importGoodsSource() {
+
+  }
+  audit(item: any) {
+    console.log(item)
+  }
+
+ /*
+  * 审核关闭弹窗
+  view: 1
+  浮动费用： 0
+  查看评价： 3
+  */
+  handleCancel(type: string) {
+    console.log(type)
+    this.isVisibleRE = false
+  }
+    /**
+  * 审核通过按钮
+  */
+  handleOK() {
+    
+  }
+   /**
+  *查看评价
+  */
+  viewEvaluate(item: any) {
+    this.isVisibleRE = true
+  }
+}

src/app/routes/order-management/components/risk/risk.component.html

@@ -0,0 +1,91 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-03 11:10:14
+ * @LastEditTime: 2021-12-07 14:42:43
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\supply-management\components\vehicle\vehicle.component.html
+-->
+<!-- 搜索表单 -->
+<page-header-wrapper [title]="''">
+</page-header-wrapper>
+<nz-card>
+  <div nz-row nzGutter="8">
+    <!-- 查询字段小于或等于3个时，不显示伸缩按钮 -->
+    <div nz-col nzSpan="24" *ngIf="queryFieldCount <= 4">
+      <sf #sf [schema]="schema" [ui]="ui" [mode]="'search'" [disabled]="!sf?.valid" [loading]="service.http.loading"
+        (formSubmit)="st?.load(1)" (formReset)="resetSF()"></sf>
+    </div>
+
+    <!-- 查询字段大于3个时，根据展开状态调整布局 -->
+    <ng-container *ngIf="queryFieldCount > 4">
+      <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]="service.http.loading"
+          (click)="st?.load(1)">查询</button>
+        <button nz-button nzType="primary" 
+         >导出</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>
+    </ng-container>
+  </div>
+</nz-card>
+
+<nz-card>
+  <nz-tabset (nzSelectedIndexChange)="selectChange($event)" >
+    <nz-tab *ngFor="let tab of tabs; let i = index"  [nzTitle]="tab.name + ' (' + tab.count + ') '" (nzClick)="tabChange(i)">
+    </nz-tab>
+  </nz-tabset>
+  <div style="margin-top: 15px;">
+    <!-- [req]="{ method: 'GET', 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, 30, 50, 100, 200, 300, 500, 1000] }"
+      [loadingDelay]="500" [loading]="service.http.loading" -->
+    <st #st [scroll]="{ x: '1200px' }" [data]="service.$api_get_catalogue_member" [columns]="columns">
+      <ng-template st-row="goodsId" let-item let-index="index">
+        <a [routerLink]="'/order-management/vehicle-detail/'+item.id">{{item.no}}</a>
+      </ng-template>
+      <!-- <ng-template st-row="externalSn" let-item let-index="index">
+        <span class="mr-xs">{{111111}}</span>
+        <a (click)="editEnternalSn(item)">编辑</a>
+      </ng-template> -->
+      <ng-template st-row="enStatusStr27878" let-item let-index="index">
+        <div class="mr-xs" nzPopoverTitle="Title" nz-popover [nzPopoverContent]="contentTemplate">{{item.no}}</div>
+      </ng-template>
+      <ng-template st-row="feiong" let-item let-index="index">
+        <div style="color: aqua;" >
+          {{item.no}}
+        </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>
+
+<nz-modal [(nzVisible)]="isVisibleRE"  [nzWidth]="600" [nzFooter]="nzModalFooterview2"  (nzOnOk)="handleOK()" nzTitle="审核" (nzOnCancel)="handleCancel('1')">
+  <ng-container *nzModalContent>
+    <sf #sfView [schema]="schemaView" [ui]="uiView" [compact]="true" [button]="'none'">
+    </sf>
+  </ng-container>
+  <ng-template #nzModalFooterview2>
+    <button nz-button nzType="default" (click)="handleCancel('1')">取消</button>
+    <button nz-button nzType="primary" (click)="handleOK()">确定</button>
+  </ng-template>
+</nz-modal>
+
+

src/app/routes/order-management/components/risk/risk.component.spec.ts

@@ -0,0 +1,32 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-07 14:27:59
+ * @LastEditTime: 2021-12-07 14:28:59
+ * @LastEditors: your name
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\components\risk\risk.component.spec.ts
+ */
+import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { OrderManagementRiskComponent } from './risk.component';
+
+describe('OrderManagementRiskComponent', () => {
+  let component: OrderManagementRiskComponent;
+  let fixture: ComponentFixture<OrderManagementRiskComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ OrderManagementRiskComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OrderManagementRiskComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/routes/order-management/components/risk/risk.component.ts

@@ -0,0 +1,362 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { STColumn, STComponent } from '@delon/abc/st';
+import { SFComponent, SFDateWidgetSchema, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
+import { ModalHelper, _HttpClient } from '@delon/theme';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { map } from 'rxjs/operators';
+import { SupplyManagementService } from '../../services/order-management.service';
+
+
+@Component({
+  selector: 'app-supply-management-risk',
+  templateUrl: './risk.component.html',
+  styleUrls: ['./risk.component.less']
+})
+export class OrderManagementRiskComponent implements OnInit {
+  url = `/user?_allow_anonymous=true`;
+  ui: SFUISchema = {};
+  uiView: SFUISchema = {};
+  schema: SFSchema = {};
+  schemaView: SFSchema = {};
+  auditMany = false;
+  isVisibleRE = false;
+  _$expand = false;
+  @ViewChild('st') private readonly st!: STComponent;
+  @ViewChild('sf', { static: false }) sf!: SFComponent;
+  @ViewChild('sfView', { static: false }) sfView!: SFComponent;
+  columns: STColumn[] = [];
+  datass: any = [
+    {
+    one: '1',
+    two: '1',
+    three: '1',
+    id: 1
+   },
+    {
+    one: '2',
+    two: '2',
+    three: '2',
+    id: 2
+   },
+];
+  tabs = [  {
+    name: '全部',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '待申诉',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '申诉中',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '申诉成功',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '申诉失败',
+    type: 5,
+    count: 0,
+  },
+  ];
+  constructor(public service: SupplyManagementService, private modal: NzModalService) { }
+
+  /**
+ * 查询参数
+ */
+  get reqParams() {
+    return {
+      ...this.sf?.value,
+    };
+  }
+  get selectedRows() {
+    return this.st?.list.filter((item) => item.checked) || [];
+  }
+  ngOnInit(): void {
+    this.initSF();
+    this.initST();
+    this.initSTAudit();
+  }
+
+
+
+  /**
+ * 初始化查询表单
+ */
+  initSF() {
+    this.schema = {
+      properties: {
+        _$expand: { type: 'boolean', ui: { hidden: true } },
+        no: {
+          type: 'string',
+          title: '运单号',
+        },
+        no2: {
+          type: 'string',
+          title: '货源编号'
+        },
+        no1: {
+          type: 'string',
+          title: '外部订单号'
+        },
+        no3: {
+          type: 'string',
+          title: '装货地',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no4: {
+          type: 'string',
+          title: '卸货地',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no7: {
+          type: 'string',
+          title: '承运司机',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no9: {
+          type: 'string',
+          title: '车牌号',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no10: {
+          type: 'string',
+          title: '收款人',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        sex: {
+          title: '运单类型',
+          type: 'string',
+          default: 0,
+          enum: [
+            { label: '未知', value: 0 },
+            { label: '男', value: 1 },
+            { label: '女', value: 2 },
+            { label: '保密', value: 3 },
+          ],
+          ui: {
+            widget: 'select',
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          } as SFSelectWidgetSchema,
+        },
+        createTime: {
+          title: '创建时间',
+          type: 'string',
+          ui: {
+            widget: 'date',
+            mode: 'range',
+            format: 'yyyy-MM-dd',
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          } as SFDateWidgetSchema,
+        },
+      },
+      type: 'object',
+    };
+    this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
+  }
+
+  /**
+   * 初始化数据列表
+   */
+  initST() {
+    this.columns = [
+      {
+        title: '申诉状态',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '运单号',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '异常信息',
+        width: '100px',
+        className: 'text-center',
+      },
+      { title: '托运方', index: 'externalSn', width: '120px', className: 'text-center' },
+      { title: '无车承运人', index: 'linkUrl', width: '120px', className: 'text-center' },
+      {
+        title: '运费明细',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '运单类型',
+        className: 'text-center',
+        width: '120px',
+      }, {
+        title: '装货地',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '卸货地',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '货物信息',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '承运司机',
+        className: 'text-center',
+        width: '120px',
+        render: 'enStatusStr27878'
+      },
+      {
+        title: '收款人',
+        className: 'text-center',
+        width: '120px',
+        render: 'feiong'
+      },
+      {
+        title: '运输信息',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '操作',
+        fixed: 'right',
+        width: '200px',
+        className: 'text-left',
+        buttons: [
+          {
+            text: '审核',
+            click: (_record) => this.viewEvaluate(_record),
+          },
+          {
+            text: '详情',
+            click: (_record) => this.viewEvaluate(_record),
+          },
+        ],
+      },
+    ];
+  }
+  initSTAudit() {
+    this.schemaView = {
+      properties: {
+        roleDescription: {
+          title: '备注',
+          type: 'string',
+          maxLength: 50,
+          ui: {
+            placeholder: '通过可以不用填写原因 ，拒绝必须说明原因',
+            widget: 'textarea',
+            autosize: { minRows: 3, maxRows: 6 }
+          },
+        },
+      },
+    };
+    this.uiView = { '*': { spanLabelFixed: 110, grid: { span: 24 } } };
+  }
+  /**
+   * 查询字段个数
+   */
+  get queryFieldCount(): number {
+    return Object.keys(this.schema?.properties || {}).length;
+  }
+  /**
+  * 伸缩查询条件
+  */
+  expandToggle(): void {
+    this._$expand = !this._$expand;
+    this.sf?.setValue('/_$expand', this._$expand);
+  }
+  tabChange(item: any) {
+    console.log(item)
+  }
+  /**
+   * 重置表单
+   */
+  resetSF(): void {
+    this.sf.reset();
+    this._$expand = false;
+  }
+
+
+
+  // 获取录单员 
+  getCatalogueMember() {
+    const params = {
+    };
+    return this.service.request(this.service.$api_get_catalogue_member, params, 'GET').pipe(
+      map((res) => {
+        if (res) {
+          console.log(res)
+        }
+      }),
+    );
+  }
+
+  selectChange(e: number) {
+    console.log(e);
+  }
+  /**
+   * 导入货源
+   */
+  importGoodsSource() {
+
+  }
+  audit(item: any) {
+    console.log(item)
+  }
+
+ /*
+  * 审核关闭弹窗
+  view: 1
+  浮动费用： 0
+  查看评价： 3
+  */
+  handleCancel(type: string) {
+    console.log(type)
+    this.isVisibleRE = false
+  }
+    /**
+  * 审核通过按钮
+  */
+  handleOK() {
+    
+  }
+   /**
+  *查看评价
+  */
+  viewEvaluate(item: any) {
+    this.isVisibleRE = true
+  }
+}

src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-12-03 15:31:52
- * @LastEditTime: 2021-12-06 20:39:18
+ * @LastEditTime: 2021-12-07 15:09:44
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html
@@ -135,12 +135,14 @@
   
   <div nz-row>
     <nz-card nzTitle="轨迹信息" style="width: 100%;" >
-   <div>
+      <div nz-row > 
+        <div nz-col [nzSpan]='12'>
     <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }">
     </st>
   </div>
-   <div>
+  <div nz-col [nzSpan]='12'>
-     <!-- <app-ordermanage-map></app-ordermanage-map> -->
+     <amap-path-simplifier></amap-path-simplifier>
+   </div>
    </div>
     </nz-card>
   </div>

src/app/routes/order-management/order-management-routing.module.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-12-03 15:31:52
- * @LastEditTime: 2021-12-07 14:06:49
+ * @LastEditTime: 2021-12-07 14:47:51
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \tms-obc-web\src\app\routes\order-management\order-management-routing.module.ts
@@ -13,7 +13,9 @@ import { OrderManagementAdditionalcComponent } from './components/additionalc/ad
 import { OrderManagementBulkeDetailComponent } from './components/bulk-detail/bulk-detail.component';
 import { OrderManagementBulkComponent } from './components/bulk/bulk.component';
 import { OrderManagementCarManageComponent } from './components/car-manage/car-manage.component';
+import { OrderManagementComplaintComponent } from './components/complaint/complaint.component';
 import { OrderManagementDriverManageComponent } from './components/driver-manage/driver-manage.component';
+import { OrderManagementRiskComponent } from './components/risk/risk.component';
 import { OrderManagementVehicleDetailComponent } from './components/vehicle-detail/vehicle-detail.component';
 import { OrderManagementVehicleComponent } from './components/vehicle/vehicle.component';
 
@@ -26,6 +28,8 @@ const routes: Routes = [
   { path: 'car-manage', component: OrderManagementCarManageComponent },
   { path: 'additionalc', component: OrderManagementAdditionalcComponent },
   { path: 'additionalc-detail/:id', component: OrderManagementAdditionalcDetailComponent },
+  { path: 'risk', component: OrderManagementRiskComponent },
+  { path: 'complaint', component: OrderManagementComplaintComponent },
 ]
 @NgModule({
   imports: [RouterModule.forChild(routes)],

src/app/routes/order-management/order-management.module.ts

@@ -13,7 +13,9 @@ import { OrderManagementAdditionalcComponent } from './components/additionalc/ad
 import { OrderManagementBulkeDetailComponent } from './components/bulk-detail/bulk-detail.component';
 import { OrderManagementBulkComponent } from './components/bulk/bulk.component';
 import { OrderManagementCarManageComponent } from './components/car-manage/car-manage.component';
+import { OrderManagementComplaintComponent } from './components/complaint/complaint.component';
 import { OrderManagementDriverManageComponent } from './components/driver-manage/driver-manage.component';
+import { OrderManagementRiskComponent } from './components/risk/risk.component';
 import { OrderManagementVehicleDetailComponent } from './components/vehicle-detail/vehicle-detail.component';
 
 import { OrderManagementVehicleComponent } from './components/vehicle/vehicle.component';
@@ -27,7 +29,9 @@ const COMPONENTS: Type<void>[] = [
   OrderManagementDriverManageComponent,
   OrderManagementCarManageComponent,
   OrderManagementAdditionalcComponent,
-  OrderManagementAdditionalcDetailComponent
+  OrderManagementAdditionalcDetailComponent,
+  OrderManagementRiskComponent,
+  OrderManagementComplaintComponent
 ];
 
 @NgModule({

src/app/routes/routes-routing.module.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-11-29 10:20:33
- * @LastEditTime: 2021-12-03 15:58:57
+ * @LastEditTime: 2021-12-07 14:57:47
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \tms-obc-web\src\app\routes\routes-routing.module.ts
@@ -37,6 +37,7 @@ const routes: Routes = [
       { path: 'vehicle', loadChildren: () => import('./vehicle/vehicle.module').then(m => m.VehicleModule) },
       { path: 'supply-management', loadChildren: () => import('./supply-management/supply-management.module').then((m) => m.SupplyManagementModule) },
       { path: 'order-management', loadChildren: () => import('./order-management/order-management.module').then((m) => m.OrderManagementModule) },
+      { path: 'waybill-management', loadChildren: () => import('./waybill-management/waybill-management.module').then((m) => m.WaybillManagementModule) },
     ]
   },
   // passport

src/app/routes/waybill-management/components/vehicle-detail/vehicle-detail.component.html

@@ -0,0 +1,149 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-03 15:31:52
+ * @LastEditTime: 2021-12-07 15:08:56
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html
+-->
+<page-header-wrapper [title]="''" [logo]="logo">
+  <ng-template #logo>
+    <button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
+      <i nz-icon nzType="left" nzTheme="outline"></i>
+    </button>
+  </ng-template>
+</page-header-wrapper>
+<nz-card>
+  <nz-spin *ngIf="!i" class="modal-spin"></nz-spin>
+  <div nz-row>
+    <div nz-col nzSpan="4">
+      <sv-container class="bdr">
+        <sv label="订单号" col="1">{{ i?.no }}</sv>
+        <sv-title class="text-center text-lg">待接单</sv-title>
+        <sv-title>
+          <div class="">
+            <a class="btn-size" (click)="hand()">指派车队长</a>
+            <!-- <a class="btn-size m-lg mr-lg">取消货源</a>
+            <a class="btn-size">再下一单</a> -->
+          </div>
+        </sv-title>
+      </sv-container>
+    </div>
+    <div nz-col nzSpan="16" class="approval-status">
+      <nz-steps style="width: 80%; margin: 0 auto" [nzLabelPlacement]="'vertical'">
+        <nz-step nzStatus="finish" nzIcon="user" [nzDescription]="i?.createAt" nzTitle="下单"></nz-step>
+        <nz-step nzStatus="finish" nzIcon="solution" nzTitle="完结"></nz-step>
+      </nz-steps>
+    </div>
+  </div>
+  <nz-divider></nz-divider>
+  <div sv-container *ngIf="i">
+    <sv label="项目名称">{{ i?.owner }}</sv>
+    <sv label="调度员">32943898021309809423</sv>
+    <sv label="承诺付款时间">3321944288191034921</sv>
+    <sv label="服务类型">18112345678</sv>
+  </div>
+  <nz-divider></nz-divider>
+  <div nz-row>
+    <div nz-col nzSpan="6">
+      <div class="source-info">
+        <h3>装卸货信息</h3>
+        <p>装货地：广东省深圳市龙岗区怡亚通大厦</p>
+        <p>联系人：奥利给/13680058545</p>
+        <p>卸货地：广东省深圳市福田区岗厦村9巷8号405（新村）</p>
+        <p>联系人：花花世界/13680058545</p>
+        <p>发货日期：广东省深圳市福田区岗厦村9巷8号405（新村）</p>
+        <p>卸货日期：花花世界/13680058545</p>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="source-info bdr bdl pl-md">
+        <h3>货物信息</h3>
+        <p>货物名称：广东省深圳市龙岗区怡亚通大厦</p>
+        <p>重量/体积：广东省深圳市福田区岗厦村9巷8号405（新村）</p>
+        <p>车型/车长：花花世界/13680058545</p>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="source-info bdr bdl pl-md">
+        <h3>托运信息</h3>
+        <p>公司名称：广东省深圳市龙岗区怡亚通大厦</p>
+        <p>联系人：广东省深圳市福田区岗厦村9巷8号405（新村）</p>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="source-info bdr pl-md">
+        <h3>承运信息</h3>
+        <p>司机：广东省深圳市龙岗区怡亚通大厦</p>
+        <p>车牌号：广东省深圳市福田区岗厦村9巷8号405（新村）</p>
+        <p>车型/车长/承重：{{'拖车'}} | {{'4.5米'}} | {{'15吨'}}</p>
+      </div>
+    </div>
+    <div class="source-info pl-md">
+      <h3>补充信息</h3>
+      <p style="color: #1890ff;">协议附件</p>
+      <p style="color: #1890ff;"> 装车附件</p>
+      <p style="color: #1890ff;">卸货附件</p>
+      <p style="color: #1890ff;">回单附件</p>
+    </div>
+  </div>
+  <nz-divider></nz-divider>
+  <div nz-row>
+    <div class="freight-info-box">
+      <h3>运费信息</h3>
+      <div class="text-right">
+        <p><label class="freigth-label">收款人:</label><span>{{400 | currency }}</span></p>
+        <p><label class="freigth-label">预付:</label><span>{{400 | currency }}</span></p>
+        <p><label class="freigth-label">油卡:</label><span>{{400 | currency }}</span></p>
+        <p><label class="freigth-label">到付:</label><span>{{400 | currency }}</span></p>
+        <p><label class="freigth-label">回单付:</label><span>{{400 | currency}}</span></p>
+        <p><label class="freigth-label">附加费:</label><span>{{400 | currency }}</span></p>
+      </div>
+    </div>
+    <nz-divider></nz-divider>
+    <div class="freight-info-box" nz-row>
+      <div nz-col nzSpan="24">
+        <h3 class="text-right"><label>总计 :</label> <span class="text-error-dark text-xl">{{400 | currency }}</span></h3>
+        <h3 class="text-right">未支付</h3>
+      </div>
+
+    </div>
+  </div>
+  <nz-divider></nz-divider>
+  <div style="display: flex; justify-content: space-evenly;">
+    <div>
+      <div>
+        <span class="leftPadding">司机运输费</span>
+        <span class="leftPadding">1000.00</span>
+        <span class="leftPadding">未支付</span>
+      </div>
+    </div>
+    <div>
+      <div>
+        <span class="leftPadding">司机运输费</span>
+        <span class="leftPadding">1000.00</span>
+        <span class="leftPadding">未支付</span>
+      </div>
+      <div>
+        <span class="leftPadding">附加费</span>
+        <span class="leftPadding">1000.00</span>
+        <span class="leftPadding">未支付</span>
+      </div>
+    </div>
+  </div>
+  <nz-divider></nz-divider>
+  
+  <div nz-row>
+    <nz-card nzTitle="轨迹信息" style="width: 100%;" >
+      <div nz-row > 
+        <div nz-col [nzSpan]='12'>
+    <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }">
+    </st>
+  </div>
+  <div nz-col [nzSpan]='12'>
+     <amap-path-simplifier></amap-path-simplifier>
+   </div>
+   </div>
+    </nz-card>
+  </div>
+</nz-card>

src/app/routes/waybill-management/components/vehicle-detail/vehicle-detail.component.less

@@ -0,0 +1,36 @@
+:host{
+    .btn-size{
+        font-size: 14px;
+    }
+    .bdr{
+        border-right: 1px solid #ccc;
+    }
+    .bdl{
+        border-left: 1px solid #ccc;
+    }
+    .source-info{
+        p{
+            margin-bottom: .5em;
+        }
+    }
+    .freight-info-box{
+        width: 95%;
+    }
+    .freigth-label{
+        display: inline-block;
+        width: 50px;
+        text-align: right;
+    }
+
+    ::ng-deep{
+      .approval-status{
+         .ant-steps{
+             width: 70%;
+             margin: 0 auto;
+         } 
+      }  
+    }
+    .leftPadding {
+        padding-right: 100px;
+    }
+}

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

@@ -0,0 +1,32 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-07 14:52:29
+ * @LastEditTime: 2021-12-07 14:56:17
+ * @LastEditors: your name
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\waybill-management\components\vehicle-detail\vehicle-detail.component.spec.ts
+ */
+import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
+import { WaybillManagementVehicleDetailComponent } from './vehicle-detail.component';
+
+describe('WaybillManagementVehicleDetailComponent', () => {
+  let component: WaybillManagementVehicleDetailComponent;
+  let fixture: ComponentFixture<WaybillManagementVehicleDetailComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ WaybillManagementVehicleDetailComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(WaybillManagementVehicleDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/routes/waybill-management/components/vehicle-detail/vehicle-detail.component.ts

@@ -0,0 +1,60 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-03 15:31:52
+ * @LastEditTime: 2021-12-07 14:55:57
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts
+ */
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { STColumn } from '@delon/abc/st';
+import { _HttpClient } from '@delon/theme';
+import { NzMessageService } from 'ng-zorro-antd/message';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { SupplyManagementService } from '../../services/waybill-management.service';
+@Component({
+  selector: 'app-supply-management-vehicle-detail',
+  templateUrl: './vehicle-detail.component.html',
+  styleUrls: ['./vehicle-detail.component.less']
+})
+export class WaybillManagementVehicleDetailComponent implements OnInit {
+
+  id = this.route.snapshot.params.id;
+  i: any;
+  logColumns: STColumn[] = [
+    { title: '时间', index: 'operationUserPhone' },
+    { title: '地点', index: ' createTime' },
+  ];
+
+  constructor(
+    private route: ActivatedRoute,
+    private msgSrv: NzMessageService,
+    private service: SupplyManagementService,
+    private modalService: NzModalService
+  ) {
+
+  }
+
+  ngOnInit(): void {
+    this.service.http.get(`/user/${this.id}?_allow_anonymous=true&_allow_badcode=true`).subscribe(res => {
+      console.log(res);
+      this.i = res
+    });
+  }
+
+
+
+  hand() {
+    this.modalService.create({
+      nzTitle: '',
+      // nzContent: OrderManagementGaodeMapComponent,
+      nzWidth: 1200
+    });
+  }
+
+  goBack() {
+    window.history.go(-1);
+  }
+  
+}

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

@@ -0,0 +1,153 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-03 11:10:14
+ * @LastEditTime: 2021-12-07 15:07:56
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\supply-management\components\vehicle\vehicle.component.html
+-->
+<!-- 搜索表单 -->
+<page-header-wrapper [title]="''">
+</page-header-wrapper>
+<nz-card>
+  <div nz-row nzGutter="8">
+    <!-- 查询字段小于或等于3个时，不显示伸缩按钮 -->
+    <div nz-col nzSpan="24" *ngIf="queryFieldCount <= 4">
+      <sf #sf [schema]="schema" [ui]="ui" [mode]="'search'" [disabled]="!sf?.valid" [loading]="service.http.loading"
+        (formSubmit)="st?.load(1)" (formReset)="resetSF()"></sf>
+    </div>
+
+    <!-- 查询字段大于3个时，根据展开状态调整布局 -->
+    <ng-container *ngIf="queryFieldCount > 4">
+      <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]="service.http.loading"
+          (click)="st?.load(1)">查询</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>
+    </ng-container>
+  </div>
+</nz-card>
+
+<nz-card>
+  <nz-tabset (nzSelectedIndexChange)="selectChange($event)" [nzTabBarExtraContent]="extraTemplate">
+    <nz-tab *ngFor="let tab of tabs; let i = index"  [nzTitle]="tab.name + ' (' + tab.count + ') '" (nzClick)="tabChange(i)">
+    </nz-tab>
+  </nz-tabset>
+  <div style="margin-top: 15px;">
+    <!-- [req]="{ method: 'GET', 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, 30, 50, 100, 200, 300, 500, 1000] }"
+      [loadingDelay]="500" [loading]="service.http.loading" -->
+    <st #st [scroll]="{ x: '1200px' }" [data]="service.$api_get_catalogue_member" [columns]="columns">
+      <ng-template st-row="goodsId" let-item let-index="index">
+        <a [routerLink]="'/waybill-management/vehicle-detail/'+item.id">{{item.no}}</a>
+      </ng-template>
+      <!-- <ng-template st-row="externalSn" let-item let-index="index">
+        <span class="mr-xs">{{111111}}</span>
+        <a (click)="editEnternalSn(item)">编辑</a>
+      </ng-template> -->
+      <ng-template st-row="enStatusStr27878" let-item let-index="index">
+        <div class="mr-xs" nzPopoverTitle="Title" nz-popover [nzPopoverContent]="contentTemplate">{{item.no}}</div>
+      </ng-template>
+      <ng-template st-row="feiong" let-item let-index="index">
+        <div style="color: aqua;" (click)="OpenPrice()">
+          {{item.no}}
+        </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>
+
+
+<nz-modal [(nzVisible)]="isVisible"  [nzWidth]="600" [nzFooter]="nzModalFooter" nzTitle="浮动费用" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('0')">
+  <ng-container *nzModalContent>
+    <st
+    #stFloat
+    multiSort
+    size="small"
+    [bordered]="true"
+    [data]="datass"
+    [columns]="columnsFloat"
+    [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, 30, 50, 100, 200, 300, 500, 1000] }"
+    [loadingDelay]="500"
+  >
+  </st>
+  </ng-container>
+  <ng-template #nzModalFooter>
+    <button nz-button nzType="primary" (click)="handleCancel('0')">取消</button>
+    <button nz-button nzType="default" (click)="handleOK()">确定</button>
+  </ng-template>
+</nz-modal>
+
+
+<nz-modal [(nzVisible)]="isVisibleView"  [nzWidth]="600" [nzFooter]="nzModalFooterview" nzTitle="查看" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('1')">
+  <ng-container *nzModalContent>
+    <st
+    #stFloatView
+    multiSort
+    size="small"
+    [bordered]="true"
+    [data]="datass"
+    [columns]="columnsFloatView"
+    [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, 30, 50, 100, 200, 300, 500, 1000] }"
+    [loadingDelay]="500"
+  >
+  </st>
+  <div><span>变更原因2：</span></div>
+  <div><span>拒绝原因：</span></div>
+  <div><span>注：</span></div>
+  </ng-container>
+  <ng-template #nzModalFooterview>
+    <button nz-button nzType="default" (click)="handleCancel('1')">取消</button>
+    <button nz-button nzType="primary" (click)="handleOK()">确定</button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isVisibleEvaluate"  [nzWidth]="600" [nzFooter]="nzModalFooterEvaluate"  (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('2')">
+  <ng-container *nzModalContent>
+    <nz-tabset>
+      <nz-tab nzTitle="我的评价">
+      <div>
+        评分: <nz-rate [ngModel]="2.5" nzAllowHalf></nz-rate>
+        <div><span>评价内容：</span></div>
+      </div>
+      </nz-tab>
+      <nz-tab nzTitle="司机评价">
+      <div>
+        暂无评价内容
+      </div>
+      </nz-tab>
+    </nz-tabset>
+  </ng-container>
+  <ng-template #nzModalFooterEvaluate>
+    <button nz-button nzType="default" (click)="handleCancel('2')">取消</button>
+    <button nz-button nzType="primary" (click)="handleOK()">确定</button>
+  </ng-template>
+</nz-modal>
+
+<ng-template #extraTemplate>
+  <div>
+    <button  nz-button nzType="primary">导出</button>
+  </div>
+</ng-template>

src/app/routes/waybill-management/components/vehicle/vehicle.component.less

@@ -0,0 +1,2 @@
+:host {
+}

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

@@ -0,0 +1,24 @@
+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/waybill-management/components/vehicle/vehicle.component.ts

@@ -0,0 +1,488 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { STColumn, STComponent } from '@delon/abc/st';
+import { SFComponent, SFDateWidgetSchema, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
+import { ModalHelper, _HttpClient } from '@delon/theme';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { map } from 'rxjs/operators';
+import { SupplyManagementService } from '../../services/waybill-management.service';
+
+
+@Component({
+  selector: 'app-supply-management-vehicle',
+  templateUrl: './vehicle.component.html',
+  styleUrls: ['./vehicle.component.less']
+})
+export class WaybillManagementVehicleComponent implements OnInit {
+  url = `/user?_allow_anonymous=true`;
+  ui: SFUISchema = {};
+  schema: SFSchema = {};
+  auditMany = false;
+  isVisibleView = false;
+  isVisibleEvaluate = false;
+  isVisible = false;
+  _$expand = false;
+  @ViewChild('st') private readonly st!: STComponent;
+  @ViewChild('stFloat') private readonly stFloat!: STComponent;
+  @ViewChild('stFloatView') private readonly stFloatView!: STComponent;
+  @ViewChild('sf', { static: false }) sf!: SFComponent;
+  @ViewChild('sfFre', { static: false }) sfFre!: SFComponent;
+  columns: STColumn[] = [];
+  columnsFloat: STColumn[] = [];
+  columnsFloatView: STColumn[] = [];
+  datass: any = [
+    {
+    one: '1',
+    two: '1',
+    three: '1',
+    id: 1
+   },
+    {
+    one: '2',
+    two: '2',
+    three: '2',
+    id: 2
+   },
+];
+  tabs = [  {
+    name: '全部',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '待接单',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '待发车',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '运输中',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '代签收',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '已完成',
+    type: 5,
+    count: 0,
+  },
+  {
+    name: '已取消',
+    type: 5,
+    count: 0,
+  },
+  ];
+  constructor(public service: SupplyManagementService, private modal: NzModalService) { }
+
+  /**
+ * 查询参数
+ */
+  get reqParams() {
+    return {
+      ...this.sf?.value,
+    };
+  }
+  get selectedRows() {
+    return this.st?.list.filter((item) => item.checked) || [];
+  }
+  ngOnInit(): void {
+    this.initSF();
+    this.initST();
+    this.initSTFloat();
+    this.initSTFloatView();
+  }
+
+
+
+  /**
+ * 初始化查询表单
+ */
+  initSF() {
+    this.schema = {
+      properties: {
+        _$expand: { type: 'boolean', ui: { hidden: true } },
+        no: {
+          type: 'string',
+          title: '运单号',
+        },
+        no2: {
+          type: 'string',
+          title: '货源编号'
+        },
+        no1: {
+          type: 'string',
+          title: '托运公司'
+        },
+        no3: {
+          type: 'string',
+          title: '装货地',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no4: {
+          type: 'string',
+          title: '卸货地',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no7: {
+          type: 'string',
+          title: '承运司机',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no9: {
+          type: 'string',
+          title: '车牌号',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        no10: {
+          type: 'string',
+          title: '收款人',
+          ui: {
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          }
+        },
+        sex: {
+          title: '支付状态',
+          type: 'string',
+          default: 0,
+          enum: [
+            { label: '未知', value: 0 },
+            { label: '男', value: 1 },
+            { label: '女', value: 2 },
+            { label: '保密', value: 3 },
+          ],
+          ui: {
+            widget: 'select',
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          } as SFSelectWidgetSchema,
+        },
+        createTime: {
+          title: '创建时间',
+          type: 'string',
+          ui: {
+            widget: 'date',
+            mode: 'range',
+            format: 'yyyy-MM-dd',
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          } as SFDateWidgetSchema,
+        },
+        appId: {
+          type: 'string',
+          title: '是否风险单',
+          ui: {
+            widget: 'select',
+            placeholder: '请选择',
+            visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+            allowClear: true,
+            asyncData: () => this.getCatalogueMember(),
+          },
+        },
+      },
+      type: 'object',
+    };
+    this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
+  }
+
+  /**
+   * 初始化数据列表
+   */
+  initST() {
+    this.columns = [
+      { title: '', type: 'checkbox', width: '50px', className: 'text-center' },
+      {
+        title: '运单号',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '货源编号',
+        width: '100px',
+        className: 'text-center',
+      },
+      { title: '托运公司', index: 'externalSn', width: '120px', className: 'text-center' },
+      { title: '装货地', index: 'linkUrl', width: '120px', className: 'text-center' },
+      {
+        title: '卸货地',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '货物名称',
+        className: 'text-center',
+        width: '120px',
+      }, {
+        title: '重量/体积',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '承运司机',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '车牌号',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '出价',
+        className: 'text-center',
+        width: '120px',
+        render: 'enStatusStr27878'
+      },
+      {
+        title: '浮动费用',
+        className: 'text-center',
+        width: '120px',
+        render: 'feiong'
+      },
+      {
+        title: '成交金额',
+        className: 'text-center',
+        width: '120px',
+      },
+      {
+        title: '收款人',
+        className: 'text-center',
+        index: 'enStatusStr2',
+        type: 'badge',
+        width: '100px',
+        badge: {
+          正常: { text: '正常', color: 'success' },
+          冻结: { text: '冻结', color: 'warning' },
+          废弃: { text: '废弃', color: 'default' },
+        },
+      },
+      {
+        title: '支付状态',
+        width: '170px',
+        className: 'text-center',
+      },
+      {
+        title: '创建时间',
+        className: 'text-center',
+        index: 'enStatusStr3',
+        type: 'badge',
+        width: '100px',
+        badge: {
+          正常: { text: '正常', color: 'success' },
+          冻结: { text: '冻结', color: 'warning' },
+          废弃: { text: '废弃', color: 'default' },
+        },
+      },
+      {
+        title: '异常原因',
+        className: 'text-center',
+        index: 'enStatusStr3',
+        type: 'badge',
+        width: '100px',
+        badge: {
+          正常: { text: '正常', color: 'success' },
+          冻结: { text: '冻结', color: 'warning' },
+          废弃: { text: '废弃', color: 'default' },
+        },
+      },
+      {
+        title: '运单状态',
+        className: 'text-center',
+        index: 'enStatusStr3',
+        type: 'badge',
+        width: '100px',
+        badge: {
+          正常: { text: '正常', color: 'success' },
+          冻结: { text: '冻结', color: 'warning' },
+          废弃: { text: '废弃', color: 'default' },
+        },
+      },
+      {
+        title: '操作',
+        fixed: 'right',
+        width: '200px',
+        className: 'text-left',
+        buttons: [
+          {
+            text: '查看评价',
+            click: (_record) => this.viewEvaluate(_record),
+          },
+        ],
+      },
+    ];
+  }
+  initSTFloat() {
+    this.columnsFloat = [
+      {
+        title: '序号',
+        className: 'text-center',
+        index: 'one', 
+      },
+      {
+        title: '操作时间',
+        className: 'text-center',
+        index: 'two', 
+      },
+      {
+        title: '操作人',
+        className: 'text-center',
+        index: 'three', 
+      },
+      { title: '状态', index: 'externalSn',  className: 'text-center' },
+      {
+        title: '操作',
+        fixed: 'right',
+        className: 'text-left',
+        buttons: [
+          {
+            text: '查看',
+            click: (_record) => this.FloatView(_record),
+          },
+          {
+            text: '撤销',
+            click: (_record) => this.audit(_record),
+          },
+        ],
+      },
+    ];
+  }
+  initSTFloatView() {
+    this.columnsFloatView = [
+      {
+        title: '费用名称',
+        width: '100px',
+        className: 'text-center',
+        render: 'goodsId'
+      },
+      {
+        title: '变更前',
+        width: '100px',
+        className: 'text-center',
+      },
+      { title: '变更值', index: 'externalSn', width: '120px', className: 'text-center' },
+      { title: '变更后', index: 'externalSn', width: '120px', className: 'text-center' }
+    ];
+  }
+  /**
+   * 查询字段个数
+   */
+  get queryFieldCount(): number {
+    return Object.keys(this.schema?.properties || {}).length;
+  }
+  /**
+  * 伸缩查询条件
+  */
+  expandToggle(): void {
+    this._$expand = !this._$expand;
+    this.sf?.setValue('/_$expand', this._$expand);
+  }
+  tabChange(item: any) {
+    console.log(item)
+  }
+  /**
+   * 重置表单
+   */
+  resetSF(): void {
+    this.sf.reset();
+    this._$expand = false;
+  }
+
+
+
+  // 获取录单员 
+  getCatalogueMember() {
+    const params = {
+    };
+    return this.service.request(this.service.$api_get_catalogue_member, params, 'GET').pipe(
+      map((res) => {
+        if (res) {
+          console.log(res)
+        }
+      }),
+    );
+  }
+
+  selectChange(e: number) {
+    console.log(e);
+  }
+  /**
+   * 导入货源
+   */
+  importGoodsSource() {
+
+  }
+  audit(item: any) {
+    console.log(item)
+  }
+
+ /*
+  * 审核关闭弹窗
+  view: 1
+  浮动费用： 0
+  查看评价： 3
+  */
+  handleCancel(type: string) {
+    console.log(type)
+    if(type === '0') {
+      this.isVisible = false
+    } else if(type === '1') {
+    console.log(type)
+      this.isVisibleView = false
+    } else if(type === '2') {
+    console.log(type)
+      this.isVisibleEvaluate = false
+    }
+  }
+    /**
+  * 审核通过按钮
+  */
+  handleOK() {
+    
+  }
+  OpenPrice() {
+    this.isVisible = true
+  }
+   /**
+  * 浮动费用查看
+  */
+  FloatView(item: any) {
+    console.log(item)
+    this.isVisibleView = true
+  }
+   /**
+  *查看评价
+  */
+  viewEvaluate(item: any) {
+    console.log(item)
+    this.isVisibleEvaluate = true
+  }
+}

src/app/routes/waybill-management/services/waybill-management.service.ts

@@ -0,0 +1,14 @@
+import { Injectable, Injector } from '@angular/core';
+import { BaseService } from 'src/app/shared/services';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class SupplyManagementService extends BaseService {
+
+  $api_get_catalogue_member = `/user?_allow_anonymous=true`;
+  $api_del_driver = ``;
+  constructor(public injector: Injector) {
+    super(injector)
+  }
+}

src/app/routes/waybill-management/waybill-management-routing.module.ts

@@ -0,0 +1,22 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-03 15:31:52
+ * @LastEditTime: 2021-12-07 14:56:57
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\order-management-routing.module.ts
+ */
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { WaybillManagementVehicleDetailComponent } from './components/vehicle-detail/vehicle-detail.component';
+import { WaybillManagementVehicleComponent } from './components/vehicle/vehicle.component';
+
+const routes: Routes = [
+  { path: 'vehicle', component: WaybillManagementVehicleComponent },
+  { path: 'vehicle-detail/:id', component: WaybillManagementVehicleDetailComponent },
+]
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class WaybillManagementRoutingModule { }

src/app/routes/waybill-management/waybill-management.module.ts

@@ -0,0 +1,28 @@
+/*
+ * @Author: your name
+ * @Date: 2021-12-03 15:31:52
+ * @LastEditTime: 2021-12-07 14:57:09
+ * @LastEditors: Please set LastEditors
+ * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @FilePath: \tms-obc-web\src\app\routes\order-management\order-management.module.ts
+ */
+import { NgModule, Type } from '@angular/core';
+import { SharedModule } from '@shared';
+
+import { WaybillManagementVehicleDetailComponent } from './components/vehicle-detail/vehicle-detail.component';
+
+import { WaybillManagementVehicleComponent } from './components/vehicle/vehicle.component';
+import { WaybillManagementRoutingModule } from './waybill-management-routing.module';
+const COMPONENTS: Type<void>[] = [
+  WaybillManagementVehicleComponent,
+  WaybillManagementVehicleDetailComponent
+];
+
+@NgModule({
+  imports: [
+    SharedModule,
+    WaybillManagementRoutingModule
+  ],
+  declarations: COMPONENTS,
+})
+export class WaybillManagementModule { }

src/assets/mocks/menu-data.json

@@ -214,6 +214,16 @@
                 }
                ]
             },
+            {
+              "text": "风险单管理",
+              "icon": "anticon anticon-dashboard",
+              "link": "/order-management/risk"
+            },
+            {
+              "text": "投诉管理",
+              "icon": "anticon anticon-dashboard",
+              "link": "/order-management/complaint"
+            },
             {
               "text": "整车订单详情",
               "icon": "anticon anticon-dashboard",
@@ -234,6 +244,31 @@
             }
           ]
         },
+        {
+          "text": "运单管理",
+          "icon": "anticon anticon-dashboard",
+          "group": true,
+          "children": [
+            {
+              "text": "整车运单",
+              "link": "/waybill-management/vehicle"
+            },
+            {
+              "hide": true,
+              "text": "整车运单详情",
+              "link": "/waybill-management/vehicle-detail/:id"
+            },
+            {
+              "text": "大宗运单",
+              "link": "/waybill-management/vehicle"
+            },
+            {
+              "hide": true,
+              "text": "大宗运单详情",
+              "link": "/waybill-management/vehicle-detail/:id"
+            }
+          ]
+        },
         {
           "text": "车辆管理",
           "icon": "anticon anticon-dashboard",