yvan/Study
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

vue3版本初版上线 自测已可用

Browse Source
This commit is contained in:
piexlmax
2021-08-26 12:45:41 +08:00
parent adc7f567f9
commit 265e42f513
81 changed files with 4478 additions and 18639 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/view/superAdmin/api/api.vue
+23 -23
View File
@@ -24,13 +24,15 @@
<el-form-item>
<el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
<el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
<el-popover v-model="deleteVisible" placement="top" width="160">
<el-popover v-model:visible="deleteVisible" placement="top" width="160">
<p>确定要删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
</div>
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
<template #reference>
<el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
</template>
</el-popover>
</el-form-item>
</el-form>
@@ -45,22 +47,21 @@
<el-table-column label="api分组" min-width="150" prop="apiGroup" sortable="custom" />
<el-table-column label="api简介" min-width="150" prop="description" sortable="custom" />
<el-table-column label="请求" min-width="150" prop="method" sortable="custom">
<template slot-scope="scope">
<template #default="scope">
<div>
{{ scope.row.method }}
<el-tag
:key="scope.row.methodFiletr"
:type="scope.row.method|tagTypeFiletr"
:type="tagTypeFiletr(scope.row.method)"
effect="dark"
size="mini"
>{{ scope.row.method|methodFiletr }}</el-tag>
<!-- {{scope.row.method|methodFiletr}} -->
>{{ methodFiletr(scope.row.method) }}</el-tag>
</div>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200">
<template slot-scope="scope">
<template #default="scope">
<el-button size="small" type="primary" icon="el-icon-edit" @click="editApi(scope.row)">编辑</el-button>
<el-button
size="small"
@@ -82,7 +83,7 @@
@size-change="handleSizeChange"
/>
<el-dialog :before-close="closeDialog" :title="dialogTitle" :visible.sync="dialogFormVisible">
<el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle">
<el-form ref="apiForm" :inline="true" :model="form" :rules="rules" label-width="80px">
<el-form-item label="路径" prop="path">
<el-input v-model="form.path" autocomplete="off" />
@@ -105,10 +106,12 @@
</el-form-item>
</el-form>
<div class="warning">新增Api需要在角色管理内配置权限才可使用</div>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -151,17 +154,6 @@ const methodOptions = [
export default {
name: 'Api',
filters: {
methodFiletr(value) {
const target = methodOptions.filter(item => item.value === value)[0]
// return target && `${target.label}(${target.value})`
return target && `${target.label}`
},
tagTypeFiletr(value) {
const target = methodOptions.filter(item => item.value === value)[0]
return target && `${target.type}`
}
},
mixins: [infoList],
data() {
return {
@@ -196,6 +188,14 @@ export default {
this.getTableData()
},
methods: {
methodFiletr(value) {
const target = methodOptions.filter(item => item.value === value)[0]
return target && `${target.label}`
},
tagTypeFiletr(value) {
const target = methodOptions.filter(item => item.value === value)[0]
return target && `${target.type}`
},
// 选中api
handleSelectionChange(val) {
this.apis = val
web/src/view/superAdmin/authority/authority.vue
+15 -10
View File
@@ -14,7 +14,7 @@
<el-table-column label="角色id" min-width="180" prop="authorityId" />
<el-table-column label="角色名称" min-width="180" prop="authorityName" />
<el-table-column fixed="right" label="操作" width="460">
<template slot-scope="scope">
<template #default="scope">
<el-button size="mini" type="primary" @click="opdendrawer(scope.row)">设置权限</el-button>
<el-button
icon="el-icon-plus"
@@ -45,7 +45,7 @@
</el-table>
<span style="color: red;font-size: 12px">注：右上角头像下拉可切换角色</span>
<!-- 新增角色弹窗 -->
<el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible">
<el-dialog v-model="dialogFormVisible" :title="dialogTitle">
<el-form ref="authorityForm" :model="form" :rules="rules">
<el-form-item label="父级角色" prop="parentId">
<el-cascader
@@ -64,22 +64,24 @@
<el-input v-model="form.authorityName" autocomplete="off" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</template>
</el-dialog>
<el-drawer v-if="drawer" :visible.sync="drawer" :with-header="false" size="40%" title="角色配置">
<el-drawer v-if="drawer" v-model="drawer" :with-header="false" size="40%" title="角色配置">
<el-tabs :before-leave="autoEnter" class="role-box" type="border-card">
<el-tab-pane label="角色菜单">
<Menus ref="menus" :row="activeRow" />
<Menus ref="menus" :row="activeRow" @changeRow="changeRow" />
</el-tab-pane>
<el-tab-pane label="角色api">
<apis ref="apis" :row="activeRow" />
<Apis ref="apis" :row="activeRow" @changeRow="changeRow" />
</el-tab-pane>
<el-tab-pane label="资源权限">
<Datas ref="datas" :authority="tableData" :row="activeRow" />
<Datas ref="datas" :authority="tableData" :row="activeRow" @changeRow="changeRow" />
</el-tab-pane>
</el-tabs>
</el-drawer>
@@ -158,6 +160,9 @@ export default {
await this.getTableData()
},
methods: {
changeRow(key, value) {
this.activeRow[key] = value
},
autoEnter(activeName, oldActiveName) {
const paneArr = ['menus', 'apis', 'datas']
if (oldActiveName) {
web/src/view/superAdmin/authority/components/datas.vue
+5 -5
View File
@@ -25,7 +25,7 @@ export default {
},
authority: {
default: function() {
return {}
return []
},
type: Array
}
@@ -53,19 +53,19 @@ export default {
},
all() {
this.dataAuthorityId = [...this.authoritys]
this.row.dataAuthorityId = this.dataAuthorityId
this.$emit('changeRow', 'dataAuthorityId', this.dataAuthorityId)
this.needConfirm = true
},
self() {
this.dataAuthorityId = this.authoritys.filter(item => item.authorityId === this.row.authorityId)
this.row.dataAuthorityId = this.dataAuthorityId
this.$emit('changeRow', 'dataAuthorityId', this.dataAuthorityId)
this.needConfirm = true
},
selfAndChildren() {
const arrBox = []
this.getChildrenId(this.row, arrBox)
this.dataAuthorityId = this.authoritys.filter(item => arrBox.indexOf(item.authorityId) > -1)
this.row.dataAuthorityId = this.dataAuthorityId
this.$emit('changeRow', 'dataAuthorityId', this.dataAuthorityId)
this.needConfirm = true
},
getChildrenId(row, arrBox) {
@@ -95,7 +95,7 @@ export default {
},
// 选择
selectAuthority() {
this.row.dataAuthorityId = this.dataAuthorityId
this.$emit('changeRow', 'dataAuthorityId', this.dataAuthorityId)
this.needConfirm = true
}
}
web/src/view/superAdmin/authority/components/menus.vue
+16 -14
View File
@@ -14,20 +14,22 @@
show-checkbox
@check="nodeChange"
>
<span slot-scope="{ node , data }" class="custom-tree-node">
<span>{{ node.label }}</span>
<span>
<el-button
type="text"
size="mini"
:style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
:disabled="!node.checked"
@click="() => setDefault(data)"
>
{{ row.defaultRouter === data.name?"首页":"设为首页" }}
</el-button>
<template #default="{ node , data }">
<span class="custom-tree-node">
<span>{{ node.label }}</span>
<span>
<el-button
type="text"
size="mini"
:style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
:disabled="!node.checked"
@click="() => setDefault(data)"
>
{{ row.defaultRouter === data.name?"首页":"设为首页" }}
</el-button>
</span>
</span>
</span>
</template>
</el-tree>
</div>
</template>
@@ -81,7 +83,7 @@ export default {
const res = await updateAuthority({ authorityId: this.row.authorityId, AuthorityName: this.row.authorityName, parentId: this.row.parentId, defaultRouter: data.name })
if (res.code === 0) {
this.$message({ type: 'success', message: '设置成功' })
this.row.defaultRouter = res.data.authority.defaultRouter
this.$emit('changeRow', 'defaultRouter', res.data.authority.defaultRouter)
}
},
nodeChange() {
web/src/view/superAdmin/dictionary/sysDictionary.vue
+14 -28
View File
@@ -33,7 +33,7 @@
>
<el-table-column type="selection" width="55" />
<el-table-column label="日期" width="180">
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
<template #default="scope">{{ formatDate(scope.row.CreatedAt) }}</template>
</el-table-column>
<el-table-column label="字典名（中）" prop="name" width="120" />
@@ -41,22 +41,24 @@
<el-table-column label="字典名（英）" prop="type" width="120" />
<el-table-column label="状态" prop="status" width="120">
<template slot-scope="scope">{{ scope.row.status|formatBoolean }}</template>
<template #default="scope">{{ formatBoolean(scope.row.status) }}</template>
</el-table-column>
<el-table-column label="描述" prop="desc" width="280" />
<el-table-column label="按钮组">
<template slot-scope="scope">
<template #default="scope">
<el-button size="mini" type="success" @click="toDetile(scope.row)">详情</el-button>
<el-button size="mini" type="primary" @click="updateSysDictionary(scope.row)">变更</el-button>
<el-popover v-model="scope.row.visible" placement="top" width="160">
<el-popover v-model:visible="scope.row.visible" placement="top" width="160">
<p>确定要删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteSysDictionary(scope.row)">确定</el-button>
</div>
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" style="margin-left:10px">删除</el-button>
<template #reference>
<el-button type="danger" icon="el-icon-delete" size="mini" style="margin-left:10px">删除</el-button>
</template>
</el-popover>
</template>
</el-table-column>
@@ -73,7 +75,7 @@
@size-change="handleSizeChange"
/>
<el-dialog :before-close="closeDialog" :visible.sync="dialogFormVisible" title="弹窗操作">
<el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
<el-form-item label="字典名（中）" prop="name">
<el-input
@@ -98,11 +100,13 @@
<el-input v-model="formData.desc" placeholder="请输入描述" clearable :style="{width: '100%'}" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</template>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</el-dialog>
<div style="margin-top:40px;color:red">获取字典且缓存方法已在前端utils/dictionary 已经封装完成 不必自己书写 使用方法查看文件内注释</div>
@@ -117,27 +121,9 @@ import {
findSysDictionary,
getSysDictionaryList
} from '@/api/sysDictionary' // 此处请自行替换地址
import { formatTimeToStr } from '@/utils/date'
import infoList from '@/mixins/infoList'
export default {
name: 'SysDictionary',
filters: {
formatDate: function(time) {
if (time !== null && time !== '') {
var date = new Date(time)
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
} else {
return ''
}
},
formatBoolean: function(bool) {
if (bool !== null) {
return bool ? '是' : '否'
} else {
return ''
}
}
},
mixins: [infoList],
data() {
return {
web/src/view/superAdmin/dictionary/sysDictionaryDetail.vue
+14 -28
View File
@@ -32,7 +32,7 @@
>
<el-table-column type="selection" width="55" />
<el-table-column label="日期" width="180">
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
<template #default="scope">{{ formatDate(scope.row.CreatedAt) }}</template>
</el-table-column>
<el-table-column label="展示值" prop="label" width="120" />
@@ -40,21 +40,23 @@
<el-table-column label="字典值" prop="value" width="120" />
<el-table-column label="启用状态" prop="status" width="120">
<template slot-scope="scope">{{ scope.row.status|formatBoolean }}</template>
<template #default="scope">{{ formatBoolean(scope.row.status) }}</template>
</el-table-column>
<el-table-column label="排序标记" prop="sort" width="120" />
<el-table-column label="按钮组">
<template slot-scope="scope">
<template #default="scope">
<el-button size="small" type="primary" @click="updateSysDictionaryDetail(scope.row)">变更</el-button>
<el-popover v-model="scope.row.visible" placement="top" width="160">
<el-popover v-model:visible="scope.row.visible" placement="top" width="160">
<p>确定要删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteSysDictionaryDetail(scope.row)">确定</el-button>
</div>
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini">删除</el-button>
<template #reference>
<el-button type="danger" icon="el-icon-delete" size="mini">删除</el-button>
</template>
</el-popover>
</template>
</el-table-column>
@@ -71,7 +73,7 @@
@size-change="handleSizeChange"
/>
<el-dialog :before-close="closeDialog" :visible.sync="dialogFormVisible" title="弹窗操作">
<el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
<el-form-item label="展示值" prop="label">
<el-input
@@ -98,10 +100,12 @@
<el-input-number v-model.number="formData.sort" placeholder="排序标记" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -114,28 +118,10 @@ import {
findSysDictionaryDetail,
getSysDictionaryDetailList
} from '@/api/sysDictionaryDetail' // 此处请自行替换地址
import { formatTimeToStr } from '@/utils/date'
import infoList from '@/mixins/infoList'
export default {
name: 'SysDictionaryDetail',
filters: {
formatDate: function(time) {
if (time !== null && time !== '') {
var date = new Date(time)
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
} else {
return ''
}
},
formatBoolean: function(bool) {
if (bool !== null) {
return bool ? '是' : '否'
} else {
return ''
}
}
},
mixins: [infoList],
data() {
return {
web/src/view/superAdmin/index.vue
+12 -4
View File
@@ -1,9 +1,17 @@
<template>
<div>
<keep-alive>
<router-view v-if="$route.meta.keepAlive" />
</keep-alive>
<router-view v-if="!$route.meta.keepAlive" />
<router-view v-if="$route.meta.keepAlive" v-slot="{ Component }">
<transition mode="out-in" name="el-fade-in-linear">
<keep-alive>
<component :is="Component" />
</keep-alive>
</transition>
</router-view>
<router-view v-if="!$route.meta.keepAlive" v-slot="{ Component }">
<transition mode="out-in" name="el-fade-in-linear">
<component :is="Component" />
</transition>
</router-view>
</div>
</template>
web/src/view/superAdmin/menu/icon.vue
+6 -2
View File
@@ -9,10 +9,10 @@
<el-form-item prop="icon" style="width:100%">
<i
class="icon"
:class="'el-icon-'+ meta.icon"
:class="'el-icon-'+ metaData.icon"
style="position: absolute; z-index: 9999; padding: 5px 10px; "
/>
<el-select v-model="meta.icon" clearable filterable class="gva-select" placeholder="请选择">
<el-select v-model="metaData.icon" clearable filterable class="gva-select" placeholder="请选择">
<el-option v-for="item in options" :key="item.key" :label="item.key" :value="item.key">
<span class="icon" :class="item.label" />
<span style="float: left">{{ item.key }}</span>
@@ -37,6 +37,7 @@ export default {
data() {
return {
input: '',
metaData: {},
options: [
{ key: 'platform-eleme', label: 'el-icon-platform-eleme' },
{ key: 'eleme', label: 'el-icon-eleme' },
@@ -324,6 +325,9 @@ export default {
value: ''
}
},
created() {
this.metaData = this.meta
},
methods: {}
}
</script>
web/src/view/superAdmin/menu/menu.vue
+25 -21
View File
@@ -10,7 +10,7 @@
<el-table-column label="路由Name" min-width="160" prop="name" />
<el-table-column label="路由Path" min-width="160" prop="path" />
<el-table-column label="是否隐藏" min-width="100" prop="hidden">
<template slot-scope="scope">
<template #default="scope">
<span>{{ scope.row.hidden?"隐藏":"显示" }}</span>
</template>
</el-table-column>
@@ -18,18 +18,18 @@
<el-table-column label="排序" min-width="70" prop="sort" />
<el-table-column label="文件路径" min-width="360" prop="component" />
<el-table-column label="展示名称" min-width="120" prop="authorityName">
<template slot-scope="scope">
<template #default="scope">
<span>{{ scope.row.meta.title }}</span>
</template>
</el-table-column>
<el-table-column label="图标" min-width="140" prop="authorityName">
<template slot-scope="scope">
<template #default="scope">
<i :class="`el-icon-${scope.row.meta.icon}`" />
<span>{{ scope.row.meta.icon }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="300">
<template slot-scope="scope">
<template #default="scope">
<el-button
size="mini"
type="primary"
@@ -52,8 +52,9 @@
</el-table-column>
</el-table>
<el-dialog :before-close="handleClose" :title="dialogTitle" :visible.sync="dialogFormVisible">
<el-dialog v-model="dialogFormVisible" :before-close="handleClose" :title="dialogTitle">
<el-form
v-if="dialogFormVisible"
ref="menuForm"
:inline="true"
:model="form"
@@ -70,10 +71,13 @@
/>
</el-form-item>
<el-form-item prop="path" style="width:30%">
<div slot="label" style="display:inline-block">
路由path
<el-checkbox v-model="checkFlag" style="float:right;margin-left:20px;">添加参数</el-checkbox>
</div>
<template #label>
<div style="display:inline-flex">
路由path
<el-checkbox v-model="checkFlag" style="float:right;margin-left:20px;">添加参数</el-checkbox>
</div>
</template>
<el-input
v-model="form.path"
:disabled="!checkFlag"
@@ -105,9 +109,7 @@
<el-input v-model="form.meta.title" autocomplete="off" />
</el-form-item>
<el-form-item label="图标" prop="meta.icon" style="width:30%">
<icon :meta="form.meta">
<template slot="prepend">el-icon-</template>
</icon>
<icon :meta="form.meta" />
</el-form-item>
<el-form-item label="排序标记" prop="sort" style="width:30%">
<el-input v-model.number="form.sort" autocomplete="off" />
@@ -135,7 +137,7 @@
>新增菜单参数</el-button>
<el-table :data="form.parameters" stripe style="width: 100%">
<el-table-column prop="type" label="参数类型" width="180">
<template slot-scope="scope">
<template #default="scope">
<el-select v-model="scope.row.type" placeholder="请选择">
<el-option key="query" value="query" label="query" />
<el-option key="params" value="params" label="params" />
@@ -143,21 +145,21 @@
</template>
</el-table-column>
<el-table-column prop="key" label="参数key" width="180">
<template slot-scope="scope">
<template #default="scope">
<div>
<el-input v-model="scope.row.key" />
</div>
</template>
</el-table-column>
<el-table-column prop="value" label="参数值">
<template slot-scope="scope">
<template #default="scope">
<div>
<el-input v-model="scope.row.value" />
</div>
</template>
</el-table-column>
<el-table-column>
<template slot-scope="scope">
<template #default="scope">
<div>
<el-button
type="danger"
@@ -170,10 +172,12 @@
</el-table-column>
</el-table>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="enterDialog">确 定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -244,7 +248,7 @@ export default {
methods: {
addParameter(form) {
if (!form.parameters) {
this.$set(form, 'parameters', [])
this.form.parameters = []
}
form.parameters.push({
type: 'query',
web/src/view/superAdmin/operation/sysOperationRecord.vue
+20 -30
View File
@@ -13,13 +13,15 @@
</el-form-item>
<el-form-item>
<el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
<el-popover v-model="deleteVisible" placement="top" width="160">
<el-popover v-model:visible="deleteVisible" placement="top" width="160">
<p>确定要删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
</div>
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
<template #reference>
<el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
</template>
</el-popover>
</el-form-item>
</el-form>
@@ -35,15 +37,15 @@
>
<el-table-column type="selection" width="55" />
<el-table-column label="操作人" width="140">
<template slot-scope="scope">
<template #default="scope">
<div>{{ scope.row.user.userName }}({{ scope.row.user.nickName }})</div>
</template>
</el-table-column>
<el-table-column label="日期" width="180">
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
<template #default="scope">{{ formatDate(scope.row.CreatedAt) }}</template>
</el-table-column>
<el-table-column label="状态码" prop="status" width="120">
<template slot-scope="scope">
<template #default="scope">
<div>
<el-tag type="success">{{ scope.row.status }}</el-tag>
</div>
@@ -53,13 +55,15 @@
<el-table-column label="请求方法" prop="method" width="120" />
<el-table-column label="请求路径" prop="path" width="240" />
<el-table-column label="请求" prop="path" width="80">
<template slot-scope="scope">
<template #default="scope">
<div>
<el-popover v-if="scope.row.body" placement="top-start" trigger="hover">
<div class="popover-box">
<pre>{{ fmtBody(scope.row.body) }}</pre>
</div>
<i slot="reference" class="el-icon-view" />
<template #reference>
<i class="el-icon-view" />
</template>
</el-popover>
<span v-else>无</span>
@@ -67,27 +71,31 @@
</template>
</el-table-column>
<el-table-column label="响应" prop="path" width="80">
<template slot-scope="scope">
<template #default="scope">
<div>
<el-popover v-if="scope.row.resp" placement="top-start" trigger="hover">
<div class="popover-box">
<pre>{{ fmtBody(scope.row.resp) }}</pre>
</div>
<i slot="reference" class="el-icon-view" />
<template #reference>
<i class="el-icon-view" />
</template>
</el-popover>
<span v-else>无</span>
</div>
</template>
</el-table-column>
<el-table-column label="按钮组">
<template slot-scope="scope">
<el-popover v-model="scope.row.visible" placement="top" width="160">
<template #default="scope">
<el-popover v-model:visible="scope.row.visible" placement="top" width="160">
<p>确定要删除吗？</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
<el-button size="mini" type="primary" @click="deleteSysOperationRecord(scope.row)">确定</el-button>
</div>
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger">删除</el-button>
<template #reference>
<el-button icon="el-icon-delete" size="mini" type="danger">删除</el-button>
</template>
</el-popover>
</template>
</el-table-column>
@@ -111,28 +119,10 @@ import {
getSysOperationRecordList,
deleteSysOperationRecordByIds
} from '@/api/sysOperationRecord' // 此处请自行替换地址
import { formatTimeToStr } from '@/utils/date'
import infoList from '@/mixins/infoList'
export default {
name: 'SysOperationRecord',
filters: {
formatDate: function(time) {
if (time !== null && time !== '') {
var date = new Date(time)
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
} else {
return ''
}
},
formatBoolean: function(bool) {
if (bool !== null) {
return bool ? '是' : '否'
} else {
return ''
}
}
},
mixins: [infoList],
data() {
return {
web/src/view/superAdmin/user/user.vue
+17 -12
View File
@@ -5,7 +5,7 @@
</div>
<el-table :data="tableData" border stripe>
<el-table-column label="头像" min-width="50">
<template slot-scope="scope">
<template #default="scope">
<div :style="{'textAlign':'center'}">
<CustomPic :pic-src="scope.row.headerImg" />
</div>
@@ -15,7 +15,7 @@
<el-table-column label="用户名" min-width="150" prop="userName" />
<el-table-column label="昵称" min-width="150" prop="nickName" />
<el-table-column label="用户角色" min-width="150">
<template slot-scope="scope">
<template #default="scope">
<el-cascader
v-model="scope.row.authorityIds"
:options="authOptions"
@@ -29,14 +29,16 @@
</template>
</el-table-column>
<el-table-column label="操作" min-width="150">
<template slot-scope="scope">
<el-popover v-model="scope.row.visible" placement="top" width="160">
<template #default="scope">
<el-popover v-model:visible="scope.row.visible" placement="top" width="160">
<p>确定要删除此用户吗</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteUser(scope.row)">确定</el-button>
</div>
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini">删除</el-button>
<template #reference>
<el-button type="danger" icon="el-icon-delete" size="mini">删除</el-button>
</template>
</el-popover>
</template>
</el-table-column>
@@ -53,7 +55,7 @@
@size-change="handleSizeChange"
/>
<el-dialog :visible.sync="addUserDialog" custom-class="user-dialog" title="新增用户">
<el-dialog v-model="addUserDialog" custom-class="user-dialog" title="新增用户">
<el-form ref="userForm" :rules="rules" :model="userInfo">
<el-form-item label="用户名" label-width="80px" prop="username">
<el-input v-model="userInfo.username" />
@@ -72,7 +74,8 @@
</el-form-item>
<el-form-item label="用户角色" label-width="80px" prop="authorityId">
<el-cascader
v-model="userInfo.authorityIds"
v-if="userInfo"
v-model:visible="userInfo.authorityIds"
:options="authOptions"
:show-all-levels="false"
:props="{ multiple:true,checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
@@ -81,10 +84,12 @@
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="closeAddUserDialog">取 消</el-button>
<el-button type="primary" @click="enterAddUserDialog">确 定</el-button>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeAddUserDialog">取 消</el-button>
<el-button type="primary" @click="enterAddUserDialog">确 定</el-button>
</div>
</template>
</el-dialog>
<ChooseImg ref="chooseImg" :target="userInfo" :target-key="`headerImg`" />
</div>
@@ -155,7 +160,7 @@ export default {
const authorityIds = user.authorities && user.authorities.map(i => {
return i.authorityId
})
this.$set(user, 'authorityIds', authorityIds)
user.authorityIds = authorityIds
})
},
openHeaderChange() {