黎星凯
2024-04-15 62b6a7fac3f2acde70b578431147c4a01f19c182
admin-web/src/views/systemSetting/role/index.vue
@@ -2,104 +2,6 @@
  <div class="app-container">
    <el-container>
      <el-card class="box-card" style="width: 100%" shadow="never">
        <!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">-->
        <!--      <el-form-item label="角色名称" prop="roleName">-->
        <!--        <el-input-->
        <!--          v-model="queryParams.roleName"-->
        <!--          placeholder="请输入"-->
        <!--          clearable-->
        <!--          @keyup.enter.native="handleQuery"-->
        <!--          style="width: 150px"-->
        <!--        />-->
        <!--      </el-form-item>-->
        <!--      <el-form-item label="状态" prop="status">-->
        <!--        <el-select-->
        <!--          style="width: 150px"-->
        <!--          v-model="queryParams.status"-->
        <!--          placeholder="请选择"-->
        <!--          clearable>-->
        <!--          <el-option-->
        <!--            v-for="dict in constants.normalOrDisabled"-->
        <!--            :key="dict.value"-->
        <!--            :label="dict.label"-->
        <!--            :value="dict.value"-->
        <!--          />-->
        <!--        </el-select>-->
        <!--      </el-form-item>-->
        <!--      <el-form-item>-->
        <!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>-->
        <!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
        <!--      </el-form-item>-->
        <!--    </el-form>-->
        <!--    <el-row :gutter="10" class="mb8">-->
        <!--      <el-col :span="1.5">-->
        <!--        <el-button-->
        <!--          type="primary"-->
        <!--          plain-->
        <!--          icon="el-icon-plus"-->
        <!--          size="mini"-->
        <!--          @click="handleAdd"-->
        <!--          v-hasPermi="['system:role:add']"-->
        <!--        >新增</el-button>-->
        <!--      </el-col>-->
        <!--    </el-row>-->
        <!--    <el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange">-->
        <!--      <el-table-column type="selection" width="55" align="center" />-->
        <!--      <el-table-column label="角色编号" prop="role_id" width="160" />-->
        <!--      <el-table-column label="角色名称" prop="role_name" :show-overflow-tooltip="true" width="150" />-->
        <!--      <el-table-column label="权限字符" prop="role_key" :show-overflow-tooltip="true" width="150" />-->
        <!--      <el-table-column label="显示顺序" prop="role_sort" width="100" />-->
        <!--      <el-table-column label="状态" align="center" width="100">-->
        <!--        <template slot-scope="scope">-->
        <!--          <el-switch-->
        <!--            v-model="scope.row.status"-->
        <!--            :active-value=0-->
        <!--            :inactive-value=1-->
        <!--            @change="handleStatusChange(scope.row)"-->
        <!--          ></el-switch>-->
        <!--        </template>-->
        <!--      </el-table-column>-->
        <!--      <el-table-column label="备注" align="center" prop="remark" width="180">-->
        <!--      </el-table-column>-->
        <!--      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180">-->
        <!--        <template slot-scope="scope">-->
        <!--          <el-button-->
        <!--            size="mini"-->
        <!--            type="text"-->
        <!--            icon="el-icon-edit"-->
        <!--            @click="handleUpdate(scope.row)"-->
        <!--            v-hasPermi="['system:role:edit']"-->
        <!--          >修改</el-button>-->
        <!--          <el-button-->
        <!--            size="mini"-->
        <!--            type="text"-->
        <!--            icon="el-icon-delete"-->
        <!--            @click="handleDelete(scope.row)"-->
        <!--            v-hasPermi="['system:role:remove']"-->
        <!--          >删除</el-button>-->
        <!--&lt;!&ndash;          <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:role:edit']">-->
        <!--            <span class="el-dropdown-link">-->
        <!--              <i class="el-icon-d-arrow-right el-icon&#45;&#45;right"></i>更多-->
        <!--            </span>-->
        <!--            <el-dropdown-menu slot="dropdown">-->
        <!--              <el-dropdown-item command="handleDataScope" icon="el-icon-circle-check"-->
        <!--                v-hasPermi="['system:role:edit']">数据权限</el-dropdown-item>-->
        <!--              <el-dropdown-item command="handleAuthUser" icon="el-icon-user"-->
        <!--                v-hasPermi="['system:role:edit']">分配用户</el-dropdown-item>-->
        <!--            </el-dropdown-menu>-->
        <!--          </el-dropdown>&ndash;&gt;-->
        <!--        </template>-->
        <!--      </el-table-column>-->
        <!--    </el-table>-->
        <!--    <el-pagination-->
        <!--      :current-page="queryParams.pageNum"-->
        <!--      :page-sizes="constants.page.limit"-->
        <!--      :layout="constants.page.layout"-->
        <!--      :total="this.total"-->
        <!--      @size-change="changeSize"-->
        <!--      @current-change="changePage"-->
        <!--    />-->
        <!--搜索条件-->
        <div class="filter-container">
          <my-search ref="searchBar" :items="items" @search="fifterForm"></my-search>
        </div>
