Merge branch 'develop' of https://gitlab.eascs.com/tms-ui/tms-obc-web into develop

src/app/routes/datatable/components/busitable/busiindex/busiindex.component.ts

@@ -75,6 +75,11 @@ export class DatatableBusiindexComponent implements OnInit {
     } else if(this.mode === 'month') {
       type = 2
     }
+    if(this.modeNext === 'year') {
+      type = 1
+    } else if(this.modeNext === 'month') {
+      type = 2
+    }
     const params: any = {
       time: this.timeNext,
       type
@@ -83,8 +88,8 @@ export class DatatableBusiindexComponent implements OnInit {
       if (res) {
         this.chartData = res
         if(flag) {
-          this.pillar.reRender()
+          // this.pillar.reRender()
-          this.curve.reRender()
+          // this.curve.reRender()
         }
       }
     })
@@ -112,9 +117,9 @@ export class DatatableBusiindexComponent implements OnInit {
   }
 
   changeDataNext() {
-    if(this.mode === 'year') {
+    if(this.modeNext === 'year') {
       this.dateFormat = 'yyyy'
-    } else if(this.mode === 'month') {
+    } else if(this.modeNext === 'month') {
       this.dateFormat = 'yyyy-MM'
     }
   }
@@ -122,10 +127,15 @@ export class DatatableBusiindexComponent implements OnInit {
     if(result === null) {
       return
     }
-    if(this.mode === 'year') {
+    console.log(this.mode);
+    if(this.modeNext === 'year') {
       this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00']
-    } else if(this.mode === 'month') {
+    } else if(this.modeNext === 'month') {
       this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00']
+
+      console.log(this.dateNext);
+      console.log(this.timeNext);
+      
     }
     this.initData(true)
   }

src/app/routes/datatable/components/busitable/busiindex/curve/curve.component.ts

@@ -15,9 +15,9 @@ export class BusitableCurveComponent implements OnInit, OnChanges {
   }
   ngOnChanges(changes: SimpleChanges): void {
     if (this.chartData) {
-      // setTimeout(()=>{
+      setTimeout(()=>{
-      //   this.chart.render(true)
+        this.chart.render(true)
-      // }, 1000)
+      }, 1000)
 
     }
   }
@@ -48,25 +48,23 @@ export class BusitableCurveComponent implements OnInit, OnChanges {
       year: {
         range: [0, 1],
       },
-      value: {
+      number: {
-        min: 0,
+        min: -9999,
         nice: true,
       },
     });
-    this.chart.axis('value', {
+    const itemTpl = `
-      label: {
+        <div style="padding: 15px; color: red">
-        formatter: (val: any) => {
+            环比:&nbsp;&nbsp;{value}%
-          return val;
+        </div>
-        },
+`
-      },
-    });
     this.chart.tooltip({
       showCrosshairs: true, // 展示 Tooltip 辅助线
       shared: true,
-    });
+      itemTpl: itemTpl
-
+  });
-    this.chart.line().position('time*value').label('value');
+    this.chart.line().position('time*number').label('number');
-    this.chart.point().position('time*value');
+    this.chart.point().position('time*number');
 
     this.chart.render();
   }

src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.html

@@ -1,9 +1,61 @@
-<page-header [action]="phActionTpl">
+<!--
-  <ng-template #phActionTpl>
+ * @Description  : 
-    <button (click)="add()" nz-button nzType="primary">新建</button>
+ * @Version      : 1.0
+ * @Author       : Shiming
+ * @Date         : 2022-03-30 17:57:46
+ * @LastEditors  : Shiming
+ * @LastEditTime : 2022-04-18 15:42:33
+ * @FilePath     : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\mancustomtable\\mancustomtable.component.html
+ * Copyright (C) 2022 huzhenhong. All rights reserved.
+-->
+<!-- 页头 -->
+<page-header-wrapper [title]="'业务员报告'"></page-header-wrapper>
+<nz-card >
+  <nz-tabset (nzSelectedIndexChange)="selectChange($event)" [nzTabBarExtraContent]="extraTemplate">
+    <nz-tab [nzTitle]="'客户'"></nz-tab>
+    <nz-tab [nzTitle]="'合伙人'"></nz-tab>
+  </nz-tabset>
+  <ng-template #extraTemplate>
+    <div class="chooseBox">
+      <div class="timeBox">
+        <!-- <nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()">
+          <label nz-radio-button nzValue="year">年</label>
+          <label nz-radio-button nzValue="month">月</label>
+          <label nz-radio-button nzValue="date">日</label>
+          <label nz-radio-button nzValue="define">自定义</label>
+        </nz-radio-group>
+        <div class="dateBox">
+          <nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
+          <nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'" [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
+        </div> -->
+        <sf #sf [schema]="searchSchema" button="none"
+        [ui]="{ '*': { spanLabelFixed: 0, grid: { xxl:5,xl:4, lg: 8, md: 12, sm: 12, xs: 24,gutter:20 } } }"
+        [compact]="true">
+        <ng-template sf-template="no4" let-me let-ui="ui" let-schema="schema">
+          <div class="chooseBox">
+            <div class="timeBox">
+              <nz-radio-group [(ngModel)]="mode" nzButtonStyle="solid" (ngModelChange)="changeData()">
+                <label nz-radio-button nzValue="year">年</label>
+                <label nz-radio-button nzValue="month">月</label>
+                <label nz-radio-button nzValue="date">日</label>
+                <label nz-radio-button nzValue="define">自定义</label>
+              </nz-radio-group>
+              <div class="dateBox">
+                <nz-date-picker [(ngModel)]="date" [nzMode]="mode" [nzFormat]="dateFormat" *ngIf="mode !== 'define'"
+                  [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-date-picker>
+                <nz-range-picker [(ngModel)]="defineDate" [nzFormat]="dateFormat" *ngIf="mode === 'define'"
+                  [nzDisabledDate]="disabledDate" (ngModelChange)="onChange($event)"></nz-range-picker>
+              </div>
+            </div>
+          </div>
+        </ng-template>
+      </sf>
+      </div>
+    </div>
   </ng-template>
-</page-header>
+  <st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listShipperReportPage"
-<nz-card>
+    [req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
-  <sf mode="search" [schema]="searchSchema" (formSubmit)="st.reset($event)" (formReset)="st.reset($event)"></sf>
+    [scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
-  <st #st [data]="url" [columns]="columns"></st>
+    [page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }">
-</nz-card>
+  </st>
+</nz-card>

src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.less

@@ -0,0 +1,20 @@
+.chooseBox {
+    display: flex;
+    float  : right;
+}
+
+.timeBox {
+    display: flex;
+    margin : 0 0 0 10px;
+}
+
+.dateBox {
+    display: inline-block;
+    margin : 0 0 0 10px;
+}
+
+:host::ng-deep {
+    .ant-form-item-control {
+        max-width: 100%;
+    }
+}

src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.ts

@@ -1,45 +1,233 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { STColumn, STComponent } from '@delon/abc/st';
-import { SFSchema } from '@delon/form';
+import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
-import { ModalHelper, _HttpClient } from '@delon/theme';
+import {  DatePipe, _HttpClient } from '@delon/theme';
+import { differenceInCalendarDays } from 'date-fns';
+import { DataService } from '../../../services/data.service';
+
 
 @Component({
   selector: 'app-datatable-mancustomtable',
   templateUrl: './mancustomtable.component.html',
+  styleUrls: ['./mancustomtable.component.less'],
+  providers: [DatePipe]
 })
 export class DatatableMancustomtableComponent implements OnInit {
   url = `/user`;
+  @ViewChild('st', { static: false }) st!: STComponent;
+  @ViewChild('sf', { static: false }) sf!: SFComponent;
+  _$expand = false;
+  type = 1;
+  mode = 'year';
+  date: any = null;
+  defineDate = [];
+  time: any = ['2022-01-01 00:00:00']
+  dateFormat = 'yyyy';
+  today = new Date();
+  ui: SFUISchema = {};
+  schema: SFSchema = {};
+  isLoading: boolean = false;
   searchSchema: SFSchema = {
     properties: {
-      no: {
+      customerName: {
         type: 'string',
-        title: '编号'
+        title: '',
+        ui: {
+          placeholder: '请输入客户名称',
+          change: (value: any) => {
+            console.log(value);
+            this.st.reload({ ...this.reqParams });
+          }
+        },
+     
+      },
+      salesmanName: {
+        type: 'string',
+        title: '',
+        ui: {
+          placeholder: '请输入业务员',
+          change: (value: any) => {
+            this.st.reload({ ...this.reqParams });
+          }
+        }
+      },
+      no4: {
+        type: 'string',
+        title: '',
+        ui: {
+          class: 'custom',
+          widget: 'custom',
+          grid: { xxl: 12, xl: 12, lg: 24, md: 24, sm: 24, xs: 24 }
+        }
       }
     }
   };
-  @ViewChild('st') private readonly st!: STComponent;
   columns: STColumn[] = [
-    { title: '编号', index: 'no' },
+    { title: '货主名称', index: 'enterpriseName', className: 'text-center', width: '200px' },
-    { title: '调用次数', type: 'number', index: 'callNo' },
+    { title: '注册时间', index: 'registerTime', className: 'text-center', width: '200px' },
-    { title: '头像', type: 'img', width: '50px', index: 'avatar' },
+    { title: '客户类型', index: 'customerType', className: 'text-center', width: '100px', type: 'enum', enum: {
-    { title: '时间', type: 'date', index: 'updatedAt' },
+      1: '平台客户',
-    {
+      2: '直客',
-      title: '',
+      3: '渠道客户'
-      buttons: [
-        // { text: '查看', click: (item: any) => `/form/${item.id}` },
-        // { text: '编辑', type: 'static', component: FormEditComponent, click: 'reload' },
-      ]
     }
+   },
+    { title: '业务员', index: 'salesmanName', className: 'text-center', width: '100px' },
+    { title: '合伙人', index: 'partnerName', className: 'text-center', width: '100px' },
+    { title: '客户状态', index: 'customerStatus', className: 'text-center', width: '100px', type: 'enum', enum: {
+      1: '未激活',
+      2: '沉默',
+      3: '流失',
+      4: '活跃'
+    } },
+    { title: '订单数', index: 'zsl', className: 'text-center', width: '100px' },
+    { title: '订单金额', index: 'ddje', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ddje }) } },
+    { title: '应收订单数', index: 'ysdds', className: 'text-center', width: '120px' },
+    { title: '应收金额', index: 'yingsje', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yingsje }) } },
+    { title: '待开票订单数', index: 'yifyf', className: 'text-center', width: '130px' },
+    { title: '待开票金额', index: 'dkpdds', className: 'text-right', width: '120px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.dkpdds }) } },
+    { title: '已收金额', index: 'yisje', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yisje }) } },
+    { title: '应收附加费', index: 'yingsfjf', className: 'text-right', width: '120px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yingsfjf }) } },
+    { title: '已收附加费', index: 'yisfjf', className: 'text-right', width: '120px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yisfjf }) } },
+    { title: '附加费率', index: 'fjfl', className: 'text-center', width: '100px' },
+    { title: '已开票金额', index: 'ykpje', className: 'text-right', width: '100px', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ykpje }) } },
   ];
