diff --git a/src/app/routes/datatable/components/datascreen/datascreen.component.html b/src/app/routes/datatable/components/datascreen/datascreen.component.html index 939d29dd..34d6aa64 100644 --- a/src/app/routes/datatable/components/datascreen/datascreen.component.html +++ b/src/app/routes/datatable/components/datascreen/datascreen.component.html @@ -4,15 +4,23 @@ * @Author : Shiming * @Date : 2022-04-06 10:57:56 * @LastEditors : Shiming - * @LastEditTime : 2022-04-07 16:16:57 + * @LastEditTime : 2022-04-07 16:37:05 * @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.html * Copyright (C) 2022 huzhenhong. All rights reserved. -->
-

运多星网络货运平台

+
+

运多星网络货运平台

+
+   + {{todayTime}} +
+
+

实时交易监控

+
diff --git a/src/app/routes/datatable/components/datascreen/datascreen.component.ts b/src/app/routes/datatable/components/datascreen/datascreen.component.ts index a0ff7310..bc0dd745 100644 --- a/src/app/routes/datatable/components/datascreen/datascreen.component.ts +++ b/src/app/routes/datatable/components/datascreen/datascreen.component.ts @@ -1,11 +1,11 @@ import { map } from 'rxjs/operators'; /* - * @Description : + * @Description : * @Version : 1.0 * @Author : Shiming * @Date : 2022-04-06 10:57:56 * @LastEditors : Shiming - * @LastEditTime : 2022-04-07 15:53:41 + * @LastEditTime : 2022-04-07 16:31:17 * @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.ts * Copyright (C) 2022 huzhenhong. All rights reserved. */ @@ -19,7 +19,6 @@ import { G2TimelineComponent, G2TimelineData } from '@delon/chart/timeline'; import { G2MiniAreaClickItem, G2MiniAreaData } from '@delon/chart/mini-area'; import { format } from 'date-fns'; - @Component({ selector: 'app-datatable-datascreen', templateUrl: './datascreen.component.html', @@ -38,71 +37,78 @@ export class DatatableDatascreenComponent implements OnInit { headDeal: any; classifyDeal: any; todaysDeal: any; - + todayTime: string =''; + monthData: G2TimelineData[] = []; - salesData :any; - salesData2 :Array = this.genData(); - constructor(public service: DataService) { - - } - ngOnChanges(changes: any): void { + salesData: any; + salesData2: Array = this.genData(); + constructor(public service: DataService) {} + ngOnChanges(changes: any): void { console.log(changes); - } /** * 查询参数 */ get reqOrderParams() { - const params = { - - } + const params = {}; return { ...params }; } get reqParams() { - const params = { - } + const params = {}; return { ...params }; } ngOnInit(): void { - this.initST() - this.initOrderST() - this.initData() - this.initLineData() + + setInterval(() => { + this.setTime() + },1000) + this.initST(); + this.initOrderST(); + this.initData(); + this.initLineData(); } - initData(){ + setTime () { + var myDate = new Date(); + var mytime = myDate.toLocaleTimeString(); //获取当前时间 + myDate.getFullYear(); //获取完整的年份(4位,1970-????) + myDate.getMonth(); //获取当前月份(0-11,0代表1月) + myDate.getDate(); //获取当前日(1-31) + this.todayTime = myDate.getFullYear() + '-' + myDate.getMonth() + 1 + '-' + myDate.getDate() + ' ' + mytime; + } + initData() { this.service.request(this.service.$api_getAnnualTransactions).subscribe((res: any) => { - this.allDeal = res - }) + this.allDeal = res; + }); this.service.request(this.service.$api_getTransactionAmount).subscribe((res: any) => { - this.headDeal = res - }) + this.headDeal = res; + }); this.service.request(this.service.$api_getCustomerStatistics).subscribe((res: any) => { - this.classifyDeal = res - }) + this.classifyDeal = res; + }); this.service.request(this.service.$api_getTradingToday).subscribe((res: any) => { - this.todaysDeal = res - }) - let value: any = [] - this.service.request(this.service.$api_getTransactionDistribution).subscribe((res: any) => { - if(res) { - res.forEach((element: any) => { - value.push({ - name: element.province, - value: element.weight, - }); - }); - console.log(value); - this.chartData = value - this.map.reRender() + this.todaysDeal = res; + }); + let value: any = []; + this.service.request(this.service.$api_getTransactionDistribution).subscribe((res: any) => { + if (res) { + res.forEach((element: any) => { + value.push({ + name: element.province, + value: element.weight + }); + }); + console.log(value); + this.chartData = value; + this.map.reRender(); } - }) -} - initLineData(){ + }); + } + initLineData() { this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => { - this.monthData = res + this.monthData = res; if (this.timeline) { console.log(this.timeline); - + // 等待组件渲染 setTimeout(() => this.timeline.changeData()); } @@ -113,62 +119,62 @@ export class DatatableDatascreenComponent implements OnInit { // y2: Math.floor(Math.random() * 100) + 10, // }); // } - }) - let value: any = [] - this.service.request(this.service.$api_getShipmentRanking).subscribe((res: any) => { - console.log(res); - res.forEach((element: any) => { - value.push({ - x: element.city, - y: element.weight, }); - }); - this.salesData = value - // if (this.pie) { - // // 等待组件渲染 - // setTimeout(() => { - // console.log('a') - // this.pie.changeData() - // }); - // } - console.log(this.salesData); - }) - } - public genData(): G2MiniAreaData[] { - let value: any = [] + let value: any = []; this.service.request(this.service.$api_getShipmentRanking).subscribe((res: any) => { console.log(res); res.forEach((element: any) => { - value.push({ - x: element.city, - y: element.weight, + value.push({ + x: element.city, + y: element.weight + }); }); + this.salesData = value; + // if (this.pie) { + // // 等待组件渲染 + // setTimeout(() => { + // console.log('a') + // this.pie.changeData() + // }); + // } + console.log(this.salesData); + }); + } + public genData(): G2MiniAreaData[] { + let value: any = []; + this.service.request(this.service.$api_getShipmentRanking).subscribe((res: any) => { + console.log(res); + res.forEach((element: any) => { + value.push({ + x: element.city, + y: element.weight + }); }); - }) + }); console.log(value); return value; - } + } /** -* 初始化数据列表 -*/ + * 初始化数据列表 + */ initST() { this.columns = [ - { title: '序号', render: 'index', className: 'text-center',width: '70px' }, - { title: '发货地', index: 'loadAddress', className: 'text-center',width: '90px' }, - { title: '卸货地', index: 'dischargeAddress', className: 'text-center' ,width: '90px'}, - { title: '货物', index: 'goodsName', className: 'text-center',width: '90px'}, - { title: '数量', render: 'weight', className: 'text-center',width: '120px' }, + { title: '序号', render: 'index', className: 'text-center', width: '70px' }, + { title: '发货地', index: 'loadAddress', className: 'text-center', width: '90px' }, + { title: '卸货地', index: 'dischargeAddress', className: 'text-center', width: '90px' }, + { title: '货物', index: 'goodsName', className: 'text-center', width: '90px' }, + { title: '数量', render: 'weight', className: 'text-center', width: '120px' } ]; } initOrderST() { this.orderColumns = [ - { title: '运单号', index: 'wayCode', className: 'text-center',width: '120px' }, - { title: '货主', index: 'shipperName', className: 'text-center',width: '70px' }, - { title: '时间', index: 'createTime', className: 'text-center',width: '200px' }, - { title: '风险等级', index: 'warningType', className: 'text-center',width: '90px'} + { title: '运单号', index: 'wayCode', className: 'text-center', width: '120px' }, + { title: '货主', index: 'shipperName', className: 'text-center', width: '70px' }, + { title: '时间', index: 'createTime', className: 'text-center', width: '200px' }, + { title: '风险等级', index: 'warningType', className: 'text-center', width: '90px' } ]; } - + handleClick(data: G2MiniAreaClickItem): void { this.service.msgSrv.info(`${data.item.x} - ${data.item.y}`); } diff --git a/src/assets/images/oclock.svg b/src/assets/images/oclock.svg new file mode 100644 index 00000000..596ea29d --- /dev/null +++ b/src/assets/images/oclock.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file