前端框架编写

296c0147 · wangwei · f5376f2b · 296c0147 · 296c0147 · 296c0147
Commit 296c0147 authored Aug 03, 2018 by wangwei
17 changed files
--- a/index.html
+++ b/index.html
@@ -3,7 +3,7 @@
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="stylesheet" href="http://at.alicdn.com/t/font_746649_emhxd7ufqd.css">
+    <link rel="stylesheet" href="http://at.alicdn.com/t/font_746649_vcfxh3i6oy.css">
    <title>singsing-new-admin</title>
  </head>
  <body>

--- a/src/components/class/index.vue
+++ b/src/components/class/index.vue
@@ -6,7 +6,6 @@
 <script>
    export default {
-        name: "index"
    }
 </script>

--- a/src/components/framework/headIndex.vue
+++ b/src/components/framework/headIndex.vue
@@ -2,16 +2,39 @@
  <div class="head-index">
    {{$store.state.userName}}
    <div class="fl-r">
-      <el-button round size="mini">退出登录</el-button>
+      <el-button round size="mini" @click="logOut">退出登录</el-button>
-      <el-button icon="el-icon-setting" circle size="mini"></el-button>
    </div>
  </div>
 </template>
 <script>
-    export default {
+  import {logoutApi} from "../../service/api";
-        name: "headIndex"
+  import cookie from '../../util/cookie'
+  export default {
+    name: "headIndex",
+    data(){
+      return {
+      }
+    },
+    methods:{
+      logOut(){
+        this.$confirm('确定退出系统?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          logoutApi().then(()=>{
+            cookie.delete('cc_token');
+            this.$store.dispatch('setToken','');
+            this.$store.dispatch('setUserName','');
+            this.$router.push({name:'login'})
+          })
+        }).catch(() => {
+        });
+      }
    }
+  }
 </script>
 <style scoped lang="less">
@@ -20,4 +43,7 @@
    height: 100%;
    line-height: 40px;
  }
+  .btn-div{
+    text-align: center;
+  }
 </style>
--- a/src/components/framework/index.vue
+++ b/src/components/framework/index.vue
@@ -25,7 +25,6 @@
  import leftMenu from './leftMenu'
  import tab from './tab'
  export default {
-    name: "index",
    components: {leftMenu, headIndex,tab},
    data(){
      return {

--- a/src/components/framework/leftMenu.vue
+++ b/src/components/framework/leftMenu.vue
@@ -31,11 +31,6 @@
        }
      }
    },
-    watch:{
-      $route(to,from){
-        this.$store.state.nowTab = to.name
-      }
-    },
  }
 </script>

--- a/src/components/framework/tab.vue
+++ b/src/components/framework/tab.vue
 <template>
  <div class="tab">
-    <div :class="{'li-parent':true,light:data.routerName === $store.state.nowTab}":key="data.routerName" v-for="data in tabList">
+    <div :class="{'li-parent':true,light:data.routerName === $store.state.nowTab}" :key="data.routerName" v-for="data in tabList">
      <div class="tab-li" @click="toPath(data.routerName)">
        {{data.value}}
      </div>

--- a/src/components/lesson/index.vue
+++ b/src/components/lesson/index.vue
@@ -6,7 +6,6 @@
 <script>
    export default {
-        name: "index"
    }
 </script>

--- a/src/components/login/index.vue
+++ b/src/components/login/index.vue
@@ -23,7 +23,6 @@
  import md5 from 'js-md5';
  import bgUrl from '../../assets/skyBackground.png'
    export default {
-        name: "index",
      data(){
        return{
          bgUrl:bgUrl,
@@ -51,13 +50,9 @@
                password:md5(this.login.password)
              };
              loginApi(json).then(res=>{
-                if(res.code === 0){
+                  this.$store.dispatch('setToken',res.token);
-                  this.$store.dispatch('setToken',res.data.token);
+                  this.$store.dispatch('setUserName',res.user_name);
-                  this.$store.dispatch('setUserName',res.data.user_name);
                  this.$router.push({name:'index'})
-                }else{
-                  this.$message.error(res.msg);
-                }
              })
            }
          })

