246 lines
8.3 KiB
Vue
246 lines
8.3 KiB
Vue
<template>
|
|
<div class="reportTable">
|
|
<!-- <el-button v-if="!disabled" class="addbtn" size="small" @click="addReport">添加报告</el-button>-->
|
|
<el-button v-if="!disabled" class="delbtn" size="small" @click="deleteAll">批量删除</el-button>
|
|
<div class="table">
|
|
<vxe-table :data="processTable" :empty-render="{name: 'NotData'}" align="center" border stripe max-height="280"
|
|
ref="xTable" @checkbox-all="selectAllEvent" @checkbox-change="selectChangeEvent">
|
|
<vxe-column type="checkbox" width="60"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="name" title="报告名称"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="confidentialLevel" title="报告涉密等级"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="privacyLevel" title="报告隐私等级"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="oneApproveName" title="审批人"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="twoApproveName" title="二级审批人"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="applyReason" title="申请原因"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="powerName" title="申请权限"></vxe-column>
|
|
|
|
<vxe-column show-overflow show-header-overflow title="操作" width="200" fixed="right" v-if="!disabled">
|
|
<template #default="{ row,rowIndex }">
|
|
<el-button type="text" class="" @click="editTable(row,rowIndex)">编辑</el-button>
|
|
<el-button type="text" class="del-btn" @click="reportDelete(row)">删除</el-button>
|
|
<!-- <el-button type="text" @click="downloadRow(row)">下载</el-button>-->
|
|
</template>
|
|
</vxe-column>
|
|
</vxe-table>
|
|
<!-- <el-pagination-->
|
|
<!-- class="pagination"-->
|
|
<!-- @size-change="handleLogSizeChange"-->
|
|
<!-- @current-change="handleLogCurrentChange"-->
|
|
<!-- :current-page="qLog.pageNo"-->
|
|
<!-- :page-sizes="[5, 10, 20]"-->
|
|
<!-- :page-size="qLog.pageSize"-->
|
|
<!-- layout="total, sizes, prev, pager, next, jumper"-->
|
|
<!-- :total="total"/>-->
|
|
<reportDrawer ref="reportDrawer" :isShow="editDialog" :form="form" @close="editDialog=false" @update="updateTable"></reportDrawer>
|
|
<!-- <reportDialog ref="reportDialog" :tagsForm="tagsForm" :alreadyData="value" @confirm="addReportList"></reportDialog>-->
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import reportDrawer from './reportDrawer'
|
|
|
|
export default {
|
|
name: 'reportTable',
|
|
props: {
|
|
value: {
|
|
type: Array,
|
|
default: new Array([]),
|
|
required: true
|
|
},
|
|
disabled: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
components: {
|
|
reportDrawer
|
|
},
|
|
data () {
|
|
return {
|
|
form:{},
|
|
formIndex:0,
|
|
editDialog: false,
|
|
processTable: [],
|
|
total: 0,
|
|
qLog: {
|
|
pageSize: 10,
|
|
pageNo: 1
|
|
},
|
|
copyTableData: [],
|
|
checkIds: [],
|
|
}
|
|
},
|
|
watch: {
|
|
value () {
|
|
// this.qLog.pageSize = 10
|
|
// this.qLog.pageNo = 1
|
|
// this.total = this.value.length
|
|
// this.processTable = this.value.slice(0, 9)
|
|
// this.pageChage(1)
|
|
this.processTable = this.value
|
|
}
|
|
},
|
|
created () {
|
|
// this.copyTableData = JSON.parse(JSON.stringify(this.tableData))
|
|
},
|
|
methods: {
|
|
updateTable(form){
|
|
this.$set(this.processTable,this.formIndex,form)
|
|
|
|
this.$emit('updateTable',this.processTable)
|
|
},
|
|
editTable(row,index) {
|
|
this.form = JSON.parse(JSON.stringify(row))
|
|
this.formIndex=index
|
|
this.$refs.reportDrawer.open(this.form)
|
|
},
|
|
addReportList (list) {
|
|
this.$nextTick(()=>{
|
|
this.$emit('updateTable', [...this.value , ...list])
|
|
})
|
|
},
|
|
pageChage (current) {
|
|
this.total = this.value.length
|
|
setTimeout(() => {
|
|
current = current || this.qLog.pageNo
|
|
this.qLog.pageNo = current
|
|
this.processTable = this.value.slice(this.qLog.pageSize * (current - 1), this.qLog.pageSize * current)
|
|
// console.log(this.pages.size, this.pages.size * (current - 1), this.pages.size * this.pages.current, this.list)
|
|
if (this.processTable.length < 1 && current > 1) {
|
|
this.pageChage(current - 1)
|
|
return false
|
|
}
|
|
})
|
|
},
|
|
handleLogSizeChange (val) {
|
|
this.qLog.pageSize = val
|
|
this.qLog.pageNo = 1
|
|
this.pageChage(1)
|
|
},
|
|
handleLogCurrentChange (val) {
|
|
this.qLog.pageNo = 1
|
|
this.pageChage(val)
|
|
},
|
|
selectAllEvent ({ checked }) {
|
|
const records = this.$refs.xTable.getCheckboxRecords()
|
|
this.checkIds = records
|
|
},
|
|
selectChangeEvent ({ checked }) {
|
|
const records = this.$refs.xTable.getCheckboxRecords()
|
|
this.checkIds = records
|
|
},
|
|
addReport () {
|
|
this.$refs.reportDialog.show()
|
|
},
|
|
deleteAll () {
|
|
this.reportDelete(this.checkIds)
|
|
},
|
|
reportDelete (row) {
|
|
// 删除报告 假删除
|
|
|
|
if (Array.isArray(row)) {
|
|
this.$confirm('此操作将删除所选数据, 是否继续?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
if (this.$route.query.taskDefinitionKey == 'reEdit' ){
|
|
// 有idde
|
|
console.log(this.value)
|
|
var idsList=this.checkIds.filter(item=>{
|
|
if(item.id && item.id !=''){
|
|
return item
|
|
}
|
|
})
|
|
var reportList=this.checkIds.filter(item=>{
|
|
if(!item.id ){
|
|
return item
|
|
}
|
|
})
|
|
|
|
var newValue=[]
|
|
if(idsList.length>0){
|
|
idsList=idsList.map(item=>{
|
|
return item.reportId
|
|
})
|
|
reportList=reportList.map(item=>{
|
|
return item.reportId
|
|
})
|
|
// this.$api.permissionProcess.deletReport({ids:idsList}).then(()=>{
|
|
if(reportList.length>0){
|
|
let reportids= row.map(item=>item.reportId)
|
|
newValue=this.value.filter(item =>
|
|
reportids.indexOf(item.reportId)==-1
|
|
)
|
|
this.$emit('updateTable', newValue,idsList)
|
|
}else{
|
|
newValue=this.value.filter(item =>
|
|
idsList.indexOf(item.reportId)==-1
|
|
)
|
|
this.$emit('updateTable', newValue,idsList)
|
|
}
|
|
// })
|
|
}else{
|
|
if(reportList.length>0){
|
|
reportList=reportList.map(item=>{
|
|
return item.reportId
|
|
})
|
|
newValue=this.value.filter(item => reportList.indexOf(item.reportId)==-1
|
|
)
|
|
this.$emit('updateTable', newValue,[])
|
|
}
|
|
}
|
|
|
|
}
|
|
else{
|
|
let id=row.map(item=>item.reportId)
|
|
this.$emit('updateTable', this.value.filter(item => id.indexOf(item.reportId) === -1))
|
|
}
|
|
})
|
|
}
|
|
else{
|
|
this.$confirm('此操作将删除所选数据, 是否继续?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
if (this.$route.query.taskDefinitionKey == 'reEdit' ){
|
|
if(row.id && row.id !=''){
|
|
// this.$api.permissionProcess.deletReport({ids:[row.id]}).then(()=>{
|
|
this.$emit('updateTable',this.value.filter(item => item.id !== row.id),[row.reportId])
|
|
// })
|
|
}else{
|
|
this.$emit('updateTable', this.value.filter(item => item.reportId !== row.reportId),[])
|
|
}
|
|
}else{
|
|
this.$emit('updateTable', this.value.filter(item => item.reportId !== row.reportId),[])
|
|
}
|
|
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.table{
|
|
margin-top: 10px;
|
|
}
|
|
.reportTable{
|
|
margin-bottom: 20px;
|
|
}
|
|
.addbtn{
|
|
border: none;
|
|
background-color: #8400FF;
|
|
color: #fff;
|
|
}
|
|
.delbtn{
|
|
border: none;
|
|
background-color: #d9001b;
|
|
color: #fff;
|
|
}
|
|
</style>
|