UA 权限管理

he wei

2022-09-02 e6c473f6c027e6fa0bbe688935655d3ecf61de6f

UA 权限管理

 src/pages/permission/apis.js

New file
@@ -0,0 +1,90 @@
import axios from "@/assets/axios";

/**
 * 查询所有的权限组及其下的所有权限和用户信息
 * @returns 
 */
export const getList = () => {
  return axios({
    method: "GET",
    url: "permitGroup/getAllGroup"
  })
}
/**
 * 添加权限组
 * @returns 
 */
export const addGroup = (groupName) => {
  return axios({
    method: "GET",
    url: "permitGroup/addGroup",
    params: { groupName }
  })
}
/**
 * 删除权限组
 * @returns 
 */
export const delGroup = (groupId) => {
  return axios({
    method: "GET",
    url: "permitGroup/delGroup",
    params: { groupId }
  })
}
/**
 * 查询所有用户 列表 不分页
 * @returns 
 */
export const getUserList = () => {
  return axios({
    method: "GET",
    url: "permitGroup/getAllDocUser"
  })
}
/**
 * 查询所有用户 列表 不分页
 * @returns 
 */
export const getAllPermit = () => {
  return axios({
    method: "GET",
    url: "permitGroup/getAllPermit"
  })
}

/**
 * 权限组下 权限
 * @returns 
 */
export const opreatePermitToGroup = (data) => {
  return axios({
    method: "POST",
    url: "permitGroup/opreatePermitToGroup",
    data
  })
}

/**
 * 权限组下 用户
 * @returns 
 */
export const opreateUserToGroup = (data) => {
  return axios({
    method: "POST",
    url: "permitGroup/opreateUserToGroup",
    data
  })
}

/**
 * 编辑权限组名
 * @returns 
 */
export const updateGroup = (groupId, groupName) => {
  return axios({
    method: "GET",
    url: "permitGroup/updateGroup",
    params: { groupId, groupName }
  })
}

 src/pages/permission/index.js

New file
@@ -0,0 +1,2 @@
import List from './list';
export default List;

 src/pages/permission/list.vue

New file
@@ -0,0 +1,512 @@
<template>
  <div class="main">
    <a-space class="operator">
      <span class="title">权限组列表</span>
      <a-button type="primary" @click="addGroup">新增权限组</a-button>
    </a-space>
    <div class="content">
      <div class="inner" ref="tableWrap">
        <a-spin :spinning="spinning" tip="拼命加载中...">
          <a-table
            ref="aTable"
            :scroll="{ y }"
            bordered
            :columns="columns"
            :data-source="dataSource"
            :pagination="false"
            row-key="groupId"
          >
            <template slot="users" slot-scope="text, record">
              <a-space>
                <template v-if="record.users.length <= 3">
                  <a-tag
                    v-for="(item, idx) in record.users"
                    :key="'user_' + idx"
                    >{{ item.name }}</a-tag
                  >
                </template>
                <template v-else>
                  <a-tag
                    v-for="(item, idx) in record.users.slice(0, 2)"
                    :key="'user_' + idx"
                    >{{ item.name }}</a-tag
                  >
                  <a-popover title="用户列表" trigger="hover">
                    <template #content>
                      <div class="" style="width: 500px">
                        <a-table
                          size="small"
                          :scroll="{ y: 500 }"
                          bordered
                          :columns="userColumns"
                          :data-source="record.users"
                          :pagination="false"
                          rowKey="idx"
                        >
                        </a-table>
                      </div>
                    </template>
                    <a-tag>更多</a-tag>
                  </a-popover>
                </template>
              </a-space>
            </template>
            <template slot="permits" slot-scope="text, record">
              <a-space>
                <template v-if="record.permits.length <= 3">
                  <a-tag
                    v-for="(item, idx) in record.permits"
                    :key="'permit_' + idx"
                    >{{ item.permitName }}</a-tag
                  >
                </template>
                <template v-else>
                  <a-tag
                    v-for="(item, idx) in record.permits.slice(0, 2)"
                    :key="'permit_' + idx"
                    >{{ item.permitName }}</a-tag
                  >
                  <a-popover title="权限列表" trigger="hover">
                    <template #content>
                      <div class="" style="width: 500px">
                        <a-table
                          size="small"
                          :scroll="{ y: 500 }"
                          bordered
                          :columns="permitColumns"
                          :data-source="record.permits"
                          :pagination="false"
                          rowKey="idx"
                        >
                        </a-table>
                      </div>
                    </template>
                    <a-tag>更多</a-tag>
                  </a-popover>
                </template>
              </a-space>
            </template>
            <template slot="action" slot-scope="text, record">
              <a @click="showRename(record)">重命名</a>
              <a-divider type="vertical"></a-divider>
              <a-popconfirm title="是否删除?" @confirm="remove(record)">
                <a>删除</a>
              </a-popconfirm>
              <a-divider type="vertical"></a-divider>
              <a @click="editUser(record)">用户</a>
              <a-divider type="vertical"></a-divider>
              <a @click="editPermit(record)">权限</a>
            </template>
          </a-table>
        </a-spin>
      </div>
    </div>
    <a-modal
      :visible="renameShow"
      :width="300"
      :title="nameTitle"
      :destroyOnClose="true"
      :maskClosable="false"
      @cancel="renameCancel"
      @ok="renameOk"
    >
      <div class="">权限组名称</div>
      <a-input v-model="newName" placeholder="请输入权限组名称"></a-input>
    </a-modal>
    <a-modal
      class="centerModal"
      :visible="updateUserShow"
      :width="800"
      title="更改权限组用户"
      :destroyOnClose="true"
      :maskClosable="false"
      @cancel="updateUserCancel"
      @ok="updateUserOk"
    >
      <a-transfer
        :data-source="optionsData"
        show-search
        :titles="['其他用户', '已选中']"
        :list-style="{
          width: '276px',
          height: '400px',
        }"
        :operations="['添加', '移除']"
        :target-keys="targetKeys"
        :render="(item) => item.title"
        @change="handleChange"
      >
        <span slot="notFoundContent"> 没数据 </span>
      </a-transfer>
    </a-modal>
    <a-modal
      class="centerModal"
      :visible="updatePermitShow"
      :width="400"
      title="更改权限"
      :destroyOnClose="true"
      :maskClosable="false"
      @cancel="updatePermitCancel"
      @ok="updatePermitOk"
    >
      <a-tree
        checkable
        :selectable="false"
        :checkedKeys="checkedKeys"
        defaultExpandAll
        :tree-data="treeData"
        @check="onCheck"
      />
    </a-modal>
  </div>