@@ -113,19 +15,19 @@
    </el-container>
    <!-- 添加或修改角色配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
      <el-form v-loading="loading" ref="form" :model="form" :rules="rules" label-width="100px">
        <el-form-item label="角色名称" prop="role_name">
          <el-input v-model="form.role_name" placeholder="请输入角色名称"/>
        </el-form-item>
        <el-form-item prop="role_key">
          <span slot="label">
            <el-tooltip content="角色标识,目前暂未使用" placement="top">
              <i class="el-icon-question"></i>
            </el-tooltip>
            角色标识
          </span>
          <el-input v-model="form.role_key" placeholder="请输入角色标识"/>
        </el-form-item>
        <!--        <el-form-item prop="role_key">
                  <span slot="label">
                    <el-tooltip content="角色标识,目前暂未使用" placement="top">
                      <i class="el-icon-question"></i>
                    </el-tooltip>
                    角色标识
                  </span>
                  <el-input v-model="form.role_key" placeholder="请输入角色标识"/>
                </el-form-item>-->
        <el-form-item label="角色顺序" prop="role_sort">
          <el-input-number v-model="form.role_sort" controls-position="right" :min="0"/>
        </el-form-item>
@@ -133,23 +35,19 @@
          <el-radio-group v-model="form.status">
            <el-radio :label="0">正常</el-radio>
            <el-radio :label="1">禁用</el-radio>
            <!--            <el-radio-->
            <!--              v-for="dict in constants.normalOrDisabled"-->
            <!--              :key="dict.value"-->
            <!--              :label="dict.value"-->
            <!--            >{{dict.label}}</el-radio>-->
          </el-radio-group>
        </el-form-item>
        <el-form-item label="角色范围">
          <el-radio-group v-model="form.data_scope">
            <el-radio :label="1" checked>省</el-radio>
            <el-radio :label="2">市</el-radio>
            <el-radio :label="3">县</el-radio>
            <el-radio v-if="$store.getters.userInfo.lv<2" :label="1">省</el-radio>
            <el-radio v-if="$store.getters.userInfo.lv<3" :label="2">市</el-radio>
            <el-radio v-if="$store.getters.userInfo.lv<4" :label="3">县</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="菜单权限">
          <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
          <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
          <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选
          </el-checkbox>
          <el-checkbox v-model="form.menu_check_strictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动
          </el-checkbox>
          <el-tree
