jiangyy
4 years ago
8 changed files with 1342 additions and 2 deletions
@ -0,0 +1,36 @@ |
|||||
|
export default [ |
||||
|
{ |
||||
|
key: 'categoryName', |
||||
|
title: '分类', |
||||
|
display: ['formA', 'formU', 'table', 'model'], |
||||
|
fixed: false, |
||||
|
block: true, |
||||
|
width: 120 |
||||
|
}, |
||||
|
{ |
||||
|
key: 'title', |
||||
|
title: '标题', |
||||
|
type: 'input', |
||||
|
display: ['formA', 'formU', 'table', 'model'], |
||||
|
fixed: false, |
||||
|
block: true, |
||||
|
width: 150 |
||||
|
}, |
||||
|
{ |
||||
|
key: 'updatedTime', |
||||
|
title: '更新时间', |
||||
|
display: ['formA', 'formU', 'table', 'model'], |
||||
|
fixed: false, |
||||
|
block: true, |
||||
|
width: 80 |
||||
|
}, |
||||
|
{ |
||||
|
key: 'createdName', |
||||
|
title: '创建人', |
||||
|
type: 'input', |
||||
|
display: ['formA', 'formU', 'table', 'model'], |
||||
|
fixed: false, |
||||
|
block: true, |
||||
|
width: 80 |
||||
|
} |
||||
|
] |
||||
@ -0,0 +1,462 @@ |
|||||
|
<template> |
||||
|
<div class="div_main"> |
||||
|
<div class="div_btn"> |
||||
|
|
||||
|
<el-button type="default" |
||||
|
size="mini" |
||||
|
@click="diaCancel">取消返回</el-button> |
||||
|
<el-button v-if="formType!='D'" |
||||
|
type="primary" |
||||
|
size="mini" |
||||
|
@click="saveForm">保存发布</el-button> |
||||
|
|
||||
|
</div> |
||||
|
<div class="div_content"> |
||||
|
<el-form :inline="true" |
||||
|
:model="dataForm" |
||||
|
:rules="dataRule" |
||||
|
ref="dataForm" |
||||
|
:disabled="formType=='D'" |
||||
|
:label-width="'120px'"> |
||||
|
<el-form-item label="标题" |
||||
|
prop="title"> |
||||
|
<el-input class="item_width_1" |
||||
|
v-model="dataForm.title" |
||||
|
placeholder="标题"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="分类" |
||||
|
prop="type"> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="dataForm.categoryId" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in categoryList" |
||||
|
:key="item.categoryId" |
||||
|
:label="item.categoryName" |
||||
|
:value="item.categoryId"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
|
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="发布单位" |
||||
|
prop="unit"> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="dataForm.orgId" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="(item,index) in orgList" |
||||
|
@click.native="orgChange(index)" |
||||
|
:key="item.orgId" |
||||
|
:label="item.orgName" |
||||
|
:value="item.orgId"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
|
||||
|
</el-form> |
||||
|
|
||||
|
<div class="div_editor"> |
||||
|
<el-tabs v-model="activeName" |
||||
|
@tab-click="tabClick"> |
||||
|
<el-tab-pane style="height:500px" |
||||
|
v-for="item in moduleArray" |
||||
|
:key="item.moduleId" |
||||
|
:label="item.moduleName" |
||||
|
:name="item.moduleId"> |
||||
|
<quill-editor :ref="'text'+item.moduleId" |
||||
|
:disabled="formType=='D'" |
||||
|
class="ql-container" |
||||
|
:options="item.editorOption" |
||||
|
@change="onEditorChange" /> |
||||
|
|
||||
|
</el-tab-pane> |
||||
|
</el-tabs> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
<el-form :inline="true" |
||||
|
:model="externalLink" |
||||
|
ref="externalLink" |
||||
|
:disabled="formType=='D'" |
||||
|
:label-width="'120px'"> |
||||
|
|
||||
|
<el-form-item label="外链地址" |
||||
|
prop="externalLink"> |
||||
|
<el-input class="item_width_1" |
||||
|
v-model="externalLink.externalLink" |
||||
|
placeholder="外链地址"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="地址说明" |
||||
|
prop="description"> |
||||
|
<el-input class="item_width_1" |
||||
|
v-model="externalLink.description" |
||||
|
placeholder="地址说明"></el-input> |
||||
|
</el-form-item> |
||||
|
<div> |
||||
|
<el-form-item class="block" |
||||
|
label="附件" |
||||
|
prop="attach"> |
||||
|
<el-upload class="upload-demo" |
||||
|
:action="uploadUlr" |
||||
|
:on-success="handleAvatarSuccess" |
||||
|
:on-change="handleChange" |
||||
|
:file-list="fileList"> |
||||
|
<el-button size="small" |
||||
|
type="primary">点击上传</el-button> |
||||
|
<div slot="tip" |
||||
|
class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> |
||||
|
</el-upload> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from 'vuex' |
||||
|
import { Loading } from 'element-ui' // 引入Loading服务 |
||||
|
import { requestPost } from '@/js/dai/request' |
||||
|
|
||||
|
import 'quill/dist/quill.core.css' |
||||
|
import 'quill/dist/quill.snow.css' |
||||
|
import 'quill/dist/quill.bubble.css' |
||||
|
|
||||
|
import { quillEditor } from 'vue-quill-editor' |
||||
|
|
||||
|
let loading// 加载动画 |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
|
||||
|
formType: '', // 操作类型A/U D(详情) |
||||
|
guideId: '', // 父组件传来功能id |
||||
|
categoryList: [], |
||||
|
orgList: [], |
||||
|
|
||||
|
dataForm: { |
||||
|
guideId: '', |
||||
|
title: '', |
||||
|
categoryId: '', |
||||
|
orgId: '', |
||||
|
orgType: '', |
||||
|
orgName: '', |
||||
|
moduleList: [], |
||||
|
externalLinks: [], |
||||
|
attachmentList: [] |
||||
|
}, |
||||
|
externalLink: { |
||||
|
externalLink: "", |
||||
|
description: "" |
||||
|
}, |
||||
|
|
||||
|
content: '', |
||||
|
editorOption: { |
||||
|
placeholder: '编辑文章内容' |
||||
|
}, |
||||
|
activeName: "", |
||||
|
moduleArray: [], |
||||
|
selTabIndex: 0, |
||||
|
|
||||
|
fileList: [{ |
||||
|
name: 'food.jpeg', |
||||
|
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' |
||||
|
}, { |
||||
|
name: 'food2.jpeg', |
||||
|
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' |
||||
|
}], |
||||
|
uploadUlr: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2', |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
mounted () { |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
|
||||
|
async initData (guideId, type) { |
||||
|
this.formType = type |
||||
|
this.guideId = guideId |
||||
|
|
||||
|
if (type === 'A') { |
||||
|
this.resetData() |
||||
|
|
||||
|
} else { |
||||
|
this.dataForm.guideId = guideId |
||||
|
this.loadFormData() |
||||
|
} |
||||
|
await this.loadOrg() |
||||
|
await this.getcategory() |
||||
|
await this.loadModule() |
||||
|
}, |
||||
|
|
||||
|
async getcategory () { |
||||
|
// const url = '/gov/guide/guideccategory/getcategory' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidecategory/getcategory' |
||||
|
|
||||
|
const params = { |
||||
|
queryOrigin: 'saveorupdate' |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.categoryList = data |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async loadOrg () { |
||||
|
// const url = '/gov/org/staff/orgList' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/org/staff/orgList' |
||||
|
|
||||
|
const params = {} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.orgList = data |
||||
|
if (data.length > 0) { |
||||
|
this.dataForm.orgId = data[0].orgId |
||||
|
this.dataForm.orgType = data[0].orgType |
||||
|
this.dataForm.orgName = data[0].orgName |
||||
|
} |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//获取模块tab |
||||
|
async loadModule () { |
||||
|
// const url = '/gov/voice/guidemodule/list' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidemodule/list' |
||||
|
|
||||
|
const params = {} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.moduleArray = data |
||||
|
|
||||
|
this.moduleArray.forEach(element => { |
||||
|
element.editorOption = { |
||||
|
placeholder: '输入' + element.moduleName |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
if (data.length > 0) { |
||||
|
this.activeName = data[0].moduleId |
||||
|
} |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//单位下拉框改变 |
||||
|
orgChange (index) { |
||||
|
console.log(index) |
||||
|
this.dataForm.orgName = this.orgList[index].orgName |
||||
|
this.dataForm.orgType = this.orgList[index].orgType |
||||
|
}, |
||||
|
|
||||
|
tabClick (selTab) { |
||||
|
console.log(selTab.index) |
||||
|
this.selTabIndex = selTab.index |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
onEditorChange ({ editor, html, text }) { |
||||
|
this.moduleArray[this.selTabIndex].moduleContent = html |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
async loadFormData () { |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guide/detail' |
||||
|
// const url = '/gov/voice/guide/detail' |
||||
|
let _data = { |
||||
|
guideId: this.guideId |
||||
|
} |
||||
|
const params = {} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.dataForm = data |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
saveForm () { |
||||
|
|
||||
|
this.dataForm.moduleList = [] |
||||
|
this.moduleArray.forEach(element => { |
||||
|
if (element.moduleContent) { |
||||
|
this.dataForm.moduleList.push(element) |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
if (this.externalLink.externalLink && this.externalLink.description) { |
||||
|
this.dataForm.externalLinks = [] |
||||
|
this.dataForm.externalLinks.push(this.externalLink) |
||||
|
} else if (!this.externalLink.externalLink && !this.externalLink.description) { |
||||
|
this.dataForm.externalLinks = [] |
||||
|
} else { |
||||
|
this.$message({ |
||||
|
type: 'error', |
||||
|
message: '链接地址和地址说明必须同时填写' |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
console.log(this.dataForm) |
||||
|
|
||||
|
return false |
||||
|
this.$refs['dataForm'].validate((valid, messageObj) => { |
||||
|
|
||||
|
if (!valid) { |
||||
|
app.util.validateRule(messageObj) |
||||
|
} else { |
||||
|
let url = '' |
||||
|
|
||||
|
if (this.type === 'U') { |
||||
|
// url = '/gov/voice/guide/update' |
||||
|
url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guide/update' |
||||
|
} else { |
||||
|
// url="/gov/voice/guide/add" |
||||
|
url = "http://yapi.elinkservice.cn/mock/102/gov/voice/guide/add" |
||||
|
|
||||
|
|
||||
|
} |
||||
|
window.app.ajax.post(url, this.dataForm, |
||||
|
(data, rspMsg) => { |
||||
|
this.$message({ |
||||
|
type: 'success', |
||||
|
message: '保存成功' |
||||
|
}) |
||||
|
this.$emit('dialogOk') |
||||
|
this.visible = false |
||||
|
}, |
||||
|
(rspMsg, data) => { |
||||
|
this.endLoading() |
||||
|
this.$message.error(rspMsg) |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
handleClose () { |
||||
|
this.visible = false |
||||
|
}, |
||||
|
resetData () { |
||||
|
this.dataForm = { |
||||
|
guideId: '', |
||||
|
title: '', |
||||
|
categoryId: '', |
||||
|
orgId: '', |
||||
|
orgType: '', |
||||
|
orgName: '', |
||||
|
moduleList: [], |
||||
|
externalLinks: [], |
||||
|
attachmentList: [] |
||||
|
} |
||||
|
}, |
||||
|
// 取消 |
||||
|
diaCancel () { |
||||
|
this.resetData() |
||||
|
this.$emit('cancleBack') |
||||
|
}, |
||||
|
|
||||
|
handleChange (file, fileList) { |
||||
|
this.fileList = fileList.slice(-3); |
||||
|
}, |
||||
|
|
||||
|
handleAvatarSuccess (res, file) { |
||||
|
if (res.code === 0 && res.msg === 'success') { |
||||
|
this.dataForm2.logo = res.data.url |
||||
|
} else this.$message.error(res.msg) |
||||
|
}, |
||||
|
// 开启加载动画 |
||||
|
startLoading () { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: '正在加载……', // 加载中需要显示的文字 |
||||
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
||||
|
}) |
||||
|
}, |
||||
|
// 结束加载动画 |
||||
|
endLoading () { |
||||
|
// clearTimeout(timer); |
||||
|
if (loading) { |
||||
|
loading.close() |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
components: { |
||||
|
quillEditor |
||||
|
|
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
type: [ |
||||
|
{ required: true, message: '分类不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
unit: [ |
||||
|
{ required: true, message: '发布单位不能为空', trigger: 'blur' } |
||||
|
|
||||
|
], |
||||
|
title: [ |
||||
|
{ required: true, message: '标题不能为空', trigger: 'blur' } |
||||
|
|
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
...mapGetters(['clientHeight', 'resolution']), |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="css" scoped> |
||||
|
.div_btn { |
||||
|
z-index: 10; |
||||
|
position: absolute; |
||||
|
right: 50px; |
||||
|
top: 20px; |
||||
|
/* margin: 0 0 20px 0; */ |
||||
|
} |
||||
|
|
||||
|
.div_editor { |
||||
|
margin-left: 60px; |
||||
|
width: 90%; |
||||
|
} |
||||
|
|
||||
|
.div_editor >>> .el-tabs--card > .el-tabs__header .el-tabs__nav { |
||||
|
border: none; |
||||
|
} |
||||
|
.el-tabs__nav-wrap::after { |
||||
|
background-color: white; |
||||
|
} |
||||
|
.el-tabs__active-bar { |
||||
|
background-color: white; |
||||
|
} |
||||
|
|
||||
|
.div_content { |
||||
|
margin-top: 30px; |
||||
|
} |
||||
|
|
||||
|
.item_width_1 { |
||||
|
width: 300px; |
||||
|
} |
||||
|
.item_width_2 { |
||||
|
width: 500px; |
||||
|
} |
||||
|
.block { |
||||
|
display: block; |
||||
|
} |
||||
|
</style> |
||||
|
|
||||
|
<style> |
||||
|
.aui-content .ql-container { |
||||
|
height: 400px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,352 @@ |
|||||
|
<template> |
||||
|
<div class="role-container"> |
||||
|
<el-card class="flex1"> |
||||
|
|
||||
|
<div v-if="isManager"> |
||||
|
上下拖动可改变角色顺序 |
||||
|
<el-button style="margin-left:10px" |
||||
|
type="primary" |
||||
|
size="small" |
||||
|
@click="handleSaveSort">保存顺序</el-button> |
||||
|
<el-button type="primary" |
||||
|
size="small" |
||||
|
@click="handleAdd">新增</el-button> |
||||
|
</div> |
||||
|
<el-table ref="roleTable" |
||||
|
v-loading="loading1" |
||||
|
:data="tableData" |
||||
|
row-key="roleKey" |
||||
|
border |
||||
|
style="width: 100%;margin-top:20px"> |
||||
|
<el-table-column type="index" |
||||
|
header-align="left" |
||||
|
align="left" |
||||
|
width="50"></el-table-column> |
||||
|
|
||||
|
<el-table-column prop="categoryName" |
||||
|
header-align="left" |
||||
|
align="left" |
||||
|
label="分类名称" |
||||
|
width="150"></el-table-column> |
||||
|
|
||||
|
<el-table-column prop="status" |
||||
|
label="状态" |
||||
|
header-align="left" |
||||
|
align="left"> |
||||
|
<template slot-scope="scope"> |
||||
|
<p style="color:red" |
||||
|
v-if="scope.row.status==='disable'">{{'禁用'}}</p> |
||||
|
<p v-else>{{'启用'}}</p> |
||||
|
|
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column v-if="isManager" |
||||
|
width="450" |
||||
|
label="操作"> |
||||
|
<template slot-scope="scope"> |
||||
|
|
||||
|
<el-button v-if="scope.row.status==='enable'" |
||||
|
type="primary" |
||||
|
size="mini" |
||||
|
@click="handelChangeState(scope.row,'disable')">禁用</el-button> |
||||
|
<el-button v-if="scope.row.status==='disable'" |
||||
|
type="primary" |
||||
|
size="mini" |
||||
|
@click="handelChangeState(scope.row,'enable')">启用</el-button> |
||||
|
|
||||
|
<el-button type="primary" |
||||
|
size="mini" |
||||
|
@click="handleEdit(scope.row.roleKey, scope.row.roleName)">修改</el-button> |
||||
|
|
||||
|
<el-button type="primary" |
||||
|
size="mini" |
||||
|
@click="handleDel(scope.row)">删除</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
|
||||
|
</el-card> |
||||
|
|
||||
|
<!-- 修改弹出框 --> |
||||
|
<el-dialog :visible.sync="diaShow" |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
:title="diaTitle" |
||||
|
width="30%" |
||||
|
@closed="diaClose"> |
||||
|
<div class="div_duty" |
||||
|
v-if="diaShow"> |
||||
|
<span> 分类名称 </span> |
||||
|
<el-input style="margin-top:20px" |
||||
|
type="textarea" |
||||
|
:rows="2" |
||||
|
v-model="categoryName"></el-input> |
||||
|
<div class="div_btn"> |
||||
|
<el-button type="primary" |
||||
|
size="small" |
||||
|
@click="saveCategory()">保存</el-button> |
||||
|
<el-button size="small" |
||||
|
@click="diaShow=false">取消</el-button> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import Sortable from 'sortablejs' |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
|
||||
|
export default { |
||||
|
name: 'RoleList', |
||||
|
props: {}, |
||||
|
data () { |
||||
|
return { |
||||
|
loading1: false, |
||||
|
|
||||
|
selCategoryId: '', |
||||
|
tableData: [], |
||||
|
isManager: false, |
||||
|
|
||||
|
//弹出框相关 |
||||
|
diaTitle: '新增分类', |
||||
|
categoryName: '', |
||||
|
diaShow: false, |
||||
|
|
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
mounted () { |
||||
|
this.loadList() |
||||
|
this.dragRoleSort() |
||||
|
|
||||
|
const roleList = this.$store.state.user.roleList |
||||
|
console.log(this.$store.state.user.roleList) |
||||
|
if (roleList.indexOf('root_manager') > -1) { |
||||
|
this.isManager = true |
||||
|
} else { |
||||
|
this.isManager = false |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
|
||||
|
//获取分类列表 |
||||
|
async loadList () { |
||||
|
console.log(this.description) |
||||
|
// const url = "/gov/voice/guideccategory/getcategory" |
||||
|
const url = "/gov/voice/guidecategory/page" |
||||
|
const params = { |
||||
|
} |
||||
|
const { data, code, msg } = await requestGet(url, params) |
||||
|
if (code === 0) { |
||||
|
this.tableData = data.list |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//新增 |
||||
|
handleAdd () { |
||||
|
this.diaTitle = '新增分类' |
||||
|
this.diaShow = true |
||||
|
this.categoryName = '' |
||||
|
this.selCategoryId = '' |
||||
|
}, |
||||
|
//编辑 |
||||
|
handleEdit (row) { |
||||
|
this.diaTitle = '编辑分类' |
||||
|
this.diaShow = true |
||||
|
this.selCategoryId = row.id |
||||
|
this.categoryName = row.categoryName |
||||
|
}, |
||||
|
|
||||
|
//保存分类 |
||||
|
async saveCategory () { |
||||
|
const url = "/gov/voice/guideccategory/update" |
||||
|
let params = {} |
||||
|
if (this.selCategoryId) { |
||||
|
params = { |
||||
|
categoryId: this.selCategoryId, |
||||
|
categoryName: this.categoryName |
||||
|
} |
||||
|
} else { |
||||
|
params = { |
||||
|
categoryName: this.categoryName |
||||
|
} |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.loadList() |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//修改状态 |
||||
|
async handelChangeState (row, state) { |
||||
|
|
||||
|
const url = "/gov/voice/guideccategory/disable" |
||||
|
const params = { |
||||
|
status: state, |
||||
|
categoryId: row.id |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.loadList() |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//删除分类 |
||||
|
async handelDel (row) { |
||||
|
const url = "/gov/voice/guidecategory" |
||||
|
const params = { |
||||
|
categoryId: row.id |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.loadList() |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
//关闭角色职责弹出框 |
||||
|
diaClose () { |
||||
|
this.selCategoryId = '' |
||||
|
this.diaTitle = '' |
||||
|
this.categoryName = '' |
||||
|
this.diaShow = false |
||||
|
}, |
||||
|
|
||||
|
//显示角色职责弹出框 |
||||
|
handelChangeDuty (row) { |
||||
|
this.selCategoryId = row.id |
||||
|
this.description = row.description |
||||
|
this.roleName = row.roleName |
||||
|
this.diaShow = true |
||||
|
}, |
||||
|
handleChangeName (row) { |
||||
|
row.isEdit = true |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
//保存角色名称、职责 |
||||
|
async updateRole () { |
||||
|
console.log(this.description) |
||||
|
const url = "/epmetuser/govstaffrole/updatedefaultrole" |
||||
|
const params = { |
||||
|
roleId: this.selCategoryId, |
||||
|
roleName: this.roleName, |
||||
|
description: this.description |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.diaShow = false |
||||
|
this.loadList() |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
//点击功能权限按钮 |
||||
|
toOperationConfig (roleKey, roleName) { |
||||
|
this.roleName = roleName |
||||
|
this.funcShow = true |
||||
|
this.opeList = [] |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
|
||||
|
dragRoleSort () { |
||||
|
const el = this.$refs.roleTable.$el.querySelectorAll('.el-table__body-wrapper > table > tbody')[0] |
||||
|
this.sortTable = Sortable.create(el, { |
||||
|
group: 'dragTable', |
||||
|
ghostClass: 'sortable-ghost', // Class name for the drop placeholder, |
||||
|
// setData: function(dataTransfer, dragEl) { |
||||
|
// dataTransfer.setData("Text", dragEl.textContent); |
||||
|
// }, |
||||
|
delay: 0, |
||||
|
onChange: evt => { |
||||
|
// console.log(evt) |
||||
|
}, |
||||
|
onEnd: evt => { |
||||
|
const targetRow = this.tableData.splice(evt.oldIndex, 1)[0] |
||||
|
this.tableData.splice(evt.newIndex, 0, targetRow) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
//保存顺序 |
||||
|
handleSaveSort () { |
||||
|
let data = { |
||||
|
roleIdList: this.tableData.map(item => { |
||||
|
return item.id |
||||
|
}) |
||||
|
} |
||||
|
this.$http |
||||
|
.post('/epmetuser/govstaffrole/savedefaultsort', data) |
||||
|
.then(({ data: res }) => { |
||||
|
console.log('ressss', res) |
||||
|
if (res.code === 0 && res.msg === 'success') { |
||||
|
this.$message({ |
||||
|
type: 'success', |
||||
|
message: '保存成功' |
||||
|
}) |
||||
|
this.loadList() |
||||
|
} else { |
||||
|
this.$message({ |
||||
|
type: 'error', |
||||
|
message: res.msg |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.role-container, |
||||
|
.role-flex { |
||||
|
display: flex; |
||||
|
} |
||||
|
.flex1 { |
||||
|
flex: 1; |
||||
|
} |
||||
|
.now-name { |
||||
|
/* display: flex; |
||||
|
justify-content: space-between; */ |
||||
|
margin-bottom: 10px; |
||||
|
margin-left: 10px; |
||||
|
} |
||||
|
.aui-wrapper .el-card + .el-card { |
||||
|
margin-top: 0; |
||||
|
} |
||||
|
.role-container .el-dialog__body { |
||||
|
padding: 0 20px 20px; |
||||
|
} |
||||
|
.div_duty { |
||||
|
height: 300px; |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
.div_btn { |
||||
|
position: absolute; |
||||
|
bottom: 30px; |
||||
|
right: 15px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,482 @@ |
|||||
|
<template> |
||||
|
<div class="registerList"> |
||||
|
<el-card shadow="never" |
||||
|
class="aui-card--fill"> |
||||
|
<div v-show="!formShow" |
||||
|
class="mod-demo__demo}"> |
||||
|
<el-form :inline="true" |
||||
|
:model="tableParams" |
||||
|
@keyup.enter.native="loadData()"> |
||||
|
<div> |
||||
|
<el-form-item label="所属组织" |
||||
|
:label-width="labelWidth"> |
||||
|
<el-cascader v-model="tableParams.agencyId" |
||||
|
style="width:480px" |
||||
|
:options="options" |
||||
|
:props="optionProps" |
||||
|
clearable></el-cascader> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
|
||||
|
<div> |
||||
|
<el-form-item label="问题分类" |
||||
|
:label-width="labelWidth"> |
||||
|
<el-select v-model="tableParams.categoryId" |
||||
|
placeholder="问题分类" |
||||
|
clearable> |
||||
|
<el-option v-for="item in categoryList" |
||||
|
:key="item.categoryId" |
||||
|
:label="item.categoryName" |
||||
|
:value="item.categoryId"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="标题" |
||||
|
:label-width="labelWidth"> |
||||
|
<el-input v-model="tableParams.guideTitle" |
||||
|
placeholder="标题" |
||||
|
clearable> |
||||
|
|
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item style="margin-left:10px"> |
||||
|
<el-button @click="loadData()" |
||||
|
type="primary">查询</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item style="margin-left:10px"> |
||||
|
<el-button @click="add()" |
||||
|
type="primary">新增</el-button> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
|
||||
|
<c-table column-type="index" |
||||
|
ref="table" |
||||
|
:url="tableUrl" |
||||
|
:params="tableParams" |
||||
|
:operationWidth="80" |
||||
|
keyword="guidanceList" |
||||
|
:operations="operations" |
||||
|
:tableHeight="tableHeight" |
||||
|
@detail="detail" |
||||
|
@edit="edit" |
||||
|
@del="del"> |
||||
|
</c-table> |
||||
|
</div> |
||||
|
|
||||
|
<div v-show="formShow"> |
||||
|
<detail-form ref="ref_edit_form" |
||||
|
@cancleBack="cancleBack" |
||||
|
@refresh="loadData"></detail-form> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import CTable from '@c/CTable' |
||||
|
import DetailForm from './DetailForm' |
||||
|
import { mapGetters } from 'vuex' |
||||
|
import { Loading } from 'element-ui' // 引入Loading服务 |
||||
|
import { requestPost } from '@/js/dai/request' |
||||
|
|
||||
|
let loading // 加载动画 |
||||
|
const customerId = localStorage.getItem('customerId') |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
//查询条件标题宽度 |
||||
|
labelWidth: '70px', |
||||
|
formShow: false, |
||||
|
|
||||
|
optionProps: { |
||||
|
value: 'agencyId', |
||||
|
label: 'agencyName', |
||||
|
children: 'subAgencyList', |
||||
|
checkStrictly: true |
||||
|
}, |
||||
|
options: [ |
||||
|
{ |
||||
|
agencyId: 'zhinan', |
||||
|
agencyName: '指南', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'shejiyuanze', |
||||
|
agencyName: '设计原则', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'yizhi', |
||||
|
agencyName: '一致' |
||||
|
}, { |
||||
|
agencyId: 'fankui', |
||||
|
agencyName: '反馈' |
||||
|
}, { |
||||
|
agencyId: 'xiaolv', |
||||
|
agencyName: '效率' |
||||
|
}, { |
||||
|
agencyId: 'kekong', |
||||
|
agencyName: '可控' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'daohang', |
||||
|
agencyName: '导航', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'cexiangdaohang', |
||||
|
agencyName: '侧向导航' |
||||
|
}, { |
||||
|
agencyId: 'dingbudaohang', |
||||
|
agencyName: '顶部导航' |
||||
|
}] |
||||
|
}] |
||||
|
}, |
||||
|
{ |
||||
|
agencyId: 'zujian', |
||||
|
agencyName: '组件', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'basic', |
||||
|
agencyName: 'Basic', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'layout', |
||||
|
agencyName: 'Layout 布局' |
||||
|
}, { |
||||
|
agencyId: 'color', |
||||
|
agencyName: 'Color 色彩' |
||||
|
}, { |
||||
|
agencyId: 'typography', |
||||
|
agencyName: 'Typography 字体' |
||||
|
}, { |
||||
|
agencyId: 'icon', |
||||
|
agencyName: 'Icon 图标' |
||||
|
}, { |
||||
|
agencyId: 'button', |
||||
|
agencyName: 'Button 按钮' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'form', |
||||
|
agencyName: 'Form', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'radio', |
||||
|
agencyName: 'Radio 单选框' |
||||
|
}, { |
||||
|
agencyId: 'checkbox', |
||||
|
agencyName: 'Checkbox 多选框' |
||||
|
}, { |
||||
|
agencyId: 'input', |
||||
|
agencyName: 'Input 输入框' |
||||
|
}, { |
||||
|
agencyId: 'input-number', |
||||
|
agencyName: 'InputNumber 计数器' |
||||
|
}, { |
||||
|
agencyId: 'select', |
||||
|
agencyName: 'Select 选择器' |
||||
|
}, { |
||||
|
agencyId: 'cascader', |
||||
|
agencyName: 'Cascader 级联选择器' |
||||
|
}, { |
||||
|
agencyId: 'switch', |
||||
|
agencyName: 'Switch 开关' |
||||
|
}, { |
||||
|
agencyId: 'slider', |
||||
|
agencyName: 'Slider 滑块' |
||||
|
}, { |
||||
|
agencyId: 'time-picker', |
||||
|
agencyName: 'TimePicker 时间选择器' |
||||
|
}, { |
||||
|
agencyId: 'date-picker', |
||||
|
agencyName: 'DatePicker 日期选择器' |
||||
|
}, { |
||||
|
agencyId: 'datetime-picker', |
||||
|
agencyName: 'DateTimePicker 日期时间选择器' |
||||
|
}, { |
||||
|
agencyId: 'upload', |
||||
|
agencyName: 'Upload 上传' |
||||
|
}, { |
||||
|
agencyId: 'rate', |
||||
|
agencyName: 'Rate 评分' |
||||
|
}, { |
||||
|
agencyId: 'form', |
||||
|
agencyName: 'Form 表单' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'data', |
||||
|
agencyName: 'Data', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'table', |
||||
|
agencyName: 'Table 表格' |
||||
|
}, { |
||||
|
agencyId: 'tag', |
||||
|
agencyName: 'Tag 标签' |
||||
|
}, { |
||||
|
agencyId: 'progress', |
||||
|
agencyName: 'Progress 进度条' |
||||
|
}, { |
||||
|
agencyId: 'tree', |
||||
|
agencyName: 'Tree 树形控件' |
||||
|
}, { |
||||
|
agencyId: 'pagination', |
||||
|
agencyName: 'Pagination 分页' |
||||
|
}, { |
||||
|
agencyId: 'badge', |
||||
|
agencyName: 'Badge 标记' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'notice', |
||||
|
agencyName: 'Notice', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'alert', |
||||
|
agencyName: 'Alert 警告' |
||||
|
}, { |
||||
|
agencyId: 'loading', |
||||
|
agencyName: 'Loading 加载' |
||||
|
}, { |
||||
|
agencyId: 'message', |
||||
|
agencyName: 'Message 消息提示' |
||||
|
}, { |
||||
|
agencyId: 'message-box', |
||||
|
agencyName: 'MessageBox 弹框' |
||||
|
}, { |
||||
|
agencyId: 'notification', |
||||
|
agencyName: 'Notification 通知' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'navigation', |
||||
|
agencyName: 'Navigation', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'menu', |
||||
|
agencyName: 'NavMenu 导航菜单' |
||||
|
}, { |
||||
|
agencyId: 'tabs', |
||||
|
agencyName: 'Tabs 标签页' |
||||
|
}, { |
||||
|
agencyId: 'breadcrumb', |
||||
|
agencyName: 'Breadcrumb 面包屑' |
||||
|
}, { |
||||
|
agencyId: 'dropdown', |
||||
|
agencyName: 'Dropdown 下拉菜单' |
||||
|
}, { |
||||
|
agencyId: 'steps', |
||||
|
agencyName: 'Steps 步骤条' |
||||
|
}] |
||||
|
}, { |
||||
|
agencyId: 'others', |
||||
|
agencyName: 'Others', |
||||
|
subAgencyList: [{ |
||||
|
agencyId: 'dialog', |
||||
|
agencyName: 'Dialog 对话框' |
||||
|
}, { |
||||
|
agencyId: 'tooltip', |
||||
|
agencyName: 'Tooltip 文字提示' |
||||
|
}, { |
||||
|
agencyId: 'popover', |
||||
|
agencyName: 'Popover 弹出框' |
||||
|
}, { |
||||
|
agencyId: 'card', |
||||
|
agencyName: 'Card 卡片' |
||||
|
}, { |
||||
|
agencyId: 'carousel', |
||||
|
agencyName: 'Carousel 走马灯' |
||||
|
}, { |
||||
|
agencyId: 'collapse', |
||||
|
agencyName: 'Collapse 折叠面板' |
||||
|
}] |
||||
|
}] |
||||
|
} |
||||
|
], |
||||
|
categoryList: [], |
||||
|
|
||||
|
|
||||
|
// 列表相关 |
||||
|
// tableUrl: '/gov/guide/guide/list', |
||||
|
tableUrl: 'http://yapi.elinkservice.cn/mock/102/gov/voice/guide/list', |
||||
|
tableParams: { |
||||
|
agencyId: '', // |
||||
|
categoryId: '', //分类 |
||||
|
guideTitle: '' //标题 |
||||
|
}, |
||||
|
|
||||
|
operations: [ |
||||
|
{ |
||||
|
lable: '详情', // 按钮显示名称 |
||||
|
size: 'mini', |
||||
|
style: 'margin: 0 6px;', |
||||
|
type: 'text', |
||||
|
slot: '', |
||||
|
plain: false, |
||||
|
methodName: 'detail', // 回调方法名称 |
||||
|
isShow: (row) => { |
||||
|
return true |
||||
|
} |
||||
|
}, |
||||
|
{ |
||||
|
lable: '编辑', // 按钮显示名称 |
||||
|
size: 'mini', |
||||
|
style: 'margin: 0 6px;', |
||||
|
type: 'text', |
||||
|
slot: '', |
||||
|
plain: false, |
||||
|
methodName: 'edit', // 回调方法名称 |
||||
|
isShow: (row) => { |
||||
|
return true |
||||
|
// if (row.initState === 1) { |
||||
|
// return true |
||||
|
// } else { |
||||
|
// return false |
||||
|
// } |
||||
|
} |
||||
|
}, |
||||
|
{ |
||||
|
lable: '删除', // 按钮显示名称 |
||||
|
size: 'mini', |
||||
|
style: 'margin: 0 6px;', |
||||
|
type: 'text', |
||||
|
slot: '', |
||||
|
plain: false, |
||||
|
methodName: 'del', // 回调方法名称 |
||||
|
isShow: (row) => { |
||||
|
return true |
||||
|
} |
||||
|
} |
||||
|
], |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
CTable, |
||||
|
DetailForm |
||||
|
}, |
||||
|
activated () { |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.table.doLayout() // 解决表格错位 |
||||
|
}) |
||||
|
}, |
||||
|
mounted () { |
||||
|
this.initData() |
||||
|
console.log(customerId) |
||||
|
}, |
||||
|
computed: { |
||||
|
tableHeight () { |
||||
|
return this.clientHeight - 60 - 80 - 80 - 100 |
||||
|
}, |
||||
|
|
||||
|
...mapGetters(['clientHeight', 'env']) |
||||
|
}, |
||||
|
methods: { |
||||
|
async initData () { |
||||
|
this.startLoading() |
||||
|
await this.getAgencylist()//获取组织级别 |
||||
|
await this.getcategory()//获取分类 |
||||
|
await this.loadData()//获取指南列表 |
||||
|
this.endLoading() |
||||
|
}, |
||||
|
|
||||
|
loadData () { |
||||
|
this.$refs.table.loadData() |
||||
|
}, |
||||
|
|
||||
|
//新增 |
||||
|
add () { |
||||
|
this.formShow = true |
||||
|
this.$refs['ref_edit_form'].initData("", "A") |
||||
|
}, |
||||
|
|
||||
|
// 详情 |
||||
|
detail (row) { |
||||
|
this.formShow = true |
||||
|
this.$refs['ref_edit_form'].initData(row.guideId, "D") |
||||
|
}, |
||||
|
|
||||
|
edit (row) { |
||||
|
this.formShow = true |
||||
|
this.$refs['ref_edit_form'].initData(row.guideId, "U") |
||||
|
}, |
||||
|
async del (row) { |
||||
|
// const url = '/gov/voice/guidecategory/delete' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidecategory/delete' |
||||
|
|
||||
|
const params = { |
||||
|
categoryId: row.guideId |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.$message.success("删除成功") |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
cancleBack () { |
||||
|
this.formShow = false |
||||
|
}, |
||||
|
|
||||
|
async getAgencylist () { |
||||
|
// const url = '/gov/org/agency/agencylist' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/org/agency/agencylist' |
||||
|
|
||||
|
const params = {} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.options = [] |
||||
|
this.options.push(data) |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async getcategory () { |
||||
|
// const url = '/gov/guide/guideccategory/getcategory' |
||||
|
const url = 'http://yapi.elinkservice.cn/mock/102/gov/voice/guidecategory/getcategory' |
||||
|
|
||||
|
const params = { |
||||
|
queryOrigin: 'query' |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.categoryList = data |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 开启加载动画 |
||||
|
startLoading () { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: '正在加载……', // 加载中需要显示的文字 |
||||
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
||||
|
}) |
||||
|
}, |
||||
|
// 结束加载动画 |
||||
|
endLoading () { |
||||
|
// clearTimeout(timer); |
||||
|
if (loading) { |
||||
|
loading.close() |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="css" scoped> |
||||
|
.myNote { |
||||
|
display: -webkit-box; |
||||
|
text-overflow: ellipsis; |
||||
|
overflow: hidden; |
||||
|
-webkit-line-clamp: 3; |
||||
|
-webkit-box-orient: vertical; |
||||
|
} |
||||
|
/* .register .el-table .el-table__header-wrapper { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
}*/ |
||||
|
/* |
||||
|
.register .el-table .el-table__fixed-body-wrapper { |
||||
|
height: calc(100% - 44px); |
||||
|
margin-top: 44px; |
||||
|
overflow-y: auto !important; |
||||
|
} */ |
||||
|
</style> |
||||
|
|
||||
Loading…
Reference in new issue