添加区分字段

This commit is contained in:
刘华勇 2024-01-21 22:23:27 +08:00
parent 34b553be1a
commit e94a01fc96
2 changed files with 204 additions and 324 deletions

View File

@ -2,95 +2,50 @@
<div class="app-container">
<div class="head-container" style="margin: 20px 0px">
<!-- 搜索 -->
<el-input
v-model="searchObj.contractName"
clearable
placeholder="合同名称"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input v-model="searchObj.contractName" clearable placeholder="合同名称" style="width: 200px; margin-right: 10px"
class="filter-item" maxlength="100" />
<el-input
v-model="searchObj.invoicingNamePartyA"
clearable
placeholder="发票抬头(甲方)"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input
v-model="searchObj.invoicingNamePartyB"
clearable
placeholder="发票抬头(乙方)"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-date-picker class="filter-item"
style="width: 200px;margin-right: 10px"
v-model="searchObj.invoiceDateGt"
type="date"
value-format="yyyy-MM-dd"
placeholder="开票日期开始"
></el-date-picker>
<el-date-picker class="filter-item"
style="width: 200px;margin-right: 10px"
v-model="searchObj.invoiceDateLt"
type="date"
value-format="yyyy-MM-dd"
placeholder="开票日期结束"
></el-date-picker>
<el-button
class="filter-item"
type="success"
icon="el-icon-search"
@click="searchBtn"
>搜索</el-button
>
<el-input v-model="searchObj.invoicingNamePartyA" clearable placeholder="发票抬头(甲方)"
style="width: 200px; margin-right: 10px" class="filter-item" maxlength="100" />
<el-input v-model="searchObj.invoicingNamePartyB" clearable placeholder="发票抬头(乙方)"
style="width: 200px; margin-right: 10px" class="filter-item" maxlength="100" />
<el-date-picker class="filter-item" style="width: 200px;margin-right: 10px" v-model="searchObj.invoiceDateGt"
type="date" value-format="yyyy-MM-dd" placeholder="开票日期开始"></el-date-picker>
<el-date-picker class="filter-item" style="width: 200px;margin-right: 10px" v-model="searchObj.invoiceDateLt"
type="date" value-format="yyyy-MM-dd" placeholder="开票日期结束"></el-date-picker>
<el-button class="filter-item" type="success" icon="el-icon-search" @click="searchBtn">搜索</el-button>
<!-- 新增 -->
<div style="display: inline-block; margin: 0px 2px; float: right">
<el-button
class="filter-item"
type="primary"
icon="el-icon-plus"
@click="add"
>新增</el-button
>
<el-button class="filter-item" type="primary" icon="el-icon-plus" @click="add">新增</el-button>
</div>
</div>
<div style="margin-bottom: 15px;"> <span style="color:red;display:inline-block">合同总金额 : {{total01}}</span> <span style="color:red;display:inline-block;margin-left: 25px;">总开票金额 : {{total02}}</span> <span style="color:red;display:inline-block;margin-left: 25px;">已付款总金额 : {{total03}}</span></div>
<el-table
v-loading="listLoading"
:data="list"
border
stripe
highlight-current-row
style="width: 100%"
>
<af-table-column prop="contractId" align="center" label="合同编号" >
<div style="margin-bottom: 15px;"> <span style="color:red;display:inline-block">合同总金额 : {{ totalAmountSum }}</span>
<span style="color:red;display:inline-block;margin-left: 25px;">总开票金额 : {{ invoiceAmountSum }}</span> <span
style="color:red;display:inline-block;margin-left: 25px;">已付款总金额 : {{ paidAmountSum }}</span>
</div>
<el-table v-loading="listLoading" :data="list" border stripe highlight-current-row style="width: 100%">
<af-table-column prop="contractId" align="center" label="合同编号">
</af-table-column>
<af-table-column prop="contractName" align="center" label="合同名称" >
<af-table-column prop="contractName" align="center" label="合同名称">
</af-table-column>
<af-table-column prop="invoicingNamePartyA" align="center" label="发票抬头(甲方)" >
<af-table-column prop="invoicingNamePartyA" align="center" label="发票抬头(甲方)">
</af-table-column>
<af-table-column prop="invoicingNamePartyB" align="center" label="发票抬头(乙方)" >
<af-table-column prop="invoicingNamePartyB" align="center" label="发票抬头(乙方)">
</af-table-column>
<af-table-column prop="totalAmount" align="center" label="合同总⾦额" >
<af-table-column prop="totalAmount" align="center" label="合同总⾦额">
</af-table-column>
<af-table-column prop="invoiceAmount" align="center" label="本次开票⾦额" >
<af-table-column prop="invoiceAmount" align="center" label="本次开票⾦额">
</af-table-column>
<af-table-column prop="paidAmount" align="center" label="已付款⾦额" >
<af-table-column prop="paidAmount" align="center" label="已付款⾦额">
</af-table-column>
<af-table-column prop="invoiceDate" align="center" label="开票⽇期" >
<af-table-column prop="invoiceDate" align="center" label="开票⽇期">
</af-table-column>
<af-table-column prop="paymentDate" align="center" label="付款⽇期" >
<af-table-column prop="paymentDate" align="center" label="付款⽇期">
</af-table-column>
<af-table-column prop="notes" align="center" label="备注" >
<af-table-column prop="notes" align="center" label="备注">
</af-table-column>
<af-table-column align="center" label="操作" width="150">
<template slot-scope="scope">
@ -100,47 +55,40 @@
</af-table-column>
</el-table>
<pagination
v-show="total > 0"
layout="total, prev, pager, next"
:total="total"
:page.sync="listQuery.page"
:limit.sync="listQuery.limit"
@pagination="paginations"
/>
<pagination v-show="total > 0" layout="total, prev, pager, next" :total="total" :page.sync="listQuery.page"
:limit.sync="listQuery.limit" @pagination="paginations" />
</div>
</template>
<!-- let len = data.split('/').length;
let fileName = data.split('/')[len-1]; -->
<script>
import { xyReimburseinfoDelte ,xyProjectinfoSelectXm,invoicesContractInfo,delinvoicesContractInfo } from '@/api/article'
import { xyReimburseinfoDelte, xyProjectinfoSelectXm, invoicesContractInfo, delinvoicesContractInfo } from '@/api/article'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
import moment from 'moment'
export default {
name: 'reimbursement',
components: { Pagination },
data() {
return {
list: [],
total01:0,
total02:0,
total03:0,
totalAmountSum: 0,
invoiceAmountSum: 0,
paidAmountSum: 0,
listLoading: true,
listQuery: {
page: 1,
limit: 10
},
total: 0,
pageSize : 10,//
currentPage : 0,//
searchObj : {
sort : 'desc',
pageSize: 10,//
currentPage: 0,//
searchObj: {
sort: 'desc',
},
nameOption : [],//
nameOption: [],//
}
},
@ -150,89 +98,92 @@ export default {
},
methods: {
//
// expenseDate,asc/expenseDate,desc
getList(sort='desc') {
getList(sort = 'desc') {
this.listLoading = true
let obj = {
page : this.listQuery.page-1,
size : this.listQuery.limit,
...this.searchObj,
page: this.listQuery.page - 1,
size: this.listQuery.limit,
...this.searchObj,
sort
}
console.log(obj);
invoicesContractInfo(obj).then(res=>{
invoicesContractInfo(obj).then(res => {
this.listLoading = false;
res.content.map(item=>{
item.invoiceDate = item.invoiceDate ? moment(item.invoiceDate).format('YYYY-MM-DD') : ''
res.content.map(item => {
item.invoiceDate = item.invoiceDate ? moment(item.invoiceDate).format('YYYY-MM-DD') : ''
item.paymentDate = item.paymentDate ? moment(item.paymentDate).format('YYYY-MM-DD') : ''
return item
})
this.list = res.content;
this.total = res.totalElements;
this.totalAmountSum = res.totalAmountSum;
this.invoiceAmountSum = res.invoiceAmountSum;
this.paidAmountSum = res.paidAmountSum;
})
},
paginations(item){
paginations(item) {
console.log(item);
this.listQuery.page = item.page;
this.listQuery.limit = item.limit;
this.getList();
},
//
searchBtn(){
searchBtn() {
this.listQuery.page = 1;
this.getList();
},
// //
del(scope){
if (!this.$delectAuth()) return;
del(scope) {
if (!this.$delectAuth()) return;
// console.log(scope.row);
let id = scope.row.id
this.$confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// this.$message({
// type: 'success',
// message: '!'
// });
delinvoicesContractInfo(id).then(res=>{
// console.log(res);
this.getList();
})
}).catch(() => {
// this.$message({
// type: 'info',
// message: ''
// });
});
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// this.$message({
// type: 'success',
// message: '!'
// });
delinvoicesContractInfo(id).then(res => {
// console.log(res);
this.getList();
})
}).catch(() => {
// this.$message({
// type: 'info',
// message: ''
// });
});
},
// //
editBtn(scope){
localStorage.setItem('editData',JSON.stringify(scope.row) );
editBtn(scope) {
localStorage.setItem('editData', JSON.stringify(scope.row));
this.$router.push('/reimbursement/creatInvoice');
},
// //
add(){
localStorage.setItem('editData',null );
add() {
localStorage.setItem('editData', null);
this.$router.push('/reimbursement/creatInvoice');
},
//
nameChange(val){
nameChange(val) {
console.log(val);
console.log(this.searchObj.empName,this.searchObj.jobNum);
if(val !=""){
console.log(this.searchObj.empName, this.searchObj.jobNum);
if (val != "") {
this.searchObj.empName = val.split('-')[0]
this.searchObj.jobNum = val.split('-')[1]
}else{
this.searchObj.empName = '' ;
this.searchObj.jobNum = '' ;
} else {
this.searchObj.empName = '';
this.searchObj.jobNum = '';
}
},
}
@ -243,9 +194,11 @@ export default {
.edit-input {
padding-right: 100px;
}
/deep/ .el-table th {
background: #f5f7fa;
/deep/ .el-table th {
background: #f5f7fa;
}
.cancel-btn {
position: absolute;
right: 15px;

View File

@ -2,109 +2,39 @@
<div class="app-container">
<div class="head-container" style="margin: 20px 0px">
<!-- 搜索 -->
<el-input
v-model="searchObj.xpProName"
clearable
placeholder="项目名称"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input
v-model="searchObj.reimburseCont"
clearable
placeholder="报销内容"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input
v-model="searchObj.empName"
clearable
placeholder="姓名"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input
v-model="searchObj.reimburseAmtStart"
clearable
placeholder="报销金额起"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-input
v-model="searchObj.reimburseAmtEnd"
clearable
placeholder="报销金额止"
style="width: 200px; margin-right: 10px"
class="filter-item"
maxlength="100"
/>
<el-date-picker class="filter-item"
style="width: 200px;margin-right: 10px"
v-model="searchObj.reimburseDateStart"
type="date"
value-format="yyyy-MM-dd"
placeholder="报销日期开始"
></el-date-picker>
<el-date-picker class="filter-item"
style="width: 200px;margin-right: 10px"
v-model="searchObj.reimburseDateEnd"
type="date"
value-format="yyyy-MM-dd"
placeholder="报销日期结束"
></el-date-picker>
<el-select
style="width: 200px; margin-right: 10px"
v-model="searchObj.sort"
placeholder="查询排序"
class="filter-item"
>
<el-option
label="正序"
value="reimburseDate,asc"
></el-option>
<el-option
label="倒序"
value="reimburseDate,desc"
></el-option>
<el-input v-model="searchObj.xpProName" clearable placeholder="项目名称" style="width: 200px; margin-right: 10px"
class="filter-item" maxlength="100" />
<el-input v-model="searchObj.reimburseCont" clearable placeholder="报销内容" style="width: 200px; margin-right: 10px"
class="filter-item" maxlength="100" />
<el-input v-model="searchObj.empName" clearable placeholder="姓名" style="width: 200px; margin-right: 10px"
class="filter-item" maxlength="100" />
<el-input v-model="searchObj.reimburseAmtStart" clearable placeholder="报销金额起"
style="width: 200px; margin-right: 10px" class="filter-item" maxlength="100" />
<el-input v-model="searchObj.reimburseAmtEnd" clearable placeholder="报销金额止" style="width: 200px; margin-right: 10px"
class="filter-item" maxlength="100" />
<el-date-picker class="filter-item" style="width: 200px;margin-right: 10px" v-model="searchObj.reimburseDateStart"
type="date" value-format="yyyy-MM-dd" placeholder="报销日期开始"></el-date-picker>
<el-date-picker class="filter-item" style="width: 200px;margin-right: 10px" v-model="searchObj.reimburseDateEnd"
type="date" value-format="yyyy-MM-dd" placeholder="报销日期结束"></el-date-picker>
<el-select style="width: 200px; margin-right: 10px" v-model="searchObj.sort" placeholder="查询排序" class="filter-item">
<el-option label="正序" value="reimburseDate,asc"></el-option>
<el-option label="倒序" value="reimburseDate,desc"></el-option>
</el-select>
<el-button
class="filter-item"
type="success"
icon="el-icon-search"
@click="searchBtn"
>搜索</el-button
>
<el-button class="filter-item" type="success" icon="el-icon-search" @click="searchBtn">搜索</el-button>
<!-- 新增 -->
<div style="display: inline-block; margin: 0px 2px; float: right">
<el-button
class="filter-item"
type="primary"
icon="el-icon-plus"
@click="add"
>新增</el-button
>
<el-button class="filter-item" type="primary" icon="el-icon-plus" @click="add">新增</el-button>
</div>
</div>
<div style="margin-bottom: 15px;">
<span style="color: red;display:inline-block">报销总金额 {{ reimburseAmTotle }}</span> <span style="color: red;margin-left: 10px;display:inline-block">报销总笔数 {{ reimburseTotleCount }}</span>
<span style="color: red;display:inline-block">报销总金额 {{ reimburseAmTotle }}</span> <span
style="color: red;margin-left: 10px;display:inline-block">报销总笔数 {{ reimburseTotleCount }}</span>
</div>
<el-table
v-loading="listLoading"
:data="list"
border
stripe
highlight-current-row
style="width: 100%"
>
<el-table v-loading="listLoading" :data="list" border stripe highlight-current-row style="width: 100%">
<af-table-column align="center" prop="xpProjectnum" label="项目编号" width="200">
<!-- <template slot-scope="scope">
<!-- <template slot-scope="scope">
<span style="color:blue;cursor: pointer;" @click.prevent="handleLinkDetail(scope)">
{{ scope.row.xpProjectnum }}
</span>
@ -112,15 +42,15 @@
</af-table-column>
<af-table-column prop="xpProName" align="center" label="项目名称" >
<af-table-column prop="xpProName" align="center" label="项目名称">
<!-- <template slot-scope="scope">
<span>{{ scope.row.projectName }}</span>
</template> -->
</af-table-column>
<af-table-column prop="reimburseNum" align="center" label="报销编号" >
<af-table-column prop="reimburseNum" align="center" label="报销编号">
</af-table-column>
<af-table-column prop="reimburseCont" align="center" label="报销内容" >
<af-table-column prop="reimburseCont" align="center" label="报销内容">
<!-- <template slot-scope="scope">
<span>{{ scope.row.projectName }}</span>
</template> -->
@ -128,13 +58,13 @@
<!-- <af-table-column prop="jobNum" align="center" label="工号" >
</af-table-column> -->
<af-table-column prop="empName" align="center" class-name="status-col" label="姓名" >
<af-table-column prop="empName" align="center" class-name="status-col" label="姓名">
</af-table-column>
<af-table-column prop="reimburseAmt" align="center" label="报销金额(元)" >
<af-table-column prop="reimburseAmt" align="center" label="报销金额(元)">
</af-table-column>
<af-table-column prop="reimburseDate" align="center" label="日期" width="120" >
<af-table-column prop="reimburseDate" align="center" label="日期" width="120">
<template slot-scope="scope">
<span>{{ scope.row.reimburseDate!=null?scope.row.reimburseDate.split(' ')[0]:"" }}</span>
<span>{{ scope.row.reimburseDate != null ? scope.row.reimburseDate.split(' ')[0] : "" }}</span>
</template>
</af-table-column>
<!-- <af-table-column prop="invoiceAccessory" align="center" label="发票上传" >
@ -144,64 +74,57 @@
</div>
</template>
</af-table-column> -->
<af-table-column prop="otherAccessory" align="center" label="其他附件" >
<af-table-column prop="otherAccessory" align="center" label="其他附件">
<template slot-scope="scope">
<div>
{{ scope.row.otherAccessory.split('/')[scope.row.otherAccessory.split('/').length-1] }}
{{ scope.row.otherAccessory.split('/')[scope.row.otherAccessory.split('/').length - 1] }}
</div>
</template>
</af-table-column>
<af-table-column prop="remark" align="center" label="备注" >
<af-table-column prop="remark" align="center" label="备注">
</af-table-column>
<af-table-column align="center" label="操作" width="150">
<template slot-scope="scope">
<el-button type="primary" size='mini' @click="editBtn(scope)">修改</el-button>
<el-button type="primary" size='mini' @click="editBtn(scope)">修改</el-button>
<el-button type="primary" size='mini' @click="deleteContract(scope)">删除</el-button>
</template>
</af-table-column>
</el-table>
<pagination
v-show="total > 0"
layout="total, prev, pager, next"
:total="total"
:page.sync="listQuery.page"
:limit.sync="listQuery.limit"
@pagination="paginations"
/>
<pagination v-show="total > 0" layout="total, prev, pager, next" :total="total" :page.sync="listQuery.page"
:limit.sync="listQuery.limit" @pagination="paginations" />
</div>
</template>
<!-- let len = data.split('/').length;
let fileName = data.split('/')[len-1]; -->
<script>
import { xyReimbursementList ,xyReimburseinfoDelte ,xyProjectinfoSelectXm } from '@/api/article'
import { xyReimbursementList, xyReimburseinfoDelte, xyProjectinfoSelectXm } from '@/api/article'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
export default {
name: 'reimbursement',
components: { Pagination },
data() {
return {
list: null,
reimburseAmTotle:0,
reimburseTotleCount:0,
reimburseAmTotle: 0,
reimburseTotleCount: 0,
listLoading: true,
listQuery: {
page: 1,
limit: 10
},
total: 0,
pageSize : 10,//
currentPage : 0,//
searchObj : {
sort : 'reimburseDate,desc',
pageSize: 10,//
currentPage: 0,//
searchObj: {
sort: 'reimburseDate,desc',
},
nameOption : [],//
nameOption: [],//
}
},
@ -211,11 +134,11 @@ export default {
},
methods: {
//
getNameSelect(){
xyProjectinfoSelectXm().then(res=>{
getNameSelect() {
xyProjectinfoSelectXm().then(res => {
console.log(res);
this.nameOption = res
}).catch(err=>{
}).catch(err => {
console.log(err)
})
},
@ -223,88 +146,90 @@ export default {
getList() {
this.listLoading = true
let obj = {
page : this.listQuery.page-1,
size : this.listQuery.limit,
page: this.listQuery.page - 1,
size: this.listQuery.limit,
...this.searchObj
}
console.log(obj);
xyReimbursementList(obj).then(res=>{
xyReimbursementList(obj).then(res => {
this.listLoading = false;
this.list = res.content;
this.total = res.totalElements;
this.reimburseAmTotle = res.reimburseAmTotle;
this.reimburseTotleCount = res.reimburseTotleCount;
})
},
paginations(item){
paginations(item) {
console.log(item);
this.listQuery.page = item.page;
this.listQuery.limit = item.limit;
this.getList();
},
//
searchBtn(){
searchBtn() {
this.listQuery.page = 1;
this.getList();
},
// //
deleteContract(scope){
deleteContract(scope) {
if (!this.$delectAuth()) return;
// console.log(scope.row);
let id = scope.row.id
this.$confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// this.$message({
// type: 'success',
// message: '!'
// });
xyReimburseinfoDelte(id).then(res=>{
// console.log(res);
if(res=='200'){
this.$message({
type: 'success',
message: '删除成功!'
});
this.getList();
}else{
this.$message({
type: 'success',
message: '删除失败!状态码:'+res,
});
}
})
}).catch(() => {
// this.$message({
// type: 'info',
// message: ''
// });
});
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// this.$message({
// type: 'success',
// message: '!'
// });
xyReimburseinfoDelte(id).then(res => {
// console.log(res);
if (res == '200') {
this.$message({
type: 'success',
message: '删除成功!'
});
this.getList();
} else {
this.$message({
type: 'success',
message: '删除失败!状态码:' + res,
});
}
})
}).catch(() => {
// this.$message({
// type: 'info',
// message: ''
// });
});
},
// //
editBtn(scope){
localStorage.setItem('editData',JSON.stringify(scope.row) );
editBtn(scope) {
localStorage.setItem('editData', JSON.stringify(scope.row));
this.$router.push('/reimbursement/create');
},
// //
add(){
localStorage.setItem('editData',null );
add() {
localStorage.setItem('editData', null);
this.$router.push('/reimbursement/create');
},
//
nameChange(val){
nameChange(val) {
console.log(val);
console.log(this.searchObj.empName,this.searchObj.jobNum);
if(val !=""){
console.log(this.searchObj.empName, this.searchObj.jobNum);
if (val != "") {
this.searchObj.empName = val.split('-')[0]
this.searchObj.jobNum = val.split('-')[1]
}else{
this.searchObj.empName = '' ;
this.searchObj.jobNum = '' ;
} else {
this.searchObj.empName = '';
this.searchObj.jobNum = '';
}
},
}
@ -315,9 +240,11 @@ export default {
.edit-input {
padding-right: 100px;
}
/deep/ .el-table th {
background: #f5f7fa;
/deep/ .el-table th {
background: #f5f7fa;
}
.cancel-btn {
position: absolute;
right: 15px;