按钮级别的新版本,多级别的组织架构
loulijun2021
2023-08-09 1ec6e15f8a7d351ce8537567cf6e956e99d4167f
1.编码规格完成90%
已修改6个文件
106 ■■■■■ 文件已修改
src/layout/components/Navbar.vue 8 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/layout/components/Sidebar/index.vue 7 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/store/modules/permission.js 55 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/basicSettings/roleList.vue 6 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/login/index.vue 7 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/systemSetting/encodingRules.vue 23 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/layout/components/Navbar.vue
@@ -243,7 +243,7 @@
  mounted() {
    // this.getHubConnectionBuilder()
    this.getButtonData()
    Vue.prototype.$ButtonData = JSON.parse(sessionStorage.getItem('ButtonData'))
  },
  computed: {
    ...mapGetters([
@@ -275,12 +275,6 @@
    }
  },
  methods: {
    // 获取全局按钮键值对
    async  getButtonData() {
      const { data: res } = await ButtonData()
      Vue.prototype.$ButtonData = res // 用于全局
    },
    // 建立hub连接
    async getHubConnectionBuilder() {
      const url = 'http://121.196.36.24:8019/chatHub'
src/layout/components/Sidebar/index.vue
@@ -57,6 +57,7 @@
import SidebarItem from './SidebarItem'
import variables from '@/styles/variables.scss'
import { removeCookie, setCookie } from '@/utils/auth'
import Vue from 'vue'
export default {
  components: { SidebarItem, Logo },
@@ -76,10 +77,14 @@
    activeMenu() {
      const route = this.$route
      const { meta, path } = route
      console.log(meta, path, 7)
      // if set path, the sidebar will highlight the path you set
      removeCookie('ruleCode')
      setCookie('ruleCode', meta.code)// 将编码规则code存到cookie里面
      Vue.prototype.$buttoncode = meta.buttoncode
      Vue.prototype.$datacode = meta.datacode
      // setCookie('buttoncode', meta.buttoncode)//  按钮权限
      // setCookie('datacode', meta.datacode)//  数据权限
      if (meta.activeMenu) {
        return meta.activeMenu
      }
src/store/modules/permission.js
@@ -1,23 +1,12 @@
import { asyncRoutes, asyncRoutesCloud, commonRoutes } from '@/router'
import Layout from '@/layout'
import { getCookie } from '@/utils/auth'
// 判断是否有权限
function hasPermission(roles, route) {
  if (route.meta && route.meta.role) {
    return roles.some(role => route.meta.role.includes(role))
  } else {
    return true
  }
}
import { asyncRoutes, commonRoutes } from '@/router'
/**
 * 把后台返回菜单组装成routes要求的格式
 * @param {*} routes
 * @param {*} menu
 */
export function getAsyncRoutes(routes, menu) {
  console.log(routes, menu, 6)
  // routes 是route.js的路由
  // menu   是接口返回的路由
  // menu  中flag  "0" 表示 true  "1"表示false
  const menuCode = []// 将后端code取出存成数组形式
  const menuNameAndCode = []// 将后端code与name取出存成数组形式
@@ -29,7 +18,7 @@
        item.children.forEach(it => {
          if (it.flag === '0') {
            menuCode.push(it.code)
            menuNameAndCode.push({ code: it.code, name: it.name })
            menuNameAndCode.push({ code: it.code, name: it.name, buttoncode: it.buttoncode, datacode: it.datacode })
          }
        })
      }
@@ -45,7 +34,10 @@
      let flag = false// 判断是否有children存进去
      item.children.forEach(it => {
        if (menuCode.includes(it.code)) {
          it.meta.title = menuNameAndCode.find(item2 => item2.code === it.code).name
          const t = menuNameAndCode.find(item2 => item2.code === it.code)
          it.meta.title = t.name
          it.meta.buttoncode = t.buttoncode
          it.meta.datacode = t.datacode
          children.push(it)
          flag = true
        }
@@ -69,22 +61,6 @@
  return newRoutes
}
// 过滤出有权限的路由
export function filterAsyncRoutes(routes, roles) {
  const res = []
  routes.forEach(route => {
    const tmp = { ...route }
    if (hasPermission(roles, tmp)) {
      if (tmp.children) {
        tmp.children = filterAsyncRoutes(tmp.children, roles)
      }
      res.push(tmp)
    }
  })
  return res
}
const state = {
  routes: commonRoutes,
  addRouters: []
@@ -100,19 +76,8 @@
const actions = {
  generateRoutes({ commit }, menu) {
    return new Promise(resolve => {
      // const newRoutes = getAsyncRoutes(asyncRoutes, menu)
      let newRoutes
      if (getCookie('cloud')) {
        const arr = menu.map(i => i.code)
        newRoutes = asyncRoutesCloud.filter(i => {
          if (arr.includes(i.code)) {
            return i
          }
        })
        newRoutes.push({ path: '*', redirect: '/404', hidden: true })
      } else {
        newRoutes = getAsyncRoutes(asyncRoutes, menu)
      }
      const newRoutes = getAsyncRoutes(asyncRoutes, menu)
      commit('SET_ROUTES', newRoutes)
      resolve(newRoutes)
    })
src/views/basicSettings/roleList.vue
@@ -463,7 +463,7 @@
    },
    // 单个按钮改变
    handleCheckedButtonChange(oldValue, index, code, newValue, flag) {
      console.log(oldValue, index, code, newValue, 2)
      // console.log(oldValue, index, code, newValue, 2)
      // 判断是否包含在内
      if (!flag) {
        if (!this.menuCheckedCodeArr.includes(code) && oldValue.length === 0 && newValue.length === 1) { // 否
@@ -528,7 +528,6 @@
    // 处理中间树形选中值改变
    handleTreeCenterCheckChange(obj, selfChecked, selfChildrenTreeCheck) {
      // console.log(obj, selfChecked, selfChildrenTreeCheck, '王老吉')
      console.log(selfChecked, 10)
      if (!selfChildrenTreeCheck) {
        if (!selfChecked) { // 从选中到不选中
          obj.buttonChecked = []
@@ -536,7 +535,6 @@
          this.menuCheckedCodeArr = this.menuCheckedCodeArr.filter(i => i !== obj.menucode)
        }
        if (selfChecked) { // 从不选中到选中
          console.log(obj, 9)
          obj.buttonCheckedCode = []
          this.treeCenter[0].children.forEach(item => {
            if (item.children && item.children.length) {
@@ -642,7 +640,7 @@
        }
      })
      console.log(arr, 'arr')
      // console.log(arr, 'arr')
      const rolecode = this.$refs.treeLeftRef.getCurrentKey()
      const res = await RolePermissionSava(JSON.stringify(arr), rolecode, this.activeName)
      if (res.code === '200') {
src/views/login/index.vue
@@ -144,6 +144,8 @@
import { validUsername } from '@/utils/validate'
import { getCookie, removeCookie, setCookie } from '@/utils/auth'
import { ForcedOffline } from '@/api/user'
import { ButtonData } from '@/api/basicSettings'
import Vue from 'vue'
export default {
  name: 'Login',
@@ -217,11 +219,14 @@
        if (valid) {
          this.loading = true
          this.$store.dispatch('user/login', this.loginForm).then(() => {
            console.log(getCookie('code') === '302', 9999)
            // console.log(getCookie('code') === '302', 9999)
            if (getCookie('code') === '302') {
              this.dialogVisible = true
            } else {
              this.$router.push({ path: this.redirect || '/' })
              ButtonData().then(res => {
                sessionStorage.setItem('ButtonData', JSON.stringify(res.data))
              })
            }
            this.loading = false
          }).catch(() => {
src/views/systemSetting/encodingRules.vue
@@ -2,7 +2,13 @@
  <div>
    <div class="body" :style="{height:mainHeight+'px'}">
      <div class="bodyTopButtonGroup">
        <el-button v-waves type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增</el-button>
        <el-button
          v-waves
          :style="{visibility:$buttoncode.includes('Add')?'':'hidden'}"
          type="primary"
          icon="el-icon-circle-plus-outline"
          @click="add('add')"
        >新增</el-button>
      </div>
      <div class="bodyTopFormGroup">
@@ -82,7 +88,7 @@
            sortable="custom"
          >
            <template slot-scope="{row}">
              <div>{{ dateType.find(i=>i.code===row.filingdate).name }}</div>
              <div>{{ dateType.find(i => i.code === row.filingdate).name }}</div>
            </template>
          </el-table-column>
          <el-table-column
@@ -97,6 +103,7 @@
            sortable="custom"
          />
          <el-table-column
            v-if="$buttoncode.toString().length"
            label="操作"
            width="120"
            fixed="right"
@@ -106,12 +113,16 @@
                <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                  <i
                    class="el-icon-edit-outline"
                    :style="{color:$store.state.settings.theme}"
                    :style="{color:$store.state.settings.theme,display:$buttoncode.includes('Update')?'':'none'}"
                    @click="edit('edit',row)"
                  />
                </el-tooltip>
                <el-tooltip v-del-tab-index class="item" effect="dark" content="删除" placement="top">
                  <i class="el-icon-delete" :style="{color:$store.state.settings.theme}" @click="del(row)" />
                  <i
                    class="el-icon-delete"
                    :style="{color:$store.state.settings.theme,display:$buttoncode.includes('Delete')?'':'none'}"
                    @click="del(row)"
                  />
                </el-tooltip>
              </div>
            </template>
@@ -219,7 +230,6 @@
  directives: { elDragDialog, waves },
  data() {
    return {
      mouseHoverType: 'mouseout',
      isExpandForm: false,
      mainHeight: 0,
      tableHeight: 0,
@@ -299,6 +309,7 @@
    this.getHeight()
    this.getCodeMenuSelect()
    console.log(this.$buttoncode)
  },
  methods: {
    async getCodeMenuSelect() {
@@ -309,7 +320,6 @@
        childrenProperty: 'children'
      })
      this.menuOptions = this.menuOptionsAll.filter(i => i.type === this.dialogForm.type)
      // console.log(this.menuOptions, 2)
    },
    radioChange() {
      this.menuOptions = this.menuOptionsAll.filter(i => i.type === this.dialogForm.type)
@@ -407,7 +417,6 @@
    dialogVisibleConfirm() {
      this.$refs.dialogForm.validate(valid => {
        if (valid) {
          // console.log(this.$refs.cascader.checkedValue, 1)
          const rightcode = this.$refs.cascader.checkedValue[this.$refs.cascader.checkedValue.length - 1]
          this.dialogForm.rightcode = rightcode
          this.dialogForm.rightname = this.menuOptions[this.menuOptions.findIndex(i => i.menucode === this.$refs.cascader.checkedValue[0])].children.find(i => i.menucode === rightcode).menuname