Skip to content

Commit 6db2367

Browse files
HccakeHccake
committed
✨ 用户文档菜单（用于数据权限示例）
1 parent 9dc3659 commit 6db2367

File tree

3 files changed

+245
-0
lines changed

3 files changed

+245
-0
lines changed

‎src/api/sample/document.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import request from '@/utils/request'
2+
3+
export function getPage(query) {
4+
return request({
5+
url: '/sample/document/page',
6+
method: 'get',
7+
params: query
8+
})
9+
}
10+
11+
export function addObj(obj) {
12+
return request({
13+
url: '/sample/document',
14+
method: 'post',
15+
data: obj
16+
})
17+
}
18+
19+
export function delObj(id) {
20+
return request({
21+
url: '/sample/document/' + id,
22+
method: 'delete'
23+
})
24+
}
25+
26+
export function putObj(obj) {
27+
return request({
28+
url: '/sample/document',
29+
method: 'put',
30+
data: obj
31+
})
32+
}

‎src/views/sample/document/DocumentModalForm.vue

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
<template>
2+
<a-modal
3+
:title="title"
4+
:visible="visible"
5+
:mask-closable="false"
6+
:body-style="{paddingBottom: '8px'}"
7+
:confirm-loading="submitLoading"
8+
@ok="handleSubmit"
9+
@cancel="handleClose"
10+
>
11+
<a-form
12+
:form="form"
13+
:label-col="labelCol"
14+
:wrapper-col="wrapperCol"
15+
>
16+
<a-form-item v-if="isUpdateForm" style="display: none">
17+
<a-input v-decorator="['id']" />
18+
</a-form-item>
19+
<a-form-item label="文档名称">
20+
<a-input v-decorator="['name', { rules: [{ required: true, message: '请输入文档名称!' }] }]" placeholder="文档名称" />
21+
</a-form-item>
22+
<a-form-item label="所属用户">
23+
<lov-local
24+
v-decorator="['userId', { rules: [{ required: true, message: '请选择所属用户!' }] }]"
25+
placeholder="所属用户"
26+
v-bind="sysUserLov"
27+
:multiple="false"
28+
/>
29+
</a-form-item>
30+
</a-form>
31+
</a-modal>
32+
</template>
33+
34+
<script>
35+
import { PopUpFormMixin } from '@/mixins'
36+
import { addObj, putObj } from '@/api/sample/document'
37+
import { sysUserLov } from '@/components/Lov/lovOptions'
38+
39+
export default {
40+
name: 'DocumentModalForm',
41+
mixins: [PopUpFormMixin],
42+
data () {
43+
return {
44+
reqFunctions: {
45+
create: addObj,
46+
update: putObj
47+
},
48+
49+
labelCol: {
50+
sm: { span: 24 },
51+
md: { span: 5 }
52+
},
53+
wrapperCol: {
54+
sm: { span: 24 },
55+
md: { span: 19 }
56+
},
57+
58+
// 校验配置
59+
decoratorOptions: {},
60+
61+
// 系统用户Lov
62+
sysUserLov
63+
}
64+
},
65+
methods: {}
66+
}
67+
</script>

