提交 be545bf7 authored 作者: lidongxu's avatar lidongxu

feat(report): 新增_管理员分配报表权限给个人功能_个人查看被分配报表列表和预览功能

上级 0bb1469d
import request from '@/utils/request'
// 获取被分配的报表列表
export function getReportListAPI(params) {
return request({
url: '/report/jimuReport/query/list',
params
})
}
...@@ -31,6 +31,7 @@ export * from './system/menu' ...@@ -31,6 +31,7 @@ export * from './system/menu'
export * from './system/notice' export * from './system/notice'
export * from './system/operlog' export * from './system/operlog'
export * from './system/post' export * from './system/post'
export * from './system/report'
export * from './system/role' export * from './system/role'
export * from './system/user' export * from './system/user'
export * from './tool/gen' export * from './tool/gen'
...@@ -28,4 +28,5 @@ export function getReportFolderListAPI() { ...@@ -28,4 +28,5 @@ export function getReportFolderListAPI() {
}, },
method: 'GET' method: 'GET'
}) })
} }
\ No newline at end of file
import request from '@/utils/request'
// 管理员查询所有报表接口
export const selReportListAPI = (params) => {
return request({
url: `/report/jimuReport/query/all/list`,
params
})
}
// 授权单个报表给单个/多个用户
export const batchAuthReportAPI = (data) => {
return request({
url: `/report/jimuReportAuth/core/authUsers`,
method: "PUT",
data
})
}
// 报表分类下拉列表接口
export const selReportCategoryAPI = () => {
return request({
url: `/report/jimuReportCategory/query/list`
})
}
// 查询-报表已分配用户列表
export const selReportAuthUserListAPI = (params) => {
return request({
url: `/report/jimuReportAuth/query/list/user`,
params
})
}
// cover some element-ui styles // cover some element-ui styles
body .el-loading-mask{
z-index: 10000 !important;
}
.el-breadcrumb__inner, .el-breadcrumb__inner,
.el-breadcrumb__inner a { .el-breadcrumb__inner a {
font-weight: 400 !important; font-weight: 400 !important;
...@@ -142,11 +138,7 @@ body .el-loading-mask{ ...@@ -142,11 +138,7 @@ body .el-loading-mask{
flex: 1; flex: 1;
} }
/* 全局覆盖Element Plus加载遮罩的背景色 */
.el-loading-mask {
z-index: 2 !important;
// background-color: red !important;
}
.el-pagination { .el-pagination {
font-size: var(--xl-fontsize) !important; font-size: var(--xl-fontsize) !important;
......
<template>
<div class="app-container">
<el-card class="container">
<template #header>
<div class="card-header">
<span>常用报表</span>
<el-button class="custom"
type="primary"
link
@click="visible = true">
自定义
</el-button>
</div>
</template>
<div v-for="item in groups"
class="group_item">
<div>
<p class="group_name">
<el-icon color="blue"
size="18">
<Folder />
</el-icon>
<span>
{{ item.groupName }}
</span>
</p>
<div class="link_wrap">
<div class="link_item"
v-for="obj in item.items">
<el-icon color="green"
size="16">
<Document></Document>
</el-icon>
<el-link :href="baseURL + obj.previewUrl"
target="_blank">{{ obj.reportName }}</el-link>
</div>
</div>
</div>
</div>
</el-card>
<el-dialog title="编辑常用报表"
v-model="visible"
draggable overflow>
<div class="wrap">
<div class="left">
<draggable v-model="reportList"
group="reports"
ghost-class="dragging-item-left"
item-key="id">
<template #item="{ element }">
<div class="link_item">
<el-icon color="green"
size="16">
<Document></Document>
</el-icon>
<el-link :href="baseURL + element.previewUrl"
target="_blank">{{ element.reportName }}</el-link>
</div>
</template>
</draggable>
</div>
<div class="right">
<div class="group-container">
<el-card v-for="group in groups"
:key="group.id"
class="group_card"
:style="{ width: '100%' }">
<template #header>
<div class="card-header">
<span>{{ group.groupName }}</span>
</div>
</template>
<draggable v-model="group.items"
group="reports"
ghost-class="dragging-item"
item-key="id"
@change="groupChange">
<template #item="{ element }">
<div class="link_item">
<el-icon color="green"
size="16">
<Document></Document>
</el-icon>
<el-link :href="baseURL + element.previewUrl"
target="_blank">{{ element.reportName }}</el-link>
</div>
</template>
</draggable>
</el-card>
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script setup>
import { getReportListAPI, getReportListBySelfAPI, getReportListByGroupAPI, addReportGroupAPI } from '@/api'
import draggable from 'vuedraggable'
const visible = ref(false)
const groups = ref([])
const baseURL = ref(import.meta.env.VITE_APP_REPORT_URL + '/report')
const reportList = ref([])
const getReportList = async () => {
// 积木报表
const { data } = await getReportListAPI({
categoryName: '财务报表'
})
// 其他报表
const { data: otherData } = await getReportListBySelfAPI()
reportList.value = data.concat(otherData)
// 右侧分组列表
const res = await getReportListByGroupAPI({
categoryName: '财务报表'
})
groups.value = res.data
// 左侧报表里要删除右侧里面有的了,用 reportId 来判断
reportList.value = reportList.value.filter(item => {
return !groups.value.some(group => group.items.some(groupItem => groupItem.reportId === item.reportId))
})
}
// 拖入拖出+顺序改变
const groupChange = async (e) => {
groups.value.forEach(o => {
o.id = o.groupId
})
await addReportGroupAPI(groups.value)
}
getReportList()
</script>
<style scoped
lang="scss">
.el-card__header {
.custom {
float: right;
padding: 3px 0;
}
}
.group_item {
.group_name {
display: flex;
align-items: center;
gap: 10px;
font-size: 16px;
font-weight: 800;
}
.link_wrap {
display: flex;
flex-wrap: wrap;
padding: 0 0 0 20px;
.link_item {
padding: 10px 0;
width: 25%;
/* 超出宽度文字省略号 */
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
.link_item {
padding: 5px 0;
display: flex;
align-items: center;
gap: 10px;
}
.group_card {
margin-top: 20px;
}
.wrap {
display: flex;
gap: 20px;
width: 100%;
height: 100%;
.left {
width: 100%;
height: 100%;
overflow-y: scroll;
overflow-x: hidden;
}
.right {
width: 100%;
height: 100%;
overflow-y: scroll;
overflow-x: hidden;
}
}
/* 添加拖拽时的样式 */
.dragging-item-left {
background-color: transparent;
}
.dragging-item {
background-color: #a1ccf2;
}
</style>
\ No newline at end of file
<template>
<div class="app-container">
<div class="container">
<el-form :model="queryParams"
ref="queryRef"
inline
label-width="68px"
v-show="showSearch">
<el-form-item label="报表名称"
prop="name">
<el-input v-model="queryParams.name"
placeholder="搜索报表名称"
clearable
style="width: 240px"
@input="getReportList" />
</el-form-item>
<el-form-item label="报表类目"
prop="categoryName">
<el-select v-model="queryParams.categoryName"
placeholder="选择报表类目"
clearable
filterable
@change="getReportList"
style="width: 240px">
<el-option v-for="item in categoryList"
:label="item.name"
:value="item.name" />
</el-select>
</el-form-item>
<el-form-item>
<el-button icon="Refresh"
@click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 表格数据 -->
<el-table v-loading="loading"
:data="reportList">
<el-table-column label="报表名称"
key="reportName"
prop="reportName"
align="left"
sortable>
<template #default="scope">
<div style="display: flex; align-items: center">
<el-icon>
<List color="green" />
</el-icon>
<span style="margin-left: 10px">{{ scope.row.reportName }}</span>
</div>
</template>
</el-table-column>
<el-table-column label="创建人"
key="createBy"
prop="createBy"
align="left"
width="180"
sortable />
<el-table-column label="创建时间"
prop="createTime"
align="left"
width="180"
sortable>
<template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<!-- 操作预览 -->
<el-table-column label="操作"
key="operation"
align="center"
width="180">
<template #default="scope">
<el-button link
type="primary"
icon="Reading"
@click="previewReport(scope.row)">预览</el-button>
</template>
</el-table-column>
</el-table>
<!-- <pagination v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getReportList" /> -->
</div>
</div>
</template>
<script setup
name="Role">
import { getReportListAPI, selReportCategoryAPI } from "@/api"
import { getToken } from '@/utils/auth'
import useUserStore from '@/store/modules/user'
const userStore = useUserStore()
const reportBaseURL = import.meta.env.VITE_APP_REPORT_URL
const { proxy } = getCurrentInstance()
/*************** 报表列表部分 ****************/
// 报表搜索
const showSearch = ref(true)
const queryParams = reactive({
name: undefined, // 报表名称
categoryName: undefined, // 报表类目
pageNum: 1,
pageSize: 10
})
// 获取设置报表类目下拉菜单
const categoryList = ref([])
const getCategoryList = () => {
selReportCategoryAPI().then(res => {
categoryList.value = res.data;
})
}
getCategoryList()
// 重置
function resetQuery() {
proxy.resetForm("queryRef")
getReportList()
}
// 获取报表列表
const loading = ref(true)
const reportList = ref([])
// 查询报表列表
function getReportList() {
loading.value = true
getReportListAPI(queryParams).then(response => {
reportList.value = response.data
loading.value = false
})
}
getReportList()
// 点击某行报表
function previewReport(row) {
window.open(`${reportBaseURL}/report/jmreport/view/${row.id}?token=${getToken()}&tenantId=${userStore.$state.userInfo.deptId}`)
}
</script>
<style scoped
lang="scss">
</style>
\ No newline at end of file
...@@ -9,9 +9,8 @@ import iFrame from '@/components/iFrame/index' ...@@ -9,9 +9,8 @@ import iFrame from '@/components/iFrame/index'
// 获取 pinia 里保存的用户部门 id // 获取 pinia 里保存的用户部门 id
import useUserStore from '@/store/modules/user' import useUserStore from '@/store/modules/user'
// 这里写暴露的统一的网关地址 const userStore = useUserStore()
const store = useUserStore() const openUrl = ref(`${import.meta.env.VITE_APP_REPORT_URL}/report/jmreport/list?token=` + getToken() + `&tenantId=${userStore.$state.userInfo.deptId}`)
const openUrl = ref(`${import.meta.env.VITE_APP_REPORT_URL}/report/jmreport/list?token=` + getToken() + `&tenantId=${store.$state.userInfo.deptId}`)
</script> </script>
<style lang="scss" <style lang="scss"
......
...@@ -39,7 +39,7 @@ export default defineConfig(({ mode, command }) => { ...@@ -39,7 +39,7 @@ export default defineConfig(({ mode, command }) => {
rewrite: (p) => p.replace(/^\/ql_local/, '') rewrite: (p) => p.replace(/^\/ql_local/, '')
}, },
'/bc_local': { '/bc_local': {
target: 'http://192.168.101.103:8180', target: 'http://192.168.100.103:8180',
changeOrigin: true, changeOrigin: true,
rewrite: (p) => p.replace(/^\/bc_local/, '') rewrite: (p) => p.replace(/^\/bc_local/, '')
} }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论