</template>

<script>
import { mapGetters } from 'vuex';
import {
  getList,
  updateGroup,
  delGroup,
  addGroup,
  getUserList,
  opreateUserToGroup,
  getAllPermit,
  opreatePermitToGroup,
} from "./apis";
export default {
  name: "",

  data() {
    return {
      update: -1,
      updatePermitShow: false,
      checkedKeys: [],
      permits: [],
      permits1: [],
      treeData: [],
      optionsData: [],
      targetKeys: [],
      targetKeys1: [],
      updateUserShow: false,
      isAdd: true,
      renameShow: false,
      currId: "",
      oldName: "",
      newName: "",
      spinning: false,
      y: 500,
      columns: [
        {
          title: "权限组名称",
          dataIndex: "groupName",
          align: "center",
          width: 180,
        },
        {
          title: "组员",
          dataIndex: "users",
          align: "center",
          width: 180,
          scopedSlots: { customRender: "users" },
        },
        {
          title: "权限",
          dataIndex: "permits",
          align: "center",
          width: 180,
          scopedSlots: { customRender: "permits" },
        },
        {
          title: "操作",
          dataIndex: "operation",
          align: "center",
          width: 100,
          scopedSlots: { customRender: "action" },
        },
      ],
      dataSource: [],
      userColumns: [
        {
          title: "用户名",
          dataIndex: "name",
          align: "center",
        },
      ],
      permitColumns: [
        {
          title: "权限名称",
          dataIndex: "permitName",
          align: "center",
        },
      ],
    };
  },
  components: {},
  computed: {
    ...mapGetters("setting", ["affixed"]),
    nameTitle() {
      return this.isAdd ? "新增权限组" : "重命名权限组";
    },
  },
  watch: {
    update(n) {
      if (-1 != n) {
        this.$nextTick(() => {
          const wrap = this.$refs.tableWrap;
          const header = document.querySelectorAll(
            ".content .ant-table-header"
          )[0].clientHeight;
          const wraper = wrap.clientHeight;
          const h = wraper - header;
          this.y = h;
        });
      }
    },
    affixed() {
      setTimeout(() => {
        this.update = Math.random();
      }, 200);
    },
  },
  methods: {
    test(data) {
      console.log(data);
    },
    getList() {
      this.spinning = true;
      getList().then((res) => {
        let { code, data, data2, msg } = res.data;
        let list = [];
        if (code && data) {
          list = data2;
        }
        this.spinning = false;
        this.dataSource = list;
        if (-1 == this.update) {
          this.update = Math.random();
        }
      });
    },
    showRename(obj) {
      const { groupId, groupName } = obj;
      this.newName = groupName;
      this.oldName = groupName;
      this.currId = groupId;
      this.isAdd = false;
      this.renameShow = true;
    },
    renameCancel() {
      this.renameShow = false;
    },
    renameOk() {
      if (this.newName.trim() == "") {
        this.$message.warn("请输入权限组名称");
        return false;
      }
      if (!this.isAdd && this.newName.trim() == this.oldName) {
        this.$message.warn("权限组名并未发生改变");
        return false;
      }
      if (this.isAdd) {
        addGroup(this.newName).then((res) => {
          let { code, data, msg } = res.data;
          if (code && data) {
            this.$message.success("操作成功");
            this.renameShow = false;
            this.getList();
          } else {
            this.$message.error(msg);
          }
        });
      } else {
        updateGroup(this.currId, this.newName).then((res) => {
          let { code, data, msg } = res.data;
          if (code && data) {
            this.$message.success("操作成功");
            this.renameShow = false;
            this.getList();
          } else {
            this.$message.error(msg);
          }
        });
      }
    },
    remove(obj) {
      const { groupId } = obj;
      delGroup(groupId).then((res) => {
        let { code, data, msg } = res.data;
        if (code && data) {
          this.$message.success("操作成功");
          this.getList();
        } else {
          this.$message.error(msg);
        }
      });
    },
    addGroup() {
      this.isAdd = true;
      this.newName = "";
      this.renameShow = true;
    },
    editUser(obj) {
      const { users, groupId } = obj;
      this.currId = groupId;
      this.targetKeys = users.map((v) => v.name);
      this.targetKeys1 = this.targetKeys.map((v) => v);
      this.updateUserShow = true;
    },
    updateUserCancel() {
      this.updateUserShow = false;
    },
    updateUserOk() {
      let groupId = this.currId;
      // 比较用户列表的差异
      let addusers = [],
        delusers = [];
      addusers = this.targetKeys
        .filter((v) => !this.targetKeys1.some((val) => v == val))
        .map((v) => ({ uname: v, groupId }));
      delusers = this.targetKeys1
        .filter((v) => !this.targetKeys.some((val) => val == v))
        .map((v) => ({ uname: v, groupId }));
      opreateUserToGroup({ addusers, delusers }).then((res) => {
        const { code, data, msg } = res.data;
        if (code && data) {
          this.$message.success("操作成功");
          this.getList();
          this.updateUserShow = false;
        } else {
          this.$message.error(msg);
        }
      });
    },
    handleChange(targetKeys, direction, moveKeys) {
      // console.log(targetKeys, direction, moveKeys);
      this.targetKeys = targetKeys;
    },
    // 查询所有用户 不分页
    getAllUsers() {
      getUserList().then((res) => {
        let { code, data, data2 } = res.data;
        let list = [];
        if (code && data) {
          list = data2.map((v) => ({
            key: v.name,
            title: v.name,
          }));
        }
        this.optionsData = list;
      });
    },
    onCheck(checkedKeys, info) {
      console.log("onCheck", checkedKeys, info);
      this.checkedKeys = checkedKeys;
      this.permits = checkedKeys.filter((v) => /^1/.test(v));
    },
    getAllPermit() {
      getAllPermit().then((res) => {
        let { code, data, data2, msg } = res.data;
        let list = [];
        if (code && data) {
          list = data2.map((v) => {
            let children = v.permitList.map((val) => {
              return {
                ...val,
                title: val.permitName,
                key: val.permitId,
              };
            });
            return {
              title: v.categoryName,
              children,
              key: v.categoryId,
            };
          });
        }
        this.treeData = list;
      });
    },
    editPermit(obj) {
      this.permits1 = obj.permits.map((v) => v.permitId);
      this.checkedKeys = obj.permits.map((v) => v.permitId);
      this.currId = obj.groupId;
      this.updatePermitShow = true;
    },
    updatePermitCancel() {
      this.updatePermitShow = false;
    },
    updatePermitOk() {
      let groupId = this.currId;
      // 比较用户列表的差异
      let addpermits = [],
        delpermits = [];
      addpermits = this.permits
        .filter((v) => !this.permits1.some((val) => v == val))
        .map((v) => ({ permitId: v, groupId }));
      delpermits = this.permits1
        .filter((v) => !this.permits.some((val) => val == v))
        .map((v) => ({ permitId: v, groupId }));
      opreatePermitToGroup({ addpermits, delpermits }).then((res) => {
        const { code, data, msg } = res.data;
        if (code && data) {
          this.$message.success("操作成功");
          this.getList();
          this.updatePermitShow = false;
        } else {
          this.$message.error(msg);
        }
      });
    },
    resize() {
      setTimeout(() => {
        this.update = Math.random();
      }, 200);
    },
    activeFN() {
      this.resize();
    },
  },

  mounted() {
    this.getList();
    this.getAllUsers();
    this.getAllPermit();
    window.addEventListener("resize", this.resize);
  },
  destroyed() {
    window.removeEventListener("resize", this.resize);
  },
};
</script>

