2022/1/21 系统设置角色、隶属海关

minggao/config/index.js

@@ -12,8 +12,8 @@ module.exports = {
     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        // target: 'http://192.168.1.17:12345', //翟毅飞
-        target: 'http://192.168.1.77:12345', //曹世祥
+        target: 'http://192.168.1.17:12345', //翟毅飞
+        // target: 'http://192.168.1.77:12345', //曹世祥
         changeOrigin: true,
         pathRewrite: { 
           '^/api': '/api' //重写接口

minggao/src/components/tree-table/tree-item.vue

@@ -10,27 +10,27 @@
         <td :colspan="colSpan">
           <table>
             <tr class="leve" :class="levelClass">
-              <td class="td1">{{ model.Id }}</td>
+              <td class="td1">{{ model.id }}</td>
               <td class="td2">
                 <div class="td-title" @dblclick="handlerExpand(model)">
                   <span
-                    v-if="model.children.length > 0"
+                    v-if="model.childrens.length > 0"
                     class="tree-close"
                     :class="{ 'tree-open': model.isExpand }"
                     @click="handlerExpand(model)"
                   ></span>
                   <a class="ellipsis">
                     <i class="t-icon m-dep"></i>
-                    <span :title="model.ObjectName">{{
-                      model.ObjectName
+                    <span :title="model.org_name">{{
+                      model.org_name
                     }}</span>
                   </a>
                 </div>
               </td>
-              <td class="td3">{{ model.CreateTime | formatDate }}</td>
+              <td class="td3">{{ model.create_time }}</td>
               <td class="td4">
-                <span :title="model.Experience" class="ellipsis">{{
-                  model.Experience
+                <span :title="model.modify_time" class="ellipsis">{{
+                  model.modify_time
                 }}</span>
               </td>
               <td class="td6">
@@ -42,11 +42,10 @@
                   >删除</a
                 >
                 <i class="line"></i>
-                <a class="user" href="javascript:;" @click="deleteFunc(model)"
-                  >组织账号</a
-                >
-                <i class="line"></i>
-                <a class="addr" href="javascript:;" @click="addOrganization(model)"
+                <a
+                  class="addr"
+                  href="javascript:;"
+                  @click="addOrganizationFunc(model)"
                   >添加下级组织</a
                 >
               </td>
@@ -55,16 +54,20 @@
         </td>
       </tr>
     </table>
+
+    <!-- 暂无数据 -->
+
     <div v-show="model.isExpand" class="other-node" :class="otherNodeClass">
       <tree-item
-        v-for="(m, i) in model.children"
+        v-for="(m, i) in model.childrens"
         :key="String('child_node' + i)"
         :num="i"
         :root="1"
         @actionFunc="actionFunc"
         @deleteFunc="deleteFunc"
+        @addOrganization="addOrganizationFunc"
         @handlerExpand="handlerExpand"
-        :nodes.sync="model.children.length"
+        :nodes.sync="model.childrens.length"
         :trees.sync="trees"
         :model.sync="m"
       >
@@ -113,30 +116,23 @@ export default {
       var recurFunc = (data, list) => {
         data.forEach((l) => {
           if (l.id === m.id) this.parentNodeModel = list;
-          if (l.children) {
-            recurFunc(l.children, l);
+          if (l.childrens) {
+            recurFunc(l.childrens, l);
           }
         });
       };
       recurFunc(this.trees, this.trees);
     },
-    
+
     handlerExpand(m) {
+      // console.log(m)
+      // console.log('-------------------')
       this.$emit("handlerExpand", m);
     },
 
     // 删除
     deleteFunc(m) {
       this.$emit("deleteFunc", m);
-      // this.getParentNode(m)
-      // console.log(this.parentNodeModel)
-      // if (this.parentNodeModel.hasOwnProperty('children')) {
-      // 	console.log('父级是跟节点', this.parentNodeModel)
-      // 	this.parentNodeModel.children.splice(this.parentNodeModel.children.indexOf(m), 1)
-      // } else if (this.parentNodeModel instanceof Array) {
-      // 	console.log('跟节点', this.parentNodeModel)
-      // 	this.parentNodeModel.splice(this.parentNodeModel.indexOf(m), 1)
-      // }
     },
 
     // 编辑
@@ -145,13 +141,8 @@ export default {
     },
 
     // 添加下级组织
-    addOrganization(m) {
-      alert('添加下级组织')
-    },
-
-    // 组织账号
-    userOrganization(m) {
-      alert('组织账号')
+    addOrganizationFunc(m) {
+      this.$emit("addOrganization", m);
     },
   },
   filters: {

minggao/src/components/tree-table/tree_table.vue

@@ -30,6 +30,7 @@
                   :num="i"
                   @actionFunc="actionFunc"
                   @deleteFunc="deleteFunc"
+                  @addOrganization="addOrganization"
                   @handlerExpand="handlerExpand"
                   :nodes="treeDataSource.length"
                   :trees.sync="treeDataSource"
@@ -77,12 +78,12 @@ export default {
       let reduceDataFunc = (data, level) => {
         data.map((m, i) => {
           m.isExpand = false;
-          m.children = m.children || [];
+          m.childrens = m.childrens || [];
           m.level = level;
           m.bLeft = level === 1 ? 34 : (level - 2) * 16 + 34;
-          m.Experience = m.Experience || "无";
-          if (m.children.length > 0) {
-            reduceDataFunc(m.children, level + 1);
+          // m.Experience = m.Experience || "无";
+          if (m.childrens.length > 0) {
+            reduceDataFunc(m.childrens, level + 1);
           }
         });
       };
@@ -105,6 +106,10 @@ export default {
     deleteFunc(m) {
       this.$emit("deleteFunc", m);
     },
+    // 添加下级组织
+    addOrganization(m) {
+      this.$emit("addOrganization", m)
+    },
     // 展开
     handlerExpand(m) {
       this.$emit("handlerExpand", m);

minggao/src/page/systemmanger/customsManger.vue

@@ -16,7 +16,9 @@
             </el-input>
             <div class="btn_box">
               <el-button type="primary" size="small">搜索</el-button>
-              <el-button type="primary" size="small">添加用户</el-button>
+              <el-button type="primary" size="small" @click="addrUser"
+                >添加用户</el-button
+              >
             </div>
           </div>
         </el-col>
@@ -29,14 +31,67 @@
         :list.sync="treeDataSource"
         @actionFunc="actionFunc"
         @deleteFunc="deleteFunc"
+        @addOrganization="addOrganization"
         @handlerExpand="handlerExpand"
         @orderByFunc="orderByFunc"
       ></tree-table>
 
       <!-- 分页 -->
-      <el-pagination :page-size="10" @current-change="newPage" :current-page="page" v-if="treeDataSource.length > 0" background layout="prev, pager, next" :total="tableSum">
+      <el-pagination
+        :page-size="10"
+        @current-change="newPage"
+        :current-page="page"
+        v-if="treeDataSource.length > 0"
+        background
+        layout="prev, pager, next, jumper"
+        :total="tableSum"
+      >
       </el-pagination>
     </el-card>
+
+    <!-- 添加用户 -->
+    <el-dialog
+      :title="tltData"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :visible.sync="addrUserVisible"
+      width="25%"
+    >
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="上级: ">
+          <el-select
+            size="mini"
+            v-model="form.higher"
+            placeholder="请选择活动区域"
+            :disabled="true"
+          >
+            <el-option
+              v-for="(item, index) in higherList"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="组织名称: ">
+          <el-input
+            style="width: 80%"
+            size="mini"
+            v-model="form.name"
+          ></el-input>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button size="small" type="primary" @click="onSubmit"
+            >确定</el-button
+          >
+          <el-button size="small" @click="addrUserVisible = false"
+            >取消</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-dialog>
   </div>
 </template>
 
@@ -53,14 +108,37 @@ export default {
     return {
       input: "", // 组织搜索
       treeDataSource: [],
-      tableSum: 100, // 表格列表总数
+      tableSum: 0, // 表格列表总数
       page: 1, // 当前页数
+
+      // 添加隶属海关弹框
+      addrUserVisible: false,
+      higherList: [
+        {
+          value: "",
+          label: "",
+        },
+      ],
+      form: {
+        name: "",
+        higher: "",
+      },
+      tltData: "添加隶属海关",
+      userData: {}, // 点击编辑时获取到的当前数据
     };
   },
   //监听属性 类似于data概念
   computed: {},
   //监控data中的数据变化
-  watch: {},
+  watch: {
+    // 添加隶属海关弹框
+    addrUserVisible(val) {
+      if (val == false) {
+        this.form.higher = ""; // 清除上级值
+        this.form.name = ""; // 清除组织名称值
+      }
+    },
+  },
   //方法集合
   methods: {
     // 树形表格
@@ -68,38 +146,211 @@ export default {
       alert("排序");
       alert(val);
     },
+    // 编辑
     actionFunc(m) {
-      alert("编辑");
+      console.log(m);
+      this.userData = m
+      this.tltData = "编辑隶属海关"; //改变弹框标题
+      if (m.level == 1) {
+        this.$set(this.higherList, 0, {
+          value: "",
+          label: "根类别",
+        });
+        this.form.higher = "";
+      } else {
+        this.$set(this.higherList, 0, {
+          value: m.parent_id,
+          label: m.parent_name,
+        });
+        this.form.higher = m.parent_name;
+      }
+      this.form.name = m.org_name;
+
+      // console.log(this.higherList);
+      this.addrUserVisible = true; //打开弹框
     },
+    // 删除
     deleteFunc(m) {
-      alert("删除");
+      // console.log(m);
+      this.$confirm("此操作将永久删除, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.$axios({
+            method: "POST",
+            url: "/api/api_gateway?method=sysmenage.usermanager.org_delete",
+            data: this.qs.stringify({
+              org_id: m.id,
+            }),
+          })
+            .then((res) => {
+              if (res.data.data == true) {
+                this.$message({
+                  message: '删除成功了',
+                  type: 'success',
+                  duration: 1500
+                });
+                this.tabListData()
+              } else {
+                this.$message({
+                  message: '删除失败',
+                  type: 'error',
+                  duration: 1500
+                });
+              }
+              // console.log(res);
+            })
+            .catch((err) => {
+              // console.log(err);
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+
+      // this.$axios({
+      //   method: 'POST',
+      //   url: '/api/api_gateway?method=sysmenage.usermanager.org_add',
+      //   data: this.qs.stringify({
+      //     org_id: m.id
+      //   })
+      // }).then((res) => {
+      //   console.log(res)
+      // }).catch((err) => {
+      //   console.log(err)
+      // })
+    },
+    // 添加下级组织
+    addOrganization(m) {
+      console.log(m)
+      this.tltData = "添加隶属海关"; //改变弹框标题
+      this.$set(this.higherList, 0, {
+        value: m.id,
+        label: m.org_name,
+      });
+      this.form.higher = m.org_name;
+      this.addrUserVisible = true; //打开弹框
     },
+
     handlerExpand(m) {
-      console.log("展开/收缩");
+      // console.log("展开/收缩");
+      // console.log(m);
       m.isExpand = !m.isExpand;
     },
 
     // 请求下页数据
     newPage(page) {
-        console.log(page)
-    }
+      // console.log(page);
+      this.page = page;
+      this.tabListData();
+    },
+
+    // 添加用户 -- 一级
+    addrUser() {
+      this.higherList = [
+        {
+          label: "根类别",
+          value: "",
+        },
+      ];
+      this.addrUserVisible = true;
+    },
+
+    // 添加用户 || 编辑用户 -- 确定
+    onSubmit() {
+      var that = this
+      if (this.form.name == "") {
+        this.$message({
+          message: "请填写组织名称!",
+          type: "warning",
+          duration: 1500,
+        });
+      } else if (this.form.name.split(" ").join("").length == 0) {
+        this.$message({
+          message: "不能填写空格！",
+          type: "warning",
+          duration: 1500,
+        });
+      } else {
+        // 请求添加接口
+        if (this.tltData == "编辑隶属海关") {
+          // 编辑
+          var url = "/api/api_gateway?method=sysmenage.usermanager.org_modify";
+          var postData = this.qs.stringify({
+            org_name: this.form.name, //组织名称
+            org_id: this.userData.id, // 组织id
+          });
+        } else if (this.tltData == "添加隶属海关") {
+          // 添加
+          var url = "/api/api_gateway?method=sysmenage.usermanager.org_add";
+          var postData = this.qs.stringify({
+            org_name: that.form.name, //组织名称
+            parent_org_id: that.higherList[0].value, // 上级组织id，没有上级组织表示创建的组织是顶级组织
+          });
+        }
+ 
+        this.$axios({
+          method: "POST",
+          url,
+          data: postData,
+        })
+          .then((res) => {
+            console.log(res);
+            if (res.data.data == true) {
+              this.$message({
+                message: "成功!",
+                type: "success",
+                duration: 1500,
+              });
+              this.addrUserVisible = false
+              this.tabListData()
+            } else {
+              this.$message({
+                message: "失败!",
+                type: "error",
+                duration: 1500,
+              });
+            }
+          })
+          .catch((err) => {
+            console.log(err);
+          });
+      }
+    },
+
+    // 请求表格列表
+    tabListData() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.org_list",
+        data: this.qs.stringify({
+          page: this.page,
+          page_item: "9",
+          org_name: this.input,
+        }),
+      })
+        .then((res) => {
+          // console.log(res.data.data);
+          if (res.data.data.total_item !== 0) {
+            this.treeDataSource = res.data.data.page_list;
+            this.tableSum = res.data.data.total_item;
+          }
+        })
+        .catch((err) => {
+          // console.log(err);
+        });
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
-    this.$axios({
-      method: "post",
-      url: "/qxz_page",
-      data: "",
-    })
-      .then((res) => {
-        console.log(res);
-        this.treeDataSource = res.data.data;
-      })
-      .catch((err) => {
-        console.log(err);
-      });
+    this.tabListData(); // 请求表格列表
   },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
@@ -116,6 +367,18 @@ export default {
     overflow: hidden;
     overflow-y: auto;
   }
+
+  // 表单
+  /deep/.el-form {
+    .el-form-item {
+      .el-form-item__content {
+        // 上级
+        .el-select {
+          width: 80%;
+        }
+      }
+    }
+  }
 }
 
 // 组织搜索

minggao/src/page/systemmanger/motif.vue

@@ -0,0 +1,38 @@
+<!--  -->
+<template>
+  <div class="">主题管理</div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
+//例如：import 《组件名称》 from '《组件路径》';
+
+export default {
+  //import引入的组件需要注入到对象中才能使用
+  components: {},
+  data() {
+    //这里存放数据
+    return {};
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {},
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='less' scoped>
+//@import url(); 引入公共css类
+</style>

minggao/src/page/systemmanger/role.vue

@@ -0,0 +1,498 @@
+<!--  -->
+<template>
+  <div class="role_box">
+    <el-card>
+      <!-- 筛选 -->
+      <el-row>
+        <el-col>
+          <!-- 组织搜索 -->
+          <div class="search_box">
+            <el-input
+              size="small"
+              placeholder="请输入角色名称"
+              v-model="input"
+              @change="searchData"
+              clearable
+            >
+            </el-input>
+            <div class="btn_box">
+              <el-button type="primary" size="small" @click="searchData"
+                >搜索</el-button
+              >
+              <el-button type="primary" size="small" @click="addrRole"
+                >添加角色</el-button
+              >
+            </div>
+          </div>
+        </el-col>
+      </el-row>
+
+      <!-- 列表 -->
+      <el-table :data="tableData" stripe style="width: 100%">
+        <el-table-column prop="ind" label="序号" width="280"></el-table-column>
+        <el-table-column prop="role_name" label="角色名称" width="380">
+        </el-table-column>
+        <el-table-column prop="role_message" label="角色描述" width="580">
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <a class="reset" href="javascript:;" @click="actionFunc(scope.row)"
+              >编辑</a
+            >
+            <i class="line"></i>
+            <a class="delete" href="javascript:;" @click="deleteFunc(scope.row)"
+              >删除</a
+            >
+            <i class="line"></i>
+            <a class="addr" href="javascript:;" @click="limitsData(scope.row)"
+              >分配权限</a
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <el-pagination
+        v-if="tableData.length !== 0"
+        @current-change="changeList"
+        background
+        layout="prev, pager, next, jumper"
+        :current-page="page"
+        :total="pagesum"
+      >
+      </el-pagination>
+    </el-card>
+
+    <!-- 添加用户 - 编辑用户 -->
+    <el-dialog
+      :title="tltData"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :visible.sync="addrUserVisible"
+      width="45%"
+    >
+      <el-form ref="form" :rules="rules" :model="form" label-width="90px">
+        <el-form-item label="角色名称: " prop="name">
+          <el-input
+            style="width: 80%"
+            size="mini"
+            v-model="form.name"
+          ></el-input>
+        </el-form-item>
+
+        <el-form-item label="角色描述: " prop="describe">
+          <el-input
+            style="width: 80%"
+            size="mini"
+            type="textarea"
+            resize="none"
+            v-model="form.describe"
+          ></el-input>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button size="small" type="primary" @click="submitForm"
+            >确定</el-button
+          >
+          <el-button size="small" @click="addrUserVisible = false"
+            >取消</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+
+    <!-- 分配权限 -->
+    <el-dialog
+      title="分配权限"
+      :visible.sync="setRightDialogVisible"
+      width="50%"
+      @close="setRightDialogClosed"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+    >
+      <el-tree
+        :data="rightsList"
+        :props="treeProps"
+        ref="treeRef"
+        show-checkbox
+        node-key="pur_id"
+        default-expand-all
+        :default-checked-keys="defKeys"
+      ></el-tree>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="setRightDialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="allotRights">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  data() {
+    //这里存放数据
+    return {
+      input: "",
+      tableData: [],
+      page: 1,
+      pagesum: 0,
+
+      //   添加用户 - 编辑用户
+      tltData: "",
+      addrUserVisible: false,
+      form: {
+        name: "",
+        describe: "",
+      },
+      rules: {
+        name: [
+          { required: true, message: "请输入角色名称", trigger: "blur" },
+          //   { min: 3, max: 5, message: "长度在 1 到 15 个字符", trigger: "blur" },
+        ],
+        describe: [
+          { required: true, message: "请输入角色描述", trigger: "blur" },
+          //   { min: 3, max: 5, message: "长度在 1 到 30 个字符", trigger: "blur" },
+        ],
+      },
+
+      // 分配权限
+      setRightDialogVisible: false,
+      rightsList: [],
+      //  默认选中节点ID值
+      defKeys: [],
+      describeData: {}, // 点击表格操作时获取到的当前数据
+      //  树形控件的属性绑定对象
+      treeProps: {
+        label: "purview_name",
+        children: "children",
+      },
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {
+    // 添加、编辑角色弹框
+    addrUserVisible(val) {
+      if (val == false) {
+        this.form.name = "";
+        this.form.describe = "";
+      }
+    },
+  },
+  //方法集合
+  methods: {
+    tabListData() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.role_list",
+        data: this.qs.stringify({
+          page: this.page,
+          page_item: "10",
+          role_name: this.input,
+        }),
+      })
+        .then((res) => {
+          if (res.data.data.total_item !== 0) {
+            var data = res.data.data.page_list;
+            this.pagesum = res.data.data.total_item;
+            var list = [];
+            data.forEach((item, index) => {
+              item.ind = index + 1;
+              list.push(item);
+            });
+            this.tableData = list;
+          } else {
+            this.tableData = [];
+            this.pagesum = 0;
+          }
+        })
+        .catch((err) => {
+          // console.log(err)
+        });
+    },
+
+    // 搜索
+    searchData() {
+      this.tabListData();
+    },
+
+    // 下一页
+    changeList(num) {
+      this.page = num;
+      this.tabListData();
+    },
+
+    // 添加角色
+    addrRole() {
+      this.tltData = "添加角色";
+      this.addrUserVisible = true;
+    },
+    // 编辑角色
+    actionFunc(data) {
+      //   console.log(data);
+      this.describeData = data;
+      this.tltData = "编辑角色";
+      this.form.name = data.role_name; // 角色名称
+      this.form.describe = data.role_message; // 角色描述
+      this.addrUserVisible = true;
+    },
+    // 添加、编辑角色确定
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          if (this.tltData == "添加角色") {
+            // 添加
+            this.addrRoleAxios(); // 添加
+          } else if (this.tltData == "编辑角色") {
+            // 编辑
+            this.editRoleAxios(); // 编辑
+          }
+        } else {
+          //   console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // 添加 - 确定
+    addrRoleAxios() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.role_add",
+        data: this.qs.stringify({
+          role_name: this.form.name,
+          role_message: this.form.describe,
+        }),
+      })
+        .then((res) => {
+          if (res.data.data == true) {
+            this.$message({
+              message: "成功!",
+              type: "success",
+              duration: 1500,
+            });
+            this.addrUserVisible = false;
+            this.tabListData();
+          } else {
+            this.$message({
+              message: "失败!",
+              type: "error",
+              duration: 1500,
+            });
+          }
+          //   console.log(res);
+          this.addrUserVisible = false;
+        })
+        .catch((err) => {
+          //   console.log(err);
+        });
+    },
+    // 编辑 - 确定
+    editRoleAxios() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.role_modify",
+        data: this.qs.stringify({
+          role_id: this.describeData.id,
+          role_name: this.form.name,
+          role_message: this.form.describe,
+        }),
+      })
+        .then((res) => {
+          if (res.data.data == true) {
+            this.$message({
+              message: "成功!",
+              type: "success",
+              duration: 1500,
+            });
+            this.addrUserVisible = false;
+            this.tabListData();
+          } else {
+            this.$message({
+              message: "失败!",
+              type: "error",
+              duration: 1500,
+            });
+          }
+          //   console.log(res);
+          this.addrUserVisible = false;
+        })
+        .catch((err) => {
+          //   console.log(err);
+        });
+    },
+
+    // 分配权限
+    limitsData(val) {
+      this.describeData = val;
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.user_info",
+      })
+        .then((res) => {
+          if (res.data.message == "") {
+            var data = res.data.data.children;
+            this.rightsList = data;
+            this.limitsList(); //获取当前角色的权限
+          } else {
+            this.$message.error("获取权限列表失败!");
+          }
+        })
+        .catch((err) => {
+          // console.log(err)
+        });
+    },
+    // 当前角色权限
+    limitsList() {
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.role_info",
+        data: this.qs.stringify({
+          role_id: this.describeData.id, //角色ID
+        }),
+      })
+        .then((res) => {
+          if (res.data.data) {
+            this.setRightDialogVisible = true;
+            var list = this.tableData;
+            for (var i = 0; i < list.length; i++) {
+              if (list[i].id == this.describeData.id) {
+                list[i]["children"] = res.data.data;
+                this.defKeys = [];
+                this.getLeafkeys(list[i], this.defKeys);
+              }
+            }
+          }
+        //   this.tabListData = list;
+          this.tableData = list;
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+    },
+
+    getLeafkeys(node, arr) {
+      if (!node.children) {
+        return arr.push(node.pur_id);
+      }
+      node.children.forEach((item) => this.getLeafkeys(item, arr));
+    },
+    setRightDialogClosed() {
+      this.rightsList = [];
+    },
+    // 确定 - 分配权限
+    allotRights() {
+        var that = this
+      // 获得当前选中的Id
+      const keys = [
+        ...this.$refs.treeRef.getCheckedKeys(),
+        ...this.$refs.treeRef.getHalfCheckedKeys(),
+      ];
+      const idStr = keys.join(",");
+      console.log(idStr);
+      this.$axios({
+        method: "POST",
+        url: "/api/api_gateway?method=sysmenage.usermanager.role_perm",
+        data: this.qs.stringify({
+          pur_id: idStr, // 权限id
+          role_id: this.describeData.id, // 角色id
+        }),
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.data.message == "") {
+            this.$message.success("分配权限成功!");
+            that.setRightDialogVisible = false;
+            that.tabListData();
+          }
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+    },
+
+    // 删除
+    deleteFunc(data) {
+      this.$confirm("此操作将永久删除, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.$axios({
+            method: "POST",
+            url: "/api/api_gateway?method=sysmenage.usermanager.role_delete",
+            data: this.qs.stringify({
+              role_id: data.id,
+            }),
+          })
+            .then((res) => {
+              if (res.data.message == "") {
+                this.$message({
+                  type: "success",
+                  message: "删除成功!",
+                  duration: 1500,
+                });
+              }
+              this.tabListData();
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {
+    this.tabListData(); // 表格数据
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='less' scoped>
+.role_box {
+  .search_box {
+    display: flex;
+    /deep/.el-input {
+      width: 300px;
+    }
+    .btn_box {
+      margin: 0 0 0 15px;
+    }
+  }
+  a {
+    text-decoration: none;
+  }
+  .reset {
+    color: #1890ff;
+  }
+  .delete {
+    color: #f56c6c;
+  }
+  .addr {
+    color: #67c23a;
+  }
+  .line {
+    display: inline-block;
+    width: 1px;
+    background: rgba(0, 0, 0, 0.09);
+    margin: 0 11px;
+    height: 14px;
+  }
+}
+</style>

minggao/src/router/index.js

@@ -8,7 +8,9 @@ import Login from '@/page/login/login'
 // *****************首页**********************
 import Index from '@/page/home/index'
 //---------------------------------------系统管理----------------------------------------------------
-const customsManger = () => import('@/Page/systemmanger/customsManger')
+const customsManger = () => import('@/Page/systemmanger/customsManger') 
+const role = () => import('@/Page/systemmanger/role')
+const motif = () => import('@/Page/systemmanger/motif')
 
 // *****************测报系统**********************
 import cbd from '@/page/forecasting/cbd/Cbd'//首页
@@ -45,6 +47,20 @@ export default new Router({
             title: '隶属海关管理'
           }
         },
+        {
+          path: 'role',
+          component: role,
+          meta: {
+            title: '角色管理'
+          }
+        },
+        {
+          path: 'motif',
+          component: motif,
+          meta: {
+            title: '主题管理'
+          }
+        },
         //------------------系统管理--------------------------
         {
           path: 'cbd',