-
+  /**
-  constructor(private http: _HttpClient, private modal: ModalHelper) { }
+   * 查询参数
-
+   */
-  ngOnInit(): void { }
+   get reqParams() {
-
+    if(this.mode === 'year') {
-  add(): void {
+      this.type = 1
-    // this.modal
+    } else if(this.mode === 'month') {
-    //   .createStatic(FormEditComponent, { i: { id: 0 } })
+      this.type = 2
-    //   .subscribe(() => this.st.reload());
+    } else if(this.mode === 'date') {
+      this.type = 3
+    } else {
+      this.type = 4
+    }
+    let params: any = {
+      time: this.time,
+      type: this.type,
+      ...this.sf?.value
+     };
+  
+    delete params._$expand;
+    return { ...params };
   }
+  constructor(public service: DataService, private datePipe: DatePipe) { }
+  ngOnInit(): void { 
+    this.initSF();
+  }
+ /**
+   * 初始化查询表单
+   */
+  initSF() {
+    this.schema = {
+      properties: {
+        _$expand: { type: 'boolean', ui: { hidden: true } },
+        enterpriseName: {
+          type: 'string',
+          title: '货主名称',
+          ui: {
+            placeholder: '请输入',
+          }
+        },
+        customerType: {
+          type: 'string',
+          title: '客户类型',
+          ui: {
+            widget: 'select',
+            placeholder: '请选择',
+          },
+          enum: [
+            {label: '直客', value: 2},
+            {label: '渠道客户', value: 3},
+            {label: '平台客户', value: 1},
+          ]
+        },
+        customerStatus: {
+          type: 'string',
+          title: '客户状态',
+          ui: {
+            widget: 'select',
+            placeholder: '请选择',
+          },
+          enum: [
+            {label: '未激活', value: 1},
+            {label: '沉默', value: 2},
+            {label: '流失', value: 3},
+            {label: '活跃', value: 4},
+          ]
+        },
+        registerTime: {
+          title: '注册时间',
+          type: 'string',
+          ui: {
+            widget: 'sl-from-to', type: 'date', format: 'yyyy-MM-dd', visibleIf: {
+              _$expand: (value: boolean) => value,
+            },
+          } as SFDateWidgetSchema,
+        }
+      },
+      type: 'object'
+    };
+    this.ui = { '*': { spanLabelFixed: 110, grid: { span: 8, gutter: 4 } } };
+  }
+  changeData(){
+    if(this.mode === 'year') {
+      this.dateFormat = 'yyyy'
+    } else if(this.mode === 'month') {
+      this.dateFormat = 'yyyy-MM'
+    } else {
+      this.dateFormat = 'yyyy-MM-dd'
+    } 
+  }
+  onChange(result: any) {
+    if(result === null) {
+      return
+    }
+    if(this.mode === 'year') {
+      this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00']
+    } else if(this.mode === 'month') {
+      this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00']
+    } else if(this.mode === 'date') {
+      this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00']
+    } else{
+      this.time = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + '00:00:00', this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00']
+    }
+    this.st.reload({ ...this.reqParams });
+  }
+  disabledDate = (current: Date): boolean =>
+    // Can not select days before today and today
+    differenceInCalendarDays(current, this.today) > 0;
 
+    export() {
+      // this.service.downloadFile(this.service.$api_exportUploadBill, this.sf.value, {});
+    }
+  search() {
+    this.st?.load(1)
+
+  }
+    /**
+   * 伸缩查询条件
+   */
+     expandToggle() {
+      this._$expand = !this._$expand;
+      this.sf?.setValue('/_$expand', this._$expand);
+    }
+  
+  /**
+   * 重置表单
+   */
+   resetSF() {
+    this.sf.reset();
+    this._$expand = false;
+    this.isLoading = true
+  }
+  selectChange(e: number) {
+    // this.resourceStatus = e;
+    // this.initST();
+    setTimeout(() => {
+      this.st.load();
+    }, 500);
+  }
 }