Commit 559adfd7 by dqjdda

调整 api 目录,代码优化

parent d99fb71f
...@@ -31,11 +31,4 @@ export function edit(data) { ...@@ -31,11 +31,4 @@ export function edit(data) {
}) })
} }
export function downloadDept(params) { export default { add, edit, del, getDepts }
return request({
url: 'api/dept/download',
method: 'get',
params,
responseType: 'blob'
})
}
import request from '@/utils/request' import request from '@/utils/request'
// 获取所有的菜单树
export function getMenusTree() { export function getMenusTree() {
return request({ return request({
url: 'api/menus/tree', url: 'api/menus/tree',
...@@ -38,11 +37,4 @@ export function edit(data) { ...@@ -38,11 +37,4 @@ export function edit(data) {
}) })
} }
export function downloadMenu(params) { export default { add, edit, del, getMenusTree }
return request({
url: 'api/menus/download',
method: 'get',
params,
responseType: 'blob'
})
}
...@@ -45,14 +45,6 @@ export function edit(data) { ...@@ -45,14 +45,6 @@ export function edit(data) {
}) })
} }
export function editPermission(data) {
return request({
url: 'api/roles/permission',
method: 'put',
data
})
}
export function editMenu(data) { export function editMenu(data) {
return request({ return request({
url: 'api/roles/menu', url: 'api/roles/menu',
...@@ -61,11 +53,4 @@ export function editMenu(data) { ...@@ -61,11 +53,4 @@ export function editMenu(data) {
}) })
} }
export function downloadRole(params) { export default { add, edit, del, get, editMenu }
return request({
url: 'api/roles/download',
method: 'get',
params,
responseType: 'blob'
})
}
import Vue from 'vue' import Vue from 'vue'
import { get as getDictDetail } from '@/api/dictDetail' import { get as getDictDetail } from '@/api/system/dictDetail'
export default class Dict { export default class Dict {
constructor(dict) { constructor(dict) {
......
...@@ -35,6 +35,8 @@ export default { ...@@ -35,6 +35,8 @@ export default {
dialog: false, dialog: false,
// Form 表单 // Form 表单
form: {}, form: {},
// 重置表单
resetForm: {},
// 弹窗的标题 // 弹窗的标题
title: '', title: '',
// 方法 // 方法
...@@ -179,6 +181,7 @@ export default { ...@@ -179,6 +181,7 @@ export default {
*/ */
showAddFormDialog() { showAddFormDialog() {
this.isAdd = true this.isAdd = true
this.resetForm = JSON.parse(JSON.stringify(this.form))
this.beforeShowAddForm() this.beforeShowAddForm()
this.dialog = true this.dialog = true
}, },
...@@ -193,6 +196,7 @@ export default { ...@@ -193,6 +196,7 @@ export default {
showEditFormDialog(data = '') { showEditFormDialog(data = '') {
this.isAdd = false this.isAdd = false
if (data) { if (data) {
this.resetForm = JSON.parse(JSON.stringify(this.form))
this.form = JSON.parse(JSON.stringify(data)) this.form = JSON.parse(JSON.stringify(data))
} }
this.beforeShowEditForm(data) this.beforeShowEditForm(data)
...@@ -203,10 +207,10 @@ export default { ...@@ -203,10 +207,10 @@ export default {
*/ */
addMethod() { addMethod() {
this.crudMethod.add(this.form).then(() => { this.crudMethod.add(this.form).then(() => {
this.hideFormDialog()
this.addSuccessNotify() this.addSuccessNotify()
this.loading = false this.loading = false
this.afterAddMethod() this.afterAddMethod()
this.cancel()
this.init() this.init()
}).catch(() => { }).catch(() => {
this.loading = false this.loading = false
...@@ -215,17 +219,16 @@ export default { ...@@ -215,17 +219,16 @@ export default {
/** /**
* 新增后可以调用该方法 * 新增后可以调用该方法
*/ */
afterAddMethod() { afterAddMethod() { },
},
/** /**
* 通用的编辑方法 * 通用的编辑方法
*/ */
editMethod() { editMethod() {
this.crudMethod.edit(this.form).then(() => { this.crudMethod.edit(this.form).then(() => {
this.hideFormDialog()
this.editSuccessNotify() this.editSuccessNotify()
this.loading = false this.loading = false
this.afterEditMethod() this.afterEditMethod()
this.cancel()
this.init() this.init()
}).catch(() => { }).catch(() => {
this.loading = false this.loading = false
...@@ -234,8 +237,7 @@ export default { ...@@ -234,8 +237,7 @@ export default {
/** /**
* 编辑后可以调用该方法 * 编辑后可以调用该方法
*/ */
afterEditMethod() { afterEditMethod() {},
},
/** /**
* 提交前可以调用该方法 * 提交前可以调用该方法
*/ */
...@@ -249,21 +251,26 @@ export default { ...@@ -249,21 +251,26 @@ export default {
if (!this.beforeSubmitMethod()) { if (!this.beforeSubmitMethod()) {
return return
} }
this.$refs['form'].validate((valid) => { if (this.$refs['form']) {
if (valid) { this.$refs['form'].validate((valid) => {
this.loading = true if (valid) {
if (this.isAdd) { this.loading = true
this.addMethod() if (this.isAdd) {
} else this.editMethod() this.addMethod()
} } else this.editMethod()
}) }
})
}
}, },
/** /**
* 隐藏弹窗 * 隐藏弹窗
*/ */
hideFormDialog() { cancel() {
this.dialog = false this.dialog = false
this.$refs['form'].resetFields() if (this.$refs['form']) {
this.$refs['form'].clearValidate()
this.form = this.resetForm
}
}, },
/** /**
* 获取弹窗的标题 * 获取弹窗的标题
...@@ -278,7 +285,7 @@ export default { ...@@ -278,7 +285,7 @@ export default {
this.beforeInit() this.beforeInit()
this.downloadLoading = true this.downloadLoading = true
download(this.url + '/download', this.params).then(result => { download(this.url + '/download', this.params).then(result => {
this.downloadFile(result, this.title, 'xlsx') this.downloadFile(result, this.title + '数据', 'xlsx')
this.downloadLoading = false this.downloadLoading = false
}).catch(() => { }).catch(() => {
this.downloadLoading = false this.downloadLoading = false
......
...@@ -4,7 +4,7 @@ import Config from '@/settings' ...@@ -4,7 +4,7 @@ import Config from '@/settings'
import NProgress from 'nprogress' // progress bar import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css'// progress bar style import 'nprogress/nprogress.css'// progress bar style
import { getToken } from '@/utils/auth' // getToken from cookie import { getToken } from '@/utils/auth' // getToken from cookie
import { buildMenus } from '@/api/menu' import { buildMenus } from '@/api/system/menu'
import { filterAsyncRouter } from '@/store/modules/permission' import { filterAsyncRouter } from '@/store/modules/permission'
NProgress.configure({ showSpinner: false })// NProgress Configuration NProgress.configure({ showSpinner: false })// NProgress Configuration
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
import axios from 'axios' import axios from 'axios'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import { del } from '@/api/picture' import { del } from '@/api/tools/picture'
export default { export default {
name: 'Markdown', name: 'Markdown',
data() { data() {
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
import echarts from 'echarts' import echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme require('echarts/theme/macarons') // echarts theme
import { debounce } from '@/utils' import { debounce } from '@/utils'
import { getChartData } from '@/api/visits' import { getChartData } from '@/api/monitor/visits'
export default { export default {
props: { props: {
......
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
<script> <script>
import CountTo from 'vue-count-to' import CountTo from 'vue-count-to'
import { get } from '@/api/visits' import { get } from '@/api/monitor/visits'
export default { export default {
components: { components: {
CountTo CountTo
......
...@@ -174,9 +174,9 @@ ...@@ -174,9 +174,9 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { update, get } from '@/api/genConfig' import { update, get } from '@/api/generator/genConfig'
import { save } from '@/api/generator' import { save } from '@/api/generator/generator'
import { getDicts } from '@/api/dict' import { getDicts } from '@/api/system/dict'
export default { export default {
name: 'GeneratorConfig', name: 'GeneratorConfig',
components: {}, components: {},
......
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { parseTime } from '@/utils/index' import { parseTime } from '@/utils/index'
import { generator } from '@/api/generator' import { generator } from '@/api/generator/generator'
export default { export default {
name: 'GeneratorIndex', name: 'GeneratorIndex',
mixins: [initData], mixins: [initData],
......
...@@ -32,7 +32,7 @@ import LineChart from './dashboard/LineChart' ...@@ -32,7 +32,7 @@ import LineChart from './dashboard/LineChart'
import RadarChart from '@/components/Echarts/RadarChart' import RadarChart from '@/components/Echarts/RadarChart'
import PieChart from '@/components/Echarts/PieChart' import PieChart from '@/components/Echarts/PieChart'
import BarChart from '@/components/Echarts/BarChart' import BarChart from '@/components/Echarts/BarChart'
import { count } from '@/api/visits' import { count } from '@/api/monitor/visits'
/** /**
* 记录访问,只有页面刷新或者第一次加载才会记录 * 记录访问,只有页面刷新或者第一次加载才会记录
......
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { parseTime } from '@/utils/index' import { parseTime } from '@/utils/index'
import { getErrDetail } from '@/api/log' import { getErrDetail } from '@/api/monitor/log'
import Search from './search' import Search from './search'
export default { export default {
name: 'ErrorLog', name: 'ErrorLog',
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
<script> <script>
import { downloadFile } from '@/utils/index' import { downloadFile } from '@/utils/index'
import { downloadLog } from '@/api/log' import { downloadLog } from '@/api/monitor/log'
export default { export default {
props: { props: {
query: { query: {
......
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
import { del, downloadOnline } from '@/api/online' import { del, downloadOnline } from '@/api/monitor/online'
export default { export default {
name: 'OnlineUser', name: 'OnlineUser',
mixins: [initData], mixins: [initData],
......
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
<script> <script>
import checkPermission from '@/utils/permission' // 权限判断函数 import checkPermission from '@/utils/permission' // 权限判断函数
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del, delAll, downloadRedis } from '@/api/redis' import { del, delAll, downloadRedis } from '@/api/monitor/redis'
import { downloadFile } from '@/utils/index' import { downloadFile } from '@/utils/index'
export default { export default {
name: 'Redis', name: 'Redis',
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
</template> </template>
<script> <script>
import { add, edit } from '@/api/server' import { add, edit } from '@/api/monitor/server'
export default { export default {
props: { props: {
isAdd: { isAdd: {
......
...@@ -122,7 +122,7 @@ ...@@ -122,7 +122,7 @@
<script> <script>
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del } from '@/api/server' import { del } from '@/api/monitor/server'
import eForm from './form' import eForm from './form'
export default { export default {
name: 'ServerMonitor', name: 'ServerMonitor',
......
<template>
<el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" :title="isAdd ? '新增部门' : '编辑部门'" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
</el-form-item>
<el-form-item v-if="form.pid !== 0" label="状态" prop="enabled">
<el-radio v-for="item in dicts" :key="item.id" v-model="form.enabled" :label="item.value">{{ item.label }}</el-radio>
</el-form-item>
<el-form-item v-if="form.pid !== 0" style="margin-bottom: 0px;" label="上级部门">
<treeselect v-model="form.pid" :options="depts" style="width: 370px;" placeholder="选择上级类目" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
</div>
</el-dialog>
</template>
<script>
import { add, edit, getDepts } from '@/api/dept'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect },
props: {
isAdd: {
type: Boolean,
required: true
},
dicts: {
type: Array,
required: true
}
},
data() {
return {
loading: false, dialog: false, depts: [],
form: {
id: '',
name: '',
pid: 1,
enabled: 'true'
},
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
]
}
}
},
methods: {
cancel() {
this.resetForm()
},
doSubmit() {
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.form.pid !== undefined) {
this.loading = true
if (this.isAdd) {
this.doAdd()
} else this.doEdit()
} else {
this.$message({
message: '上级部门不能为空',
type: 'warning'
})
}
}
})
},
doAdd() {
add(this.form).then(res => {
this.resetForm()
this.$notify({
title: '添加成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
})
},
doEdit() {
edit(this.form).then(res => {
this.resetForm()
this.$notify({
title: '修改成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
})
},
resetForm() {
this.dialog = false
this.$refs['form'].resetFields()
this.form = {
id: '',
name: '',
pid: 1,
enabled: 'true'
}
},
getDepts() {
getDepts({ enabled: true }).then(res => {
this.depts = res.content
})
}
}
}
</script>
<style scoped>
</style>
...@@ -3,9 +3,9 @@ ...@@ -3,9 +3,9 @@
<!--工具栏--> <!--工具栏-->
<div class="head-container"> <div class="head-container">
<!-- 搜索 --> <!-- 搜索 -->
<el-input v-model="query.value" clearable size="small" placeholder="输入部门名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" /> <el-input v-model="query.name" clearable size="small" placeholder="输入部门名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<el-date-picker <el-date-picker
v-model="query.date" v-model="query.createTime"
:default-time="['00:00:00','23:59:59']" :default-time="['00:00:00','23:59:59']"
type="daterange" type="daterange"
range-separator=":" range-separator=":"
...@@ -20,37 +20,49 @@ ...@@ -20,37 +20,49 @@
</el-select> </el-select>
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button> <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<!-- 新增 --> <!-- 新增 -->
<div v-permission="['admin','dept:add']" style="display: inline-block;margin: 0px 2px;"> <el-button
<el-button class="filter-item"
class="filter-item" size="mini"
size="mini" type="primary"
type="primary" icon="el-icon-plus"
icon="el-icon-plus" @click="showAddFormDialog"
@click="add" >新增</el-button>
>新增</el-button>
</div>
<!-- 导出 --> <!-- 导出 -->
<div style="display: inline-block;"> <el-button
<el-button :loading="downloadLoading"
:loading="downloadLoading" size="mini"
size="mini" class="filter-item"
class="filter-item" type="warning"
type="warning" icon="el-icon-download"
icon="el-icon-download" @click="downloadMethod"
@click="download" >导出</el-button>
>导出</el-button>
</div>
</div> </div>
<!--表单组件--> <!--表单组件-->
<eForm ref="form" :is-add="isAdd" :dicts="dict.dept_status" /> <el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" :title="getFormTitle()" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
</el-form-item>
<el-form-item v-if="form.pid !== 0" label="状态" prop="enabled">
<el-radio v-for="item in dict.dept_status" :key="item.id" v-model="form.enabled" :label="item.value">{{ item.label }}</el-radio>
</el-form-item>
<el-form-item v-if="form.pid !== 0" style="margin-bottom: 0px;" label="上级部门" prop="pid">
<treeselect v-model="form.pid" :options="depts" style="width: 370px;" placeholder="选择上级类目" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button>
</div>
</el-dialog>
<!--表格渲染--> <!--表格渲染-->
<el-table v-loading="loading" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" :default-expand-all="expand" :data="data" row-key="id" size="small"> <el-table v-loading="loading" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" default-expand-all :data="data" row-key="id" size="small">
<el-table-column label="名称" prop="name" /> <el-table-column label="名称" prop="name" />
<el-table-column label="状态" align="center"> <el-table-column label="状态" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-switch <el-switch
v-model="scope.row.enabled" v-model="scope.row.enabled"
:disabled="scope.row.id == 1" :disabled="scope.row.id === 1"
active-color="#409EFF" active-color="#409EFF"
inactive-color="#F56C6C" inactive-color="#F56C6C"
@change="changeEnabled(scope.row, scope.row.enabled,)" @change="changeEnabled(scope.row, scope.row.enabled,)"
...@@ -64,7 +76,7 @@ ...@@ -64,7 +76,7 @@
</el-table-column> </el-table-column>
<el-table-column v-if="checkPermission(['admin','dept:edit','dept:del'])" label="操作" width="130px" align="center" fixed="right"> <el-table-column v-if="checkPermission(['admin','dept:edit','dept:del'])" label="操作" width="130px" align="center" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button v-permission="['admin','dept:edit']" size="mini" type="primary" icon="el-icon-edit" @click="edit(scope.row)" /> <el-button v-permission="['admin','dept:edit']" size="mini" type="primary" icon="el-icon-edit" @click="showEditFormDialog(scope.row)" />
<el-popover <el-popover
:ref="scope.row.id" :ref="scope.row.id"
v-permission="['admin','dept:del']" v-permission="['admin','dept:del']"
...@@ -74,7 +86,7 @@ ...@@ -74,7 +86,7 @@
<p>确定删除本条数据吗?</p> <p>确定删除本条数据吗?</p>
<div style="text-align: right; margin: 0"> <div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button> <el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="subDelete(scope.row.id)">确定</el-button> <el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.id)">确定</el-button>
</div> </div>
<el-button slot="reference" :disabled="scope.row.id === 1" type="danger" icon="el-icon-delete" size="mini" /> <el-button slot="reference" :disabled="scope.row.id === 1" type="danger" icon="el-icon-delete" size="mini" />
</el-popover> </el-popover>
...@@ -85,24 +97,31 @@ ...@@ -85,24 +97,31 @@
</template> </template>
<script> <script>
import checkPermission from '@/utils/permission' import crud from '@/mixins/crud'
import initData from '@/mixins/initData' import crudDept from '@/api/system/dept'
import { del, edit, downloadDept } from '@/api/dept' import Treeselect from '@riophae/vue-treeselect'
import { parseTime, downloadFile } from '@/utils/index' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import eForm from './form'
export default { export default {
name: 'Dept', name: 'Dept',
components: { eForm }, components: { Treeselect },
mixins: [initData], mixins: [crud],
// 设置数据字典 // 设置数据字典
dicts: ['dept_status'], dicts: ['dept_status'],
data() { data() {
return { return {
title: '部门',
crudMethod: { ...crudDept },
depts: [],
form: { id: null, name: null, pid: 1, enabled: 'true' },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
]
},
enabledTypeOptions: [ enabledTypeOptions: [
{ key: 'true', display_name: '正常' }, { key: 'true', display_name: '正常' },
{ key: 'false', display_name: '禁用' } { key: 'false', display_name: '禁用' }
], ]
delLoading: false, expand: true
} }
}, },
created() { created() {
...@@ -111,61 +130,28 @@ export default { ...@@ -111,61 +130,28 @@ export default {
}) })
}, },
methods: { methods: {
parseTime,
checkPermission,
beforeInit() { beforeInit() {
this.url = 'api/dept' this.url = 'api/dept'
const sort = 'id,desc'
this.params = { page: this.page, size: this.size, sort: sort }
const query = this.query
const value = query.value
const enabled = query.enabled
if (value) { this.params['name'] = value }
if (query.date) {
this.params['startTime'] = query.date[0]
this.params['endTime'] = query.date[1]
}
if (enabled !== '' && enabled !== null) { this.params['enabled'] = enabled }
return true return true
}, },
subDelete(id) { // 打开新增弹窗前做的操作
this.delLoading = true beforeShowAddForm() {
del(id).then(res => { this.getDepts()
this.delLoading = false
this.$refs[id].doClose()
this.init()
this.$notify({
title: '删除成功',
type: 'success',
duration: 2500
})
}).catch(err => {
this.delLoading = false
this.$refs[id].doClose()
console.log(err.response.data.message)
})
},
add() {
this.isAdd = true
const _this = this.$refs.form
_this.getDepts()
_this.dialog = true
}, },
changeExpand() { // 打开新增弹窗前做的操作
this.expand = !this.expand beforeShowEditForm(data) {
this.getDepts()
this.form.enabled = data.enabled.toString()
}, },
edit(data) { beforeSubmitMethod() {
this.isAdd = false if (!this.form.pid) {
const _this = this.$refs.form this.$message({
_this.getDepts() message: '上级部门不能为空',
_this.form = { type: 'warning'
id: data.id, })
name: data.name, return false
pid: data.pid,
createTime: data.createTime,
enabled: data.enabled.toString()
} }
_this.dialog = true return true
}, },
// 改变状态 // 改变状态
changeEnabled(data, val) { changeEnabled(data, val) {
...@@ -174,12 +160,8 @@ export default { ...@@ -174,12 +160,8 @@ export default {
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
edit(data).then(res => { this.crudMethod.edit(data).then(res => {
this.$notify({ this.notify(this.dict.label.dept_status[val] + '成功', 'success')
title: this.dict.label.dept_status[val] + '成功',
type: 'success',
duration: 2500
})
}).catch(err => { }).catch(err => {
data.enabled = !data.enabled data.enabled = !data.enabled
console.log(err.response.data.message) console.log(err.response.data.message)
...@@ -188,14 +170,9 @@ export default { ...@@ -188,14 +170,9 @@ export default {
data.enabled = !data.enabled data.enabled = !data.enabled
}) })
}, },
download() { getDepts() {
this.beforeInit() this.crudMethod.getDepts({ enabled: true }).then(res => {
this.downloadLoading = true this.depts = res.content
downloadDept(this.params).then(result => {
downloadFile(result, '部门列表', 'xlsx')
this.downloadLoading = false
}).catch(() => {
this.downloadLoading = false
}) })
} }
} }
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</template> </template>
<script> <script>
import { add, edit } from '@/api/dict' import { add, edit } from '@/api/system/dict'
export default { export default {
props: { props: {
isAdd: { isAdd: {
......
...@@ -92,7 +92,7 @@ ...@@ -92,7 +92,7 @@
<script> <script>
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del, downloadDict } from '@/api/dict' import { del, downloadDict } from '@/api/system/dict'
import dictDetail from '../dictDetail/index' import dictDetail from '../dictDetail/index'
import { downloadFile } from '@/utils/index' import { downloadFile } from '@/utils/index'
import eForm from './form' import eForm from './form'
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
</template> </template>
<script> <script>
import { add, edit } from '@/api/dictDetail' import { add, edit } from '@/api/system/dictDetail'
export default { export default {
props: { props: {
isAdd: { isAdd: {
......
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
<script> <script>
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del } from '@/api/dictDetail' import { del } from '@/api/system/dictDetail'
import eForm from './form' import eForm from './form'
export default { export default {
components: { eForm }, components: { eForm },
......
...@@ -39,11 +39,8 @@ ...@@ -39,11 +39,8 @@
>导出</el-button> >导出</el-button>
</div> </div>
<!--表单渲染--> <!--表单渲染-->
<el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="hideFormDialog" :visible.sync="dialog" :title="getFormTitle()" width="500px"> <el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" :title="getFormTitle()" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item v-show="false" label="ID" prop="id">
<el-input v-model="form.id" style="width: 370px;" />
</el-form-item>
<el-form-item label="名称" prop="name"> <el-form-item label="名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" /> <el-input v-model="form.name" style="width: 370px;" />
</el-form-item> </el-form-item>
...@@ -58,7 +55,7 @@ ...@@ -58,7 +55,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="text" @click="hideFormDialog">取消</el-button> <el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button> <el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button>
</div> </div>
</el-dialog> </el-dialog>
...@@ -124,8 +121,8 @@ ...@@ -124,8 +121,8 @@
<script> <script>
import crud from '@/mixins/crud' import crud from '@/mixins/crud'
import crudJob from '@/api/job' import crudJob from '@/api/system/job'
import { getDepts } from '@/api/dept' import { getDepts } from '@/api/system/dept'
import Treeselect from '@riophae/vue-treeselect' import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default { export default {
...@@ -145,14 +142,7 @@ export default { ...@@ -145,14 +142,7 @@ export default {
{ key: 'true', display_name: '正常' }, { key: 'true', display_name: '正常' },
{ key: 'false', display_name: '禁用' } { key: 'false', display_name: '禁用' }
], ],
form: { form: { id: null, name: null, sort: 999, enabled: 'true', dept: { id: null }},
id: '',
name: '',
sort: 999,
enabled: 'true',
createTime: '',
dept: { id: null }
},
depts: [], depts: [],
rules: { rules: {
name: [ name: [
......
<template>
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="isAdd ? '新增菜单' : '编辑菜单'" append-to-body width="580px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="菜单类型">
<el-radio-group v-model="form.type" size="mini" style="width: 178px">
<el-radio-button label="0">目录</el-radio-button>
<el-radio-button label="1">菜单</el-radio-button>
<el-radio-button label="2">按钮</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单图标">
<el-popover
placement="bottom-start"
width="450"
trigger="click"
@show="$refs['iconSelect'].reset()"
>
<IconSelect ref="iconSelect" @selected="selected" />
<el-input slot="reference" v-model="form.icon" style="width: 450px;" placeholder="点击选择图标" readonly>
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon" style="height: 32px;width: 16px;" />
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
</el-input>
</el-popover>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="外链菜单">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() === '1'" label="菜单缓存">
<el-radio-group v-model="form.cache" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单可见">
<el-radio-group v-model="form.hidden" size="mini">
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单标题" prop="name">
<el-input v-model="form.name" :style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
</el-form-item>
<el-form-item v-show="form.type.toString() === '2'" label="按钮名称">
<el-input v-model="form.name" placeholder="按钮名称" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="form.type.toString() !== '0'" label="权限标识">
<el-input v-model="form.permission" :disabled="form.iframe === 'true'" placeholder="权限标识" style="width: 178px;" />
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" style="width: 178px;" />
</el-form-item>
<el-form-item label="菜单排序">
<el-input-number v-model.number="form.sort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="form.iframe === 'false' && form.type.toString() === '1'" label="组件名称">
<el-input v-model="form.componentName" style="width: 178px;" placeholder="匹配组件内Name字段" />
</el-form-item>
<el-form-item v-show="form.iframe === 'false' && form.type.toString() === '1'" label="组件路径">
<el-input v-model="form.component" style="width: 178px;" placeholder="组件路径" />
</el-form-item>
<el-form-item label="上级类目">
<treeselect v-model="form.pid" :options="menus" style="width: 450px;" placeholder="选择上级类目" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
</div>
</el-dialog>
</template>
<script>
import { add, edit, getMenusTree } from '@/api/menu'
import Treeselect from '@riophae/vue-treeselect'
import IconSelect from '@/components/IconSelect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect, IconSelect },
props: {
isAdd: {
type: Boolean,
required: true
}
},
data() {
return {
loading: false, dialog: false, menus: [],
form: { name: '', sort: 999, path: '', component: '', componentName: '', iframe: 'false', roles: [], pid: 0, icon: '', cache: false, hidden: false, type: 0, permission: '' },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
path: [
{ required: true, message: '请输入地址', trigger: 'blur' }
]
}
}
},
methods: {
cancel() {
this.resetForm()
},
doSubmit() {
this.$refs['form'].validate((valid) => {
if (valid) {
this.loading = true
if (this.isAdd) {
this.doAdd()
} else this.doEdit()
} else {
return false
}
})
},
doAdd() {
add(this.form).then(res => {
this.resetForm()
this.$notify({
title: '添加成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(() => {
this.loading = false
})
},
doEdit() {
edit(this.form).then(res => {
this.resetForm()
this.$notify({
title: '修改成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(() => {
this.loading = false
})
},
resetForm() {
this.dialog = false
this.$refs['form'].resetFields()
this.form = { name: '', sort: 999, path: '', component: '', componentName: '', iframe: 'false', roles: [], pid: 0, icon: '', cache: false, hidden: false, type: 0, permission: '' }
},
selected(name) {
this.form.icon = name
},
getMenus() {
getMenusTree().then(res => {
this.menus = []
const menu = { id: 0, label: '顶级类目', children: [] }
menu.children = res
this.menus.push(menu)
})
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ .el-input-number .el-input__inner {
text-align: left;
}
</style>
...@@ -3,9 +3,9 @@ ...@@ -3,9 +3,9 @@
<!--工具栏--> <!--工具栏-->
<div class="head-container"> <div class="head-container">
<!-- 搜索 --> <!-- 搜索 -->
<el-input v-model="query.value" clearable size="small" placeholder="模糊搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" /> <el-input v-model="query.blurry" clearable size="small" placeholder="模糊搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<el-date-picker <el-date-picker
v-model="query.date" v-model="query.createTime"
:default-time="['00:00:00','23:59:59']" :default-time="['00:00:00','23:59:59']"
type="daterange" type="daterange"
range-separator=":" range-separator=":"
...@@ -17,31 +17,97 @@ ...@@ -17,31 +17,97 @@
/> />
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button> <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<!-- 新增 --> <!-- 新增 -->
<div v-permission="['admin','menu:add']" style="display: inline-block;margin: 0px 2px;"> <el-button
<el-button class="filter-item"
class="filter-item" size="mini"
size="mini" type="primary"
type="primary" icon="el-icon-plus"
icon="el-icon-plus" @click="showAddFormDialog"
@click="add" >新增</el-button>
>新增</el-button>
</div>
<!-- 导出 --> <!-- 导出 -->
<div style="display: inline-block;"> <el-button
<el-button :loading="downloadLoading"
:loading="downloadLoading" size="mini"
size="mini" class="filter-item"
class="filter-item" type="warning"
type="warning" icon="el-icon-download"
icon="el-icon-download" @click="downloadMethod"
@click="download" >导出</el-button>
>导出</el-button>
</div>
</div> </div>
<!--表单组件--> <!--表单渲染-->
<eForm ref="form" :is-add="isAdd" /> <el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="getFormTitle()" append-to-body width="580px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="菜单类型" prop="type">
<el-radio-group v-model="form.type" size="mini" style="width: 178px">
<el-radio-button label="0">目录</el-radio-button>
<el-radio-button label="1">菜单</el-radio-button>
<el-radio-button label="2">按钮</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单图标" prop="icon">
<el-popover
placement="bottom-start"
width="450"
trigger="click"
@show="$refs['iconSelect'].reset()"
>
<IconSelect ref="iconSelect" @selected="selected" />
<el-input slot="reference" v-model="form.icon" style="width: 450px;" placeholder="点击选择图标" readonly>
<svg-icon v-if="form.icon" slot="prefix" :icon-class="form.icon" class="el-input__icon" style="height: 32px;width: 16px;" />
<i v-else slot="prefix" class="el-icon-search el-input__icon" />
</el-input>
</el-popover>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="外链菜单" prop="iframe">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() === '1'" label="菜单缓存" prop="cache">
<el-radio-group v-model="form.cache" size="mini">
<el-radio-button label="true"></el-radio-button>
<el-radio-button label="false"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单可见" prop="hidden">
<el-radio-group v-model="form.hidden" size="mini">
<el-radio-button label="false"></el-radio-button>
<el-radio-button label="true"></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type.toString() !== '2'" label="菜单标题" prop="name">
<el-input v-model="form.name" :style=" form.type.toString() === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
</el-form-item>
<el-form-item v-show="form.type.toString() === '2'" label="按钮名称" prop="name">
<el-input v-model="form.name" placeholder="按钮名称" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="form.type.toString() !== '0'" label="权限标识" prop="permission">
<el-input v-model="form.permission" :disabled="form.iframe === 'true'" placeholder="权限标识" style="width: 178px;" />
</el-form-item>
<el-form-item v-if="form.type.toString() !== '2'" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" style="width: 178px;" />
</el-form-item>
<el-form-item label="菜单排序" prop="sort">
<el-input-number v-model.number="form.sort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
</el-form-item>
<el-form-item v-show="form.iframe === 'false' && form.type.toString() === '1'" label="组件名称" prop="componentName">
<el-input v-model="form.componentName" style="width: 178px;" placeholder="匹配组件内Name字段" />
</el-form-item>
<el-form-item v-show="form.iframe === 'false' && form.type.toString() === '1'" label="组件路径" prop="component">
<el-input v-model="form.component" style="width: 178px;" placeholder="组件路径" />
</el-form-item>
<el-form-item label="上级类目" prop="pid">
<treeselect v-model="form.pid" :options="menus" style="width: 450px;" placeholder="选择上级类目" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button>
</div>
</el-dialog>
<!--表格渲染--> <!--表格渲染-->
<el-table v-loading="loading" :data="data" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" :default-expand-all="expand" row-key="id" size="small"> <el-table v-loading="loading" :data="data" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" row-key="id" size="small">
<el-table-column :show-overflow-tooltip="true" label="菜单名称" width="125px" prop="name" /> <el-table-column :show-overflow-tooltip="true" label="菜单名称" width="125px" prop="name" />
<el-table-column prop="icon" label="图标" align="center" width="60px"> <el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope"> <template slot-scope="scope">
...@@ -82,7 +148,7 @@ ...@@ -82,7 +148,7 @@
</el-table-column> </el-table-column>
<el-table-column v-if="checkPermission(['admin','menu:edit','menu:del'])" label="操作" width="130px" align="center" fixed="right"> <el-table-column v-if="checkPermission(['admin','menu:edit','menu:del'])" label="操作" width="130px" align="center" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button v-permission="['admin','menu:edit']" size="mini" type="primary" icon="el-icon-edit" @click="edit(scope.row)" /> <el-button v-permission="['admin','menu:edit']" size="mini" type="primary" icon="el-icon-edit" @click="showEditFormDialog(scope.row)" />
<el-popover <el-popover
:ref="scope.row.id" :ref="scope.row.id"
v-permission="['admin','menu:del']" v-permission="['admin','menu:del']"
...@@ -92,7 +158,7 @@ ...@@ -92,7 +158,7 @@
<p>确定删除吗,如果存在下级节点则一并删除,此操作不能撤销!</p> <p>确定删除吗,如果存在下级节点则一并删除,此操作不能撤销!</p>
<div style="text-align: right; margin: 0"> <div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button> <el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="subDelete(scope.row.id)">确定</el-button> <el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.id)">确定</el-button>
</div> </div>
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" /> <el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" />
</el-popover> </el-popover>
...@@ -103,18 +169,29 @@ ...@@ -103,18 +169,29 @@
</template> </template>
<script> <script>
import checkPermission from '@/utils/permission' // 权限判断函数 import crud from '@/mixins/crud'
import initData from '@/mixins/initData' import crudMenu from '@/api/system/menu'
import { del, downloadMenu } from '@/api/menu' import Treeselect from '@riophae/vue-treeselect'
import { parseTime, downloadFile } from '@/utils/index' import IconSelect from '@/components/IconSelect'
import eForm from './form' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default { export default {
name: 'Menu', name: 'Menu',
components: { eForm }, components: { Treeselect, IconSelect },
mixins: [initData], mixins: [crud],
data() { data() {
return { return {
delLoading: false, expand: false title: '菜单',
crudMethod: { ...crudMenu },
menus: [],
form: { name: null, sort: 999, path: null, component: null, componentName: null, iframe: false, roles: [], pid: 0, icon: null, cache: false, hidden: false, type: 0, permission: null },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
path: [
{ required: true, message: '请输入地址', trigger: 'blur' }
]
}
} }
}, },
created() { created() {
...@@ -123,68 +200,35 @@ export default { ...@@ -123,68 +200,35 @@ export default {
}) })
}, },
methods: { methods: {
parseTime,
checkPermission,
beforeInit() { beforeInit() {
this.url = 'api/menus' this.url = 'api/menus'
const sort = 'id,desc'
const query = this.query
const value = query.value
this.params = { page: this.page, size: this.size, sort: sort }
if (value) { this.params['blurry'] = value }
if (query.date) {
this.params['startTime'] = query.date[0]
this.params['endTime'] = query.date[1]
}
return true return true
}, },
subDelete(id) { // 打开新增弹窗前做的操作
this.delLoading = true beforeShowAddForm() {
del(id).then(res => { this.getMenus()
this.delLoading = false
this.$refs[id].doClose()
this.init()
this.$notify({
title: '删除成功',
type: 'success',
duration: 2500
})
}).catch(err => {
this.delLoading = false
this.$refs[id].doClose()
console.log(err.response.data.message)
})
},
add() {
this.isAdd = true
this.$refs.form.getMenus()
this.$refs.form.dialog = true
}, },
edit(data) { // 打开新增弹窗前做的操作
this.isAdd = false beforeShowEditForm() {
const _this = this.$refs.form this.getMenus()
_this.getMenus()
_this.form = { id: data.id, component: data.component, componentName: data.componentName, name: data.name, sort: data.sort, pid: data.pid, path: data.path, iframe: data.iframe.toString(), roles: [], icon: data.icon, cache: data.cache, hidden: data.hidden, type: data.type, permission: data.permission }
_this.dialog = true
}, },
changExpand() { selected(name) {
this.expand = !this.expand this.form.icon = name
this.init()
}, },
download() { getMenus() {
this.beforeInit() this.crudMethod.getMenusTree().then(res => {
this.downloadLoading = true this.menus = []
downloadMenu(this.params).then(result => { const menu = { id: 0, label: '顶级类目', children: [] }
downloadFile(result, '菜单列表', 'xlsx') menu.children = res
this.downloadLoading = false this.menus.push(menu)
}).catch(() => {
this.downloadLoading = false
}) })
} }
} }
} }
</script> </script>
<style scoped> <style rel="stylesheet/scss" lang="scss" scoped>
/deep/ .el-input-number .el-input__inner {
text-align: left;
}
</style> </style>
<template>
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="isAdd ? '新增角色' : '编辑角色'" append-to-body width="520px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="角色名称" prop="name">
<el-input v-model="form.name" style="width: 145px;" />
</el-form-item>
<el-form-item label="角色权限" prop="permission">
<el-input v-model="form.permission" style="width: 145px;" />
</el-form-item>
<el-form-item label="数据范围">
<el-select v-model="form.dataScope" style="width: 145px" placeholder="请选择数据范围" @change="changeScope">
<el-option
v-for="item in dateScopes"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="角色级别" prop="sort">
<el-input-number v-model.number="form.level" :min="1" controls-position="right" style="width: 145px;" />
</el-form-item>
<el-form-item v-if="form.dataScope === '自定义'" label="数据权限">
<treeselect v-model="deptIds" :options="depts" multiple style="width: 380px" placeholder="请选择" />
</el-form-item>
<el-form-item label="描述信息">
<el-input v-model="form.remark" style="width: 380px;" rows="5" type="textarea" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
</div>
</el-dialog>
</template>
<script>
import { getDepts } from '@/api/dept'
import { add, edit } from '@/api/role'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect },
props: {
isAdd: {
type: Boolean,
required: true
}
},
data() {
return {
dateScopes: ['全部', '本级', '自定义'],
loading: false, dialog: false, depts: [], deptIds: [],
form: { name: '', depts: [], remark: '', dataScope: '本级', level: 3, permission: '' },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
permission: [
{ required: true, message: '请输入权限', trigger: 'blur' }
]
}
}
},
methods: {
cancel() {
this.resetForm()
},
doSubmit() {
if (this.form.dataScope === '自定义' && this.deptIds.length === 0) {
this.$message({
message: '自定义数据权限不能为空',
type: 'warning'
})
} else {
this.form.depts = []
if (this.form.dataScope === '自定义') {
for (let i = 0; i < this.deptIds.length; i++) {
this.form.depts.push({
id: this.deptIds[i]
})
}
}
this.$refs['form'].validate((valid) => {
if (valid) {
this.loading = true
if (this.isAdd) {
this.doAdd()
} else this.doEdit()
} else {
return false
}
})
}
},
doAdd() {
add(this.form).then(res => {
this.resetForm()
this.$notify({
title: '添加成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
})
},
doEdit() {
edit(this.form).then(res => {
this.resetForm()
this.$notify({
title: '修改成功',
type: 'success',
duration: 2500
})
this.loading = false
this.$parent.init()
}).catch(err => {
this.loading = false
console.log(err.response.data.message)
})
},
resetForm() {
this.dialog = false
this.$refs['form'].resetFields()
this.form = { name: '', depts: [], remark: '', dataScope: '本级', level: 3, permission: '' }
},
getDepts() {
getDepts({ enabled: true }).then(res => {
this.depts = res.content
})
},
changeScope() {
if (this.form.dataScope === '自定义') {
this.getDepts()
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ .el-input-number .el-input__inner {
text-align: left;
}
</style>
<template> <template>
<div class="app-container"> <div class="app-container">
<!--表单组件-->
<eForm ref="form" :is-add="isAdd" />
<!--工具栏--> <!--工具栏-->
<div class="head-container"> <div class="head-container">
<!-- 搜索 --> <!-- 搜索 -->
<el-input v-model="query.value" size="small" clearable placeholder="输入名称或者描述搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" /> <el-input v-model="query.blurry" size="small" clearable placeholder="输入名称或者描述搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
<el-date-picker <el-date-picker
v-model="query.date" v-model="query.createTime"
:default-time="['00:00:00','23:59:59']" :default-time="['00:00:00','23:59:59']"
type="daterange" type="daterange"
range-separator=":" range-separator=":"
...@@ -19,27 +17,57 @@ ...@@ -19,27 +17,57 @@
/> />
<el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button> <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
<!-- 新增 --> <!-- 新增 -->
<div v-permission="['admin','roles:add']" style="display: inline-block;margin: 0px 2px;"> <el-button
<el-button class="filter-item"
class="filter-item" size="mini"
size="mini" type="primary"
type="primary" icon="el-icon-plus"
icon="el-icon-plus" @click="showAddFormDialog"
@click="add" >新增</el-button>
>新增</el-button>
</div>
<!-- 导出 --> <!-- 导出 -->
<div style="display: inline-block;"> <el-button
<el-button :loading="downloadLoading"
:loading="downloadLoading" size="mini"
size="mini" class="filter-item"
class="filter-item" type="warning"
type="warning" icon="el-icon-download"
icon="el-icon-download" @click="downloadMethod"
@click="download" >导出</el-button>
>导出</el-button>
</div>
</div> </div>
<!-- 表单渲染 -->
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="getFormTitle()" append-to-body width="520px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="角色名称" prop="name">
<el-input v-model="form.name" style="width: 145px;" />
</el-form-item>
<el-form-item label="角色权限" prop="permission">
<el-input v-model="form.permission" style="width: 145px;" />
</el-form-item>
<el-form-item label="数据范围" prop="dataScope">
<el-select v-model="form.dataScope" style="width: 145px" placeholder="请选择数据范围" @change="changeScope">
<el-option
v-for="item in dateScopes"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="角色级别" prop="level">
<el-input-number v-model.number="form.level" :min="1" controls-position="right" style="width: 145px;" />
</el-form-item>
<el-form-item v-if="form.dataScope === '自定义'" label="数据权限" prop="depts">
<treeselect v-model="form.depts" :options="depts" multiple style="width: 380px" placeholder="请选择" />
</el-form-item>
<el-form-item label="描述信息" prop="remark">
<el-input v-model="form.remark" style="width: 380px;" rows="5" type="textarea" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button>
</div>
</el-dialog>
<el-row :gutter="15"> <el-row :gutter="15">
<!--角色管理--> <!--角色管理-->
<el-col :xs="24" :sm="24" :md="16" :lg="16" :xl="17" style="margin-bottom: 10px"> <el-col :xs="24" :sm="24" :md="16" :lg="16" :xl="17" style="margin-bottom: 10px">
...@@ -53,14 +81,14 @@ ...@@ -53,14 +81,14 @@
<el-table-column prop="permission" label="角色权限" /> <el-table-column prop="permission" label="角色权限" />
<el-table-column prop="level" label="角色级别" /> <el-table-column prop="level" label="角色级别" />
<el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" /> <el-table-column :show-overflow-tooltip="true" prop="remark" label="描述" />
<el-table-column :show-overflow-tooltip="true" width="130px" prop="createTime" label="创建日期"> <el-table-column :show-overflow-tooltip="true" width="135px" prop="createTime" label="创建日期">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span> <span>{{ parseTime(scope.row.createTime) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column v-if="checkPermission(['admin','roles:edit','roles:del'])" label="操作" width="130px" align="center" fixed="right"> <el-table-column v-if="checkPermission(['admin','roles:edit','roles:del'])" label="操作" width="130px" align="center" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button v-permission="['admin','roles:edit']" size="mini" type="primary" icon="el-icon-edit" @click="edit(scope.row)" /> <el-button v-permission="['admin','roles:edit']" size="mini" type="primary" icon="el-icon-edit" @click="showEditFormDialog(scope.row)" />
<el-popover <el-popover
:ref="scope.row.id" :ref="scope.row.id"
v-permission="['admin','roles:del']" v-permission="['admin','roles:del']"
...@@ -70,7 +98,7 @@ ...@@ -70,7 +98,7 @@
<p>确定删除本条数据吗?</p> <p>确定删除本条数据吗?</p>
<div style="text-align: right; margin: 0"> <div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button> <el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button>
<el-button :loading="delLoading" type="primary" size="mini" @click="subDelete(scope.row.id)">确定</el-button> <el-button :loading="delLoading" type="primary" size="mini" @click="delMethod(scope.row.id)">确定</el-button>
</div> </div>
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" /> <el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" />
</el-popover> </el-popover>
...@@ -88,7 +116,7 @@ ...@@ -88,7 +116,7 @@
/> />
</el-card> </el-card>
</el-col> </el-col>
<!-- 授权 --> <!-- 菜单授权 -->
<el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="7"> <el-col :xs="24" :sm="24" :md="8" :lg="8" :xl="7">
<el-card class="box-card" shadow="never"> <el-card class="box-card" shadow="never">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
...@@ -123,25 +151,36 @@ ...@@ -123,25 +151,36 @@
</template> </template>
<script> <script>
import checkPermission from '@/utils/permission' import crud from '@/mixins/crud'
import initData from '@/mixins/initData' import crudRoles from '@/api/system/role'
import { del } from '@/api/role' import { getDepts } from '@/api/system/dept'
import { getMenusTree } from '@/api/menu' import { getMenusTree } from '@/api/system/menu'
import { parseTime, downloadFile } from '@/utils/index' import Treeselect from '@riophae/vue-treeselect'
import eForm from './form' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { editMenu, get, downloadRole } from '@/api/role'
export default { export default {
name: 'Role', name: 'Role',
components: { eForm }, components: { Treeselect },
mixins: [initData], mixins: [crud],
data() { data() {
return { return {
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'label' label: 'label'
}, },
title: '角色',
dateScopes: ['全部', '本级', '自定义'],
crudMethod: { ...crudRoles },
currentId: 0, menuLoading: false, showButton: false, currentId: 0, menuLoading: false, showButton: false,
delLoading: false, menus: [], menuIds: [] menus: [], menuIds: [], depts: [],
form: { name: null, depts: [], remark: null, dataScope: null, level: 3, permission: null },
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
permission: [
{ required: true, message: '请输入权限', trigger: 'blur' }
]
}
} }
}, },
created() { created() {
...@@ -151,41 +190,42 @@ export default { ...@@ -151,41 +190,42 @@ export default {
}) })
}, },
methods: { methods: {
parseTime,
checkPermission,
beforeInit() { beforeInit() {
this.showButton = false this.showButton = false
this.url = 'api/roles' this.url = 'api/roles'
const sort = 'level,asc' this.sort = 'level,asc'
const query = this.query
const value = query.value
this.params = { page: this.page, size: this.size, sort: sort }
if (value) { this.params['blurry'] = value }
if (query.date) {
this.params['startTime'] = query.date[0]
this.params['endTime'] = query.date[1]
}
// 清空菜单的选中 // 清空菜单的选中
this.$refs.menu.setCheckedKeys([]) this.$refs.menu.setCheckedKeys([])
return true return true
}, },
subDelete(id) { // 打开编辑弹窗前做的操作
this.delLoading = true beforeShowEditForm(data) {
del(id).then(res => { if (data.dataScope === '自定义') {
this.delLoading = false this.getDepts()
this.$refs[id].doClose() }
this.dleChangePage() const depts = []
this.init() data.depts.forEach(function(dept, index) {
this.$notify({ depts.push(dept.id)
title: '删除成功',
type: 'success',
duration: 2500
})
}).catch(err => {
this.delLoading = false
this.$refs[id].doClose()
console.log(err.response.data.message)
}) })
this.form.depts = depts
},
// 提交前做的操作
beforeSubmitMethod() {
if (this.form.dataScope === '自定义' && this.form.depts.length === 0) {
this.$message({
message: '自定义数据权限不能为空',
type: 'warning'
})
return false
} else {
const depts = []
this.form.depts.forEach(function(data, index) {
const dept = { id: data }
depts.push(dept)
})
this.form.depts = depts
}
return true
}, },
getMenus() { getMenus() {
getMenusTree().then(res => { getMenusTree().then(res => {
...@@ -222,12 +262,8 @@ export default { ...@@ -222,12 +262,8 @@ export default {
const menu = { id: data } const menu = { id: data }
role.menus.push(menu) role.menus.push(menu)
}) })
editMenu(role).then(res => { this.crudMethod.editMenu(role).then(res => {
this.$notify({ this.notify('保存成功', 'success')
title: '保存成功',
type: 'success',
duration: 2500
})
this.menuLoading = false this.menuLoading = false
this.update() this.update()
}).catch(err => { }).catch(err => {
...@@ -237,7 +273,7 @@ export default { ...@@ -237,7 +273,7 @@ export default {
}, },
update() { update() {
// 无刷新更新 表格数据 // 无刷新更新 表格数据
get(this.currentId).then(res => { this.crudMethod.get(this.currentId).then(res => {
for (let i = 0; i < this.data.length; i++) { for (let i = 0; i < this.data.length; i++) {
if (res.id === this.data[i].id) { if (res.id === this.data[i].id) {
this.data[i] = res this.data[i] = res
...@@ -246,32 +282,15 @@ export default { ...@@ -246,32 +282,15 @@ export default {
} }
}) })
}, },
add() { getDepts() {
this.isAdd = true getDepts({ enabled: true }).then(res => {
this.$refs.form.dialog = true this.depts = res.content
})
}, },
edit(data) { changeScope() {
this.isAdd = false if (this.form.dataScope === '自定义') {
const _this = this.$refs.form this.getDepts()
_this.deptIds = []
_this.form = { id: data.id, name: data.name, remark: data.remark, depts: data.depts, dataScope: data.dataScope, level: data.level, permission: data.permission }
if (_this.form.dataScope === '自定义') {
_this.getDepts()
}
for (let i = 0; i < _this.form.depts.length; i++) {
_this.deptIds[i] = _this.form.depts[i].id
} }
_this.dialog = true
},
download() {
this.beforeInit()
this.downloadLoading = true
downloadRole(this.params).then(result => {
downloadFile(result, '角色列表', 'xlsx')
this.downloadLoading = false
}).catch(() => {
this.downloadLoading = false
})
} }
} }
} }
...@@ -284,8 +303,8 @@ export default { ...@@ -284,8 +303,8 @@ export default {
} }
</style> </style>
<style scoped> <style rel="stylesheet/scss" lang="scss" scoped>
/deep/ .el-tree-node__label{ /deep/ .el-input-number .el-input__inner {
margin-left: 5px; text-align: left;
} }
</style> </style>
...@@ -136,7 +136,7 @@ ...@@ -136,7 +136,7 @@
<script> <script>
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del, updateIsPause, execution, add, edit, downloadJobs } from '@/api/timing' import { del, updateIsPause, execution, add, edit, downloadJobs } from '@/api/system/timing'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
import Log from './log' import Log from './log'
export default { export default {
......
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
<script> <script>
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { downloadLogs } from '@/api/timing' import { downloadLogs } from '@/api/system/timing'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
export default { export default {
mixins: [initData], mixins: [initData],
......
...@@ -24,8 +24,8 @@ ...@@ -24,8 +24,8 @@
<script> <script>
import store from '@/store' import store from '@/store'
import { validEmail } from '@/utils/validate' import { validEmail } from '@/utils/validate'
import { updateEmail } from '@/api/user' import { updateEmail } from '@/api/system/user'
import { resetEmail } from '@/api/code' import { resetEmail } from '@/api/system/code'
export default { export default {
props: { props: {
email: { email: {
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<script> <script>
import store from '@/store' import store from '@/store'
import { updatePass } from '@/api/user' import { updatePass } from '@/api/system/user'
export default { export default {
data() { data() {
const confirmPass = (rule, value, callback) => { const confirmPass = (rule, value, callback) => {
......
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
>导出</el-button> >导出</el-button>
</div> </div>
<!--表单渲染--> <!--表单渲染-->
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="hideFormDialog" :title="getFormTitle()" append-to-body width="570px"> <el-dialog :visible.sync="dialog" :close-on-click-modal="false" :before-close="cancel" :title="getFormTitle()" append-to-body width="570px">
<el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="66px"> <el-form ref="form" :inline="true" :model="form" :rules="rules" size="small" label-width="66px">
<el-form-item label="用户名" prop="username"> <el-form-item label="用户名" prop="username">
<el-input v-model="form.username" /> <el-input v-model="form.username" />
...@@ -88,7 +88,7 @@ ...@@ -88,7 +88,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="text" @click="hideFormDialog">取消</el-button> <el-button type="text" @click="cancel">取消</el-button>
<el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button> <el-button :loading="loading" type="primary" @click="submitMethod">确认</el-button>
</div> </div>
</el-dialog> </el-dialog>
...@@ -152,11 +152,11 @@ ...@@ -152,11 +152,11 @@
<script> <script>
import crud from '@/mixins/crud' import crud from '@/mixins/crud'
import crudUser from '@/api/user' import crudUser from '@/api/system/user'
import { isvalidPhone } from '@/utils/validate' import { isvalidPhone } from '@/utils/validate'
import { getDepts } from '@/api/dept' import { getDepts } from '@/api/system/dept'
import { getAll, getLevel } from '@/api/role' import { getAll, getLevel } from '@/api/system/role'
import { getAllJob } from '@/api/job' import { getAllJob } from '@/api/system/job'
import Treeselect from '@riophae/vue-treeselect' import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default { export default {
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
</template> </template>
<script> <script>
import { get, update } from '@/api/alipay' import { get, update } from '@/api/tools/alipay'
export default { export default {
name: 'Config', name: 'Config',
data() { data() {
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
</template> </template>
<script> <script>
import { toAliPay } from '@/api/alipay' import { toAliPay } from '@/api/tools/alipay'
export default { export default {
data() { data() {
return { return {
......
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
</template> </template>
<script> <script>
import { get, update } from '@/api/email' import { get, update } from '@/api/tools/email'
export default { export default {
name: 'Config', name: 'Config',
data() { data() {
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import { send } from '@/api/email' import { send } from '@/api/tools/email'
import { validEmail } from '@/utils/validate' import { validEmail } from '@/utils/validate'
import E from 'wangeditor' import E from 'wangeditor'
export default { export default {
......
...@@ -123,7 +123,7 @@ import checkPermission from '@/utils/permission' // 权限判断函数 ...@@ -123,7 +123,7 @@ import checkPermission from '@/utils/permission' // 权限判断函数
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { del, delAll, downloadPicture } from '@/api/picture' import { del, delAll, downloadPicture } from '@/api/tools/picture'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
export default { export default {
name: 'Pictures', name: 'Pictures',
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import { edit } from '@/api/localStorage' import { edit } from '@/api/tools/localStorage'
export default { export default {
props: { props: {
isAdd: { isAdd: {
......
...@@ -140,7 +140,7 @@ ...@@ -140,7 +140,7 @@
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import checkPermission from '@/utils/permission' import checkPermission from '@/utils/permission'
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del, delAll, downloadStorage } from '@/api/localStorage' import { del, delAll, downloadStorage } from '@/api/tools/localStorage'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
import eForm from './form' import eForm from './form'
export default { export default {
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
</template> </template>
<script> <script>
import { get, update } from '@/api/qiniu' import { get, update } from '@/api/tools/qiniu'
export default { export default {
data() { data() {
return { return {
......
...@@ -125,7 +125,7 @@ ...@@ -125,7 +125,7 @@
<script> <script>
import initData from '@/mixins/initData' import initData from '@/mixins/initData'
import { del, download, sync, delAll, downloadQiNiu } from '@/api/qiniu' import { del, download, sync, delAll, downloadQiNiu } from '@/api/tools/qiniu'
import { parseTime, downloadFile } from '@/utils/index' import { parseTime, downloadFile } from '@/utils/index'
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment