工作组数据统计

This commit is contained in:
宋伟佳
2021-11-12 15:45:04 +08:00
parent 3d3d586fbb
commit 36884ea627
14 changed files with 4867 additions and 4 deletions
@@ -0,0 +1,312 @@
<!--标法规-工作组-项目费用统计信息-标准制修订补助资金收支统计--支出表-->
<template>
<div id="translateCost" class="child2">
<!-- 第一第二行表单 -->
<div class="revise">
<el-form :inline="true" :model="formInline1" class="demo-form-inline">
<el-form-item label="项目名称:">
<el-input v-model="formInline1.name" placeholder="根据项目名称搜索" ></el-input>
</el-form-item>
<el-form-item style="width: 50px"></el-form-item>
<el-form-item label="支出金额:">
<el-input v-model="formInline1.money" placeholder="根据支出金额搜索" ></el-input>
</el-form-item>
<el-form-item style="width: 50px"></el-form-item>
<el-form-item label="用途:">
<el-input v-model="formInline1.use" placeholder="根据用途搜索" >
</el-input>
</el-form-item>
<el-form-item style="width: 100px"></el-form-item>
<el-form-item class="search-item btn-box" >
<el-button type="primary" size="small" onclick="" >查询</el-button>
</el-form-item>
<el-form-item class="search-item btn-box">
<el-button type="" size="small" onclick="" >清空</el-button>
</el-form-item>
</el-form>
<el-form :inline="true" :model="formInline2">
<el-form-item>
<el-button type="primary" size="small" @click="drawer1 = true" >新增</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="drawer2 = true" >编辑</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="dialogVisible1 = true" >导入</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="dialogVisible2 = true" >导出</el-button>
</el-form-item>
<el-form-item>
<el-button type="" size="small" @click="deleteDetail" icon="el-icon-delete" icon-color="red">批量删除</el-button>
<!-- handleDelete(scope.$index, scope.row)-->
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" onclick="" >模板下载</el-button>
</el-form-item>
</el-form>
</div>
<!-- 表格-->
<div class="">
<el-table
:data="tableData"
tooltip-effect="dark"
style="width: auto"
border
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="50">
</el-table-column>
<el-table-column
align="center"
type="index"
label="序号"
width="100"
>
</el-table-column>
<el-table-column
align="center"
prop="name"
label="项目名称"
>
</el-table-column>
<el-table-column
align="center"
prop="payMoney"
label="支出金额"
>
</el-table-column>
<el-table-column
align="center"
prop="use"
label="用途"
>
<!-- <template slot-scope="scope">{{ scope.row.date }}</template>-->
</el-table-column>
<el-table-column
align="center"
prop="detailAnnex"
label="详细附件"
>
</el-table-column>
</el-table>
</div>
<!-- 新增抽屉 -->
<div class="meeting-drawer">
<el-drawer
:size="size"
title="新增"
:visible.sync="drawer1">
<div style="margin: 10px;"></div>
<el-form :label-position="labelPosition" label-width="150px" :model="formLabelAlign" v-model="labelPosition">
<el-form-item label="项目名称">
<el-input v-model="formLabelAlign.name" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="支出金额">
<el-input v-model="formLabelAlign.payMoney" type="text" placeholder="请填写" style="width: 433px"></el-input>
</el-form-item>
<el-form-item label="用途">
<el-input v-model="formLabelAlign.use" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="详细附件">
<el-input v-model="formLabelAlign.detailAnnex" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item style="height: 250px"></el-form-item>
<el-form-item :inline="true" label-width="400px">
<el-button @click="dialogVisible2 = false">取消</el-button>
<el-button type="primary" @click="submit()">提交</el-button>
</el-form-item>
</el-form>
</el-drawer>
</div>
<!-- 编辑抽屉 -->
<div class="meeting-drawer">
<el-drawer
:size="size"
title="编辑"
:visible.sync="drawer2">
<div style="margin: 10px;"></div>
<el-form :label-position="labelPosition" label-width="150px" :model="formLabelAlign2" v-model="labelPosition">
<el-form-item label="项目名称">
<el-input v-model="formLabelAlign2.name" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="支出金额">
<el-input v-model="formLabelAlign2.payMoney" type="text" placeholder="请填写" style="width: 433px"></el-input>
</el-form-item>
<el-form-item label="用途">
<el-input v-model="formLabelAlign2.use" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="详细附件">
<el-input v-model="formLabelAlign2.detailAnnex" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item style="height: 250px"></el-form-item>
<el-form-item :inline="true" label-width="400px">
<el-button @click="dialogVisible2 = false">取消</el-button>
<el-button type="primary" @click="addUser">提交</el-button>
</el-form-item>
</el-form>
</el-drawer>
</div>
<div>
<!-- 导入弹框 -->
<el-dialog
title="导入文件"
:visible.sync="dialogVisible1"
width="30%"
>
<el-button class="leading-in">点击或拖拽上传文件</el-button>
</el-dialog>
</div>
<!-- 页脚分页-->
<div class="block">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-size="10"
layout="total, sizes, prev, pager, next, jumper"
:total="100">
</el-pagination>
</div>
</div>
</template>
<script>
export default {
name: "child2",
data() {
return {
formInline1: {
name: '',
money: '',
use: ''
},
tableData: [{
name: '1',
payMoney: '1',
use: '1',
detailAnnex: '1'
}],
multipleSelection: [],
drawer1: false,
drawer2: false,
size: '600px',
labelPosition: 'center',
formLabelAlign: {
name: '',
payMoney: '',
use: '',
detailAnnex: ''
},
formLabelAlign2: {
name: '',
payMoney: '',
use: '',
detailAnnex: ''
},
dialogVisible1: false,
dialogVisible2: false,
/*formInlineOut: {
name: '',
num: '',
remarks: ''
},*/
dialogVisible3: false,
currentPage: 1
}
},
created() {
this.getTableData()
},
methods: {
handleSelectionChange(val) {
this.multipleSelection = val;
},
//新增方法
submit: function(){
this.$confirm('确认进行添加','是否继续?','提示',{
confirmButtonText: '确定',
confirmButtonText: '取消',
}).then(()=>{
this.tableData.push({
name:this.formLabelAlign.name,
payMoney:this.formLabelAlign.payMoney,
use: this.formLabelAlign.use,
detailAnnex: this.formLabelAlign.detailAnnex
}),
this.$message({
type: 'success',
message: '添加成功'
})
})
},
//删除方法
deleteDetail: function(index,rows) {
this.$confirm('此操作将删除数据,','是否继续?','提示',{
confirmButtonText:'确定',
confirmButtonText:'取消',
type:'warning'
}).then(()=>{
this.tableData.splice(index,1)
this.$message({
type: 'success',
message:'删除成功',
})
}).catch((err) =>{
this.$message({
type:'error',
message:err
})
})
},
/*增加行和删除行*/
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
addUser (){
this.$message.success('添加信息成功!')
this.dialogVisible2=false
this.getTableData()
}
}
}
</script>
<style lang="less" scoped>
.child2{
.leading-in{
width: 400px;
height: 200px
}
.icon{
width: 20px;
height: 20px;
}
}
</style>
@@ -0,0 +1,393 @@
<!--标法规-工作组-项目费用统计信息-标准制修订补助资金收支统计--收入表-->
<template>
<div id="translateCost" class="child1">
<!-- 第一第二行表单 -->
<div class="revise">
<el-form :inline="true" :model="formInline1" class="demo-form-inline" ref="formInline1">
<el-form-item label="标准名称:">
<el-input v-model="formInline1.name" placeholder="根据标准名称搜索" ></el-input>
</el-form-item>
<el-form-item style="width: 50px"></el-form-item>
<el-form-item label="标准编号:">
<el-input v-model="formInline1.num" placeholder="根据标准编号搜索" ></el-input>
</el-form-item>
<el-form-item style="width: 50px"></el-form-item>
<el-form-item label="补助来源:">
<el-input v-model="formInline1.source" placeholder="根据补助来源搜索" >
</el-input>
</el-form-item>
<el-form-item style="width: 100px"></el-form-item>
<el-form-item class="search-item btn-box" >
<el-button type="primary" size="small" @click="" >查询</el-button>
</el-form-item>
<el-form-item class="search-item btn-box">
<el-button type="" size="small" @click="resetForm('formInline1')" >清空</el-button>
</el-form-item>
</el-form>
<el-form :inline="true">
<el-form-item>
<el-button type="primary" size="small" @click="drawer1 = true" >新增</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="drawer2 = true" >编辑</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="dialogVisible1 = true" >导入</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="dialogVisible2 = true" >导出</el-button>
</el-form-item>
<el-form-item>
<el-button type="" size="small" @click.native.prevent="deleteDetail($index,tableData)" icon="el-icon-delete" icon-color="red">批量删除</el-button>
<!-- handleDelete(scope.$index, scope.row)-->
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" onclick="" >模板下载</el-button>
</el-form-item>
</el-form>
</div>
<!-- 表格-->
<div class="">
<el-table
:data="tableData"
tooltip-effect="dark"
style="width: auto"
border
:header-cell-style="{background: '#f5f1f1', color: '#333333', fontSize: '16px',
fontWeight: 'bold', height: '48px'}"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="50">
</el-table-column>
<el-table-column
align="center"
type="index"
label="序号"
width="100"
>
</el-table-column>
<el-table-column
align="center"
prop="name"
label="标准名称"
>
</el-table-column>
<el-table-column
align="center"
prop="num"
label="标准编号"
>
</el-table-column>
<el-table-column
align="center"
prop="source"
label="补助来源"
>
<!-- <template slot-scope="scope">{{ scope.row.date }}</template>-->
</el-table-column>
<el-table-column
align="center"
prop="money"
label="补助金额"
>
</el-table-column>
<el-table-column
align="center"
prop="time"
label="入账时间"
>
</el-table-column>
</el-table>
</div>
<!-- 新增抽屉 -->
<div class="meeting-drawer">
<el-drawer
:size="size"
title="新增"
:visible.sync="drawer1">
<div style="margin: 10px;"></div>
<el-form :label-position="labelPosition" label-width="150px" :model="formLabelAlign" >
<el-form-item label="标准名称">
<el-input v-model="formLabelAlign.name" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="标准编号">
<el-input v-model="formLabelAlign.num" type="text" placeholder="请填写" style="width: 433px"></el-input>
</el-form-item>
<el-form-item label="补助来源">
<el-input v-model="formLabelAlign.source" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="补助金额">
<el-input v-model="formLabelAlign.money" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="入账时间">
<el-input v-model="formLabelAlign.time" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item style="height: 200px"></el-form-item>
<el-form-item :inline="true" label-width="400px">
<el-button @click="dialogVisible2 = false">取消</el-button>
<el-button type="primary" @click="submit()">提交</el-button>
</el-form-item>
</el-form>
</el-drawer>
</div>
<!-- 编辑抽屉 -->
<div class="meeting-drawer">
<el-drawer
:size="size"
title="编辑"
:visible.sync="drawer2">
<div style="margin: 10px;"></div>
<el-form :label-position="labelPosition" label-width="150px" :model="formLabelAlign2">
<el-form-item label="标准名称">
<el-input v-model="formLabelAlign2.name" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="标准编号">
<el-input v-model="formLabelAlign2.num" type="text" placeholder="请填写" style="width: 433px"></el-input>
</el-form-item>
<el-form-item label="补助来源">
<el-input v-model="formLabelAlign2.source" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="补助金额">
<el-input v-model="formLabelAlign2.money" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item label="入账时间">
<el-input v-model="formLabelAlign2.time" type="text" placeholder="请填写" style="width: 433px" >
</el-input>
</el-form-item>
<el-form-item style="height: 200px"></el-form-item>
<el-form-item :inline="true" label-width="400px">
<el-button @click="dialogVisible2 = false">取消</el-button>
<el-button type="primary" @click.native.prevent="editSubForm">提交</el-button>
</el-form-item>
</el-form>
</el-drawer>
</div>
<div>
<!-- 导入弹框 -->
<el-dialog
title="导入文件"
:visible.sync="dialogVisible1"
width="30%"
>
<el-button class="leading-in">点击或拖拽上传文件</el-button>
</el-dialog>
<!-- 导出弹框 -->
<!-- <el-dialog
title="导出文件"
:visible.sync="dialogVisible2"
width="30%"
>
<el-form :model="formInlineOut">
<el-form-item label="名称" >
<el-input v-model="formInlineOut.name" style="width:350px"></el-input>
</el-form-item>
<el-form-item label="序号" >
<el-input v-model="formInlineOut.num" style="width:350px"></el-input>
</el-form-item>
<el-form-item label="备注" >
<el-input v-model="formInlineOut.remarks" style="width:350px"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible2 = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible2 = false">确 定</el-button>
</span>
</el-dialog>-->
</div>
<!-- 页脚分页-->
<div class="block">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-size="10"
layout="total, sizes, prev, pager, next, jumper"
:total="100">
</el-pagination>
</div>
</div>
</template>
<script>
export default {
name: "child1",
data() {
return {
formInline1: {
name: '',
num: '',
source: ''
},
tableData: [{
name: '1',
num: '397433',
source: '来源1',
money: '2322',
time: '2020-02-02'
},{
name: '2',
num: '123456',
source: '来源2',
money: '1111',
time: '2020-04-06'
},{
name: '3',
num: '3',
source: '3',
money: '3',
time: '3'
}
],
multipleSelection: [],
drawer1: false,
drawer2: false,
size: '600px',
labelPosition: 'center',
formLabelAlign: {
name: '',
num: '',
source: '',
money: '',
time: ''
},
formLabelAlign2: {
name: '',
num: '',
source: '',
money: '',
time: ''
},
rowIndex: null,
dialogVisible1: false,
dialogVisible2: false,
dialogVisible3: false,
currentPage: 1
}
},
created() {
},
methods: {
//新增方法
submit: function(){
this.$confirm('确认进行添加','是否继续?','提示',{
confirmButtonText: '确定',
confirmButtonText: '取消',
}).then(()=>{
this.tableData.push({
name:this.formLabelAlign.name,
num:this.formLabelAlign.num,
source: this.formLabelAlign.source,
money: this.formLabelAlign.money,
time: this.formLabelAlign.time
}),
this.$message({
type: 'success',
message: '添加成功'
})
})
},
//删除方法
deleteDetail: function(index,rows) {
this.$confirm('此操作将删除数据,','是否继续?','提示',{
confirmButtonText:'确定',
confirmButtonText:'取消',
type:'warning'
}).then(()=>{
this.tableData.splice(index,1)
this.$message({
type: 'success',
message:'删除成功',
})
}).catch((err) =>{
this.$message({
type:'error',
message:err
})
})
},
//编辑(修改)
drawer2:function (index,row) {
this.formLabelAlign2=Object.assign({},row);
_index=index;
console.log(index);
console.log(_index);
},
//点击确定(编辑)(没出)
editSubForm(){
var editdata= _index;
console.log(editdata);
this.tableData[editdata].name=this.formLabelAlign2.name;
this.tableData[editdata].num=this.formLabelAlign2.num;
this.tableData[editdata].source=this.formLabelAlign2.source;
this.tableData[editdata].money=this.formLabelAlign2.money;
this.tableData[editdata].time=this.formLabelAlign2.time;
this.FormVisible = true;
},
//清空
resetForm(formName) {
this[formName] = {};
this.$nextTick(() => {
this.$refs[formName].resetFields()
});
},
/*获取需要渲染到页面中的数据*/
getShowData:function (arr){
this.clonetableData=JSON.parse(JSON.stringify(arr));
},
/*专门为查询写的渲染数据*/
getShowData1:function (arr){
this.tableData=JSON.parse(JSON.stringify(arr));
},
/*分页*/
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
}
}
}
</script>
<style lang="less" scoped>
.child1{
.leading-in{
width: 400px;
height: 200px
}
.icon{
width: 20px;
height: 20px;
}
}
</style>