Feature/page (#235)

* feat: 修改集合返回字段

* fix: 修复post请求重发机制

fix #233

* feat(User): edit nickname

* docs(version): 版本更新日志

* feat(user): add group name

* Update .env.production

Author: vanoneang

.env.development

@@ -1,3 +1,3 @@
 ENV = 'development'
 
-VUE_APP_BASE_URL = 'http://koa.lin.colorful3.com/'
+VUE_APP_BASE_URL = 'http://localhost:5000/'

.env.production

@@ -1,3 +1,3 @@
 
 
-VUE_APP_BASE_URL = 'http://dev.lin.colorful3.com'
+VUE_APP_BASE_URL = 'http://localhost:5000/'

README.md

@@ -89,16 +89,22 @@ QQ群搜索：林间有风 或 643205479
 
 ## 版本日志
 
-<<<<<<< HEAD
-最新版本 `0.2.0`
+最新版本 `0.2.1`
+
+### 0.2.1
+
+1. `A` 新增一键清除 reuse tab
+2. `A` 新增侧边导航搜索，可在 config 配置是否启用
+3. `F` 修复 post put 等请求不能自动重发问题
+4. `U` 优化异常处理，框架默认弹出前端配置异常信息，可通过 handleError 和 showBackend 控制本次请求是否开发者自行处理和是否直接展示后端返回异常信息
+5. `C` 登录用户名字段由 nickname -> username，同时新增 nickname 为昵称字段，可以更新昵称(需后端同步修改)
+6. `U` 优化了一些移动端适配
+7. `C` 列表信息字段由 collection -> items, total_nums -> tatal, 增加 count、page、total_page字段（需后端同步修改）
 
 ### 0.2.0
 
 1. `A` 新增图像上传、图像预览、富文本等自定义组件
 2. `A` 新增 lin-cms-ui 多个基础组件
-=======
-最新版本 `0.1.0-beta.3`
->>>>>>> 0b890cda57f1aaa11af9315d031ae15fae4def51
 
 ### 0.1.0-beta.3
 

package.json

@@ -1,12 +1,12 @@
 {
   "name": "lin-cms",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "private": true,
   "scripts": {
     "serve": "node script/plugin-get-config.js && vue-cli-service serve",
     "build": "node script/plugin-get-config.js && vue-cli-service build",
     "lint": "vue-cli-service lint",
-    "commitizen": "commitizen init cz-conventional-changelog --save-dev --save-exact",
+    "commit": "git-cz",
     "plugin-init": "node script/plugin-init.js",
     "plugin-new": "node script/plugin-new.js",
     "plugin-reconfig": "node script/plugin-get-config.js",

public/iconfont111.css

@@ -429,7 +429,7 @@ thead tr {
 }
 
 .el-menu-vertical-demo {
-  padding-top: 20px;
+  padding-top: 10px;
   border-right: 1px solid #1d2a60;
 }
 

src/assets/styles/realize/element-variables.scss

@@ -165,10 +165,10 @@ export default {
       }, 200)
     },
     search(val) {
-      if (!val) {
-        this.showSearchList = false
-        return
-      }
+      // if (!val) {
+      //   this.showSearchList = false
+      //   return
+      // }
       this.groups = []
 
       // 深度遍历配置树, 摘取叶子节点作为路由部分
@@ -331,14 +331,14 @@ export default {
     width: 80%;
     margin: 0 auto;
     height: 36px;
-    border-bottom: 1px $theme solid;
+    border-bottom: 1px rgb(185, 190, 195) solid;
     cursor: pointer;
 
     .el-icon-search {
       position: absolute;
       left: 1px;
       top: 10px;
-      color: $theme;
+      color: rgb(185, 190, 195);
     }
   }
 

src/components/layout/SideBar.vue

@@ -12,18 +12,25 @@
             <img :src="user.avatar || defaultAvatar" alt="头像">
             <label class="mask">
               <i class="iconfont icon-icon-test" style="font-size: 20px;"></i>
-              <input
-                ref="avatarInput"
-                type="file"
-                accept="image/*"
-                @change="fileChange" />
+              <input ref="avatarInput" type="file" accept="image/*" @change="fileChange" />
             </label>
           </div>
           <div class="text">
-            <div class="username">{{ nickname }}</div>
-            <div class="desc">{{ title }}</div>
+            <div class="username" @click="changeNickname" v-if="!nicknameChanged">{{ nickname }}</div>
+            <el-input
+              placeholder="请输入内容"
+              size="small"
+              v-else
+              v-model="nickname"
+              ref="input"
+              @blur="blur"></el-input>
           </div>
           <img src="../../assets/img/user/corner.png" class="corner">
+          <div class="info">
+            <div class="username">{{ username }}</div>
+            <div class="mid">|</div>
+            <div class="desc">{{ groupName }}</div>
+          </div>
         </div>
         <ul class="dropdown-box">
           <li class="password" @click="changePassword">
@@ -150,8 +157,11 @@ export default {
       }
     }
     return {
-      nickname: null,
+      username: null,
       dialogFormVisible: false,
+      nicknameChanged: false,
+      nickname: null,
+      groupName: null,
       form: {
         old_password: '',
         new_password: '',
@@ -185,13 +195,6 @@ export default {
     }
   },
   computed: {
-    title() {
-      const { isSuper } = this.user || {}
-      if (isSuper) {
-        return '超级管理员'
-      }
-      return '管理员'
-    },
     ...mapGetters(['user']),
   },
   watch: {
@@ -263,7 +266,7 @@ export default {
 
       return this.$axios({
         method: 'post',
-        url: '/cms/file/',
+        url: '/cms/file',
         data: {
           file,
         },
@@ -302,9 +305,47 @@ export default {
         })
       })
     },
+    changeNickname() {
+      this.nicknameChanged = true
+      setTimeout(() => {
+        this.$refs.input.focus()
+      }, 200)
+    },
+    async blur() {
+      if (this.nickname) {
+        const { user } = this.$store.state
+        if (this.nickname !== user.nickname && this.nickname !== '佚名') {
+          this.$axios({
+            method: 'put',
+            url: '/cms/user',
+            data: {
+              nickname: this.nickname,
+            },
+            params: {
+              showBackend: true,
+            },
+          }).then((res) => {
+            if (res.error_code === 0) {
+              this.$message({
+                type: 'success',
+                message: '更新昵称成功',
+              })
+              // 触发重新获取用户信息
+              return User.getInformation()
+            }
+            this.nickname = user.nickname
+          }).then((res) => { // eslint-disable-line
+            this.setUserAndState(res)
+          })
+        }
+      }
+      this.nicknameChanged = false
+    },
     init() {
       const { user } = this.$store.state
-      this.nickname = user ? user.nickname : '未登录'
+      this.username = user ? user.username : '未登录'
+      this.groupName = user.groupName ? user.groupName : '超级管理员'
+      this.nickname = user && user.nickname ? user.nickname : '佚名'
     },
     changePassword() {
       this.dialogFormVisible = true
@@ -372,6 +413,7 @@ export default {
 
 .user {
   height: 40px;
+
   .el-dropdown-link {
     cursor: pointer;
 
@@ -458,13 +500,29 @@ export default {
       .username {
         margin-bottom: 10px;
         font-size: 16px;
+        cursor: pointer;
       }
 
       .desc {
         font-size: 14px;
         color: rgba(222, 226, 230, 1);
       }
     }
+
+    .info {
+      position: absolute;
+      bottom: 10px;
+      right: 10px;
+      display: flex;
+      color: #fff;
+      font-size: 14px;
+      height: 20px;
+      line-height: 20px;
+
+      .mid {
+        padding: 0 5px;
+      }
+    }
   }
 
   .dropdown-box {

src/components/layout/User.vue

@@ -1,12 +1,12 @@
 
 const stateCode = {
-  777: '未知错误',
+  777: '前端不知道，找后端小哥哥',
   999: '服务器未知错误',
   10000: '认证失败',
   10020: '资源不存在',
   10030: '参数错误',
-  10040: '令牌失效',
-  10050: '令牌过期',
+  10040: 'assessToken令牌失效',
+  10050: 'assessToken令牌过期',
   10060: '字段重复',
   10070: '不可操作',
   10100: 'refreshToken异常',

src/config/error-code.js

@@ -1,5 +1,5 @@
 const Config = {
-  baseUrl: process.env.VUE_APP_BASE_URL,
+  baseURL: process.env.VUE_APP_BASE_URL,
   stagnateTime: 1 * 60 * 60 * 1000, // 无操作停滞时间  默认1小时
   openAutoJumpOut: true, // 是否开启无操作跳出
   notLoginRoute: ['login'], // 无需登录即可访问的路由 name,

src/config/index.js

@@ -112,7 +112,7 @@ class Log {
       if (page === 0) {
         this.lPage = 0
       }
-      const res = await get('cms/log/', {
+      const res = await get('cms/log', {
         count: count || this.lCount,
         page: page || this.lPage,
         name: name || this.name,

src/lin/models/log.js

@@ -10,49 +10,58 @@ const SUPER_VALUE = 2
 const ACTIVE_VALUE = 1
 
 export default class User {
+  // 当前用户是否在激活状态
   isActive = null
 
-  // 当前用户是否在激活状态
+  // 邮箱
   email = null
 
-  // 邮箱
+  // 权限分组id
   groupId = null
 
-  // 权限分组id
-  nickname = null
+  // 用户名
+  username = null
 
-  // 昵称
+  // 是否为超级管理员
   isSuper = null
 
-  // 是否为超级管理员
-  auths = [] // 拥有的权限
+  // 拥有的权限
+  auths = []
+
+  // 昵称
+  nickname = null
+
+  // 分组名称
+  groupName = null
 
-  constructor(active, email, groupId, nickname, _super, avatar, auths) {
+  constructor(active, email, groupId, username, _super, avatar, auths, nickname, groupName) {
     this.isActive = active === ACTIVE_VALUE
     this.email = email
     this.groupId = groupId
-    this.nickname = nickname
+    this.username = username
     this.avatar = avatar
     this.isSuper = _super === SUPER_VALUE
     this.auths = auths || []
+    this.nickname = nickname
+    this.groupName = groupName
   }
 
   /**
-   * 用户注册，正式发布时将废弃
+   * 分配用户
    * @param {object} data 注册信息
    */
   static register(data) {
-    return post('cms/user/register', data)
+    return post('cms/user/register', data, { handleError: true })
   }
 
   /**
    * 登陆获取tokens
-   * @param {string} nickname 昵称
+   * @param {string} username 用户名
    * @param {string} password 密码
    */
-  static async getToken(nickname, password) {
+  static async getToken(username, password) {
     const tokens = await post('cms/user/login', {
-      nickname,
+      username,
       password,
     })
     saveTokens(tokens.access_token, tokens.refresh_token)
@@ -64,15 +73,15 @@ export default class User {
    */
   static async getInformation() {
     const info = await get('cms/user/information')
-    return new User(info.active, info.email, info.group_id, info.nickname, info.admin, info.avatar)
+    return new User(info.active, info.email, info.group_id, info.username, info.admin, info.avatar, info.nickname, info.group_name)
   }
 
   /**
    * 获取当前用户信息和所拥有的权限
    */
   static async getAuths() {
     const info = await get('cms/user/auths')
-    return new User(info.active, info.email, info.group_id, info.nickname, info.admin, info.avatar, info.auths)
+    return new User(info.active, info.email, info.group_id, info.username, info.admin, info.avatar, info.auths, info.nickname, info.group_name)
   }
 
   /**