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

edit

Browse Source
This commit is contained in:
Taric Xin
2021-12-24 17:46:16 +08:00
parent c421bcd829
commit 0fd49f3c8b
9 changed files with 533 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
src/app/routes/financial-management/components/cost-management/cost-management-detail/cost-management-detail.component.html Normal file
View File

@ -0,0 +1,93 @@
<page-header-wrapper title="费用单">
</page-header-wrapper>
<nz-card class="search-box">
<div nz-row>
<div nz-col nzSpan="24">
<se-container col="3" labelWidth=100>
<se-title class="mb-md" style="font-size:18px">基本信息（应收费用）</se-title>
<se label="网络货运人" required>
天津怡亚通物流科技有限公司
</se>
<se label="费用类型" required col="2">
应收
</se>
<se label="费用备注">
天津怡亚通物流科技有限公司
</se>
<se label="应收对象" required>
C21.001-茅台集团
</se>
<se label="开票类型" required>
专票/普票
</se>
<se label="应收金额" required>
4200.00
</se>
<se label="开票金额" required>
4200.00
</se>
<se label="收款金额" required>
4200.00
</se>
</se-container>
<se-container col="3" labelWidth=100 class="mt-md">
<se-title class="mb-md" style="font-size:18px">基本信息（应付费用）</se-title>
<se label="网络货运人" required>
天津怡亚通物流科技有限公司
</se>
<se label="费用类型" required>
应收
</se>
<se label="应付核销" required>
是
</se>
<se label="费用备注">
天津怡亚通物流科技有限公司
</se>
<se label="应收对象" required>
C21.001-茅台集团
</se>
<se label="开票类型" required>
专票/普票
</se>
<se label="应收金额" required>
4200.00
</se>
<se label="收票金额" required>
4200.00
</se>
<se label="付款金额" required>
4200.00
</se>
</se-container>
</div>
</div>
</nz-card>
<nz-card class="content-box" nzBordered>
<nz-tabset>
<nz-tab nzTitle="费用明细">
<st #st [data]="data" [columns]="columns.cost" [page]="{ show: false}" [loading]="service.http.loading"
[scroll]="{ x:'1200px',y: '370px' }"></st>
</nz-tab>
<nz-tab nzTitle="开票信息">
<st #st [data]="data" [columns]="columns.requested" [page]="{ show: false}" [loading]="service.http.loading"
[scroll]="{ x:'1200px',y: '370px' }"></st>
</nz-tab>
<nz-tab nzTitle="收款信息">
<st #st [data]="data" [columns]="columns.collection" [page]="{ show: false}"
[loading]="service.http.loading" [scroll]="{ x:'1200px',y: '370px' }"></st>
</nz-tab>
<nz-tab nzTitle="收票信息">
<st #st [data]="data" [columns]="columns.ticket" [page]="{ show: false}" [loading]="service.http.loading"
[scroll]="{ x:'1200px',y: '370px' }"></st>
</nz-tab>
<nz-tab nzTitle="付款信息">
<st #st [data]="data" [columns]="columns.payment" [page]="{ show: false}" [loading]="service.http.loading"
[scroll]="{ x:'1200px',y: '370px' }"></st>
</nz-tab>
</nz-tabset>
</nz-card>

24
src/app/routes/financial-management/components/cost-management/cost-management-detail/cost-management-detail.component.less Normal file
View File

@ -0,0 +1,24 @@
:host::ng-deep {
.search-box {
.ant-card-body {
padding-bottom: 18px;
}
}
.content-box {
.ant-card-body {
padding-top: 14px;
}
}
.text-truncate {
white-space: normal;
}
.ant-form-item {
margin-bottom: 0;
}
}

80
src/app/routes/financial-management/components/cost-management/cost-management-detail/cost-management-detail.component.ts Normal file
View File

