DZ/faw-report-library-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改表格字段 修改按钮样式 修改页尾距离表格的距离

Browse Source
This commit is contained in:
zhoulingpo
2023-04-19 10:53:13 +08:00
parent 0d5445d024
commit 09260eb716
6 changed files with 60 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/css/process.scss
+3
View File
@@ -28,6 +28,9 @@
border-bottom: 3px solid #409eff;
margin-bottom: 20px;
}
.pagination{
margin-top: 10px;
}
// 表单的样式
.label-input-form{
src/components/OrgTable.vue
+9
View File
@@ -141,6 +141,7 @@
</el-table>
</div>
<el-pagination
class="pagination"
:current-page="page"
:page-sizes="[5, 10, 20]"
:pageSize="pageSize"
@@ -940,5 +941,13 @@ export default {
}
}
}
.dialog-footer{
::v-deep .el-button {
width: 80px;
height: 36px;
padding: 0;
font-size: 14px;
}
}
</style>
src/components/ProcessChooseTree.vue
+17 -6
View File
@@ -111,11 +111,13 @@
</el-table>
</div>
<pagination
:page="page"
class="pagination"
:current-page="page"
:page-sizes="[5, 10, 20]"
:pageSize="pageSize"
:total="total"
@pageChange="handlePageChange"
@pageSizeChange="handlePageSizeChange"
@current-change="handlePageChange"
@size-change="handlePageSizeChange"
></pagination>
<!-- 已选择的用户 -->
@@ -134,7 +136,7 @@
v-show="checkedIdList.length > 1">全部删除</el-button>
</div>
<div slot="footer" class="dialog-footer">
<div slot="footer" class="done">
<el-button
type="primary"
class="common-button-primary"
@@ -753,7 +755,16 @@ export default {
}
}
}
.dialog-footer{
margin: 20px;
.done {
margin: 30px 20px 10px;
text-align: right;
padding:20px 0 10px ;
::v-deep .el-button {
width: 80px;
height: 36px;
padding: 0;
font-size: 14px;
}
}
</style>
src/utils/Enum/enum.js
-1
View File
@@ -3,6 +3,5 @@ import Esenum from './index.js'
// 权限申请
export const PERMISSION = new Esenum([
{ label: '预览', value: 0 },
{ label: '下载', value: 1 },
{ label: '预览+下载', value: 2 }
])
src/views/permissionApplication/components/reportDialog.vue
+23 -139
View File
@@ -8,7 +8,7 @@
:before-close="handleClose">
<div class="tag-search">
<el-row>
<el-col :span="24">
<el-col :span="12">
<div class="tag-item">
<label class="tag-title">报告年份</label>
<el-select v-model="q.year" multiple collapse-tags placeholder="请选择报告年份">
@@ -18,72 +18,6 @@
</el-select>
</div>
</el-col>
<el-col :span="24">
<div class="tag-item">
<el-tooltip :content="tagData[1].name" placement="top">
<label class="tag-title">{{ tagData[1].name }}</label>
</el-tooltip>
<div class="tag-show" :class="{'active': tagData[1].tagShow}">
<el-checkbox :indeterminate="tagData[1].isIndeterminate" v-model="tagData[1].checkAll"
@change="(val) => handleCheckAllChange(val, 1)">全部
</el-checkbox>
<el-checkbox-group v-model="q.labelOneId"
@change="(val) => handleCheckedTagsChange(val, 1)">
<template v-for="item in tagData[1].tags">
<el-checkbox :label="item.id" :key="item.id">{{ item.name }}</el-checkbox>
</template>
</el-checkbox-group>
<i @click="switchTagShow(1)"
:class="{'el-icon-arrow-down': !tagData[1].tagShow, 'el-icon-arrow-up': tagData[1].tagShow}"></i>
</div>
</div>
</el-col>
<el-col :span="24">
<div class="tag-item">
<el-tooltip :content="tagData[2].name" placement="top">
<label class="tag-title">{{ tagData[2].name }}</label>
</el-tooltip>
<div class="tag-show" :class="{'active': tagData[2].tagShow}">
<el-checkbox :indeterminate="tagData[2].isIndeterminate" v-model="tagData[2].checkAll"
@change="(val) => handleCheckAllChange(val, 2)">全部
</el-checkbox>
<el-checkbox-group v-model="q.labelTwoId"
@change="(val) => handleCheckedTagsChange(val, 2)">
<template v-for="item in tagData[2].tags">
<el-checkbox :label="item.id" :key="item.id">{{ item.name }}</el-checkbox>
</template>
</el-checkbox-group>
<i @click="switchTagShow(2)"
:class="{'el-icon-arrow-down': !tagData[2].tagShow, 'el-icon-arrow-up': tagData[2].tagShow}"></i>
</div>
</div>
</el-col>
<el-col :span="24">
<div class="tag-item">
<el-tooltip :content="tagData[3].name" placement="top">
<label class="tag-title">{{ tagData[3].name }}</label>
</el-tooltip>
<div class="tag-show" :class="{'active': tagData[3].tagShow}">
<el-checkbox :indeterminate="tagData[3].isIndeterminate" v-model="tagData[3].checkAll"
@change="(val) => handleCheckAllChange(val, 3)">全部
</el-checkbox>
<el-checkbox-group v-model="q.labelThreeId"
@change="(val) => handleCheckedTagsChange(val, 3)">
<template v-for="item in tagData[3].tags">
<el-checkbox :label="item.id" :key="item.id">{{ item.name }}</el-checkbox>
</template>
</el-checkbox-group>
<i @click="switchTagShow(3)"
:class="{'el-icon-arrow-down': !tagData[3].tagShow, 'el-icon-arrow-up': tagData[3].tagShow}"></i>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="tag-item">
<label class="tag-title">搜索:</label>
<el-input v-model="q.keyContent" placeholder="请输入搜索内容"></el-input>
</div>
</el-col>
<el-col :span="12" align="right" class="tag-btns">
<el-button type="primary" @click="search">查询</el-button>
<el-button type="default" @click="reset">重置</el-button>
@@ -103,6 +37,7 @@
</vxe-table>
<el-pagination
class="pagination"
@size-change="handleLogSizeChange"
@current-change="handleLogCurrentChange"
:current-page="q.pageNo"
@@ -124,29 +59,6 @@ export default {
name: 'reportDialog',
data () {
return {
tagData: {
1: {
name: '',
tagShow: false,
tags: [],
isIndeterminate: true,
checkAll: false
},
2: {
name: '',
tagShow: false,
tags: [],
isIndeterminate: true,
checkAll: false
},
3: {
name: '',
tagShow: false,
tags: [],
isIndeterminate: true,
checkAll: false
}
},
processTable: [],
total: 0,
q: {
@@ -179,41 +91,6 @@ export default {
this.q.pageNo = 1
this.reportList()
},
// 切换展开隐藏
switchTagShow (type) {
this.tagData[type].tagShow = !this.tagData[type].tagShow
},
// 监听group checkbox
handleCheckedTagsChange (val, type) {
console.log(val,this.tagData[type].tags,"this.tagData[type].tags")
this.tagData[type].checkAll = (val.length === this.tagData[type].tags.length)
this.tagData[type].isIndeterminate = val.length < this.tagData[type].tags.length
},
// 监听全选按钮
handleCheckAllChange (val, type) {
switch (type) {
case 1:
this.q.labelOneId = val ? this.tagData[type].tags.map(item => item.id) : []
break
case 2:
this.q.labelTwoId = val ? this.tagData[type].tags.map(item => item.id) : []
break
case 3:
this.q.labelThreeId = val ? this.tagData[type].tags.map(item => item.id) : []
break
}
this.tagData[type].isIndeterminate = !val
},
// 标签列表
labelList () {
console.log(this.tagsForm," console.log(this.tagsForm,\"\")\n")
this.tagData[1].name = this.tagsForm.tags01.name
this.tagData[2].name = this.tagsForm.tags02.name
this.tagData[3].name = this.tagsForm.tags03.name
this.tagData[1].tags = this.tagsForm.tags01.childList
this.tagData[2].tags = this.tagsForm.tags02.childList
this.tagData[3].tags = this.tagsForm.tags03.childList
},
// 日期列表
reportDateList () {
this.$api.report.reportDateList().then(({ data }) => {
@@ -222,12 +99,29 @@ export default {
},
savaCheck () {
// 点击保存 需要把选中的数据传给父组件
const name = []
const ids = []
this.alreadyData.forEach(item => {
if (this.checkIds.indexOf(item.id) > -1) {
name.push(item.name)
ids.push(item.id)
}
})
this.checkList = this.checkList.filter(item => {
return ids.indexOf(item.id) === -1
})
if (name.length > 0) {
this.$alert(`报告${name.toString()}已经存在`, '提示', {
confirmButtonText: '确定'
})
}
// 找出已经存在的数据 用弹窗提示
this.$emit('confirm', this.checkList)
this.dialogVisible = false
},
show () {
this.ids = this.alreadyData.map(item => item.id)
this.labelList()
this.reportDateList()
// 调取接口获取数据
this.reportList()
@@ -245,23 +139,13 @@ export default {
}
this.total = 0
this.tableData = []
this.tagData[1].checkAll = false
this.tagData[1].isIndeterminate = true
this.tagData[2].checkAll = false
this.tagData[2].isIndeterminate = true
this.tagData[3].checkAll = false
this.tagData[3].isIndeterminate = true
this.reportList()
},
// 列表
reportList () {
this.$api.report.reportList(this.q).then(({ data }) => {
this.tableData = data.records.filter(item => {
if (this.ids.indexOf(item.id) === -1) {
return item
}
})
this.total = data.total - this.alreadyData.length
this.tableData = data.records
this.total = data.total
this.q.pageNo = data.current
this.q.pageSize = data.size
if (!data.records.length && this.q.pageNo !== 1) {
@@ -308,7 +192,7 @@ export default {
height: 550px;
}
.done {
margin-top: 10px;
margin: 30px 20px 10px;
text-align: right;
padding:20px 0 10px ;
src/views/permissionApplication/components/reportTable.vue
+8 -8
View File
@@ -7,15 +7,12 @@
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="name" title="车系"></vxe-column>
<!-- <vxe-column show-overflow show-header-overflow field="labelTwoName" :title="tagsForm.tags02.name"></vxe-column>-->
<!-- <vxe-column show-overflow show-header-overflow field="labelThreeName" :title="tagsForm.tags03.name"></vxe-column>-->
<vxe-column show-overflow show-header-overflow field="year" title="报告年份"></vxe-column>
<vxe-column show-overflow show-header-overflow field="createDate" title="报告部门"></vxe-column>
<vxe-column show-overflow show-header-overflow field="year" title="报告年份" width="200" ></vxe-column>
<vxe-column show-overflow show-header-overflow field="year" title="报告部门"></vxe-column>
<vxe-column show-overflow show-header-overflow field="createDate" title="涉密等级"></vxe-column>
<vxe-column show-overflow show-header-overflow field="createDate" title="隐私等级"></vxe-column>
<vxe-column show-overflow show-header-overflow field="labelOneName" :title="tagsForm.tags01.name"></vxe-column>
<vxe-column show-overflow show-header-overflow title="操作" width="200" fixed="right" v-if="!disabled">
<template #default="{ row }">
<el-button type="text" class="del-btn" @click="reportDelete(row.id)">删除</el-button>
@@ -24,6 +21,7 @@
</vxe-column>
</vxe-table>
<el-pagination
class="pagination"
@size-change="handleLogSizeChange"
@current-change="handleLogCurrentChange"
:current-page="qLog.pageNo"
@@ -97,8 +95,11 @@ export default {
},
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)
}
},
created () {
@@ -110,6 +111,7 @@ export default {
this.$emit('updateTable', [...this.value , ...list])
},
pageChage (current) {
this.total = this.value.length
setTimeout(() => {
current = current || this.qLog.pageNo
this.qLog.pageNo = current
@@ -120,7 +122,6 @@ export default {
return false
}
})
this.total = this.value.length
},
handleLogSizeChange (val) {
this.qLog.pageSize = val
@@ -128,9 +129,8 @@ export default {
this.pageChage(1)
},
handleLogCurrentChange (val) {
this.qLog.pageSize = val
this.qLog.pageNo = 1
this.pageChage(1)
this.pageChage(val)
},
// 标签列表
labelList () {