418 lines
13 KiB
Vue
418 lines
13 KiB
Vue
<!--标法规-工作组-项目费用统计信息-标准制修订补助资金收支统计--收入表-->
|
|
<template>
|
|
<div id="inComeSubsidy" class="child1">
|
|
<!-- 第一第二行表单 -->
|
|
<el-form :inline="true" :model="formQuery">
|
|
<el-form-item class="add-form-item" label="标准名称">
|
|
<el-input v-model.trim="formQuery.name" clearable size="small" placeholder="请输入标准名称"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="标准编号">
|
|
<el-input v-model.trim="formQuery.number" clearable size="small" placeholder="请输入标准编号"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="补助来源">
|
|
<el-input v-model.trim="formQuery.source" clearable size="small" placeholder="请输入补助来源"></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" size="small" @click="queryData">查询</el-button>
|
|
<el-button type="" size="small" @click="resetForm('formQuery')">清空</el-button>
|
|
</el-form-item>
|
|
<el-divider/>
|
|
<div style="float: left">
|
|
<el-button type="primary" size="small" @click="dataAdd">新增</el-button>
|
|
<el-button type="primary" size="small" @click="dialogVisible1 = true">导入</el-button>
|
|
<el-button type="primary" size="small" @click="dialogVisible2 = true">导出</el-button>
|
|
<el-button type="danger" size="small" @click="deleteDetail" icon="el-icon-delete">批量删除</el-button>
|
|
<el-button type="primary" size="small" onclick="">模板下载</el-button>
|
|
</div>
|
|
</el-form>
|
|
<el-divider/>
|
|
|
|
<!-- 表格-->
|
|
<div class="container">
|
|
<el-table
|
|
:data="tableData"
|
|
tooltip-effect="dark"
|
|
style="width: auto"
|
|
border
|
|
height="100%"
|
|
:header-cell-style="{background: '#f5f1f1', color: '#333333', padding: 0, fontSize: '16px',
|
|
fontWeight: 'bold', height: '48px'}"
|
|
@selection-change="handleSelectionChange">
|
|
<el-table-column
|
|
align="center"
|
|
type="selection"
|
|
width="50">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
type="index"
|
|
label="序号"
|
|
width="50">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
prop="name"
|
|
label="标准名称">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
prop="number"
|
|
label="标准编号">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
prop="source"
|
|
label="补助来源">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
prop="cost"
|
|
label="补助金额">
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
prop="time"
|
|
label="入账时间">
|
|
<template slot-scope="scope">
|
|
{{ scope.row.time ? $moment(scope.row.time).format("YYYY-MM-DD HH:mm:ss") : '' }}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center" width="50" fixed="right">
|
|
<template slot-scope="scope">
|
|
<div @click.stop style="display: inline-block">
|
|
<el-dropdown trigger="click" @command="handleCommand">
|
|
<i class="iconfont"></i>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item :command="[scope.row, '编辑']" v-btn-permission="''">
|
|
编辑
|
|
</el-dropdown-item>
|
|
<el-dropdown-item :command="[scope.row, '删除']" v-btn-permission="''">
|
|
删除
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<loading :loading="loading">加载中...</loading>
|
|
<pagination
|
|
:page="formQuery.page"
|
|
:total="tableTotal"
|
|
@pageChange="pageChange"
|
|
@pageSizeChange="pageSizeChange"/>
|
|
</div>
|
|
<!-- 新增抽屉 -->
|
|
<el-drawer
|
|
size="50%"
|
|
:title="drawerTitle"
|
|
:visible.sync="drawerTable">
|
|
<div style="margin: 10px;height: inherit">
|
|
<el-form class="label-input-form" label-width="150px" ref="formShowData" :model="formShowData" :rules="formRules">
|
|
<el-form-item class="add-form-item" label="标准名称">
|
|
<el-input v-model.trim="formShowData.name" type="text" placeholder="请填写">
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="标准编号">
|
|
<el-input v-model.trim="formShowData.number" type="text" placeholder="请填写"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="补助来源">
|
|
<el-input v-model.trim="formShowData.source" type="text" placeholder="请填写">
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="补助金额">
|
|
<el-input v-model.trim="formShowData.cost" type="text" placeholder="请填写">
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="入账时间">
|
|
<el-date-picker
|
|
v-model.trim="formShowData.time"
|
|
type="datetime"
|
|
format="yyyy-MM-dd HH:mm:ss"
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
placeholder="选择日期时间">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<div class="demo-drawer-footer">
|
|
<el-button size="small" @click="drawerTable = false">取消</el-button>
|
|
<el-button size="small" type="primary" :loading="submitLoading" @click="submit()">提交</el-button>
|
|
</div>
|
|
|
|
</el-drawer>
|
|
<!-- <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 class="add-form-item" label="名称" >
|
|
<el-input v-model.trim="formInlineOut.name" style="width:350px"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="序号" >
|
|
<el-input v-model.trim="formInlineOut.num" style="width:350px"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="add-form-item" label="备注" >
|
|
<el-input v-model.trim="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>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import { inComeQuery, inComeEdit, inComeAdd, inComeDel } from '@/api/statisticsApi'
|
|
export default {
|
|
name: "child1",
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
formQuery: {
|
|
name: '',
|
|
number: '',
|
|
source: '',
|
|
current: 1,
|
|
page: 1,
|
|
pageSize: this.$store.getters.userInfo.configContent,
|
|
},
|
|
tableTotal: 0,
|
|
tableData: [],
|
|
multipleSelection: [],
|
|
formShowData: {
|
|
id: '',
|
|
name: '',
|
|
number: '',
|
|
source: '',
|
|
cost: '',
|
|
time: ''
|
|
},
|
|
drawerTable: false,
|
|
drawerTitle: '',
|
|
formRules: {},
|
|
submitLoading: false
|
|
}
|
|
},
|
|
|
|
created() {
|
|
this.getTableData()
|
|
},
|
|
methods: {
|
|
getTableData() {
|
|
inComeQuery(this.formQuery).then(res=>{
|
|
this.tableData = res.data.list
|
|
this.tableTotal = res.data.count
|
|
})
|
|
},
|
|
//新增方法
|
|
dataAdd() {
|
|
this.drawerTitle = '新增'
|
|
this.formShowData = {}
|
|
this.drawerTable = true
|
|
},
|
|
// 提交按钮
|
|
submit() {
|
|
this.$refs['formShowData'].validate((valid) => {
|
|
if (valid) {
|
|
this.submitLoading = true
|
|
if (this.drawerTitle === '新增') {
|
|
inComeAdd(this.formShowData).then(res=>{
|
|
if (res.ok) {
|
|
this.$message.success('新增成功')
|
|
this.submitLoading = false
|
|
this.getTableData()
|
|
} else {
|
|
this.$message.warning('新增失败')
|
|
this.submitLoading = false
|
|
}
|
|
this.drawerTable = false
|
|
}, e => {
|
|
})
|
|
} else {
|
|
inComeEdit(this.formShowData).then(res => {
|
|
if (res.ok) {
|
|
this.$message.success('编辑成功')
|
|
this.submitLoading = false
|
|
this.getTableData()
|
|
} else {
|
|
this.$message.warning('编辑失败')
|
|
this.submitLoading = false
|
|
}
|
|
this.drawerTable = false
|
|
},e => {
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
handleSelectionChange(val) {
|
|
this.multipleSelection = val
|
|
},
|
|
//删除方法
|
|
deleteDetail() {
|
|
if (this.multipleSelection.length > 0) {
|
|
let msgIds = []
|
|
for (let i = 0; i < this.multipleSelection.length; i++) {
|
|
let msgId = this.multipleSelection[i].id
|
|
msgIds.push(msgId)
|
|
}
|
|
let delId = {
|
|
ids: msgIds.join(',')
|
|
}
|
|
this.$confirm('确定删除这些数据?', '提示', {
|
|
confirmButtonText: this.$t('m.determine'),
|
|
cancelButtonText: this.$t('m.cancel'),
|
|
type: 'warning',
|
|
confirmButtonClass: 'common-button-primary',
|
|
roundButton: true
|
|
}).then(() => {
|
|
inComeDel(delId).then(res => {
|
|
if (res.ok) {
|
|
this.$message.success('删除成功')
|
|
this.pageNo = 1
|
|
this.multipleSelection = ''
|
|
this.getTableData()
|
|
} else {
|
|
this.$message.warning('删除失败')
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
this.$message({
|
|
type: 'info',
|
|
message: '已取消删除'
|
|
})
|
|
})
|
|
} else {
|
|
this.$message.warning('请选择一条数据进行删除')
|
|
}
|
|
},
|
|
// 查询按钮
|
|
queryData() {
|
|
this.getTableData()
|
|
},
|
|
//清空
|
|
resetForm() {
|
|
this.formQuery = {}
|
|
this.getTableData()
|
|
},
|
|
// 列表更多按钮
|
|
handleCommand(command) {
|
|
switch (command[1]) {
|
|
case "编辑":
|
|
this.editRowOne(command[0]);
|
|
break;
|
|
case "删除":
|
|
this.deleteRowOne(command[0].id);
|
|
break;
|
|
}
|
|
},
|
|
editRowOne(item) {
|
|
this.drawerTitle = '编辑'
|
|
this.formShowData = {
|
|
id: item.id,
|
|
type: item.type,
|
|
number: item.number,
|
|
name: item.name,
|
|
source: item.source,
|
|
cost: item.cost,
|
|
time: this.$moment(item.time).format('YYYY-MM-DD HH:mm:ss'),
|
|
}
|
|
this.drawerTable = true
|
|
},
|
|
deleteRowOne(val) {
|
|
let delId = {
|
|
ids: val
|
|
}
|
|
this.$confirm('确定删除这些数据?', '提示', {
|
|
confirmButtonText: this.$t('m.determine'),
|
|
cancelButtonText: this.$t('m.cancel'),
|
|
type: 'warning',
|
|
confirmButtonClass: 'common-button-primary',
|
|
roundButton: true
|
|
}).then(() => {
|
|
inComeDel(delId).then(res => {
|
|
if (res.ok) {
|
|
this.$message.success('删除成功')
|
|
this.pageNo = 1
|
|
this.multipleSelection = []
|
|
this.getTableData()
|
|
} else {
|
|
this.$message.warning('删除失败')
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
this.$message({
|
|
type: 'info',
|
|
message: '已取消删除'
|
|
})
|
|
})
|
|
},
|
|
/** 分页 */
|
|
pageChange(page) {
|
|
this.formQuery.page = page
|
|
this.getTableData()
|
|
},
|
|
pageSizeChange(pageSize) {
|
|
this.formQuery.pageSize = pageSize
|
|
this.getTableData()
|
|
},
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.child1 {
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.el-form-item {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.el-divider--horizontal {
|
|
height: 0.5px;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
flex: auto;
|
|
width: 100%;
|
|
height: calc(100% - 110px) !important;
|
|
}
|
|
|
|
.leading-in {
|
|
width: 400px;
|
|
height: 200px
|
|
}
|
|
|
|
.icon {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
}
|
|
</style>
|
|
|