最新版本541200007

doum

2025-09-19 9b8baee48d0bdd95ea157be10e7c24711c511dc1

 admin/src/views/system/menu.vue

@@ -1,14 +1,23 @@
<template>
  <TableLayout class="menu-layout" :permissions="['system:menu:query']">
    <el-form ref="searchForm" slot="search-form"   label-width="100px" inline>
      <div class="platgroup_tabs">
        <div class="tab" :class="{ active: activeGroup === item.id }" @click="groupClick(item)"
             v-for="(item, i) in groupList" :key="i">
          {{ item.name }}
        </div>
      </div>
    </el-form>
    <!-- 表格和分页 -->
    <template v-slot:table-wrap>
      <ul class="toolbar" v-permissions="['system:menu:create', 'system:menu:delete', 'system:menu:sort']">
        <li><el-button type="primary" @click="$refs.operaMenuWindow.open('新建一级菜单')" icon="el-icon-plus" v-permissions="['system:menu:create']">新建</el-button></li>
        <li><el-button type="primary" @click="$refs.operaMenuWindow.open(activeGroup==0?'新建一级菜单':'新建顶部导航菜单',null,null,activeGroup)" icon="el-icon-plus" v-permissions="['system:menu:create']">新建</el-button></li>
        <li><el-button @click="deleteByIdInBatch" icon="el-icon-delete" v-permissions="['system:menu:delete']">删除</el-button></li>
        <li><el-button @click="sort('top')" :loading="isWorking.sort" icon="el-icon-sort-up" v-permissions="['system:menu:sort']">上移</el-button></li>
        <li><el-button @click="sort('bottom')" :loading="isWorking.sort" icon="el-icon-sort-down" v-permissions="['system:menu:sort']">下移</el-button></li>
      </ul>
      <el-table
        :height="tableHeightNew"
        ref="table"
        v-loading="isWorking.search"
        :data="tableData.list"
@@ -19,14 +28,14 @@
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" fixed="left"></el-table-column>
        <el-table-column prop="name" label="菜单名称"  fixed="left" min-width="160px"></el-table-column>
        <el-table-column prop="icon" label="图标" min-width="80px" class-name="table-column-icon">
        <el-table-column prop="name" label="菜单名称"  fixed="left" min-width="160px" show-tooltip-when-overflow></el-table-column>
        <el-table-column prop="icon" v-if="activeGroup !== 1" label="图标" min-width="80px" class-name="table-column-icon">
          <template slot-scope="{row}">
            <i v-if="row.icon != null && row.icon !== ''" :class="{[row.icon]: true}"></i>
            <template v-else>未设置</template>
          </template>
        </el-table-column>
        <el-table-column prop="path" label="访问路径" min-width="140px"></el-table-column>
        <el-table-column prop="path" label="访问路径" show-tooltip-when-overflow min-width="220px"></el-table-column>
        <el-table-column prop="params" label="参数" min-width="120px"></el-table-column>
        <el-table-column prop="remark" label="备注" min-width="120px"></el-table-column>
        <el-table-column prop="createUser" label="创建人" min-width="100px">
@@ -37,7 +46,7 @@
          <template slot-scope="{row}">{{row.updateUserInfo == null ? '' : row.updateUserInfo.username}}</template>
        </el-table-column>
        <el-table-column prop="updateTime" label="更新时间" min-width="140px"></el-table-column>
        <el-table-column prop="disabled" label="是否启用" min-width="80px">
        <el-table-column prop="disabled" label="是否启用" min-width="80px" fixed="right">
          <template slot-scope="{row}">
            <el-switch v-model="row.disabled" :active-value="false" :inactive-value="true" @change="switchDisabled(row)"/>
          </template>
@@ -49,8 +58,8 @@
          fixed="right"
        >
          <template slot-scope="{row}">
            <el-button type="text" icon="el-icon-edit" @click="$refs.operaMenuWindow.open('编辑菜单', row)" v-permissions="['system:menu:update']">编辑</el-button>
            <el-button type="text" icon="el-icon-plus" @click="$refs.operaMenuWindow.open('新建子菜单', null, row)" v-permissions="['system:menu:create']">新建子菜单</el-button>
            <el-button type="text" icon="el-icon-edit" @click="$refs.operaMenuWindow.open('编辑菜单', row,null,activeGroup)" v-permissions="['system:menu:update']">编辑</el-button>
            <el-button v-if="activeGroup !== 1" type="text" icon="el-icon-plus" @click="$refs.operaMenuWindow.open('新建子菜单', null, row,activeGroup)" v-permissions="['system:menu:create']">新建子菜单</el-button>
            <el-button v-if="!row.fixed" type="text" icon="el-icon-delete" @click="deleteById(row)" v-permissions="['system:menu:delete']">删除</el-button>
          </template>
        </el-table-column>
@@ -73,16 +82,22 @@
  data () {
    return {
      // 是否正在处理中
      activeGroup: 0,
      groupList:[{id:0,name: "服务中心菜单"},{id:1,name: "顶部导航配置"}],
      isWorking: {
        sort: false
      }
    }
  },
  methods: {
    groupClick(item){
      this.activeGroup = item.id
      this.handlePageChange();
    },
    // 查询数据
    handlePageChange () {
      this.isWorking.search = true
      fetchTree()
      fetchTree({type: this.activeGroup})
        .then(records => {
          this.tableData.list = records
        })
@@ -205,9 +220,29 @@

<style lang="scss" scoped>
@import "@/assets/style/variables.scss";
.platgroup_tabs {
  flex: 1;
  display: flex;
  border-bottom: 1px solid #dfe2e8;

  .tab {
    color: #666666;
    margin-right: 40px;
    cursor: pointer;
    padding-bottom: 18px;
    border-bottom: 2px solid #fff;
  }

  .active {
    font-weight: 500;
    font-size: 15px;
    color: #222222;
    border-bottom: 2px solid $primary-color;
  }
}
.menu-layout {
  /deep/ .table-content {
    margin-top: 0;
    margin-top: 0px;
  }
}
// 图标列