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-27 13:26:43 +08:00
parent 6a3f551509
commit 358ba2708e
13 changed files with 469 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,4 +1,9 @@
<page-header-wrapper title="费用单">
<page-header-wrapper title="费用单" [logo]="logo">
<ng-template #logo>
<button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
<i nz-icon nzType="left" nzTheme="outline"></i>
</button>
</ng-template>
</page-header-wrapper>
<nz-card class="search-box">

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

@ -17,6 +17,10 @@ export class CostManagementDetailComponent implements OnInit {
ngOnInit(): void {}
goBack() {
history.go(-1);
}
private initST(): { [key: string]: STColumn[] } {
return {
cost: [

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

@ -24,8 +24,10 @@
<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"
(click)="routeTo('/financial-management/cost-management/expenses-receivable/1')">添加应收费用</button>
<button nz-button nzType="primary" [nzLoading]="service.http.loading"
(click)="routeTo('/financial-management/cost-management/expenses-payable/1')">添加应付费用</button>
<button nz-button nzType="primary" [nzLoading]="service.http.loading">导入费用</button>
</div>
</div>

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

@ -258,7 +258,7 @@ export class CostManagementComponent implements OnInit {
},
{
text: '修改',
click: item => this.router.navigate(['/financial-management/freight-account/detail/1'])
click: item => this.router.navigate(['/financial-management/cost-management/expenses-receivable/1'], { queryParams: { id: 1 } })
}
]
}

56
src/app/routes/financial-management/components/cost-management/expenses-payable/expenses-payable.component.html Normal file
View File

@ -0,0 +1,56 @@
<page-header-wrapper title="应付费用单" [logo]="logo">
<ng-template #logo>
<button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
<i nz-icon nzType="left" nzTheme="outline"></i>
</button>
</ng-template>
</page-header-wrapper>
<nz-card [nzExtra]="cardTemplate" nzTitle="基本信息">
<ng-template #cardTemplate>
<button nz-button nzType="primary" [nzLoading]="service.http.loading">保存</button>
</ng-template>
<div nz-row nzGutter="8">
<div nz-col nzSpan="24">
<sf #sf [schema]="schema" [ui]="{ '*': { spanLabelFixed: 110,grid: { lg: 8, md: 12, sm: 12, xs: 24 } }}"
[button]="'none'"></sf>
</div>
</div>
<st #st [data]="data" [columns]="columns" [page]="{ show: false}" [loading]="service.http.loading" size="small"
[scroll]="{ y: '370px' }" class="mt-sm">
<ng-template st-row="description1" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="description2" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="description3" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="num" let-item let-index="index">
<nz-input-number [ngModel]="item.num" (ngModelChange)="st.setRow(index, { num: $event })" [nzMin]="0"
style="width: 100%;"></nz-input-number>
</ng-template>
<ng-template st-row="description5" let-item let-index="index">
<input nz-input [ngModel]="item.description5"
(ngModelChange)="st.setRow(index, { description5: $event })" />
</ng-template>
</st>
<button nz-button nzType="dashed" nzBlock class="mt-md" (click)="addRow()"><i nz-icon nzType="plus"
nzTheme="outline"></i>添加</button>
</nz-card>

13
src/app/routes/financial-management/components/cost-management/expenses-payable/expenses-payable.component.less Normal file
View File

@ -0,0 +1,13 @@
:host::ng-deep {
.content-box {
.ant-card-body {
padding-top: 14px;
}
}
nz-range-picker {
width: 100%;
}
}

149
src/app/routes/financial-management/components/cost-management/expenses-payable/expenses-payable.component.ts Normal file
View File

@ -0,0 +1,149 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { STComponent, STColumn } from '@delon/abc/st';
import { SFComponent, SFSchema, SFDateWidgetSchema } from '@delon/form';
import { FreightAccountService } from '../../../services/freight-account.service';
@Component({
selector: 'app-expenses-payable',
templateUrl: './expenses-payable.component.html',
styleUrls: ['./expenses-payable.component.less']
})
export class ExpensesPayableComponent implements OnInit {
@ViewChild('st', { static: true })
st!: STComponent;
@ViewChild('sf', { static: false })
sf!: SFComponent;
schema!: SFSchema;
columns: STColumn[] = this.initST();
id = null;
data: any[] = [
{
id: 1,
description1: '',
description2: '',
description3: '',
num: null,
description5: ''
}
];
constructor(public service: FreightAccountService, private route: ActivatedRoute) {
this.id = route.snapshot.queryParams.id;
if (this.id) {
this.schema = this.initSF({ page2: '天津怡亚通物流科技有限公司', pag2e21: '茅台集团' });
} else {
this.schema = this.initSF();
}
}
ngOnInit(): void {}
addRow() {
this.data.push({
id: this.data.length + 1,
description1: '',
description2: '',
description3: '',
num: null,
description5: ''
});
this.st.reload();
}
goBack() {
history.go(-1);
}
private initSF(data?: any): SFSchema {
return {
properties: {
page2: {
type: 'string',
title: '网络货运人',
enum: [],
ui: {
widget: data ? 'text' : 'select',
placeholder: '请选择'
},
default: data?.page2 || ''
},
pag2e21: {
title: '应付对象',
type: 'string',
enum: [],
ui: {
widget: data ? 'text' : 'select',
placeholder: '请选择'
},
default: data?.pag2e21 || ''
},
dee: {
title: '',
type: 'string',
ui: {
widget: 'text'
},
default: ' '
},
createTi2me: {
title: '费用日期',
type: 'string',
ui: {
widget: 'date',
mode: 'range',
format: 'yyyy-MM-dd'
} as SFDateWidgetSchema,
default: data?.createTi2me || ''
},
pa2ge2: {
type: 'string',
title: '收票方式',
enum: [],
ui: {
widget: 'select',
placeholder: '请选择'
},
default: data?.pa2ge2 || ''
},
page: {
type: 'string',
title: '应付备注',
ui: {
placeholder: '请输入'
},
default: data?.page || ''
}
},
required: ['page2', 'pag2e21', 'createTi2me', 'pa2ge2']
};
}
private initST(): STColumn[] {
return [
{ title: '结算客户', render: 'description1', width: 150 },
{ title: '费用科目', render: 'description2', width: 120 },
{ title: '税率', render: 'description3', width: 120 },
{ title: '应付金额', render: 'num', width: 120 },
{ title: '备注', render: 'description5', width: 150 },
{
title: '操作',
fixed: 'right',
className: 'text-center',
width: 90,
buttons: [
{
text: '删除',
click: item => {
this.st.removeRow(item);
this.data = this.data.filter(i => i.id !== item.id);
console.log(this.st.data, this.st._data);
}
}
]
}
];
}
}

56
src/app/routes/financial-management/components/cost-management/expenses-receivable/expenses-receivable.component.html Normal file
View File

@ -0,0 +1,56 @@
<page-header-wrapper title="应收费用单" [logo]="logo">
<ng-template #logo>
<button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
<i nz-icon nzType="left" nzTheme="outline"></i>
</button>
</ng-template>
</page-header-wrapper>
<nz-card [nzExtra]="cardTemplate" nzTitle="基本信息">
<ng-template #cardTemplate>
<button nz-button nzType="primary" [nzLoading]="service.http.loading">保存</button>
</ng-template>
<div nz-row nzGutter="8">
<div nz-col nzSpan="24">
<sf #sf [schema]="schema" [ui]="{ '*': { spanLabelFixed: 110,grid: { lg: 8, md: 12, sm: 12, xs: 24 } }}"
[button]="'none'"></sf>
</div>
</div>
<st #st [data]="data" [columns]="columns" [page]="{ show: false}" [loading]="service.http.loading" size="small"
[scroll]="{ y: '370px' }" class="mt-sm">
<ng-template st-row="description1" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="description2" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="description3" let-item let-index="index">
<nz-select [ngModel]="item.description" (ngModelChange)="st.setRow(index, { description: $event })"
style="width: 100%;">
<nz-option nzValue="曲丽丽" nzLabel="曲丽丽"></nz-option>
<nz-option nzValue="lucy" nzLabel="Lucy"></nz-option>
</nz-select>
</ng-template>
<ng-template st-row="num" let-item let-index="index">
<nz-input-number [ngModel]="item.num" (ngModelChange)="st.setRow(index, { num: $event })"
[nzMin]="0" style="width: 100%;"></nz-input-number>
</ng-template>
<ng-template st-row="description5" let-item let-index="index">
<input nz-input [ngModel]="item.description5"
(ngModelChange)="st.setRow(index, { description5: $event })" />
</ng-template>
</st>
<button nz-button nzType="dashed" nzBlock class="mt-md" (click)="addRow()"><i nz-icon nzType="plus"
nzTheme="outline"></i>添加</button>
</nz-card>

13
src/app/routes/financial-management/components/cost-management/expenses-receivable/expenses-receivable.component.less Normal file
View File

@ -0,0 +1,13 @@
:host::ng-deep {
.content-box {
.ant-card-body {
padding-top: 14px;
}
}
nz-range-picker {
width: 100%;
}
}

148
src/app/routes/financial-management/components/cost-management/expenses-receivable/expenses-receivable.component.ts Normal file
View File

@ -0,0 +1,148 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { STColumn, STComponent } from '@delon/abc/st';
import { SFComponent, SFDateWidgetSchema, SFSchema } from '@delon/form';
import { FreightAccountService } from '../../../services/freight-account.service';
@Component({
selector: 'app-expenses-receivable',
templateUrl: './expenses-receivable.component.html',
styleUrls: ['./expenses-receivable.component.less']
})
export class ExpensesReceivableComponent implements OnInit {
@ViewChild('st', { static: true })
st!: STComponent;
@ViewChild('sf', { static: false })
sf!: SFComponent;
schema!: SFSchema;
columns: STColumn[] = this.initST();
id = null;
data: any[] = [
{
id: 1,
description1: '',
description2: '',
description3: '',
num: null,
description5: ''
}
];
constructor(public service: FreightAccountService, private route: ActivatedRoute) {
this.id = route.snapshot.queryParams.id;
if (this.id) {
this.schema = this.initSF({ page2: '天津怡亚通物流科技有限公司', pag2e21: '茅台集团' });
} else {
this.schema = this.initSF();
}
}
ngOnInit(): void {}
addRow() {
this.data.push({
id: this.data.length + 1,
description1: '',
description2: '',
description3: '',
num: null,
description5: ''
});
this.st.reload();
}
goBack() {
history.go(-1);
}
private initSF(data?: any): SFSchema {
return {
properties: {
page2: {
type: 'string',
title: '网络货运人',
enum: [],
ui: {
widget: data ? 'text' : 'select',
placeholder: '请选择'
},
default: data?.page2 || ''
},
pag2e21: {
title: '应收对象',
type: 'string',
enum: [],
ui: {
widget: data ? 'text' : 'select',
placeholder: '请选择'
},
default: data?.pag2e21 || ''
},
dee: {
title: '',
type: 'string',
ui: {
widget: 'text'
},
default: ' '
},
createTi2me: {
title: '费用日期',
type: 'string',
ui: {
widget: 'date',
mode: 'range',
format: 'yyyy-MM-dd'
} as SFDateWidgetSchema,
default: data?.createTi2me || ''
},
pa2ge2: {
type: 'string',
title: '开票方式',
enum: [],
ui: {
widget: 'select',
placeholder: '请选择'
},
default: data?.pa2ge2 || ''
},
page: {
type: 'string',
title: '应收备注',
ui: {
placeholder: '请输入'
},
default: data?.page || ''
}
},
required: ['page2', 'pag2e21', 'createTi2me', 'pa2ge2']
};
}
private initST(): STColumn[] {
return [
{ title: '结算客户', render: 'description1', width: 150 },
{ title: '费用科目', render: 'description2', width: 120 },
{ title: '税率', render: 'description3', width: 120 },
{ title: '应收金额', render: 'num', width: 120 },
{ title: '备注', render: 'description5', width: 150 },
{
title: '操作',
fixed: 'right',
className: 'text-center',
width: 90,
buttons: [
{
text: '删除',
click: item => {
this.st.removeRow(item);
this.data = this.data.filter(i => i.id !== item.id);
console.log(this.st.data, this.st._data);
}
}
]
}
];
}
}

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

@ -12,6 +12,8 @@ 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 { CostManagementDetailComponent } from './components/cost-management/cost-management-detail/cost-management-detail.component';
import { ExpensesReceivableComponent } from './components/cost-management/expenses-receivable/expenses-receivable.component';
import { ExpensesPayableComponent } from './components/cost-management/expenses-payable/expenses-payable.component';
const routes: Routes = [
{ path: 'freight-account', component: FreightAccountComponent },
@ -25,6 +27,8 @@ const routes: Routes = [
// { path: 'voucher-summary', component: VoucherSummaryComponent },
{ path: 'cost-management', component: CostManagementComponent },
{ path: 'cost-management/detail/:id', component: CostManagementDetailComponent },
{ path: 'cost-management/expenses-receivable/:id', component: ExpensesReceivableComponent },
{ path: 'cost-management/expenses-payable/:id', component: ExpensesPayableComponent },
{ 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

@ -16,6 +16,8 @@ import { PaymentRecordComponent } from './components/payment-record/payment-reco
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';
import { ExpensesReceivableComponent } from './components/cost-management/expenses-receivable/expenses-receivable.component';
import { ExpensesPayableComponent } from './components/cost-management/expenses-payable/expenses-payable.component';
const ROUTESCOMPONENTS = [
FreightAccountComponent,
@ -27,7 +29,9 @@ const ROUTESCOMPONENTS = [
PaymentRecordComponent,
TransactionFlowComponent,
CostManagementComponent,
CostManagementDetailComponent
CostManagementDetailComponent,
ExpensesReceivableComponent,
ExpensesPayableComponent
];
const NOTROUTECOMPONENTS = [DriverAccountDetailComponent, FreightAccountDetailComponent, SettingFinancialComponent, ClearingModalComponent];

10
src/assets/mocks/menu-data.json
View File

@ -260,6 +260,16 @@
"hide": true,
"link": "/financial-management/cost-management/detail/:id"
},
{
"text": "应收费用单",
"hide": true,
"link": "/financial-management/cost-management/expenses-receivable/:id"
},
{
"text": "应付费用单",
"hide": true,
"link": "/financial-management/cost-management/expenses-payable/:id"
},
{
"text": "货主账户",
"link": "/financial-management/freight-account"