‎src/views/sample/document/DocumentPage.vue

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
<template>
2+
<div class="ant-pro-page-container-children-content">
3+
<!-- 查询条件 -->
4+
<div class="ant-pro-table-search">
5+
<a-form v-bind="searchFormLayout">
6+
<a-row :gutter="16">
7+
<a-col :md="8" :sm="24">
8+
<a-form-item label="ID">
9+
<a-input v-model="queryParam.id" placeholder="" />
10+
</a-form-item>
11+
</a-col>
12+
13+
<!-- <template v-if="advanced">
14+
</template>-->
15+
<a-col :md="8" :sm="24" class="table-page-search-wrapper">
16+
<div class="table-page-search-submitButtons">
17+
<a-button type="primary" @click="reloadTable">查询</a-button>
18+
<a-button style="margin-left: 8px" @click="resetSearchForm">重置</a-button>
19+
<!--<a @click="toggleAdvanced" style="margin-left: 8px">
20+
{{ advanced ? '收起' : '展开' }}
21+
<a-icon :type="advanced ? 'up' : 'down'"/>
22+
</a>-->
23+
</div>
24+
</a-col>
25+
</a-row>
26+
</a-form>
27+
</div>
28+
29+
<a-card :bordered="false" :body-style="{paddingTop: 0, paddingBottom: 0}">
30+
<!-- 操作按钮区域 -->
31+
<div class="ant-pro-table-toolbar">
32+
<div class="ant-pro-table-toolbar-title">文档表，用于演示数据权限，可切换不同用户并授予不同角色体验效果（需退出重新登录）</div>
33+
<div class="ant-pro-table-toolbar-option">
34+
<a-button
35+
v-has="'sample:document:add'"
36+
type="primary"
37+
icon="plus"
38+
@click="handleAdd()"
39+
>新建
40+
</a-button>
41+
</div>
42+
</div>
43+
44+
<!--数据表格区域-->
45+
<div class="ant-pro-table-wrapper">
46+
<a-table
47+
ref="table"
48+
size="middle"
49+
:row-key="rowKey"
50+
:columns="columns"
51+
:data-source="dataSource"
52+
:pagination="pagination"
53+
:loading="loading"
54+
@change="handleTableChange"
55+
>
56+
<template #action-slot="text, record">
57+
<a-popconfirm
58+
v-has="'sample:document:del'"
59+
title="确认要删除吗？"
60+
@confirm="() => handleDel(record)"
61+
>
62+
<a href="javascript:" class="ballcat-text-danger">删除</a>
63+
</a-popconfirm>
64+
</template>
65+
</a-table>
66+
</div>
67+
</a-card>
68+
69+
<!--表单弹窗-->
70+
<document-modal-form ref="formModal" @reload-page-table="reloadTable" />
71+
</div>
72+
</template>
73+
74+
<script>
75+
import { getPage, delObj } from '@/api/sample/document'
76+
import { TablePageMixin } from '@/mixins'
77+
import DocumentModalForm from '@/views/sample/document/DocumentModalForm'
78+
79+
export default {
80+
name: 'DocumentPage',
81+
components: { DocumentModalForm },
82+
mixins: [TablePageMixin],
83+
data () {
84+
return {
85+
getPage: getPage,
86+
delObj: delObj,
87+
88+
columns: [
89+
{
90+
title: '#',
91+
dataIndex: 'id'
92+
},
93+
{
94+
title: '文档名称',
95+
dataIndex: 'name'
96+
},
97+
{
98+
title: '所属用户ID',
99+
dataIndex: 'userId'
100+
},
101+
{
102+
title: '所属用户',
103+
dataIndex: 'username'
104+
},
105+
{
106+
title: '所属组织ID',
107+
dataIndex: 'organizationId'
108+
},
109+
{
110+
title: '所属组织',
111+
dataIndex: 'organizationName'
112+
},
113+
{
114+
title: '创建时间',
115+
dataIndex: 'createTime',
116+
width: '150px',
117+
sorter: true
118+
},
119+
{
120+
title: '操作',
121+
align: 'center',
122+
width: '150px',
123+
scopedSlots: { customRender: 'action-slot' }
124+
}
125+
]
126+
}
127+
},
128+
methods: {
129+
/**
130+
* 新建文档表，用于演示数据权限
131+
*/
132+
handleAdd () {
133+
const attributes = { title: '新建用户文档' }
134+
this.$refs.formModal.add(attributes)
135+
},
136+
/**
137+
* 编辑文档表，用于演示数据权限
138+
* @param record 当前文档表，用于演示数据权限属性
139+
*/
140+
handleEdit (record) {
141+
const attributes = { title: '编辑用户文档' }
142+
this.$refs.formModal.update(record, attributes)
143+
}
144+
}
145+
}
146+
</script>

0 commit comments

Comments
 (0)