<style lang="less" scoped>
.main {
  height: 100%;
  display: flex;
  flex-direction: column;
  .content {
    flex: 1;
    position: relative;
    .inner {
      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
    }
  }
}
.operator {
  padding: 8px 0;
  .title {
    font-size: 18px;
    color: rgba(0, 0, 0, 0.85);
    font-weight: 700;
  }
}
.centerModal /deep/ .ant-modal-body {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
</style>

 src/pages/resourceManage/materialsCenter/list.vue

@@ -169,7 +169,7 @@
          searchAble: true,
        },
        {
          title: "子件编码",
          title: "编码",
          dataIndex: "subCode",
          key: "subCode",
          align: "center",
@@ -177,7 +177,7 @@
          searchAble: true,
        },
        {
          title: "子件型号",
          title: "型号",
          dataIndex: "subModel",
          key: "subModel",
          width: 180,
@@ -185,7 +185,7 @@
          align: "center",
        },
        {
          title: "子件名称",
          title: "名称",
          dataIndex: "subName",
          key: "subName",
          align: "center",
@@ -198,14 +198,6 @@
          key: "unit",
          align: "center",
          width: 80,
          noSearch: true,
        },
        {
          title: "子件数量",
          dataIndex: "quantity",
          key: "quantity",
          align: "center",
          width: 120,
          noSearch: true,
        },
        {
@@ -491,6 +483,9 @@
      document.body.removeChild(link);
      downloadLog(parentModel, subModel);
    },
    activeFN() {
      this.resize();
    }
  },
  watch: {
    update(n) {

 src/pages/resourceManage/product/apis.js

@@ -57,4 +57,16 @@
    url: "worksheetMain/submit",
    data
  })
}
/**
 * 产品指定版本的激活 锁定
 * customCode=1&enabled=1&parentCode=1&version=1
 * @returns 
 */
