提交 8ae9cdfa 编写于 作者: q289089000's avatar q289089000

8-20

上级 d30a2835
<div nz-row nzGutter="8" *ngIf="currentItem">
<div nz-col nzSpan="24" >
<!-- 运单图片 图表行 -->
<div nz-col nzSpan="24" class="m-b-6">
<div nz-row>
<div nz-col nzSpan="12" style="border: solid 1px #ccc;">
<img style="width: 100;height: 100%;" src="assets/turtle.png"/>
<img style="width: 100;height: 100%;" src="assets/turtle.png" />
</div>
<div nz-col nzSpan="12">
<div style="height: 150px;">
<ngx-charts-bar-horizontal
[scheme]="colorScheme"
[xAxis]="true"
[yAxis]="true"
[results]="dashBoardList">
<div style="height: 150px;" >
<ngx-charts-bar-horizontal *ngIf="visibleCharts" [scheme]="colorScheme" [xAxis]="true" [yAxis]="true" [results]="dashBoardList">
</ngx-charts-bar-horizontal>
</div>
</div>
</div>
</div>
<!-- 数据行 -->
<div nz-col nzSpan="24">
<div nz-row nzGutter="8" style="margin-top: 6px;">
<!-- 行1 -->
<div nz-row nzGutter="8" class="m-b-6">
<div nz-col nzSpan="8">
<nz-date-picker [(ngModel)]="currentItem.date" style="width: 100%;" (ngModelChange)="ngModelChange($event)" name="value" nzPlaceHolder="Please select data" ></nz-date-picker>
<nz-date-picker [(ngModel)]="currentItem.date" style="width: 100%;" (ngModelChange)="ngModelChange($event)"
name="value" nzPlaceHolder="Please select data"></nz-date-picker>
</div>
<div nz-col nzSpan="8">
<app-shipper></app-shipper>
</div>
<div nz-col nzSpan="8"><nz-input-group nzAddOnBefore="No: " >
<input nz-input [(ngModel)]="currentItem.no" placeholder="货运单号">
</nz-input-group>
<app-shipper (valueChange)="onShipperChange($event)" [(value)]="currentItem.shipper" #appShipper1 (loaded)="onShipperLoaded($event)"></app-shipper>
</div>
</div>
<div nz-row nzGutter="8" style="margin-top: 6px;">
<div nz-col nzSpan="8">
<app-supplier></app-supplier>
<nz-input-group nzAddOnBefore="运费 " >
<input nz-input [(ngModel)]="currentItem.total" (ngModelChange)="onTotalChange()" placeholder="运费">
<nz-input-group nzAddOnBefore="No: ">
<input nz-input [(ngModel)]="currentItem.no" placeholder="货运单号">
</nz-input-group>
</div>
</div>
<!-- 行2 -->
<div nz-row nzGutter="8">
<div nz-col nzSpan="8">
<nz-card>
<nz-input-group nzAddOnBefore="件数 " >
<input nz-input [(ngModel)]="currentItem.box" placeholder="">
</nz-input-group>
<nz-input-group nzAddOnBefore="立方 ">
<input nz-input [(ngModel)]="currentItem.size" placeholder="">
</nz-input-group>
<nz-input-group nzAddOnBefore="公斤 " >
<input nz-input [(ngModel)]="currentItem.weight" placeholder="">
<div class="m-b-6">
<app-supplier [(value)]="currentItem.supplier"></app-supplier>
</div>
<div class="m-b-6">
<nz-input-group nzAddOnBefore="运费 ">
<input nz-input [(ngModel)]="currentItem.total" (ngModelChange)="onTotalChange()" placeholder="运费">
</nz-input-group>
</nz-card>
</div>
</div>
<div nz-col nzSpan="8">
<div nz-col nzSpan="10" class="m-b-6">
<nz-radio-group [(ngModel)]="currentItem.paytype">
<nz-table nzSize="small" nzBordered [nzData]="[1]" nzShowPagination="false">
<tbody>
<tr>
<td>*</td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td><label nz-radio [nzValue]=0>件数</label></td>
<td><input nz-input nzSize="small" [(ngModel)]="currentItem.box" (ngModelChange)="onArgChange()"></td>
<td>
<nz-input-group nzSuffix="/件" nzSize="small">
<input type="text" nz-input [(ngModel)]="price.box"/>
</nz-input-group>
</td>
<td><input nz-input nzSize="small" [(ngModel)]="sum_money.box" ></td>
</tr>
<tr>
<td><label nz-radio [nzValue]=1>大小</label></td>
<td><input nz-input nzSize="small" [(ngModel)]="currentItem.size" (ngModelChange)="onArgChange()"></td>
<td>
<nz-input-group nzSuffix="/方" nzSize="small" >
<input type="text" nz-input [(ngModel)]="price.size"/>
</nz-input-group>
</td>
<td><input nz-input nzSize="small" [(ngModel)]="sum_money.size"></td>
</tr>
<tr>
<td><label nz-radio [nzValue]=2>重量</label></td>
<td><input nz-input nzSize="small" [(ngModel)]="currentItem.weight" (ngModelChange)="onArgChange()"></td>
<td>
<nz-input-group nzSuffix="/KG" nzSize="small">
<input type="text" nz-input [(ngModel)]="price.weight"/>
</nz-input-group>
</td>
<td><input nz-input nzSize="small" [(ngModel)]="sum_money.weight"></td>
</tr>
</tbody>
</nz-table>
</nz-radio-group>
</div>
<div nz-col nzSpan="6">
</div>
</div>
......
import { Component, Input, OnInit } from '@angular/core';
import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
import { NzMessageService, NzModalRef } from 'ng-zorro-antd';
import { Shipper } from 'src/app/_model/shipper';
import { ShipperBillService } from 'src/app/_service/shipper-bill.service';
import { ShipperService } from 'src/app/_service/shipper.service';
@Component({
selector: 'app-modal-shipper-bill',
......@@ -8,64 +11,113 @@ import { ShipperBillService } from 'src/app/_service/shipper-bill.service';
})
export class ModalShipperBillComponent implements OnInit {
@ViewChild('appShipper1') appShipper1: ElementRef;
constructor(
private _shipperBill:ShipperBillService
private _shipperBill: ShipperBillService,
private _modalRet: NzModalRef,
private _msg: NzMessageService,
private _shipper: ShipperService
) {
}
@Input()item:any
loading=true;
currentItem:any;
@Input() item: any
loading = true;
shipperObj: Shipper
currentItem: any;
dashBoardList: any[]
radioValue;
price = { box: 0, size: 0, weight: 0 }
sum_money = { box: 0, size: 0, weight: 0 }
colorScheme = {
domain: ['#0F0', '#F00', '#E00', '#D00']
};
ngOnInit(): void {
console.log('shipper bill',this.item);
this._shipperBill.GetOne({_id:this.item._id}).then((doc:any)=>{
console.log('shipperbill:',doc);
console.log('shipper bill', this.item);
this._shipperBill.GetOne({ _id: this.item._id }).then((doc: any) => {
console.log('shipperbill:', doc);
this.currentItem = doc;
this.currentItem.date = new Date(doc.date)
this.onShipperChange(doc.shipper)
})
this._modalRet.afterClose.subscribe((result) => {
if (result === 'ok') {
this._shipperBill.Upd(this.currentItem).then(doc => {
this._msg.success('已完成修改.')
})
}
this.currentItem=doc;
this.currentItem.date=new Date(doc.date)
})
setTimeout(() => {
this.dashBoardList =[
this.dashBoardList = [
{
name: "当前",
value: 865,
value: 0,
},
{
name: "计件",
value: 0,
},
{
name: "计方",
value: 0,
},
{
name: "计重",
value: 0,
},
// {
// "name": "计件",
// "value": 755,
// },
// {
// "name": "计重",
// "value": 1221,
// },
// {
// "name": "体积",
// "value": 643,
// },
]
}, 50);
}
ngModelChange(e){
ngAfterViewInit() {
}
onShipperLoaded(shippers:Shipper[]){
}
ngModelChange(e) {
console.log(e);
}
onTotalChange(){
this.dashBoardList[0].value=this.currentItem.total;
onTotalChange() {
this.dashBoardList[0].value = this.currentItem.total;
this.updateChart();
}
visibleCharts = true;
updateChart() {
// this.dashBoardList = [...this.dashBoardList];
this.visibleCharts = false;
setTimeout(() => {
this.visibleCharts = true;
}, 1);
}
onShipperChange(_shipperId) {
this._shipper.GetOneById(_shipperId).then((doc: Shipper) => {
console.log('byid:'+_shipperId,doc);
this.price.box = doc.paybox;
this.price.size = doc.paysize;
this.price.weight = doc.payweight;
this.currentItem.paytype = doc.paytype;
})
}
onArgChange() {
console.log('change', this.shipperObj);
this.sum_money.box = this.currentItem.box * this.price.box
this.sum_money.size = this.currentItem.size * this.price.size
this.sum_money.weight = this.currentItem.weight * this.price.weight
updateChart(){
this.dashBoardList = [...this.dashBoardList];
}
}
<nz-select nzShowSearch nzAllowClear [(ngModel)]="value" (ngModelChange)="update()" nzPlaceHolder="物流公司" style="width: 100%;">
<nz-option *ngFor="let item of items" nzLabel="{{item.coname}}" nzValue="{{item._id}}"></nz-option>
<nz-select nzShowSearch nzAllowClear [(ngModel)]="value" (ngModelChange)="update()" nzPlaceHolder="物流公司" style="width: 100%;">
<nz-option *ngFor="let item of items" [nzLabel]="item.coname" [nzValue]="item._id"></nz-option>
</nz-select>
......@@ -11,6 +11,7 @@ export class ShipperComponent implements OnInit {
items:Shipper[]
@Input() value: string;
@Output() valueChange = new EventEmitter<string>();
@Output() loaded = new EventEmitter<Shipper[]>();
update(){
//this.value=v
......@@ -21,6 +22,7 @@ export class ShipperComponent implements OnInit {
ngOnInit(): void {
this._shipper.Get({}).then((docs:Shipper[])=>{
this.items=docs;
this.loaded.emit(docs)
})
}
......
......@@ -13,6 +13,7 @@ export class Shipper {
region: string;
paytype: number;
paybox: number;
paysize: number;
payweight: number;
......
......@@ -76,6 +76,15 @@ export class ShipperService {
this._msg.error("获取数据失败.")
})
}
async GetOneById(id){
return await this._ss.emit("shipperGetOne",{_id:id}).then((result:ResultDTO)=>{
if(result.ok){
return result.data
}
}).catch(e=>{
this._msg.error("获取数据失败.")
})
}
async Add(item:any={}){
return await this._ss.emit('shipperAdd',item).then((result:ResultDTO)=>{
......
<div class="item-box" style="display: flex;height: 100%;">
<!-- 左边 -->
<!-- 左边 -->
<div style="flex:0 0 240px;flex-direction:column ;display: flex; height: 100%;margin:0 8px;">
<div style="flex: 0;margin-bottom:8px;">
<button nz-button nzBlock nzType="primary">Add</button>
......@@ -7,7 +7,7 @@
<div style="flex: 0;margin-bottom:12px;">
<input nz-input placeholder="filter" [(ngModel)]="strFilter">
</div>
<div style="flex: 1;overflow-y: scroll;">
<div style="flex: 1;overflow-y: scroll;">
<nz-table #t [nzData]="listdata" nzSize="small">
<thead>
<tr>
......@@ -17,17 +17,19 @@
</tr>
</thead>
<tbody>
<tr *ngFor="let data of listdata|pipeObjectFilter:{'coname':strFilter,'people':strFilter}:true" [ngClass]="{'new': data.new,'changeAnima':data.change}">
<tr *ngFor="let data of listdata|pipeObjectFilter:{'coname':strFilter,'people':strFilter}:true"
[ngClass]="{'new': data.new,'changeAnima':data.change}">
<td [nzChecked]="data.check?true:false"></td>
<td>{{data.coname}}</td>
<td><button nz-button routerLink="{{data._id}}" nzType="primary" nzShape="circle" ><i nz-icon nzType="setting"></i></button></td>
<td><button nz-button routerLink="{{data._id}}" nzType="primary" nzShape="circle"><i nz-icon
nzType="setting"></i></button></td>
</tr>
</tbody>
</nz-table>
</div>
</div>
<!-- 右边 -->
<!-- 右边 -->
<div style="flex: 1 0 0;height:100%;flex-direction: column;display: flex;">
<div style="flex:0 1;border-bottom:solid 1px #ccc;">
......@@ -43,57 +45,90 @@
<div style="flex:0 0 40px;padding: 6px;">
<nz-table>
<tr>
<td><nz-range-picker [(ngModel)]="now" name="value" nzPlaceHolder="Please select data" ></nz-range-picker></td>
<td><nz-statistic [nzValue]="(58754 | number)!" [nzTitle]="'总金额'"></nz-statistic></td>
<td><nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'箱数'"></nz-statistic></td>
<td><nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'重量'"></nz-statistic></td>
<td><nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'立方'"></nz-statistic></td>
<td>
<nz-range-picker [(ngModel)]="now" name="value" nzPlaceHolder="Please select data"></nz-range-picker>
</td>
<td>
<nz-statistic [nzValue]="(58754 | number)!" [nzTitle]="'总金额'"></nz-statistic>
</td>
<td>
<nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'箱数'"></nz-statistic>
</td>
<td>
<nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'重量'"></nz-statistic>
</td>
<td>
<nz-statistic [nzValue]="(23 | number)!" [nzTitle]="'立方'"></nz-statistic>
</td>
<td></td>
</tr>
</nz-table>
</div>
<div style="flex:1;overflow-y: scroll;padding: 6px;background-color:#EEE;">
<div style="flex:1;overflow-y: scroll;padding: 6px;background-color:#EEE;">
<!-- bill datalist -->
<div>
<div *ngFor="let i of billList" class="item" style="height:140px;;width: 100%; display:flex;background-color: #eee;padding: 6px;background-color: white;margin:6px;">
<div *ngIf="i.shipper" style="flex: 1 0 0; margin-right:6px;font-size:14px;font-weight: bold;" >
<div nz-row >
<div *ngFor="let i of billList" class="item" nz-col nzXXl="12"
style="height:160px;width: 100%; padding: 6px;margin-bottom: 12px;">
<div style="background-color: white; width: 100%;display:flex;border-radius: 6px;padding:4px">
<div *ngIf="i.shipper" style="flex: 1 0 0; margin-right:6px;font-size:14px;font-weight: bold;">
<div nz-row style="font-size: 16px;border-bottom: double #aaa 4px;">
<div nz-col nzSpan="8">{{i.date|date:"yyyy-MM-dd"}}</div>
<div nz-col nzSpan="8">{{i.shipper?i.shipper:"未设置"}}</div>
<div nz-col nzSpan="8">{{i.shipper|shipper|async}}</div>
<div nz-col nzSpan="8">No.{{i.no?i.no:"未设置"}}</div>
</div>
<div nz-row style="margin-bottom: 4px;">
<div nz-col nzSpan="14">
<div nz-col nzSpan="12">
<div nz-row style="border-bottom: solid 1px #aaa;margin-bottom: 4px;padding: 4px;">
<div nz-col nzSpan="12"><nz-tag [nzColor]="'#108ee9'">凯达玩具</nz-tag></div>
<div nz-col nzSpan="12">
<nz-tag [nzColor]="'#108ee9'">{{i.supplier|supplier|async}}</nz-tag>
</div>
<div nz-col nzSpan="12">
</div>
</div>
<div nz-row >
<div nz-row>
<div nz-col nzSpan="16">
<div nz-row><div nz-col nzSpan="8">件数</div><div nz-col nzSpan="8">3</div><div nz-col nzSpan="8">3</div></div>
<div nz-row><div nz-col nzSpan="8">立方</div><div nz-col nzSpan="8">3</div><div nz-col nzSpan="8">3</div></div>
<div nz-row><div nz-col nzSpan="8">重量</div><div nz-col nzSpan="8">250</div><div nz-col nzSpan="8">3</div></div>
<div nz-row>
<div nz-col nzSpan="8">件数</div>
<div nz-col nzSpan="8">3</div>
<div nz-col nzSpan="8">3</div>
</div>
<div nz-row>
<div nz-col nzSpan="8">立方</div>
<div nz-col nzSpan="8">3</div>
<div nz-col nzSpan="8">3</div>
</div>
<div nz-row>
<div nz-col nzSpan="8">重量</div>
<div nz-col nzSpan="8">250</div>
<div nz-col nzSpan="8">3</div>
</div>
</div>
<div nz-col nzSpan="8">
<div nz-row><nz-tag >计件</nz-tag></div>
<div nz-row><div nz-col nzSpan="12">单价</div><div nz-col nzSpan="12" style="color:rgb(45, 124, 226)">25</div></div>
<div nz-row>
<nz-tag>计件</nz-tag>
</div>
<div nz-row>
<div nz-col nzSpan="12">单价</div>
<div nz-col nzSpan="12" style="color:rgb(45, 124, 226)">25</div>
</div>
</div>
</div>
</div>
<div nz-col nzSpan="10">
<div nz-row >
<div nz-row>
<div nz-col nzSpan="12">
<div>件数</div>
<div style="margin-top: 8px;">
<span style="font-size: 32px;"> <sup>12</sup>/<sub>24</sub></span>
</div>
</div>
<div nz-col nzSpan="12"><nz-statistic [nzValue]="93" [nzTitle]="'运费'"[nzValueStyle]="{ color: '#3F8600' }" ></nz-statistic></div>
<div nz-col nzSpan="12">
<nz-statistic [nzValue]="i.total" [nzTitle]="'运费'" [nzValueStyle]="{ color: '#3F8600' }"></nz-statistic>
</div>
</div>
</div>
......@@ -101,16 +136,19 @@
</div>
<div *ngIf="!i.shipper" style="flex: 1 0 0; margin-right:6px;font-size:14px;font-weight: bold;">
<div style="display: flex; width: 100%;height: 100%;background-color:#aaa;justify-content: center;align-items: center;">
<div *ngIf="!i.shipper" style="flex: 1 0 0; margin-right:6px;font-size:14px;font-weight: bold;">
<div
style="display: flex; width: 100%;height: 100%;justify-content: center;align-items: center;">
<div style="background-color: coral;">未设置</div>
</div>
</div>
<div style="flex:0 0 220px;border-radius: 4px; border:solid 1px #ccc ;" class="hand" (click)="onEditShipperBill(i)" >
<div style="flex:0 0 160px;border-radius: 4px; border:solid 1px #ccc ;" class="hand"
(click)="onEditShipperBill(i)">
<img src="assets/turtle.png" style="width:100%;height:100%;" />
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -129,27 +167,37 @@
<input nz-input placeholder="银行账号" [(ngModel)]="item.bank">
<input nz-input placeholder="区域" [(ngModel)]="item.region">
</div>
<nz-divider nzText="计费数据"></nz-divider>
<div style="flex: 1;">
<nz-card>
<nz-radio-group [(ngModel)]="item.paytype">
<label nz-radio nzValue=0>计件</label>
<nz-input-group nzAddOnBefore="计箱">
<input type="text" nz-input [(ngModel)]="item.paybox" />
</nz-input-group>
<label nz-radio nzValue=1>计方</label>
<nz-input-group nzAddOnBefore="计方">
<input type="text" nz-input [(ngModel)]="item.paysize" />
</nz-input-group>
<label nz-radio nzValue=2>计重</label>
<nz-input-group nzAddOnBefore="计重">
<input type="text" nz-input [(ngModel)]="item.payweight" />
</nz-input-group>
</nz-radio-group>
</nz-card>
<nz-radio-group [(ngModel)]="item.paytype">
<div nz-row>
<div nz-col nzSpan="12">
<label nz-radio [nzValue]=0>计件</label>
</div>
<div nz-col nzSpan="12">
<input type="text" nzSize="small" nz-input [(ngModel)]="item.paybox" />
</div>
</div>
<div nz-row>
<div nz-col nzSpan="12">
<label nz-radio [nzValue]=1>计方</label>
</div>
<div nz-col nzSpan="12">
<input type="text" nzSize="small" nz-input [(ngModel)]="item.paysize" />
</div>
</div>
<div nz-row>
<div nz-col nzSpan="12">
<label nz-radio [nzValue]=2>计重</label>
</div>
<div nz-col nzSpan="12">
<input type="text" nzSize="small" nz-input [(ngModel)]="item.payweight" />
</div>
</div>
</nz-radio-group>
</div>
<nz-divider></nz-divider>
<footer style=" flex: 0;">
......
......@@ -101,6 +101,8 @@ export class PageShipperComponent implements OnInit, OnDestroy {
//_local.back()
});
}
})
......@@ -134,7 +136,13 @@ export class PageShipperComponent implements OnInit, OnDestroy {
this._modal.create({
nzContent:ModalShipperBillComponent,
nzComponentParams:{item:_item},
nzWidth:800
nzWidth:800,
nzOnOk:()=>{
return 'ok'
},
nzOnCancel:()=>{
return 'cancel'
}
})
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册