功能优化+完善

.env

@@ -1,8 +0,0 @@
-# just a flag
-ENV = 'development'
-
-# base api
-VUE_APP_BASE_API = ''
-VUE_APP_BASE_URL = 'https://api.youxi9.com/'
-# VUE_APP_BASE_URL = 'http://devapi.youxi9.com/'
-VUE_APP_IMG_URL = 'https://cdn.youxi9.com/'

.env.development

@@ -3,5 +3,5 @@ ENV = 'development'
 
 # base api
 VUE_APP_BASE_API = ''
-# VUE_APP_BASE_URL = 'http://devapi.youxi9.com/'
+VUE_APP_BASE_URL = 'http://devapi.youxi9.com/'
 VUE_APP_IMG_URL = 'https://cdn.youxi9.com/'

.env.production

@@ -2,6 +2,6 @@
 ENV = 'production'
 
 # base api
-VUE_APP_BASE_API = 'https://api.youxi9.com/'
-# VUE_APP_BASE_URL = 'http://devapi.youxi9.com/'
+VUE_APP_BASE_API = ''
+VUE_APP_BASE_URL = 'https://api.youxi9.com/'
 VUE_APP_IMG_URL = 'https://cdn.youxi9.com/'

README.zh-CN.md

@@ -1,18 +1,7 @@
 ## 开发
