123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663 |
- <template>
- <div class="data-info">
- <el-card>
- <el-form
- :model="dataForm"
- :rules="dataRule"
- ref="dataRef"
- label-width="140px"
- >
- <el-form-item label="角色名称:" prop="name">
- <el-input v-model="dataForm.name"></el-input>
- </el-form-item>
- <el-form-item label="是否为管理员:" prop="is_admin">
- <el-select
- v-model="dataForm.is_admin"
- placeholder="请选择是否为管理员"
- size="large"
- style="width: 100%"
- @change="selChange"
- >
- <el-option
- v-for="item in adminOptions"
- :key="item.status"
- :label="item.name"
- :value="item.status"
- />
- </el-select>
- </el-form-item>
- <el-row>
- <el-col :span="6">
- <el-form-item label="权限配置:">
- <div
- style="
- width: 100%;
- height: 300px;
- overflow: hidden;
- overflow-y: auto;
- padding: 10px;
- "
- >
- <el-checkbox
- v-model="allChecked.nodeTree"
- @change="(val) => handleCheckAllChange('nodeTree', val)"
- >全选</el-checkbox
- >
- <el-tree
- ref="nodeTree"
- style="max-width: 600px"
- :props="treeProps"
- :data="treeData"
- default-expand-all
- node-key="value"
- show-checkbox
- @check="handleNodeCheck"
- />
- </div>
- </el-form-item>
- </el-col>
- <el-col :span="6">
- <el-form-item label="模板分类授权:">
- <div
- style="
- width: 100%;
- height: 150px;
- overflow: hidden;
- overflow-y: auto;
- padding: 10px;
- "
- >
- <el-tree
- ref="templateCate"
- style="max-width: 600px"
- :props="defaultProps"
- :data="templateCate"
- default-expand-all
- node-key="id"
- :default-checked-keys="defaultCheckedKeys.templateCate"
- show-checkbox
- @check="handleTemplateCheck"
- />
- </div>
- </el-form-item>
- </el-col>
- <el-col :span="6">
- <el-form-item label="文档分类授权:">
- <div
- style="
- width: 100%;
- height: 150px;
- overflow: hidden;
- overflow-y: auto;
- padding: 10px;
- "
- >
- <el-tree
- ref="docCate"
- style="max-width: 600px"
- :props="defaultProps"
- :data="documentCate"
- default-expand-all
- :default-checked-keys="defaultCheckedKeys.documentCate"
- node-key="id"
- show-checkbox
- @check="handleDocCheck"
- />
- </div>
- </el-form-item>
- </el-col>
- <el-col :span="6">
- <el-form-item label="原始数据分类授权:">
- <div
- style="
- width: 100%;
- height: 150px;
- overflow: hidden;
- overflow-y: auto;
- padding: 10px;
- "
- >
- <el-tree
- ref="sourceDataTree"
- style="max-width: 600px"
- :props="defaultProps"
- :data="sourceDataCate"
- default-expand-all
- node-key="id"
- show-checkbox
- :default-checked-keys="defaultCheckedKeys.sourceDataCate"
- @check="handleSourceDataCheck"
- />
- </div>
- </el-form-item>
- </el-col>
- </el-row>
- <el-form-item label="角色状态:">
- <el-select
- v-model="dataForm.status"
- placeholder="请选择状态"
- size="large"
- style="width: 100%"
- >
- <el-option
- v-for="item in statusOptions"
- :key="item.status"
- :label="item.name"
- :value="item.status"
- />
- </el-select>
- </el-form-item>
- <el-form-item label="介绍:">
- <el-input type="textarea" v-model="dataForm.intro"></el-input>
- </el-form-item>
- </el-form>
- </el-card>
- <div style="text-align: right; margin-top: 20px">
- <el-button type="warning" @click="btnSave">确认保存</el-button>
- </div>
- </div>
- </template>
- <script>
- import {
- createAdminRole,
- updateAdminRole,
- getAdminRoleInfo,
- selectPermissions,
- } from "@/api/AdminRole";
- import { searchDocumentCategory } from "@/api/document";
- import { searchSourceDataCategory } from "@/api/sourceData";
- import { searchAdminAuth } from "@/api/AdminAuth";
- import { getAllCategory } from "@/api/template";
- export default {
- emits: ["onClose"],
- props: {
- dataId: {
- type: Number,
- default: 0,
- },
- },
- watch: {
- dataId: {
- handler(v) {
- let _this = this;
- if (v == null || v <= 0) return;
- _this.getInfo(v);
- },
- immediate: true,
- deep: true,
- },
- },
- data() {
- return {
- activeName: "base",
- treeProps: {
- children: "children",
- label: "label",
- },
- defaultProps: {
- children: "children",
- label: "codename",
- },
- treeData: [],
- dataForm: {
- id: "",
- name: "",
- is_admin: "",
- intro: "",
- status: 5,
- },
- statusOptions: [
- {
- status: 5,
- name: "启用",
- },
- {
- status: 6,
- name: "禁用",
- },
- ],
- adminOptions: [
- {
- status: 1,
- name: "是",
- },
- {
- status: 2,
- name: "否",
- },
- ],
- pickedItem: [],
- templateCate: [],
- documentCate: [],
- sourceDataCate: [],
- allChecked: {
- nodeTree: false,
- templateCate: false,
- docCate: false,
- sourceDataTree: false,
- },
- defaultCheckedKeys: {
- templateCate: [],
- documentCate: [],
- sourceDataTree: [],
- },
- dataRule: {
- name: [
- { required: true, message: "请输入角色名称", trigger: "blur" },
- ],
- is_admin: [
- { required: true, message: "请选择是否为管理员", trigger: "change" },
- ],
- },
- };
- },
- mounted() {
- this.initNodeList();
- this.initTemplateCate();
- this.initDocCategory();
- this.initSourceDataCate();
- },
- methods: {
- /* 管理选选择 */
- selChange(val) {
- if (val == 1) {
- this.handleCheckAllChange("nodeTree", true);
- this.handleTemplateAllChange(true);
- this.handleSourceDataAllChange(true);
- this.handleDocumentCateAllChange(true);
- } else {
- this.handleCheckAllChange("nodeTree", false);
- this.handleTemplateAllChange(false);
- this.handleSourceDataAllChange(false);
- this.handleDocumentCateAllChange(false);
- }
- },
- handleTemplateAllChange(checked) {
- const tree = this.$refs.templateCate;
- if (checked) {
- this.defaultCheckedKeys.templateCate = [1, 2, 3, 4];
- tree.setCheckedKeys(this.defaultCheckedKeys.templateCate);
- } else {
- this.defaultCheckedKeys.templateCate = [];
- tree.setCheckedKeys([]);
- }
- this.allChecked.templateCate = checked;
- },
- /* 全选原始数据分类 */
- handleSourceDataAllChange(checked) {
- const tree = this.$refs.sourceDataTree;
- if (checked) {
- this.defaultCheckedKeys.sourceDataCate = [9, 10, 11, 12];
- tree.setCheckedKeys(this.defaultCheckedKeys.sourceDataCate);
- } else {
- this.defaultCheckedKeys.sourceDataCate = [];
- tree.setCheckedKeys([]);
- }
- this.allChecked.sourceDataTree = checked;
- },
- handleDocumentCateAllChange(checked) {
- const tree = this.$refs.docCate;
- if (checked) {
- this.defaultCheckedKeys.documentCate = [5, 6, 7, 8];
- tree.setCheckedKeys(this.defaultCheckedKeys.documentCate);
- } else {
- this.defaultCheckedKeys.documentCate = [];
- tree.setCheckedKeys([]);
- }
- this.allChecked.docCate = checked;
- },
- handleSourceDataCheck() {
- const tree = this.$refs.sourceDataTree;
- console.log(tree);
- const checkedCount = tree.getCheckedNodes(true).length;
- const totalCount = this.countAllNodes(this.sourceDataCate);
- this.allChecked.sourceDataTree =
- checkedCount === totalCount && totalCount > 0;
- },
- /* 原始数据分类 */
- initSourceDataCate() {
- let _this = this;
- selectPermissions({ content_type_id: 3 }).then((res) => {
- if (res.status !== 200) return;
- _this.sourceDataCate = res.data;
- });
- },
- /* 全选文档分类 */
- handleDocAllChange(treeRef) {
- const tree = this.$refs[treeRef];
- const data = this.documentCate;
- tree.setCheckedNodes(
- this.allChecked[treeRef] ? this.flattenTree(data) : []
- );
- },
- handleDocCheck() {
- const tree = this.$refs.docCate;
- const checkedCount = tree.getCheckedNodes(true).length;
- const totalCount = this.countAllNodes(this.documentCate);
- this.allChecked.docCate = checkedCount === totalCount && totalCount > 0;
- },
- /* 文档分类 */
- initDocCategory() {
- let _this = this;
- selectPermissions({ content_type_id: 2 }).then((res) => {
- if (res.status !== 200) return;
- _this.documentCate = res.data;
- });
- /* searchDocumentCategory({ page: 1, pageSize: 9999, status: 5 }).then(
- (res) => {
- if (res.status != 200) return;
- _this.documentCate = [
- {
- action: "view",
- type: "docCate",
- isMain: true,
- name: "查看",
- label: "查看",
- },
- {
- action: "create",
- type: "docCate",
- isMain: true,
- name: "创建",
- label: "创建",
- },
- {
- action: "edit",
- type: "docCateg",
- isMain: true,
- name: "编辑",
- label: "编辑",
- },
- {
- action: "delete",
- type: "docCateg",
- isMain: true,
- name: "删除",
- label: "删除",
- },
- ];
- }
- ); */
- },
- /* 全选模版分类
- handleTemplateAllChange(treeRef) {
- const tree = this.$refs[treeRef];
- const data = this.templateCate;
- tree.setCheckedNodes(
- this.allChecked[treeRef] ? this.flattenTree(data) : []
- );
- },*/
- handleTemplateCheck() {
- const tree = this.$refs.templateCate;
- const checkedCount = tree.getCheckedNodes(true).length;
- const totalCount = this.countAllNodes(this.templateCate);
- this.allChecked.templateCate =
- checkedCount === totalCount && totalCount > 0;
- },
- flattenTree(tree) {
- return tree.reduce((acc, node) => {
- if (node.children && node.children.length > 0) {
- return [...acc, node, ...this.flattenTree(node.children)];
- }
- return [...acc, node];
- }, []);
- },
- countAllNodes(nodes) {
- return nodes.reduce((count, node) => {
- if (node.children && node.children.length > 0) {
- return count + 1 + this.countAllNodes(node.children);
- }
- return count + 1;
- }, 0);
- },
- //初始化模板分类
- initTemplateCate() {
- let _this = this;
- selectPermissions({ content_type_id: 1 }).then((res) => {
- if (res.status !== 200) return;
- _this.templateCate = res.data;
- });
- },
- /* 权限配置全选 */
- handleCheckAllChange(treeRef, checked = true) {
- const tree = this.$refs[treeRef];
- tree.setCheckedNodes(checked ? this.treeData : []);
- this.allChecked.nodeTree = checked;
- },
- handleNodeCheck() {
- const tree = this.$refs.nodeTree;
- const checkedCount = tree.getCheckedNodes().length;
- const totalCount = this.countAllNodes(this.treeData);
- this.allChecked.nodeTree = checkedCount === totalCount;
- },
- countAllNodes(nodes) {
- let count = 0;
- for (const node of nodes) {
- count++;
- if (node.children) {
- count += this.countAllNodes(node.children);
- }
- }
- return count;
- },
- /* 权限配置 */
- initNodeList() {
- let _this = this;
- searchAdminAuth({ page: 1, pageSize: 999, status: 5 }).then((res) => {
- if (res.status != 200) {
- _this.treeData = [];
- return;
- }
- /* let dataList=this.$store.state.user.authList {
- value: 5,
- label: "产品管理",
- children: [],
- sub: false,
- },{
- value: 1,
- label: "项目管理",
- children: [],
- sub: false,
- },*/
- let data = [
-
- {
- value: 4,
- label: "客户管理",
- children: [],
- sub: false,
- },
- {
- value: 10,
- label: "文档管理",
- children: [],
- sub: false,
- },
- {
- value: 32,
- label: "知识库管理",
- children: [],
- sub: false,
- },
- {
- value: 37,
- label: "小程序管理",
- children: [],
- sub: false,
- },
-
- {
- value: 21,
- label: "系统设置",
- children: [],
- sub: false,
- },
- ];
- let viewAuth = res.data.filter(
- (o) => o.parent_id != 99 && o.parent_id != 999
- );
- let controlAuth = res.data.filter((o) => o.parent_id == 999);
- let items = [];
- data.map((item) => {
- item.children = viewAuth
- .filter((o) => o.parent_id == item.value)
- .map((subItem) => {
- let sub = {
- value: subItem.id,
- label: subItem.name,
- sub: true,
- children: controlAuth
- .filter((o) => o.parent_id == subItem.id)
- .map((res) => {
- let item = {
- value: res.id,
- label: res.name,
- sub: true,
- };
- return item;
- }),
- };
- return sub;
- });
- if (item.children.length > 0) {
- items.push(item);
- }
- });
- _this.treeData = items;
- });
- },
- //保存更新
- btnSave(e) {
- let _this = this;
- _this.$refs.dataRef.validate((valid) => {
- if (valid) {
- let items = _this.$refs.nodeTree.getCheckedNodes();
- let templateCate = _this.$refs.templateCate.getCheckedNodes();
- let docCate = _this.$refs.docCate.getCheckedNodes();
- let sourceDataTree = _this.$refs.sourceDataTree.getCheckedNodes();
- let operation_id;
- templateCate = templateCate.map((el) => {
- operation_id = el.id;
- return { operation_id: el.id };
- });
- docCate = docCate.map((el) => {
- el.operation_id = el.id;
- return { operation_id: el.id };
- });
- sourceDataTree = sourceDataTree.map((el) => {
- el.operation_id = el.id;
- return { operation_id: el.id };
- });
- _this.dataForm.template_cate_auth = JSON.stringify(templateCate);
- _this.dataForm.doc_cate_auth = JSON.stringify(docCate);
- _this.dataForm.source_cate_auth = JSON.stringify(sourceDataTree);
- let pickedItem = items.filter((o) => o.sub == true);
- _this.dataForm.authList = JSON.stringify(pickedItem);
- let data = { ..._this.dataForm };
- data.attrs = JSON.stringify(data.attrs);
- if (_this.dataForm.id > 0) {
- updateAdminRole(data).then((res) => {
- if (res.status != 200) return;
- _this.$alert("更新角色信息成功");
- _this.$router.push({
- path: "/system/role/index",
- });
- _this.$emit("onClose");
- });
- } else {
- createAdminRole(data).then((res) => {
- if (res.status != 200) return;
- _this.$alert("创建角色信息成功");
- _this.$router.push({
- path: "/system/role/index",
- });
- _this.$emit("onClose");
- });
- }
- }
- });
- },
- //产品详情
- getInfo(id) {
- let _this = this;
- let par = {
- id: id,
- };
- getAdminRoleInfo(par).then((res) => {
- if (!res) return;
- if (res.status != 200) return;
- _this.dataForm = res.data.info;
- if (res.data.menuList.length > 0) {
- res.data.menuList.map((el) => {
- el.label = el.name;
- el.value = el.id;
- });
- _this.$refs.nodeTree.setCheckedNodes(res.data.menuList);
- } else {
- _this.$refs.nodeTree.setCheckedNodes([]);
- }
- let tempCate = res.data.templateCategoryUsers; //JSON.parse();
- if (tempCate.length > 0) {
- _this.$refs.templateCate.setCheckedKeys(
- tempCate.map((el) => (el.type == 1 ? el.id : ""))
- );
- } else {
- _this.$refs.templateCate.setCheckedKeys([]);
- }
- let sourceCate = res.data.source_cate_auth; //JSON.parse();
- if (sourceCate.length > 0) {
- _this.$refs.sourceDataTree.setCheckedKeys(
- sourceCate.map((el) => (el.type == 1 ? el.id : ""))
- );
- } else {
- _this.$refs.sourceDataTree.setCheckedKeys([]);
- }
- // 设置文档分类树的默认选中节点
- let docCate = res.data.doc_cate_auth;
- if (docCate.length > 0) {
- _this.$refs.docCate.setCheckedKeys(
- docCate.map((el) => (el.type == 1 ? el.id : ""))
- );
- } else {
- _this.$refs.docCate.setCheckedKeys([]);
- }
- // _this.$refs.docCate.setCheckedNodes(JSON.parse(res.data.doc_cate_auth));
- // _this.$refs.sourceDataTree.setCheckedNodes(JSON.parse(res.data.source_cate_auth));
- });
- },
- onChangeStatus(e) {
- this.dataForm.status = e;
- },
- },
- };
- </script>
- <style lang="scss">
- @import "./dataInfo.scss";
- </style>
|