export const setpHistoryEnable = (params) => {
  return axios({
    method: "GET",
    url: "product/setpHistoryEnable",
    params
  })
}

 src/pages/resourceManage/product/details/details.vue

@@ -89,13 +89,13 @@
            <a-button
              type="primary"
              v-if="!currentVersion.enabled"
              @click="showSoftwareDownload"
              @click="changeStatus"
              >激活版本</a-button
            >
            <a-button
              type="primary"
              v-if="currentVersion.enabled"
              @click="showSoftwareDownload"
              @click="changeStatus"
              >锁定版本</a-button
            >
          </template>
@@ -137,6 +137,7 @@
import List from "./list";
import getWebUrl from "@/assets/js/tools/getWebUrl";
import { getVersions, zipDownload, getBomHistoryAndMaterial } from "./apis";
import { setpHistoryEnable } from "../apis";
import { dwgReview } from "@/pages/workplace/apis";
import { downloadLog } from "@/pages/system/logs/apis";
import { mapGetters } from "vuex";
@@ -346,17 +347,6 @@
        if (code && data) {
          list = data2;
        }
        list.push({
          id: -33,
          parentCode: "0950000019",
          parentName: "单体锂电池维护仪",
          parentModel: "LIFG-0530CT",
          notes: null,
          customCode: "",
          createTime: "2021-08-29 13:53:06",
          version: 2,
          enabled: 0,
        });
        this.versionList = list;
      });
    },