+[使用文档](https://panjiachen.github.io/vue-element-admin-site/zh/)
 
 ```bash
-# 克隆项目
-git clone -b i18n git@github.com:PanJiaChen/vue-element-admin.git
-
-# 进入项目目录
-cd vue-element-admin
-
-# 安装依赖
-npm install
-
-# 建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
-npm install --registry=https://registry.npm.taobao.org
-
 # 启动服务
 npm run dev
 ```
@@ -22,33 +11,13 @@ npm run dev
 ## 发布
 
 ```bash
-# 构建测试环境
-npm run build:stage
-
-# 构建生产环境
+# 构建生产环境 -- 打包
 npm run build:prod
 ```
-
-## 其它
-
-```bash
-# 预览发布环境效果
-npm run preview
-
-# 预览发布环境效果 + 静态资源分析
-npm run preview -- --report
-
-# 代码格式检查
-npm run lint
-
-# 代码格式检查并自动修复
-npm run lint -- --fix
-```
-
-更多信息请参考 [使用文档](https://panjiachen.github.io/vue-element-admin-site/zh/)
-
 ## 本地部署相关介绍
-main.js 文件开启 mock 相关，即可使用 mock。
+main.js 文件默认开启 mock ，请求数据为 mock；正式打包时可以注释。
+![image.png](https://i.loli.net/2021/11/18/AIqoErjRHKgD1f2.png)
+
 （不用改，指示说明）打包时使用 /src/utils/request.js 使用的 .env 的 VUE_APP_BASE_URL 地址，这个就是线上的。 
 ### Nginx 部署时设置反向代理+跨域
 ```config
@@ -103,5 +72,8 @@ server
 > 2021.11.17
 1. [x] 充值账户不判断是否是手机号，有些手机号格式比较新奇，或许还不是手机号。
 2. [x] 账户支付密码错误，停止其他数据请求（如果有500条，会提示500次问题）。
+3. [x] 登录时的验证码不显示浏览器输入记录。 
+4. [x] 修复首页首次进入加载样式异常问题。
+5. [x] 账户提交失败统计展示完善。 
 
 

mock/common.js

@@ -156,13 +156,13 @@ module.exports = [
     url: '/v1/recharge/player',
     type: 'post',
     response: config => {
-      return {
-        'status': true,
-        'code': 200,
-        'time': 1637055309,
-        'message': '成功',
-        'data': []
-      }
+      // return {
+      //   'status': true,
+      //   'code': 200,
+      //   'time': 1637055309,
+      //   'message': '成功',
+      //   'data': []
+      // }
 
       // return {
       //   code: 35203,
@@ -170,38 +170,41 @@ module.exports = [
       //   data: [],
       //   message: '您的支付密码有误'
       // }
-      // const math = Math.round(Math.random() * 2)
-      // var result = []
-      // switch (math) {
-      //   case 0:
-      //     result = {
-      //       'status': true,
-      //       'code': 200,
-      //       'time': 1637055309,
-      //       'message': '成功',
-      //       'data': []
-      //     }
-      //     break
-      //   case 1:
-      //     result = {
-      //       'status': false,
-      //       'code': 35203,
-      //       'time': 1637032613,
-      //       'message': '您的支付密码有误',
-      //       'data': []
-      //     }
-      //     break
-      //   case 2:
-      //     result = {
-      //       code: 401,
-      //       status: false,
-      //       data: [],
-      //       message: '操作失败'
-      //     }
-      //     break
-      // }
+      const math = Math.round(Math.random() * 3)
+      var result = []
+      switch (math) {
+        case 0:
+          result = {
+            'status': true,
+            'code': 200,
+            'time': 1637055309,
+            'message': '成功~',
+            'data': []
+          }
+          break
+        case 1:
+          result = {
+            'status': false,
+            'code': 35203,
+            'time': 1637032613,
+            'message': '您的支付密码有误~',
+            'data': []
+          }
+          break
+        case 2:
+          result = {
+            code: 401,
+            status: false,
+            data: [],
+            message: '操作失败~'
+          }
+          break
+        case 3:
+          result = { 'status': false, 'code': 10007, 'time': 1637213822, 'message': '发放Flyme账户不存在，请确认', 'data': [] }
+          break
+      }
 
-      // return result
+      return result
     }
   }
 ]

src/permission.js

@@ -3,7 +3,7 @@ import store from './store'
 import { Message } from 'element-ui'
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style
-import { getToken } from '@/utils/auth' // get token from cookie
+import { getToken, removeF5 } from '@/utils/auth' // get token from cookie
 import getPageTitle from '@/utils/get-page-title'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
@@ -56,8 +56,8 @@ router.beforeEach(async(to, from, next) => {
       }
     }
   } else {
+    removeF5()
     /* has no token*/
-
     if (whiteList.indexOf(to.path) !== -1) {
       // in the free login whitelist, go directly
       next()

src/settings.js

@@ -5,7 +5,7 @@ module.exports = {
    * @type {boolean} true | false
    * @description Whether show the settings right-panel
    */
-  showSettings: true, // 系统布局配置
+  showSettings: false, // 系统布局配置
 
   /**
    * @type {boolean} true | false

src/store/modules/user.js

@@ -1,6 +1,6 @@
 // import { login, logout, getInfo } from '@/api/user'
 import { login, getInfo } from '@/api/user'
-import { getToken, setToken, removeToken } from '@/utils/auth'
+import { getToken, setToken, removeToken, getF5, setF5, removeF5 } from '@/utils/auth'
 import router, { resetRouter } from '@/router'
 
 const state = {
@@ -103,6 +103,7 @@ const actions = {
     return new Promise((resolve, reject) => {
       commit('SET_TOKEN', '')
       commit('SET_ROLES', [])
+      removeF5()
       removeToken()
       resetRouter()
       // reset visited views and cached views
@@ -122,11 +123,20 @@ const actions = {
     return new Promise(resolve => {
       commit('SET_TOKEN', '')
       commit('SET_ROLES', [])
+      removeF5()
       removeToken()
       resolve()
     })
   },
 
+  // 刷新页面标识
+  getF5() {
+    return getF5()
+  },
+  setF5() {
+    setF5()
+  },
+
   // dynamically modify permissions
   async changeRoles({ commit, dispatch }, role) {
     const token = role + '-token'

src/utils/auth.js

@@ -1,6 +1,7 @@
 import Cookies from 'js-cookie'
 
 const TokenKey = 'Admin-Token'
+const F5Key = 'Admin-F5'
 
 export function getToken() {
   return Cookies.get(TokenKey)
@@ -13,3 +14,14 @@ export function setToken(token) {
 export function removeToken() {
   return Cookies.remove(TokenKey)
 }
+
+// 页面刷新
+export function getF5() {
+  return Cookies.get(F5Key)
+}
+export function setF5() {
+  return Cookies.set(F5Key, true)
+}
+export function removeF5() {
+  return Cookies.remove(F5Key)
+}

src/utils/request.js

@@ -7,7 +7,7 @@ console.log('# process.env.ENV: ', process.env.NODE_ENV, process.env.NODE_ENV ==
 // create an axios instance
 const service = axios.create({
   // baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
-  baseURL: process.env.NODE_ENV === 'development' ? undefined : process.env.VUE_APP_BASE_URL,
+  baseURL: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_BASE_API : process.env.VUE_APP_BASE_URL,
   // withCredentials: true, // send cookies when cross-domain requests
   timeout: 5000 // request timeout
 })
@@ -50,9 +50,13 @@ service.interceptors.response.use(
 
     // if the custom code is not 20000, it is judged as an error.
     if (res.code !== 200) {
+      var type = 'type'
+      if (res.code > 10000) {
+        type = 'warning'
+      }
       Message({
         message: res.message || 'Error',
-        type: 'error',
+        type: type,
         duration: 5 * 1000
       })
 

src/views/recharge/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="login-container">
     <el-form ref="dataForm" :model="dataForm" :rules="ruleForm">
-      <el-row :gutter="30" class="el-bg-border">
+      <el-row :gutter="30">
         <el-col :span="5">
           <el-form-item label="游戏平台" prop="pid">
             <el-select v-model="dataForm.pid" placeholder="Select" class="filter-item">
@@ -167,8 +167,7 @@ export default {
       thenAccountNum: 0, // 成功个数
       catchAccount: '', // 失败账户
       catchAccountNum: 0 // 失败个数
-      // loadingText: '处理中，请稍等。。。',
-      // loadingTextNum: 0 // 操作百分比
+
     }
   },
   created() {
@@ -176,6 +175,14 @@ export default {
     this.getRechargePlatform(this.dataForm.pid)
     this.getRechargeGame(this.dataForm.pid)
     this.updateUserMoney()
+
+    this.$store.dispatch('user/getF5').then((res) => {
+      console.log('# getF5: ', res)
+      if (!res) {
+        this.$store.dispatch('user/setF5')
+        location.reload()
+      }
+    })
   },
   methods: {
     // 更新用户余额
@@ -221,6 +228,8 @@ export default {
 
       this.thenAccount = ''
       this.catchAccount = ''
+      this.thenAccountNum = 0
+      this.catchAccountNum = 0
 
       // TODO: 正式服务器未上线，暂时不需要
       // if ((this.balanceMoney - this.dataForm.money) < 0) {
@@ -292,6 +301,7 @@ export default {
       return new Promise((resolve, reject) => {
         setTimeout((_data) => {
           this.$store.dispatch('common/rechargePlayer', _data).then((res) => {
+            console.log('# then:', data.username)
             const { code, status } = res
             if (code === 200 && status === true) {
               this.thenAccount = this.thenAccount + _data.username + '\n'
@@ -303,11 +313,14 @@ export default {
               resolve()
             }
           }).catch((res) => {
+            console.log('# catch:', data.username)
+
             this.catchAccount = this.catchAccount + _data.username + '\n'
             this.catchAccountNum++
             resolve()
           })
-        }, 2000 * index, data)
+        }, 2000 * (index + 1), data)
+        // 2000 * (index + 1): +1的原因是，这里是从第二条数据开始处理的，异步处理之前单独处理了一个，所以时间久点。
       })
     },
 
@@ -354,7 +367,6 @@ export default {
         })
       })
     }
-
   }
 }
 </script>

vue.config.js

@@ -42,10 +42,10 @@ module.exports = {
       [process.env.VUE_APP_BASE_API]: { // 这里是公共部分，在调用接口时后面接不相同的部分，/api就相当于http://192.168.0.199:8926/api这一段
         target: process.env.VUE_APP_BASE_URL, // 这里写的是访问接口的域名和端口号
         changeOrigin: true, // 必须加上这个才能跨域请求
-        logLevel: 'debug'
-        // pathRewrite: { // 重命名
-        //   ['^/' + process.env.VUE_APP_BASE_API]: ''
-        // }
+        logLevel: 'debug',
+        pathRewrite: { // 重命名
+          ['^/' + process.env.VUE_APP_BASE_API]: ''
+        }
       }
     }
   },

vue.project.config.js

@@ -3,4 +3,4 @@ module.exports = {
   folders: [
     { name: 'Root', path: '.' }
   ]
-};
+}