菜单管理

src/api/authority.js

@@ -0,0 +1,10 @@
+import { request } from '../axios/request'
+export default {
+    getMenuList (parames){
+        return request.get("/authority/getMenuList",parames)
+    },
+    //删除菜单
+    delMenu (parames){
+        return request.get("/authority/delMenu",parames)
+    },
+}

src/api/index.js

@@ -3,10 +3,10 @@ import user from './user'
 //==========================================
 import login from "@/api/login"
 import pub from "@/api/pub"
+import authority from "@/api/authority"
 export default {
-
     user,
-    //===============================================
     login,
-    pub
+    pub,
+    authority, //权限管理
 }

src/axios/request.js

@@ -18,7 +18,8 @@ instance.defaults.withCredentials=false
 instance.interceptors.request.use(function (config) {
  
   if(!token){
-      console.log("fffffffffffffff")
+      console.log("没有token,跳转到login")
+      window.location.href = "/login"
   }
   return Object.assign({}, config, {
     headers: {
@@ -36,10 +37,7 @@ instance.interceptors.request.use(function (config) {
  * 拦截响应response，并做一些错误处理
  */
 instance.interceptors.response.use((response) => {
- 
   let res = response.data
-  console.log("------------")
-  console.log("++++++++++++",res.code)
   if (res.code == 30002) {
     // ElMessage({
     //     message: res.msg,

src/components/dialog/index.vue

@@ -15,11 +15,11 @@
 <!--      <template #footer>-->
         <div class="del-btn">
           <div  v-if="know">
-            <el-button size="mini" type="primary" @click="searchSure" style="color: #ffffff" >我知道了</el-button>
+            <el-button size="mini" type="primary" @click="submitSure" style="color: #ffffff" >我知道了</el-button>
           </div>
           <div v-else>
-            <el-button size="mini" type="primary" @click="searchSure" style="color: #ffffff" >确定</el-button>
-            <el-button size="mini" style="color: #5075FC" @click="searchReset">取消</el-button>
+            <el-button size="mini" type="primary" @click="submitSure" style="color: #ffffff" >确定</el-button>
+            <el-button size="mini" style="color: #5075FC" @click="submitReset">取消</el-button>
           </div>
 
         </div>
@@ -68,11 +68,11 @@ export default {
 
   },
   methods: {
-    async searchSure () {
-      this.$emit('searchSureClick')// 此方法名字歧义  不建议使用 但是旧代码再用 还不能删除
-      this.$emit('sureClick')
+    async submitSure () {
+      this.$emit('submitSureClick')// 此方法名字歧义  不建议使用 但是旧代码再用 还不能删除
+      this.$emit('submitClick')
     },
-    searchReset () {
+    submitReset () {
       this.$emit('DialogFalse')// 此方法名字歧义  不建议使用 但是旧代码再用 还不能删除
       this.$emit('cancelClick')
     },

src/router/index.js

@@ -8,12 +8,13 @@ const routes = [{
         children: [
             {
                 meta: {
-                    action: "newGoodsList",
-                    title: '数据看板'
+                    action: "menuList",
+                    title: '权限菜单'
                 },
-                path: 'newGoodsList',
-                name: 'newGoodsList',
-                
+                path: 'menuList',
+                name: 'menuList',
+                component: () =>
+                    import ('@views/menu/index.vue')
             },
            
         ]

src/router/order/goodsOrder.js

@@ -1,20 +0,0 @@
-const routes = [{
-    meta: {
-        action: "goodsOrderList",
-        title: '商家管理中心-商品订单列表'
-    },
-    path: 'goodsOrderList',
-    name: 'goodsOrderList',
-    component: () =>
-        import ('@/views/menuOrder/goodsOrder/goodsOrderList')
-}, {
-    meta: {
-        action: "goodsOrderDetail",
-        title: '商家管理中心-商品订单详情',
-    },
-    path: 'goodsOrderDetail',
-    name: 'goodsOrderDetail',
-    component: () =>
-        import ('@/views/menuOrder/goodsOrder/goodsOrderDetail/index.vue')
-}]
-export default routes

src/views/menu/components/edit.vue

@@ -0,0 +1,99 @@
+<template>
+  <div>
+    <el-form ref="form" :rules="rules"  :model="form" label-width="120px">
+      <el-form-item
+          label="菜单名称："
+          prop="label"
+      >
+        <el-input v-model.number="form.label"  placeholder="请输入菜单名称"></el-input>
+      </el-form-item>
+      <el-form-item label="路由地址：" prop="url">
+        <el-input v-model="form.url"  placeholder="输入路由地址" ></el-input>
+      </el-form-item>
+      <el-form-item label="图标：" prop="icon">
+        <el-input v-model="form.icon"  placeholder="输入图标地址" ></el-input>
+      </el-form-item>
+      <el-form-item label="排序：" prop="sort">
+        <el-input v-model="form.sort"  placeholder="输入排序" ></el-input>
+      </el-form-item>
+      <el-form-item label="是否外链：" prop="is_links">
+        <el-switch
+            v-model="form.is_links"
+            :active-value="1"
+            :inactive-value="0"
+        >
+        </el-switch>
+      </el-form-item>
+      <el-form-item label="是否隐藏：" prop="hidden">
+        <el-switch
+            v-model="form.hidden"
+            :active-value="1"
+            :inactive-value="0"
+        >
+        </el-switch>
+      </el-form-item>
+      <el-form-item>
+        <div style="text-align: center">
+          <el-button type="primary" @click="onSubmit" :disabled="Isdisabled" :loading="isloading">保存</el-button>
+          <el-button style="color: #5075FC " @click="coles">取消</el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    menuDataForm: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      form: {
+        label: '',
+        url:"",
+        icon:"",
+        sort:"",
+        is_links:"",
+        hidden:"",
+      },
+      Isdisabled: false,
+      isloading: false,
+      rules: {
+        label: [
+          { required: true, message: '菜单名称必填' },
+        ],
+        url: [
+          { required: true, message: '路由地址必填' }
+        ],
+        sort: [
+          { pattern: /^[1-9]\d*$/, message: '排序值格式错误' },
+        ]
+      }
+    }
+  },
+  mounted() {
+    if(this.menuDataForm) {
+      this.form = Object.assign({} , this.menuDataForm)
+    }
+  },
+  methods: {
+    coles() {
+      this.$emit('colesClick')
+    },
+    onSubmit() {
+      let that = this
+      that.$refs['form'].validate((valid) => {
+        if (valid) {
+          this.$emit('menuSubmitClick', this.form)
+        }
+      })
+    }
+  }
+}
+</script>
+<style scoped>
+
+</style>

src/views/menu/index.vue

@@ -0,0 +1,208 @@
+<template>
+    <div class="main-content__div">
+      <!-- 列表 -->
+      <div class="table-box__div" v-cloak v-loading="loadingFlag">
+        <!-- 查询表单 -->
+        <el-form :inline="true" class="demo-form-inline">
+          <el-form-item>
+            <el-button type="primary" size="small" @click="updateClick">添加菜单</el-button>
+          </el-form-item>
+        
+        </el-form>
+        <el-table
+          size="mini"
+          :data="tableData"
+          :empty-text="tableDataLoadingText"
+          style="width: 100%;font-size: 15px;"
+          :header-cell-style="{background:'#FAFAFA'}"
+        >
+          <el-table-column label="编号" width="100" prop="id"></el-table-column>
+          <el-table-column label="菜单名称" prop="label" width="200"></el-table-column>
+          <el-table-column label="路由地址" prop="url" width="150"></el-table-column>
+          <el-table-column label="图标" prop="icon" width="150"></el-table-column>
+          <el-table-column label="排序" prop="sort" width="150"></el-table-column>
+          <el-table-column label="是否外链" width="150"  prop="is_links">
+            <template v-slot="{row}">
+              <el-switch
+                v-model="row.is_links"
+                :active-value="1"
+                :inactive-value="0"
+              disabled
+              ></el-switch>
+            </template>
+          </el-table-column>
+
+          <el-table-column label="是否隐藏" width="150">
+            <template v-slot="{row}">
+              
+              <el-switch
+                v-model="row.hidden"
+                :active-value="1"
+                :inactive-value="0"
+                disabled
+              ></el-switch>
+            </template>
+          </el-table-column>
+          <el-table-column   prop="" label="操作" align="center" >
+                  <template v-slot="scope">
+                    <div style="display: flex;flex-direction: column;justify-content: center;align-items: center;">
+                      <span class="btn "  @click="nextClick(scope.row.id)">查看下级</span>
+                      <span class="btn"  @click="updateClick(scope.row, scope.$index)">编辑</span>
+                      <span class="btn"  @click="deleteAuthority(scope.row,scope.$index)">删除</span>
+                    </div>
+                  </template>
+                </el-table-column>
+        </el-table>
+        <!-- 分页 -->
+        <div class="block" v-show="pagination" style="margin-top: 10px;float: right;">
+          <el-pagination
+            background
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :page-size="pageSize"
+            layout="total, prev, pager, next, jumper"
+            :total="parseInt(tableCount)">
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+  <Dialog title="温馨提示" content="您确认要删除该菜单吗？"
+          @close="DialogShow = false"
+          @submitSureClick="submitSureClickDel"
+          @DialogFalse="DialogShow = false"
+          :innerVisible="DialogShow">
+  </Dialog>
+  <DialogSlot
+      title="添加/编辑"
+      @close="menuDialogShow = false"
+      @DialogClose="menuDialogShow = false"
+      :innerVisible="menuDialogShow"
+  >
+    <editFrom
+        @colesClick="menuDialogShow = false"
+        :menuDataForm="menuDataForm"
+        @menuSubmitClick="menuSubmitClick">
+    </editFrom>
+  </DialogSlot>
+  </template>
+  <script>
+  import Dialog from "../../components/dialog";
+  import editFrom from "./components/edit";
+  import DialogSlot from "../../components/DialogSlot";
+  export default {
+    components: {
+      Dialog,
+      editFrom,
+      DialogSlot
+    },
+    data() {
+      return {
+        value:"1",
+        //  菜单列表数据
+        tableData: [],
+        //  加载中数据提示
+        tableDataLoadingText:"拼命加载中······",
+        //  是否显示分页
+        pagination:false,
+        //  每页显示的条数
+        pageSize:10,
+        //  当前页
+        currentPage:1,
+        //  菜单列表数据总条数
+        tableCount:0,
+  
+        loadingFlag: false,
+        isShowSource: false, // 是否显示来源列
+        id:0,
+        DialogShow: false, //控制删除弹窗
+        MenuId:'',
+        MenuRowIndex:'',
+        menuDataForm: {},
+        menuTableData: [],
+        menuDialogShow: false, // 控制保存弹窗
+      }
+    },
+    mounted() {},
+    methods: {
+      // 获取菜单信息列表
+      getList:function(){
+        let _t = this;
+        _t.loadingFlag = true;
+        let parames = {
+            'page':this.currentPage,
+            'pageSize':this.pageSize,
+            'id':this.id
+        }
+        this.$api.authority.getMenuList(parames).then(res=>{
+                _t.loadingFlag = false;
+                if(res.code==200){
+                  if(res.data.rows.length==0){
+                    this.$message.error("没有下级了,休息一下吧！！！")
+                    return
+                  }
+                    _t.tableData = res.data.rows;
+                    _t.tableCount = res.data.count;
+                     //  总条数大于每页显示的条数时显示分页
+                    if( _t.tableCount > _t.pageSize ){
+                     _t.pagination = true;
+                    }
+                    if( _t.tableData.length==0 ){
+                     _t.tableDataLoadingText = "暂无数据";
+                    }
+                }else{
+                    this.$message.error("查询失败")
+                }
+            })
+      },
+      // 点击翻页
+      handleCurrentChange(val) {
+        this.currentPage = val;
+        this.getList();
+      },
+      // 查看下一级
+      nextClick( id ){
+        let _t = this;
+        _t.id = id
+        _t.currentPage = 1
+        _t.pageSize = 10
+       this.getList()
+      },
+      //更新菜单
+      updateClick(row,index){
+        console.log(row)
+        this.menuDataForm = row
+        this.rowIndex = index
+        this.menuDialogShow = true
+      },
+      menuSubmitClick(data){
+        
+        console.log("提交数据",data)
+      },
+      //删除菜单
+      deleteAuthority(row, index) {
+        this.MenuId = row.id
+        this.MenuRowIndex = index
+        this.DialogShow = true
+      },
+      submitSureClickDel(row,index){
+        let parames = {
+          'id':this.MenuId
+        }
+        this.$api.authority.delMenu(parames).then(res=>{
+          if(res.code==200){
+            this.DialogShow = false
+            this.getList()
+          }else{
+            this.$message.error("查询失败")
+          }
+        })
+      }
+
+    },
+    created() {
+        this.getList();
+    }
+  }
+  </script>
+  
+