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:
yuekuo
2023-04-21 10:24:03 +08:00
parent 327f14fee1
commit e8c5cc2cc0
2 changed files with 134 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/Report/ReportList.vue
+3 -5
View File
@@ -208,12 +208,10 @@ export default {
q: {
keyContent: '',
year: [],
labelOneId: [],
labelTwoId: [],
labelThreeId: [],
name:'',
pageNo: 1,
pageSize: 10
},
pageSize: 10,
},
total: 0,
tableData: [],
yearList: [],
src/views/Report/ReportManager.vue
+131 -70
View File
@@ -5,64 +5,73 @@
</div>
<div class="search">
<el-row>
<el-col :span="20">
<div class="search-box-left">
<label>搜索:</label>
<el-input v-model="q.keyContent" placeholder="请输入搜索内容"></el-input>
<el-col :span="6">
<div class="tag-item">
<label class="tag-title">关键词:</label>
<el-input v-model="q.keyContent" placeholder="请输入报告名称"></el-input>
</div>
</el-col>
<el-col :span="6">
<div class="tag-item">
<label class="tag-title">报告年份：</label>
<el-select v-model="q.year" multiple collapse-tags placeholder="请选择报告年份">
<template v-for="item in yearList">
<el-option :label="item" :value="item" :key="item"></el-option>
</template>
</el-select>
<el-select v-model="q.labelOneId" multiple collapse-tags
:placeholder="'请选择' + tagsForm.tags01.name">
<template v-for="item in tagsForm.tags01.childList">
<el-option :label="item.name" :value="item.id" :key="item.id"></el-option>
</template>
</el-select>
<el-select v-model="q.labelTwoId" multiple collapse-tags
:placeholder="'请选择' + tagsForm.tags02.name">
<template v-for="item in tagsForm.tags02.childList">
<el-option :label="item.name" :value="item.id" :key="item.id"></el-option>
</template>
</el-select>
<el-select v-model="q.labelThreeId" multiple collapse-tags
:placeholder="'请选择' + tagsForm.tags03.name">
<template v-for="item in tagsForm.tags03.childList">
<el-option :label="item.name" :value="item.id" :key="item.id"></el-option>
</template>
</el-select>
</div>
</el-col>
<el-col :span="4" align="right">
<div class="search-box-right">
<el-button type="primary" @click="search">查询</el-button>
<el-button @click="reset">重置</el-button>
<el-col :span="6">
<div class="tag-item">
<label class="tag-title">报告名称:</label>
<el-input v-model="q.name" placeholder="请输入报告名称"></el-input>
</div>
</el-col>
<el-col :span="24">
<el-col :span="6" align="right" class="tag-btns">
<el-button type="primary" @click="search">查询</el-button>
<el-button type="default" @click="reset">重置</el-button>
</el-col>
</el-row>
<el-row >
<div class="operate-box">
<el-button @click="openLog">操作日志</el-button>
<el-button @click="openTags">标签维护</el-button>
<el-button @click="openReportAdd">报告上传</el-button>
</div>
</el-col>
</el-row>
</div>
<div class="table">
<el-row>
<el-col :span="3" class="treeList">
<el-input placeholder="输入关键字进行过滤" v-model="filterText">
</el-input>
<el-tree
class="filter-tree"
:data="treeData"
show-checkbox
node-key="id"
default-expand-all
:filter-node-method="filterNode"
ref="tree"
@check="getHalfCheckedNode"
>
</el-tree>
</el-col>
<el-col :span="20">
<div class="table">
<vxe-table ref="xTable" :data="tableData" :empty-render="{name: 'NotData'}" align="center" border stripe v-table-min-height="'calc(100vh - 320px)'">
<vxe-column show-overflow show-header-overflow type="seq" title="序号" width="77">
<template #default="{ row, rowIndex }">
{{ rowIndex + (q.pageNo - 1) * q.pageSize + 1 }}
</template>
</vxe-column>
<vxe-column show-overflow show-header-overflow field="labelOneName"
:title="tagsForm.tags01.name"></vxe-column>
<!-- <vxe-column show-overflow show-header-overflow field="labelOneName"
:title="tagsForm.tags01.name"></vxe-column> -->
<vxe-column show-overflow show-header-overflow field="name" title="报告名称"></vxe-column>
<vxe-column show-overflow show-header-overflow field="labelTwoName"
<!-- <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>
: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 title="操作" width="200" fixed="right">
@@ -78,6 +87,9 @@
:page-sizes="[5, 10, 20]" :page-size="q.pageSize" layout="total, sizes, prev, pager, next, jumper"
:total="total" />
</div>
</el-col>
</el-row>
<!--操作日志-->
<el-dialog title="操作日志" :visible.sync="dialogLog" width="1100px" :close-on-click-modal="false"
:close-on-press-escape="false" modal-append-to-body append-to-body>
@@ -294,6 +306,8 @@ export default {
filterText: '',
treeData: [
],
filterText:'',
checkedKeys:[],
privacyLevelOptions:[
{
value:'外部公开',
@@ -392,9 +406,7 @@ export default {
q: {
keyContent: '',
year: [],
labelOneId: [],
labelTwoId: [],
labelThreeId: [],
name:'',
pageNo: 1,
pageSize: 10,
},
@@ -423,6 +435,10 @@ export default {
this.reportDateList();
this.sysUserList();
},
getHalfCheckedNode(node,data){
this.checkedKeys=data.checkedKeys
this.reportList()
},
updateList(){
this.$api.report.labelList().then(res => {
this.treeData=res.data
@@ -822,9 +838,7 @@ export default {
this.q = {
keyContent: '',
year: [],
labelOneId: [],
labelTwoId: [],
labelThreeId: [],
name:'',
pageNo: 1,
pageSize: 10,
};
@@ -853,7 +867,7 @@ export default {
},
// 列表
reportList() {
this.$api.report.reportList(this.q).then(({ data }) => {
this.$api.report.reportList({...this.q,labelId:this.checkedKeys}).then(({ data }) => {
this.tableData = data.records;
this.total = data.total;
this.q.pageNo = data.current;
@@ -903,6 +917,10 @@ export default {
})
// })
},
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
},
created() {
this.init();
@@ -911,6 +929,16 @@ export default {
</script>
<style lang="scss" scoped>
.treeList{
padding: 20px;
margin-left: 13px;
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
margin-right: 20px;
.filter-tree{
margin-top: 20px;
}
}
.check-all {
text-align: right;
width: 95%;
@@ -931,19 +959,16 @@ export default {
}
.search {
.search-box-left {
padding-top: 20px;
display: flex;
justify-content: flex-start;
align-items: center;
padding-top: 9px;
label {
font-size: 14px;
font-weight: 400;
color: #595959;
margin-right: 5px;
padding-left: 22px;
}
::v-deep .el-date-picker,
::v-deep .el-input {
width: 240px;
}
.tag-item {
margin-bottom: 15px;
display: flex;
.year {
::v-deep .el-input__inner {
@@ -951,31 +976,67 @@ export default {
}
}
::v-deep .el-input {
width: 167px;
margin-right: 5px;
label.tag-title {
font-size: 14px;
font-weight: normal;
color: #646464;
display: inline-block;
// width: 112px;
height: 19px;
line-height: 19px;
padding-left: 13px;
// border-right: 1px solid #BFBFBF;
margin-right: 10px;
margin-top: 2.5px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
@media screen and (max-width: 1366px) {
::v-deep .el-input {
width: 135px;
margin-right: 5px;
.tag-show {
flex: 1;
margin-right: 28px;
height: 19px;
overflow: hidden;
position: relative;
&.active {
height: auto;
}
::v-deep .check-active{
.el-checkbox__label{
color: #434343;
}
}
::v-deep .el-checkbox {
margin-right: 15px;
color: #434343;
}
::v-deep .el-checkbox__label {
min-width: 80px;
}
::v-deep .el-checkbox-group {
display: inline;
}
.el-icon-arrow-down,
.el-icon-arrow-up {
color: #C0C4CC;
cursor: pointer;
position: absolute;
right: 0;
top: 2px;
}
}
::v-deep .el-button {
float: right;
}
}
.search-box-right {
padding-top: 20px;
display: flex;
justify-content: flex-end;
align-items: center;
padding-right: 14px;
.tag-btns {
padding-right: 15px;
}
.operate-box {
padding-left: 13px;
padding-bottom: 11px;