@@ -262,9 +160,10 @@
      tableShow: false,
      // 表格数据
      table: {
        autoLoad: false,
        showIndex: true, // 是否显示序号
        expand: false, // 是否显示详情数据
        url: SettingIplatform.apiBaseURL + '/system/role/list', // 请求地址
        url: SettingIplatform.apiBaseURL + '/pc/fin/sys/tenant/user/query/role', // 请求地址
        // 工具条
        tools: {
          columnsCtrl: {// 列控制按钮
@@ -286,12 +185,12 @@
        },
        // 列信息
        columns: [
          {title: '角色编号', field: 'role_id', align: 'center', width: '200px'},
          {title: '角色名称', field: 'role_name', align: 'center', width: '260px'},
          {title: '权限字符', field: 'role_key', align: 'center', width: '260px'},
          {title: '顺序号', field: 'role_sort', align: 'center', width: '100px'},
          {title: '角色编号', field: 'role_id', align: 'center', width: 135},
          {title: '角色名称', field: 'role_name', align: 'left', minWidth: 200},
          // {title: '权限字符', field: 'role_key', align: 'center', width: 100},
          {title: '显示顺序', field: 'role_sort', align: 'center', width: 100},
          {
            title: '状态', field: 'status', align: 'center', width: '100px',
            title: '状态', field: 'status', align: 'center', width: 100,
            switch: row => {
              const result = {}
              if (row.status == 0) {
@@ -314,11 +213,11 @@
              return result
            }
          },
          // {title: '备注', field: 'remark', align: 'left', width: '250px'},
          {title: '备注', field: 'remark', align: 'left', minWidth: 200},
        ],
        // 操作信息
        operation: {
          // width: 150,
          width: 150,
          align: 'center',
          show: true, // 显示操作列
          attr: [
@@ -368,6 +267,9 @@
      },
      // 表单参数
      form: {
        role_name: '',
        role_key: '',
        role_sort: '',
        data_scope: 1,
        status: 1
      },
@@ -395,45 +297,43 @@
  methods: {
    fifterForm(params) {
      this.queryParams = Object.assign(this.queryParams, params)
      // this.queryParams.status = 0
      this.search(1)
    },
    // 查询table列表
    search(pageNum) {
      if (pageNum != undefined) {
        this.$refs.myTable.search(pageNum)
        this.$refs.myTable.search({pageNum})
      } else {
        this.$refs.myTable.search()
      }
    },
    /** 获取顶级机构列表选择框 2022-12-15 */
    getRootOrgList() {
      this.loading = true;
      listOrgRoot().then(response => {
        this.rootOrgList = response;
        this.selectedRootOrgId = this.rootOrgList[0].id;
        this.queryParams.orgId = this.selectedRootOrgId;
        this.loading = false;
      }).then(() => {
        this.tableShow = true
        this.search(1);
      }).catch(function () {
        // this.loading = false;
        this.$nextTick(() => {
          this.search(1);
        })
      });
    },
    /** 查询角色列表 */
    getList() {
      this.loading = true;
      this.selectedRootOrgId = this.queryParams.orgId;
      listRole(this.queryParams).then(response => {
          this.roleList = response.datas;
          this.total = response.totalRows;
          this.loading = false;
        }
      );
    },
    /** 查询菜单树结构 */
    getMenuTreeselect() {
      menuTreeselect().then(response => {
    async getMenuTreeselect() {
      await menuTreeselect().then(response => {
        this.menuOptions = response;
      });
    },
@@ -480,7 +380,7 @@
      let text = row.status == 0 ? "禁用" : "启用";
      this.$modal.confirm('确认要' + text + '"' + row.role_name + '"角色吗?').then(function () {
        row.status = row.status == 0 ? 1 : 0;
        return changeRoleStatus(row.role_id, row.status);
        return changeRoleStatus(row);
      }).then(() => {
        this.$modal.msgSuccess(text + "成功");
        this.search();
@@ -503,23 +403,24 @@
      if (this.$refs.menu != undefined) {
        this.$refs.menu.setCheckedKeys([]);
      }
      this.menuExpand = false,
        this.menuNodeAll = false,
        this.deptExpand = true,
        this.deptNodeAll = false,
        this.form = {
          org_id: undefined, // 顶级机构ID
          role_id: undefined,
          role_name: undefined,
          role_key: "None",
          role_sort: 0,
          status: 0,
          menuIds: [],
          deptIds: [],
          menu_check_strictly: true,
          dept_check_strictly: true,
          remark: undefined
        };
      this.menuExpand = false
      this.menuNodeAll = false
      this.deptExpand = true
      this.deptNodeAll = false
      this.form = {
        org_id: undefined, // 顶级机构ID
        role_id: undefined,
        role_name: undefined,
        data_scope: this.$store.getters.userInfo ? this.$store.getters.userInfo.lv : 1,
        role_key: "None",
        role_sort: 0,
        status: 0,
        menuIds: [],
        deptIds: [],
        menu_check_strictly: true,
        dept_check_strictly: true,
        remark: undefined
      };
      this.resetForm("form");
    },
    changeSize(e) {
@@ -593,13 +494,15 @@
      }
    },
    /** 新增按钮操作 */
    handleAdd() {
    async handleAdd() {
      this.loading = true
      this.reset();
      this.getMenuTreeselect();
      await this.getMenuTreeselect();
      // 2022-12-18 添加上顶级机构ID
      this.form.org_id = this.selectedRootOrgId;
      this.open = true;
      this.title = "添加角色";
      this.loading = false
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
@@ -607,6 +510,7 @@
      // const roleId = row.role_id || this.ids
      const roleId = row.role_id;
      const roleMenu = this.getRoleMenuTreeselect(roleId);
      this.loading = true
      getRole(roleId).then(response => {
        this.form = response;
        this.open = true;
@@ -623,6 +527,9 @@
          });
        });
        this.title = "修改角色";
        this.loading = false
      }).catch(() => {
        this.loading = false
      });
    },
    /** 选择角色权限范围触发 */
@@ -658,20 +565,22 @@
          // 2022-12-19,把这两个字段设置为数值,目前暂不使用,要不后台类型转换错误(boolean)
          this.form.menu_check_strictly = 1;
          this.form.dept_check_strictly = 1;
          // 2023-11-30 增加默认data_scope为1
          // this.form.data_scope = 1;
          if (this.form.role_id != undefined) {
            this.form.menuIds = this.getMenuAllCheckedKeys();
            updateRole(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
              this.search()
            });
          } else {
            this.form.menuIds = this.getMenuAllCheckedKeys();
            addRole(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
              this.search()
            });
          }
        }
@@ -694,7 +603,7 @@
      this.$modal.confirm('是否确认删除角色为"' + row.role_name + '"的数据项?').then(function () {
        return delRole(roleIds);
      }).then(() => {
        this.this.search();
        this.search();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {
      });