Skip to content

C
cms-admin
提交 12e84639 authored 作者: pengxiaohui's avatar pengxiaohui
浏览文件
操作

接入高级设置和类型管理接口

上级 3f8ede6a
隐藏空白字符变更
内嵌 并排
正在显示 包含 291 行增加 和 62 行删除
src/api/settings.js
浏览文件 @ 12e84639
import httpRequest from '@/utils/axios'
/* ------------------------------------高级设置------------------------------------ */
/**
* 获取角色列表
*/
export function getRoleList(params) {
return httpRequest.get('/api/cms/admin/v1/roles', { params })
}
/**
* 获取权限列表
*/
export function getPermissionList(params) {
return httpRequest.get('/api/cms/admin/v1/permissions', { params })
}
/**
* 创建角色
*/
export function createRole(data) {
return httpRequest.post('/api/cms/admin/v1/role/create', data)
}
/**
* 获取角色详情
*/
export function getRoleDetails(params) {
return httpRequest.get(`/api/cms/admin/v1/role/${params.role_id}/detail`, { params })
}
/**
* 更新角色
*/
export function updateRole(data) {
return httpRequest.put(`/api/cms/admin/v1/role/${data.role_id}/update`, data)
}
/**
* 删除角色
*/
export function deleteRole(data) {
return httpRequest.delete(`/api/cms/admin/v1/role/${data.role_id}/delete`, data)
}
/* ------------------------------------员工管理------------------------------------ */
/**
* 获取员工列表
*/
export function getStaffList(params) {
return httpRequest.get('/api/cms/admin/v1/roles', { params })
}
/* ------------------------------------类型管理------------------------------------ */
/**
* 获取类型列表
*/
export function getTypeList(params) {
return httpRequest.get('/api/cms/admin/v1/types', { params })
}
/**
* 创建类型
*/
export function createType(data) {
return httpRequest.post('/api/cms/admin/v1/type/create', data)
}
/**
* 更新角色
*/
export function updateType(data) {
return httpRequest.put(`/api/cms/admin/v1/type/${data.type_id}/update`, data)
}
\ No newline at end of file
src/components/Layout/Sidebar/index.vue
浏览文件 @ 12e84639
......@@ -93,7 +93,6 @@ export default {
watch: {
$route: {
handler: function(nv) {
console.log(nv)
if (nv && nv.path) this.defaultActive = nv.path
else this.defaultActive = ''
},
......
src/components/Layout/header.vue
浏览文件 @ 12e84639
......@@ -52,7 +52,6 @@ export default {
},
async logout() {
await this.$store.dispatch('logout')
// console.log(this.$route.fullPath)
this.$router.push(this.$route.fullPath)
}
}
......
src/pages/settings/role/index.vue
浏览文件 @ 12e84639
......@@ -4,7 +4,7 @@
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="角色权限" name="0" lazy>
<table-list v-bind="tableOptions" ref="tabList">
<template v-slot:table-role-name="{ row }"><span class="color-blue">{{row.role_name}}</span></template>
<template v-slot:table-role-name="{ row }"><span class="color-blue">{{row.name}}</span></template>
<!-- 操作 -->
<template v-slot:table-operate="{ row }">
<el-button type="text" @click="handleEdit(row)" size="mini">编辑名称</el-button>
......@@ -45,8 +45,7 @@
</template>
<script>
import TableList from '@/components/TableList'
import { permissionList } from './permission'
import { getRoleList } from '@/api/settings.js'
import { getRoleList, getPermissionList, createRole, deleteRole, updateRole } from '@/api/settings.js'
function recursionData(arr) {
const leafArr = []
function recursion(target) {
......@@ -57,6 +56,7 @@ function recursionData(arr) {
} else if (Array.isArray(target.children)) {
list = target.children
}
list.reverse()
list.filter(item => {
if (Array.isArray(item.children) && item.children.length > 0) {
const _prop = item.tag.replace(/-/g, '_')
......@@ -88,7 +88,7 @@ export default {
params: {}
},
columns: [
{ prop: 'role_name', label: '角色名称', slots: 'table-role-name' },
{ prop: 'name', label: '角色名称', slots: 'table-role-name' },
{ prop: 'role_owner', label: '角色拥有人' },
{ prop: 'operate', label: '操作', slots: 'table-operate' }
],
......@@ -190,7 +190,7 @@ export default {
this.selectedTableItem = val
this.dialogVisible = true
this.dialogType = 'permission'
this.reviewPermission(val.permission)
this.reviewPermission(val.permission_tags)
},
reviewPermission(permissions) {
// const permissionData = []
......@@ -200,6 +200,7 @@ export default {
targetArr.push(item.tag)
}
})
this.checkAll = this.isCheckAll
},
handleCheckAllChange(val) {
if (val) {
......@@ -230,7 +231,21 @@ export default {
handleDialogSubmit() {
this.$refs.dialogForm.validate(valid => {
if (valid) {
console.log('dialogForm')
switch (this.dialogType) {
case 'create':
this.fetchCreateRole()
break
case 'delete':
this.fetchDeleteRole()
break
case 'edit':
this.fetchUpdateRole()
break
case 'permission':
this.fetchUpdateRolePermissions()
break
}
this.dialogVisible = false
} else {
return false
}
......@@ -242,23 +257,99 @@ export default {
limit: 20
}
getRoleList(params).then((res) => {
console.log(res)
if (res.code === 0 && res.data && Array.isArray(res.data.data)) {
// console.log(res.data.data)
this.tableOptions.data = res.data.data
}
})
},
fetchCreateRole() {
const data = {
name: this.form.role_name
}
createRole(data).then((res) => {
if (res.code === 0 && res.message === 'SUCCESS') {
this.fetchRoleList()
this.$message.success('创建角色成功')
} else {
this.$message.error('创建角色失败')
}
})
},
fetchUpdateRole() {
const data = {
role_id: this.selectedTableItem.id,
name: this.form.role_name
}
updateRole(data).then((res) => {
if (res.code === 0 && res.data && res.data.status) {
this.fetchRoleList()
this.$message.success('编辑角色名称成功')
} else {
this.$message.error('编辑角色名称失败')
}
})
},
fetchDeleteRole() {
const data = {
role_id: this.selectedTableItem.id
}
deleteRole(data).then((res) => {
if (res.code === 0 && res.data && res.data.status) {
this.fetchRoleList()
this.$message.success('删除角色成功')
} else {
this.$message.error('删除角色失败')
}
})
},
fetchUpdateRolePermissions() {
const permissionArr = []
Object.keys(this.form).forEach(key => {
const item = this.form[key]
if (Array.isArray(item)) {
item.forEach((it) => {
permissionArr.push(it)
})
}
})
const data = {
role_id: this.selectedTableItem.id,
permission_tags: permissionArr
}
updateRole(data).then((res) => {
if (res.code === 0 && res.data && res.data.status) {
this.fetchRoleList()
this.$message.success('权限配置成功')
} else {
this.$message.error('权限配置失败')
}
})
},
fetchPermissionList() {
const result = permissionList
const leafNodeList = recursionData(result)
this.permissionLeafCount = leafNodeList.length
this.permissionLeafList = leafNodeList
console.log(leafNodeList)
result.forEach(item => {
item.children.forEach(subItem => {
const key = subItem.v_model_key
permissionForm[key] = []
async fetchPermissionList() {
const result = await new Promise((resolve, reject) => {
getPermissionList().then((res) => {
if (res.code === 0 && Array.isArray(res.data)) {
resolve(res.data)
} else reject()
}).catch(() => {
reject()
})
})
this.permissionList = result
this.assignForm()
if (result) {
const leafNodeList = recursionData(result)
this.permissionLeafCount = leafNodeList.length
this.permissionLeafList = leafNodeList
// console.log(leafNodeList)
result.forEach(item => {
item.children.forEach(subItem => {
const key = subItem.v_model_key
permissionForm[key] = []
})
})
this.permissionList = result
this.assignForm()
}
}
}
}
......
src/pages/settings/type/index.vue
浏览文件 @ 12e84639
<template>
<div class="type page_container">
<el-button class="btn-create" type="primary" @click="handleCreate" size="small">新建类型</el-button>
<el-tabs v-model="activeName" type="card">
<el-tabs v-model="activeName" type="card" @tab-click="handleTabClick">
<el-tab-pane label="项目类型" name="0" lazy>
<table-list v-bind="projectTableOptions" ref="tabList">
<!-- 项目Id -->
<template v-slot:table-id="{ row }"><span class="details-handle" @click="handleDetails(row)">{{row.id}}</span></template>
<template v-slot:table-id="{ row }"><p class="details-handle" @click="handleDetails(row)">{{row.id}}</p></template>
<!-- 创建人 -->
<template v-slot:table-creater="{ row }"><p>{{row.sso_user.realname || row.sso_user.nickname}}</p></template>
<!-- 状态 -->
<template v-slot:table-status="{ row }">
<el-switch v-model="row.status" :active-value="1" :inactive-value="0" active-text="启用" inactive-text="停用"></el-switch>
<el-switch v-model="row.status" :active-value="1" :inactive-value="0" active-text="启用" inactive-text="停用" @change="statusChange(row)"></el-switch>
</template>
</table-list>
</el-tab-pane>
<el-tab-pane label="内容类型" name="1" lazy>
<table-list v-bind="contentTableOptions" ref="tabList">
<!-- 项目Id -->
<template v-slot:table-id="{ row }"><span class="details-handle" @click="handleDetails(row)">{{row.id}}</span></template>
<template v-slot:table-id="{ row }"><p class="details-handle" @click="handleDetails(row)">{{row.id}}</p></template>
<!-- 创建人 -->
<template v-slot:table-creater="{ row }"><p>{{row.sso_user.realname || row.sso_user.nickname}}</p></template>
<!-- 创建人 -->
<template v-slot:table-category="{ row }"><p>{{row.category | categoryFilter}}</p></template>
<!-- 状态 -->
<template v-slot:table-status="{ row }">
<el-switch v-model="row.status" :active-value="1" :inactive-value="0" active-text="启用" inactive-text="停用"></el-switch>
<el-switch v-model="row.status" :active-value="1" :inactive-value="0" active-text="启用" inactive-text="停用" @change="statusChange(row)"></el-switch>
</template>
</table-list>
</el-tab-pane>
......@@ -26,21 +32,24 @@
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="440px" @close="handleDialogClose" :destroy-on-close="true">
<el-form :model="form" label-width="110px" ref="dialogForm" class="dialog-form">
<template v-if="activeName === '0'">
<el-form-item label="项目类型名称" prop="project_type_name" :rules="{ required: true, message: '请输入项目类型名称', trigger: 'blur' }">
<el-input v-model="form.project_type_name" size="small"></el-input>
<el-form-item label="项目类型名称" prop="name" :rules="{ required: true, message: '请输入项目类型名称', trigger: 'blur' }">
<el-input v-model="form.name" size="small"></el-input>
</el-form-item>
<el-form-item v-if="dialogType === 'create'" label="参数ID为：" prop="tag" :rules="{ required: true, message: '请输入参数ID', trigger: 'blur' }">
<el-input v-model="form.tag" size="small"></el-input>
</el-form-item>
</template>
<template v-else>
<el-form-item label="内容类型为：" prop="content_type" :rules="[{ required: true, message: '请选择手机号', trigger: 'change' }]">
<el-select v-model="form.content_type" placeholder="请选择角色" size="small" style="width:100%;">
<el-form-item label="内容类型为：" prop="category" :rules="[{ required: true, message: '请选择手机号', trigger: 'change' }]">
<el-select v-model="form.category" placeholder="请选择类型" size="small" style="width:100%;">
<el-option :label="item.name" :value="item.id" v-for="item in contentTypeList" :key="item.id" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="参数ID为：" prop="query_id" :rules="{ required: true, message: '请输入参数ID', trigger: 'blur' }">
<el-input v-model="form.query_id" size="small"></el-input>
<el-form-item v-if="dialogType === 'create'" label="参数ID为：" prop="tag" :rules="{ required: true, message: '请输入参数ID', trigger: 'blur' }">
<el-input v-model="form.tag" size="small"></el-input>
</el-form-item>
<el-form-item label="类型名称为：" prop="content_type_name" :rules="{ required: true, message: '请输入类型名称', trigger: 'blur' }">
<el-input v-model="form.content_type_name" size="small"></el-input>
<el-form-item label="类型名称为：" prop="name" :rules="{ required: true, message: '请输入类型名称', trigger: 'blur' }">
<el-input v-model="form.name" size="small"></el-input>
</el-form-item>
</template>
</el-form>
......@@ -53,11 +62,11 @@
</template>
<script>
import TableList from '@/components/TableList'
import { getTypeList, createType, updateType } from '@/api/settings.js'
const defaultForm = {
project_type_name: '',
content_type: '',
query_id: '',
content_type_name: ''
name: '',
category: '',
tag: ''
}
export default {
components: { TableList },
......@@ -71,14 +80,13 @@ export default {
},
columns: [
{ prop: 'id', label: '项目类型ID', slots: 'table-id' },
{ prop: 'type', label: '项目类型' },
{ prop: 'author', label: '创建人' },
{ prop: 'create_time', label: '创建时间' },
{ prop: 'name', label: '项目类型' },
{ prop: 'sso_user', label: '创建人', slots: 'table-creater' },
{ prop: 'created_at', label: '创建时间' },
{ prop: 'tag', label: '参数ID' },
{ prop: 'status', label: '状态', slots: 'table-status' }
],
data: [
{ id: '123', type: '学位教育', author: '张三', create_time: '2021-04-23 09:00:31', status: 1 }
]
data: []
},
// 内容类型
contentTableOptions: {
......@@ -87,25 +95,24 @@ export default {
},
columns: [
{ prop: 'id', label: '内容ID', slots: 'table-id' },
{ prop: 'type_name', label: '类型名称' },
{ prop: 'type', label: '内容类型' },
{ prop: 'author', label: '创建人' },
{ prop: 'create_time', label: '创建时间' },
{ prop: 'query_id', label: '参数ID' },
{ prop: 'name', label: '类型名称' },
{ prop: 'category', label: '内容类型', slots: 'table-category' },
{ prop: 'sso_user', label: '创建人', slots: 'table-creater' },
{ prop: 'created_at', label: '创建时间' },
{ prop: 'tag', label: '参数ID' },
{ prop: 'status', label: '状态', slots: 'table-status' }
],
data: [
{ id: '123', type_name: '最新动态', type: '文章', author: '张三', create_time: '2021-04-23 09:00:31', query_id: '33', status: 1 }
]
data: []
},
contentTypeList: [
{ id: 0, name: '广告' },
{ id: 1, name: '文章' },
{ id: 2, name: '图文' }
{ id: 2, name: '广告' },
{ id: 3, name: '图文' }
],
dialogVisible: false,
dialogType: '',
form: Object.assign({}, defaultForm)
form: Object.assign({}, defaultForm),
selectedId: ''
}
},
computed: {
......@@ -115,20 +122,38 @@ export default {
return text + '类型'
}
},
filters: {
categoryFilter(val) {
let text = '广告'
switch (val) {
case 1:
text = '文章'
break
case 3:
text = '图文'
break
}
return text
}
},
created() {
this.fetchTypeList()
},
methods: {
handleTabClick() {
this.fetchTypeList()
},
handleCreate() {
this.dialogType = 'create'
this.dialogVisible = true
},
handleDetails(val) {
this.dialogType = 'details'
this.dialogType = 'edit'
this.dialogVisible = true
const isProject = this.activeName === '0'
this.selectedId = val.id
this.form = {
project_type_name: isProject ? val.type : '',
content_type: isProject ? '' : val.type,
query_id: isProject ? '' : val.query_id,
content_type_name: isProject ? '' : val.type_name
name: val.name,
category: val.category
}
},
handleDialogClose() {
......@@ -138,10 +163,67 @@ export default {
handleDialogSubmit() {
this.$refs.dialogForm.validate(valid => {
if (valid) {
console.log('dialogForm')
if (this.dialogType === 'create') {
this.fetchCreateType()
} else {
const params = { ...this.form }
delete params.tag
params.type_id = this.selectedId
this.fetchUpdateType(params, 'name')
}
} else {
return false
}
this.handleDialogClose()
})
},
statusChange(val) {
// console.log(val)
this.fetchUpdateType({
type_id: val.id,
status: val.status
}, 'status')
},
fetchCreateType() {
const params = { ...this.form }
!params.category && (params.category = 0)
params.type = this.activeName === '0' ? 0 : 1
createType(params).then((res) => {
if (res.code === 0 && res.data && res.data.id) {
this.fetchTypeList()
this.$message.success('新建类型成功')
} else {
this.$message.error('新建类型失败')
}
}).catch(() => {
this.$message.error('新建类型失败')
})
},
fetchUpdateType(data, type) {
const msg = type === 'status' ? '更改状态' : '更改类型名称'
updateType(data).then((res) => {
if (res.code === 0 && res.data && res.data.status) {
this.fetchTypeList()
this.$message.success(msg + '成功')
} else {
this.$message.error(msg + '失败')
}
}).catch(() => {
this.$message.error(msg + '失败')
})
},
fetchTypeList() {
const params = {
type: this.activeName === '0' ? 0 : 1,
page: 1,
limit: 10
}
getTypeList(params).then((res) => {
if (res.code === 0 && res.data && Array.isArray(res.data.data)) {
const data = res.data.data
if (this.activeName === '0') this.projectTableOptions.data = data
else this.contentTableOptions.data = data
}
})
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论