@ -0,0 +1,80 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { STComponent, STColumn } from '@delon/abc/st';
import { FreightAccountService } from '../../../services/freight-account.service';
@Component({
selector: 'app-cost-management-detail',
templateUrl: './cost-management-detail.component.html',
styleUrls: ['./cost-management-detail.component.less']
})
export class CostManagementDetailComponent implements OnInit {
@ViewChild('st', { static: true })
st!: STComponent;
columns: { [key: string]: STColumn[] } = this.initST();
data = [];
constructor(public service: FreightAccountService) {}
ngOnInit(): void {}
private initST(): { [key: string]: STColumn[] } {
return {
cost: [
{ title: '序号', index: 'no' },
{ title: '费用明细号', index: 'callNo' },
{ title: '订单号', index: 'callNo' },
{ title: '订单日期', index: 'callNo' },
{ title: '运单号', index: 'callNo' },
{ title: '运单日期', index: 'callNo' },
{ title: '结算客户', index: 'callNo' },
{ title: '订单费用类型', index: 'callNo' },
{ title: '费用科目', index: 'callNo' },
{ title: '税率', index: 'callNo' },
{ title: '费用金额', index: 'callNo' },
{ title: '收/付款金额', index: 'callNo' },
{ title: '开/收票金额', index: 'callNo' }
],
requested: [
{ title: '序号', index: 'no' },
{ title: '费用明细号', index: 'callNo' },
{ title: '发票申请', index: 'callNo' },
{ title: '发票类型', index: 'callNo' },
{ title: '发票号', index: 'callNo' },
{ title: '发票日期', index: 'callNo' },
{ title: '发票状态', index: 'callNo' },
{ title: '应收金额', index: 'callNo' },
{ title: '开票金额', index: 'callNo' }
],
collection: [
{ title: '序号', index: 'no' },
{ title: '费用明细号', index: 'callNo' },
{ title: '收款单号', index: 'callNo' },
{ title: '收款日期', index: 'callNo' },
{ title: '收款状态', index: 'callNo' },
{ title: '应收金额', index: 'callNo' },
{ title: '收款金额', index: 'callNo' }
],
ticket: [
{ title: '序号', index: 'no' },
{ title: '费用明细号', index: 'callNo' },
{ title: '进项发票号', index: 'callNo' },
{ title: '发票类型', index: 'callNo' },
{ title: '发票日期', index: 'callNo' },
{ title: '认证日期', index: 'callNo' },
{ title: '发票状态', index: 'callNo' },
{ title: '应付金额', index: 'callNo' },
{ title: '收票金额', index: 'callNo' }
],
payment: [
{ title: '序号', index: 'no' },
{ title: '费用明细号', index: 'callNo' },
{ title: '付款单号', index: 'callNo' },
{ title: '要求日期', index: 'callNo' },
{ title: '确认日期', index: 'callNo' },
{ title: '付款状态', index: 'callNo' },
{ title: '应付金额', index: 'callNo' },
{ title: '付款金额', index: 'callNo' }
]
};
}
}

50
src/app/routes/financial-management/components/cost-management/cost-management.component.html
View File

@ -1 +1,49 @@
<p>cost-management works!</p>
<page-header-wrapper title="费用管理">
</page-header-wrapper>
<nz-card class="search-box">
<div nz-row nzGutter="8">
<div nz-col [nzXl]="_$expand ? 24 : 18" [nzLg]="24" [nzSm]="24" [nzXs]="24">
<sf #sf [schema]="searchSchema"
[ui]="{ '*': { spanLabelFixed: 110,grid: { lg: 8, md: 12, sm: 12, xs: 24 } }}" [compact]="true"
[button]="'none'"></sf>
</div>
<div nz-col [nzXl]="_$expand ? 24 : 6" [nzLg]="24" [nzSm]="24" [nzXs]="24" class="text-right">
<button nz-button nzType="primary" [nzLoading]="service.http.loading" (click)="st?.load(1)">查询</button>
<button nz-button (click)="resetSF()">重置</button>
<button nz-button (click)="exportList()"> 导出</button>
<button nz-button (click)="exportList()"> 导出明细</button>
<button nz-button nzType="link" (click)="expandToggle()">
{{ !_$expand ? '展开' : '收起' }}
<i nz-icon [nzType]="!_$expand ? 'down' : 'up'"></i>
</button>
</div>
</div>
</nz-card>
<nz-card class="content-box">
<div nz-row class="mb-sm">
<div nz-col nzSpan="24">
<button nz-button nzType="primary" [nzLoading]="service.http.loading">添加应收费用</button>
<button nz-button nzType="primary" [nzLoading]="service.http.loading">添加应付费用</button>
<button nz-button nzType="primary" [nzLoading]="service.http.loading">导入费用</button>
</div>
</div>
<st #st [data]="service.$mock_url" [columns]="columns"
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams, process: beforeReq }"
[res]="{ reName: { list: 'data.records', total: 'data.total' } }"
[page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }"
[loading]="service.http.loading" [scroll]="{ y: '370px' }">
</st>
</nz-card>
<ng-template #auditModal>
<div nz-row nzGutter="8">
<div nz-col nzSpan="24" se-container [labelWidth]="80">
<se [col]="1" label="备注">
<textarea nz-input rows="3" placeholder="同意可以不用填写原因 ，拒绝必须说明原因"
style="width: 325px;margin-left: 14px;"></textarea>
</se>
</div>
</div>
</ng-template>

21
src/app/routes/financial-management/components/cost-management/cost-management.component.less
View File

@ -0,0 +1,21 @@
:host::ng-deep {
.search-box {
.ant-card-body {
padding-bottom: 18px;
}
}
.content-box {
.ant-card-body {
padding-top: 14px;
}
}
nz-range-picker {
width: 100%;
}
.text-truncate {
white-space: normal;
}
}

258
src/app/routes/financial-management/components/cost-management/cost-management.component.ts
View File

@ -1,4 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { STComponent, STColumn, STRequestOptions } from '@delon/abc/st';
import { SFComponent, SFSchema, SFDateWidgetSchema } from '@delon/form';
import { NzModalService } from 'ng-zorro-antd/modal';
import { FreightAccountService } from '../../services/freight-account.service';
@Component({
selector: 'app-cost-management',
@ -6,10 +11,257 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./cost-management.component.less']
})
export class CostManagementComponent implements OnInit {
@ViewChild('st', { static: true })
st!: STComponent;
@ViewChild('sf', { static: false })
sf!: SFComponent;
@ViewChild('auditModal', { static: false })
auditModal!: any;
searchSchema: SFSchema = this.initSF();
columns: STColumn[] = this.initST();
constructor() { }
selectedRows: any[] = [];
ngOnInit(): void {
reqParams = {};
_$expand = false;
constructor(public service: FreightAccountService, private nzModalService: NzModalService, private router: Router) {}
ngOnInit(): void {}
beforeReq = (requestOptions: STRequestOptions) => {
if (this.sf) {
this.reqParams = { ...this.sf.value };
}
return requestOptions;
};
auditAction(item: any) {
const modal = this.nzModalService.create({
nzTitle: '审核',
nzContent: this.auditModal,
nzFooter: [
{
label: '拒绝',
type: 'default',
onClick: () => {
modal.destroy();
}
},
{
label: '通过',
type: 'primary',
onClick: () => {
modal.destroy();
}
}
]
});
modal.afterClose.subscribe(res => {
this.st.load();
});
}
/**
* 重置表单
*/
resetSF() {
this.sf.reset();
this._$expand = false;
}
/**
* 伸缩查询条件
*/
expandToggle() {
this._$expand = !this._$expand;
this.sf?.setValue('/expand', this._$expand);
}
exportList() {
this.service.downloadFile(this.service.$mock_url, { ...this.sf.value, pageIndex: this.st.pi, pageSize: this.st.ps });
}
routeTo(url: string, params?: any) {
this.router.navigate([url], { queryParams: params });
}
private initSF(): SFSchema {
return {
properties: {
expand: {
type: 'boolean',
ui: {
hidden: true
}
},
receiveName: {
type: 'string',
title: '费用单号',
ui: { placeholder: '请输入' }
},
phone: {
type: 'string',
title: '订单号',
ui: { placeholder: '请输入' }
},
page: {
type: 'string',
title: '运单号',
ui: {
placeholder: '请输入'
}
},
createTi2me: {
title: '费用日期',
type: 'string',
ui: {
widget: 'date',
mode: 'range',
format: 'yyyy-MM-dd',
visibleIf: {
expand: (value: boolean) => value
}
} as SFDateWidgetSchema
},
pa2ge2: {
type: 'string',
title: '费用类型',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
pa22ge2: {
type: 'string',
title: '费用科目',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
page2: {
type: 'string',
title: '网络货运人',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
page21: {
type: 'string',
title: '应付对象',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
pag2e21: {
type: 'string',
title: '应收对象',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
createTime: {
title: '创建时间',
type: 'string',
ui: {
widget: 'date',
mode: 'range',
format: 'yyyy-MM-dd',
visibleIf: {
expand: (value: boolean) => value
}
} as SFDateWidgetSchema
},
pag2e221: {
type: 'string',
title: '应付核销',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
},
pag2e121: {
type: 'string',
title: '结算客户',
enum: [{ label: '全部', value: '全部' }],
ui: {
widget: 'select',
placeholder: '请选择',
visibleIf: {
expand: (value: boolean) => value
}
}
}
}
};
}
private initST(): STColumn[] {
return [
{ title: '费用单号', index: 'description', width: 120 },
{ title: '网络货运人', index: 'description', width: 120 },
{ title: '订单号', index: 'description', width: 120 },
{ title: '运单号', index: 'description', width: 120 },
{ title: '费用日期', index: 'description', width: 150 },
{ title: '费用类型', index: 'description', width: 100 },
{ title: '应付核销', index: 'description', width: 100 },
{ title: '结算客户', index: 'description', width: 100 },
{ title: '应收对象', index: 'description', width: 100 },
{ title: '应付对象', render: 'description1', width: 100 },
{ title: '应收金额', render: 'description1', width: 100 },
{ title: '应付金额', render: 'description1', width: 100 },
{ title: '收/付款金额', render: 'description1', width: 120 },
{ title: '开/收票金额', render: 'description1', width: 120 },
{ title: '创建时间', index: 'updatedAt', type: 'date', width: 150 },
{ title: '状态', render: 'description1', width: 90 },
{
title: '操作',
fixed: 'right',
className: 'text-center',
width: 90,
buttons: [
{
text: '浏览',
click: item => this.routeTo('/financial-management/cost-management/detail/1')
},
{
text: '审核',
click: item => this.auditAction(item)
},
{
text: '修改',
click: item => this.router.navigate(['/financial-management/freight-account/detail/1'])
}
]
}
];
}
}

2
src/app/routes/financial-management/financial-managemen-routing.module.ts
View File

@ -11,6 +11,7 @@ import { CostManagementComponent } from './components/cost-management/cost-manag
import { AbnormalGoldComponent } from './components/abnormal-gold/abnormal-gold.component';
import { PaymentRecordComponent } from './components/payment-record/payment-record.component';
import { TransactionFlowComponent } from './components/transaction-flow/transaction-flow.component';
import { CostManagementDetailComponent } from './components/cost-management/cost-management-detail/cost-management-detail.component';
const routes: Routes = [
{ path: 'freight-account', component: FreightAccountComponent },
@ -23,6 +24,7 @@ const routes: Routes = [
// { path: 'voucher-management', component: VoucherManagementComponent },
// { path: 'voucher-summary', component: VoucherSummaryComponent },
{ path: 'cost-management', component: CostManagementComponent },
{ path: 'cost-management/detail/:id', component: CostManagementDetailComponent },
{ path: 'abnormal-gold', component: AbnormalGoldComponent },
{ path: 'payment-record', component: PaymentRecordComponent },
{ path: 'transaction-flow', component: TransactionFlowComponent },

6
src/app/routes/financial-management/financial-management.module.ts
View File

@ -15,6 +15,7 @@ import { AbnormalGoldComponent } from './components/abnormal-gold/abnormal-gold.
import { PaymentRecordComponent } from './components/payment-record/payment-record.component';
import { TransactionFlowComponent } from './components/transaction-flow/transaction-flow.component';
import { ClearingModalComponent } from './components/abnormal-gold/clearing-modal/clearing-modal.component';
import { CostManagementDetailComponent } from './components/cost-management/cost-management-detail/cost-management-detail.component';
const ROUTESCOMPONENTS = [
FreightAccountComponent,
@ -22,10 +23,11 @@ const ROUTESCOMPONENTS = [
RechargeRecordComponent,
WithdrawalsRecordComponent,
WithdrawalsDetailComponent,
CostManagementComponent,
AbnormalGoldComponent,
PaymentRecordComponent,
TransactionFlowComponent
TransactionFlowComponent,
CostManagementComponent,
CostManagementDetailComponent
];
const NOTROUTECOMPONENTS = [DriverAccountDetailComponent, FreightAccountDetailComponent, SettingFinancialComponent, ClearingModalComponent];