TBtools-礼品商城代码优化

htmldev/TBTools/src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <transition name="fade">
-    <router-view></router-view>
+    <router-view/>
   </transition>
 </template>
 

htmldev/TBTools/src/router/index.js

@@ -190,7 +190,8 @@ const mallRoutes = [
     name: 'goodsDetail',
     meta: {
       title: '商品详情',
-      isUseCache: false
+      isUseCache: false,
+      keepAlive: true
     },
     props: (route) => ({
       id: route.query.id
@@ -234,9 +235,31 @@ const mainRoutes = {
     // 1. isTab: 是否通过tab展示内容, true: 是, false: 否
     // 2. iframeUrl: 是否通过iframe嵌套展示内容, '以http[s]://开头': 是, '': 否
     // 提示: 如需要通过iframe嵌套展示内容, 但不通过tab打开, 请自行创建组件使用iframe处理!
-    { path: '/login', component: _import('modules/account/login'), name: 'login', meta: { title: '登录' } },
-    { path: '/register', component: _import('modules/account/register'), name: 'register', meta: { title: '注册' } },
-    { path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页', isTab: true } },
+    {
+      path: '/login',
+      component: _import('modules/account/login'),
+      name: 'login',
+      meta: {
+        title: '登录'
+      }
+    },
+    {
+      path: '/register',
+      component: _import('modules/account/register'),
+      name: 'register',
+      meta: {
+        title: '注册'
+      }
+    },
+    {
+      path: '/home',
+      component: _import('common/home'),
+      name: 'home',
+      meta: {
+        title: '首页',
+        isTab: true
+      }
+    },
     ...toolsNav0,
     ...toolsNav1,
     ...toolsNav2,

htmldev/TBTools/src/views/modules/mall/goods-detail.vue

@@ -55,8 +55,12 @@ export default {
       info: {}
     }
   },
-  created () {
-    this.funInit()
+  activated () {
+    if (!this.$route.meta.isUseCache) {
+      this.info = {}
+      this.funInit()
+    }
+    this.$route.meta.isUseCache = false
   },
   methods: {
     funInit () {
@@ -76,6 +80,13 @@ export default {
         this.dataListLoading = false
       })
     }
+  },
+  beforeRouteLeave (to, from, next) {
+    console.log(to.name)
+    if (['goodsCreateOrder'].includes(to.name)) {
+      from.meta.isUseCache = true
+    }
+    next()
   }
 }
 </script>

htmldev/TBTools/src/views/modules/mall/index.vue

@@ -108,7 +108,23 @@ export default {
         warehouseId: ''
       },
       expressList: [],
-      rankList: [
+      rankList: [],
+      activeRankIndex: 0,
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      activeGoodsInedex: -1
+    }
+  },
+  activated () {
+    if (!this.$route.meta.isUseCache) {
+      this.dataForm = {
+        expressActiveIndex: '',
+        warehouseId: ''
+      }
+      this.expressList = []
+      this.rankList = [
         {
           type: '',
           label: '综合排序',
@@ -121,18 +137,17 @@ export default {
           value: false,
           icon: true
         }
-      ],
-      activeRankIndex: 0,
-      dataList: [],
-      pageIndex: 1,
-      pageSize: 10,
-      totalPage: 0,
-      activeGoodsInedex: -1
+      ]
+      this.activeRankIndex = 0
+      this.dataList = []
+      this.pageIndex = 1
+      this.pageSize = 10
+      this.totalPage = 0
+      this.activeGoodsInedex = -1
+      this.fetchExpressList()
+      this.getDataList()
     }
-  },
-  created () {
-    this.fetchExpressList()
-    this.getDataList()
+    this.$route.meta.isUseCache = false
   },
   methods: {
     resetFormData () {
@@ -208,6 +223,12 @@ export default {
       this.pageIndex = val
       this.getDataList()
     }
+  },
+  beforeRouteLeave (to, from, next) {
+    if (['goodsCreateOrder', 'goodsDetail'].includes(to.name)) {
+      from.meta.isUseCache = true
+    }
+    next()
   }
 }
 </script>

htmldev/TBTools/src/views/modules/mine/pay/pay-wallet.vue

@@ -30,12 +30,14 @@
         prop="id"
         header-align="center"
         align="center"
+        width="100"
         label="流水号">
       </el-table-column>
       <el-table-column
         prop="logType"
         header-align="center"
         align="center"
+        width="160"
         label="流水类型">
         <template slot-scope="scope">
           <span>{{ selectOption[scope.row.logType].label }}</span>
@@ -45,12 +47,14 @@
         prop="logBalance"
         header-align="center"
         align="center"
+        width="160"
         label="流水金额">
       </el-table-column>
       <el-table-column
         prop="createdAt"
         header-align="center"
         align="center"
+        width="200"
         :show-overflow-tooltip="true"
         label="创建时间">
       </el-table-column>