Rainie/bbq
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Taric Xin
2022-04-18 16:00:28 +08:00
parent 876e1c061f e44e999251
commit 6addf5c416
5 changed files with 322 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/app/routes/datatable/components/busitable/busiindex/busiindex.component.ts
View File

@ -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.curve.reRender()
// this.pillar.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)
}

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

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

68
src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.html
View File

@ -1,9 +1,61 @@
<page-header [action]="phActionTpl">
<ng-template #phActionTpl>
<button (click)="add()" nz-button nzType="primary">新建</button>
<!--
* @Description :
* @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>
<nz-card>
<sf mode="search" [schema]="searchSchema" (formSubmit)="st.reset($event)" (formReset)="st.reset($event)"></sf>
<st #st [data]="url" [columns]="columns"></st>
</nz-card>
<st #st multiSort [columns]="columns" [ps]="20" [data]="service.$api_listShipperReportPage"
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
[scroll]="{ x: '1200px' }" [res]="{ reName: { list: 'data.records', total: 'data.total' } }"
[page]="{ show: true, showSize: true, pageSizes: [20, 50, 100] }">
</st>
</nz-card>

20
src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.less Normal file
View File

@ -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%;
}
}

236
src/app/routes/datatable/components/customtable/mancustomtable/mancustomtable.component.ts
View File

@ -1,45 +1,233 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { STColumn, STComponent } from '@delon/abc/st';
import { SFSchema } from '@delon/form';
import { ModalHelper, _HttpClient } from '@delon/theme';
import { SFComponent, SFDateWidgetSchema, SFSchema, SFUISchema } from '@delon/form';
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: '调用次数', type: 'number', index: 'callNo' },
{ title: '头像', type: 'img', width: '50px', index: 'avatar' },
{ title: '时间', type: 'date', index: 'updatedAt' },
{
title: '',
buttons: [
// { text: '查看', click: (item: any) => `/form/${item.id}` },
// { text: '编辑', type: 'static', component: FormEditComponent, click: 'reload' },
]
{ title: '货主名称', index: 'enterpriseName', className: 'text-center', width: '200px' },
{ title: '注册时间', index: 'registerTime', className: 'text-center', width: '200px' },
{ title: '客户类型', index: 'customerType', className: 'text-center', width: '100px', type: 'enum', enum: {
1: '平台客户',
2: '直客',
3: '渠道客户'
}
},
{ 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 { }
add(): void {
// this.modal
// .createStatic(FormEditComponent, { i: { id: 0 } })
// .subscribe(() => this.st.reload());
/**
* 查询参数
*/
get reqParams() {
if(this.mode === 'year') {
this.type = 1
} else if(this.mode === 'month') {
this.type = 2
} 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);
}
}