--- a/src/components/main/index.vue
+++ b/src/components/main/index.vue
@@ -8,7 +8,6 @@
 <script>
  import editor from '@/components/textarea'
  export default {
-    name: "editor-demo",
    data: function () {
      return {
        content:'我是富文本编辑器的内容',

--- a/src/components/material/index.vue
+++ b/src/components/material/index.vue
@@ -6,7 +6,6 @@
 <script>
    export default {
-        name: "index"
    }
 </script>

--- a/src/components/order/index.vue
+++ b/src/components/order/index.vue
@@ -6,7 +6,6 @@
 <script>
    export default {
-        name: "index"
    }
 </script>

--- a/src/components/resources/index.vue
+++ b/src/components/resources/index.vue
@@ -12,7 +12,6 @@
 <script>
  import resourcesList from './resourcesList'
  export default {
-        name: "index",
    components: {resourcesList},
    }
 </script>

--- a/src/router/index.js
+++ b/src/router/index.js
@@ -7,7 +7,11 @@ import index from '@/components/framework'
 import main from '@/components/main'
 import login from '@/components/login'
 import resources from '@/components/resources'
+import system from '@/components/system/index'
+import admin from '@/components/system/admin'
+import role from '@/components/system/role'
+import user from '@/components/user'
+import teacher from '@/components/teacher'
 Vue.use(Router)
 const router =new Router({
@@ -24,29 +28,74 @@ const router =new Router({
      path: '/',
      name: 'index',
      component: index,
+      redirect:{name:'first'},
      children:[
        {
-          path: '/',
+          path: '',
          name:'first',
          component: main
        },{
          path: '/resources',
          name:'resources',
          component: resources
-        },
+        },{
+          path: '/user',
+          name:'user',
+          component: user
+        },{
+          path: '/teacher',
+          name:'teacher',
+          component: teacher
+        },{
+          path:'/system',
+          name:'system',
+          component:system ,
+          redirect:{name:'admin'},
+          children:[
+            {
+              path: '',
+              redirect:{name:'admin'}
+            },
+            {
+              path: 'admin',
+              name:'admin',
+              component: admin
+            },
+            {
+              path: 'role',
+              name:'role',
+              component: role
+            },
+          ]
+        }
      ]
    }
  ]
 });
 router.beforeEach((to,from,next)=> {
  //在已登录状态下不允许退回登录页面去
-  if (to.name === 'login' && store.state.token) {
+  // if (to.name === 'login' && store.state.token) {
-    next(false);
+  //   next(false);
-    return;
+  //   return;
-  }
+  // }
  //获取cookie里的token
  if(Cookie.get('cc_token')){
-    store.dispatch('setToken',Cookie.get('cc_token'))
+    store.dispatch('setToken',Cookie.get('cc_token'));
+    if(Cookie.get('cc_user_name') !== null){
+      store.dispatch('setUserName',Cookie.get('cc_user_name'))
+    }else{
+    }
+  }
+  if(to.name !== 'first'){
+  let thisMenu = store.state.menuList.find((i)=>{return i.routerName === to.name});
+  if(to.name === 'role'){
+    store.state.nowTab = 'admin'
+  }else{
+    store.state.nowTab = to.name
+  }
+  if(store.state.openedTab.indexOf(thisMenu) < 0){
+    store.state.openedTab.push(thisMenu);
+  }
  }
  // 登录拦截
  if (to.matched.some(record => record.meta.skip_auth !== true) && !store.state.token) {

--- a/src/service/api.js
+++ b/src/service/api.js
 import Vue from 'vue';
-import {post,fetch,patch,put} from './index'
+import {post,fetch,patch,put,del} from './index'
 const _baseUrl=process.env.API_URL;
 Vue.prototype.$post=post;
 Vue.prototype.$fetch=fetch;
 Vue.prototype.$patch=patch;
 Vue.prototype.$put=put;
+Vue.prototype.$del=del;
 const loginURL = `${_baseUrl}api/admin/login`;
 const getAdminListUrl = `${_baseUrl}api/admin/user/list`;
+const editAdminUrl = `${_baseUrl}api/admin/user/info`;
+const addAdminUrl = `${_baseUrl}api/admin/user/add`;
+const delAdminUrl = `${_baseUrl}api/admin/user`;
+const editPasswordUrl = `${_baseUrl}api/admin/user/passwd`;
+const logOutUrl = `${_baseUrl}api/admin/logout`;
 //登录
 export const loginApi = function(json) {
  return Vue.prototype.$post(loginURL,{"username":json.username,"passwd":json.password})
 };
-//查询用户列表
+//退出登录
+export const logoutApi = function() {
+  return Vue.prototype.$post(logOutUrl)
+};
+//查询账号列表
 export const getAdminListApi = function () {
  return Vue.prototype.$fetch(getAdminListUrl)
 };
+//修改账号信息
+export const editAdminListApi = function (id,json) {
+  return Vue.prototype.$put(`${editAdminUrl}/${id}`,json)
+};
+//添加账号
+export const addAdminListApi = function (json) {
+  return Vue.prototype.$post(addAdminUrl,json)
+};
+//删除账号
+export const delAdminListApi = function (id) {
+  return Vue.prototype.$del(`${delAdminUrl}/${id}`)
+};
+//修改密码
+export const editPasswordApi = function (id,json) {
+  return Vue.prototype.$patch(`${editPasswordUrl}/${id}`,json)
+};
--- a/src/service/index.js
+++ b/src/service/index.js
 import axios from 'axios';
 import md5 from 'js-md5';
-import { MessageBox  } from 'element-ui';
+import { MessageBox ,Message  } from 'element-ui';
 import Cookie from '../util/cookie'
 // 默认超时设置
 axios.defaults.timeout = 5000;
@@ -28,7 +28,6 @@ axios.interceptors.request.use(
    }else if(config.url !== '/api/admin/login'){
      config.data = config.data || {};
      let json = JSON.parse(JSON.stringify(config.data));
-      json = JSON.parse(json);
      json.sing = "singsingenglish21000";
      config.data.param_token = md5(JSON.stringify(json));
    }
@@ -43,11 +42,10 @@ axios.interceptors.request.use(
 //http response 拦截器
 axios.interceptors.response.use(
  response => {
-    if(response.data.errCode ===2){
+    if(response.data.code === 501){
      // 登录验证
      router.push({
-        path:"/login",
+        name:'login'//从哪个页面跳转
-        querry:{redirect:router.currentRoute.fullPath}//从哪个页面跳转
      })
    }
    return response;
@@ -71,7 +69,11 @@ export function fetch(url,params={}){
      params:params
    })
      .then(response => {
-        resolve(response.data);
+        if(response.data.code === 200){
+          resolve(response.data.data);
+        }else{
+          Message.error(response.data.msg)
+        }
      })
      .catch(err => {
        reject(err);
@@ -98,7 +100,11 @@ export function post(url,data = {}){
  return new Promise((resolve,reject) => {
    axios.post(url,data)
      .then(response => {
-        resolve(response.data);
+        if(response.data.code === 200){
+          resolve(response.data.data);
+        }else{
+          Message.error(response.data.msg)
+        }
      },err => {
        reject(err);
        let message = '请求失败！请检查网络';
@@ -123,7 +129,11 @@ export function patch(url,data = {}){
  return new Promise((resolve,reject) => {
    axios.patch(url,data)
      .then(response => {
-        resolve(response.data);
+        if(response.data.code === 200){
+          resolve(response.data.data);
+        }else{
+          Message.error(response.data.msg)
+        }
      },err => {
        reject(err);
        let message = '请求失败！请检查网络';
@@ -148,7 +158,33 @@ export function put(url,data = {}){
  return new Promise((resolve,reject) => {
    axios.put(url,data)
      .then(response => {
-        resolve(response.data);
+        if(response.data.code === 200){
+          resolve(response.data.data);
+        }else{
+          Message.error(response.data.msg)
+        }
+      },err => {
+        reject(err);
+        let message = '请求失败！请检查网络';
+        if(err.response)message=err.response.data.message;
+        MessageBox({
+          title:'错误！',
+          message:message,
+          type:'error',
+        })
+      })
+  })
+}
+export function del(url,data = {}){
+  return new Promise((resolve,reject) => {
+    axios.delete(url,data)
+      .then(response => {
+        if(response.data.code === 200){
+          resolve(response.data.data);
+        }else{
+          Message.error(response.data.msg)
+        }
      },err => {
        reject(err);
        let message = '请求失败！请检查网络';

--- a/src/util/menuList.js
+++ b/src/util/menuList.js
@@ -5,8 +5,7 @@ export default  [
    id:1,
    icon:'icon-material',
    routerName:'resources',
-  },
+  }, {
-  {
    name:'lesson',
    value:'课程管理',
    id:2,
@@ -21,8 +20,42 @@ export default  [
  },{
    name:'order',
    value:'订单管理',
-    id:1,
+    id:4,
    icon:'icon-dingdan',
    routerName:'order',
+  },{
+    name:'user',
+    value:'用户管理',
+    id:6,
+    icon:'icon-yonghu1',
+    routerName:'user',
+  },{
+    name:'teacher',
+    value:'教师管理',
+    id:6,
+    icon:'icon-laoshi',
+    routerName:'teacher',
+  },{
+    name:'system',
+    value:'系统管理',
+    id:5,
+    icon:'icon-shezhi',
+    routerName:'admin',
+    children:[
+      {
+        name:'admin',
+        value:'账号管理',
+        id:51,
+        icon:'icon-type',
+        routerName:'admin',
+      },
+      {
+        name:'role',
+        value:'角色管理',
+        id:52,
+        icon:'icon-jiaoseguanli',
+        routerName:'role',
+      }
+    ]
  }
-  ]
+]
--- a/src/util/wordbook.js
+++ b/src/util/wordbook.js
+export const ADMINSTATUS = {
+  '0':'启用',
+  '1':'冻结'
+};