@@ -416,7 +406,9 @@
    },
    downloadLog(record) {
      const { parentModel, subModel, dwgUrl, softwareUrl } = record;
      const url = softwareUrl ? this.webUrl + softwareUrl : this.webUrl + dwgUrl;
      const url = softwareUrl
        ? this.webUrl + softwareUrl
        : this.webUrl + dwgUrl;
      let link = document.createElement("a");
      link.style.display = "none";
      link.href = url;
@@ -463,6 +455,24 @@
    diff(data) {
      console.log("比较两个版本", data);
    },
    changeStatus() {
      let {
        currentVersion: { customCode, parentCode, enabled, version },
      } = this;
      enabled = !enabled * 1;
      setpHistoryEnable({customCode, parentCode, enabled, version}).then((res) => {
        let {
          code,
          data,
        } = res.data;
        if (code && data) {
          this.$message.success('操作成功');
        } else {
          this.$message.error('操作失败');
        }

      });
    },
  },
  mounted() {
    this.getVersions();

 src/pages/resourceManage/product/list.vue

@@ -43,6 +43,9 @@
                </a-upload>
              </a-space>
            </template>
            <template slot="isNormal" slot-scope="{ record }">
              {{ record.customCode == "" ? "是" : "否" }}
            </template>
            <template slot="action" slot-scope="{ record }">
              <a @click="upload(record)">上传软件</a>
              <a-divider type="vertical"></a-divider>
@@ -260,7 +263,7 @@
      conditions: {},
      columns: [
        {
          title: "母料编号",
          title: "编号",
          dataIndex: "parentCode",
          key: "parentCode",
          width: 130,
@@ -268,7 +271,7 @@
          searchAble: true,
        },
        {
          title: "母料型号",
          title: "型号",
          dataIndex: "parentModel",
          key: "parentModel",
          align: "center",
@@ -276,7 +279,7 @@
          searchAble: true,
        },
        {
          title: "母料名称",
          title: "名称",
          dataIndex: "parentName",
          key: "parentName",
          align: "center",
@@ -288,8 +291,17 @@
          dataIndex: "customCode",
          key: "customCode",
          align: "center",
          noSearch: true,
          width: 160,
          searchAble: true,
        },
        {
          title: "标准机型",
          dataIndex: "isNormal",
          dataType: "boolean",
          align: "center",
          searchAble: true,
          width: 100,
          scopedSlots: { customRender: "isNormal" },
        },
        {
          title: "创建时间",
@@ -488,10 +500,29 @@
      if (!this.isWSOpen) {
        return false;
      }
      const { pageCurr, pageSize, conditions } = this;
      const { pageCurr, pageSize, conditions, columns } = this;
      let params = {};
      Object.keys(conditions).forEach((v) => {
        params[v] = conditions[v];
        switch (v) {
          case "isNormal":
            if (conditions[v]) {
              params["customCode"] = "";
              columns.forEach((val) => {
                if(val.dataIndex == 'customCode') {
                  val.search.value = '';
                }
              });
            }
            break;
          case "customCode":
            if (params["customCode"] == undefined) {
              params[v] = conditions[v];
            }
            break;
          default:
            params[v] = conditions[v];
            break;
        }
      });
      let data = {
        pageSize,
@@ -601,6 +632,9 @@
    },
    customCancel() {
      this.customShow = false;
    },
    activeFN() {
      this.resize();
    }
  },
  watch: {
@@ -631,6 +665,11 @@
        });
      }
    },
    affixed() {
      setTimeout(() => {
        this.update = Math.random();
      }, 200);
    },
  },
  computed: {
    ...mapGetters("account", [
@@ -639,6 +678,7 @@
      "projectManagerList",
      "generalManagerList",
    ]),
    ...mapGetters("setting", ["affixed"]),
  },
  mounted() {
    this.getUserByRoleId();

 src/router/config.js

@@ -133,6 +133,27 @@
            }
          ]
        },
        {
          path: 'permission',
          name: '权限',
          meta: {
            icon: 'apartment',
            page: {
              cacheAble: false
            },
            authority: {
              role: '1004',
            }
          },
          component: BlankView,
          children: [
            {
              path: 'list',
              name: '权限管理',
              component: () => import('@/pages/permission'),
            }
          ]
        },
      ]
    },
  ]