cookie集中操作

Former-commit-id: 8c9ffb88b27e70269f09b1852909e92cfd710cb7 [formerly 8c9ffb88b27e70269f09b1852909e92cfd710cb7 [formerly 8c9ffb88b27e70269f09b1852909e92cfd710cb7 [formerly 8c9ffb88b27e70269f09b1852909e92cfd710cb7 [formerly e5bdcb60efe550ac396d216da0923446cdca81ee [formerly 90e1fddc055b36525405a7695e9bc7a405d98b2c]]]]]
Former-commit-id: 87867694606f8fe71fcb25c91d7089adbd959561
Former-commit-id: 9716af31042f2d63dbba236a23dc4119cfcf79c1
Former-commit-id: 22fbf4d4b11e94f88dd33c1d0ae289035e728c60 [formerly f8efa89704beb40194d90c947339377461142f60]
Former-commit-id: 15f9f81d6d4a65c6bf37e0609b0b9015778121ab
Former-commit-id: 410cc0bf083d3101c9b689d2a6e411224dfd2228
Former-commit-id: 474c050e0bb843faf13e525ef3fe141482d36fee
Former-commit-id: 947277bfe634f10563da40a6205bf69b3056f06f
Former-commit-id: cceb89e9afd1516fb3378d3edcbfca97cbaa0ffe

src/layout/header-aside/layout.vue

@@ -10,8 +10,8 @@
       <!-- 顶栏 -->
       <div class="d2-theme-header">
         <div class="logo-group" :style="{width: isMenuAsideCollapse ? asideWidthCollapse : asideWidth}">
-          <img v-if="isMenuAsideCollapse" :src="`${$baseUrl}image/theme/${themeActiveSetting.name}/logo/icon-only.png`">
+          <img v-if="isMenuAsideCollapse" :src="`${$baseUrl}image/theme/${d2adminThemeActiveSetting.name}/logo/icon-only.png`">
-          <img v-else :src="`${$baseUrl}image/theme/${themeActiveSetting.name}/logo/all.png`">
+          <img v-else :src="`${$baseUrl}image/theme/${d2adminThemeActiveSetting.name}/logo/all.png`">
         </div>
         <div class="toggle-aside-btn" @click="handleToggleAside">
           <d2-icon name="bars"/>
@@ -87,7 +87,7 @@ export default {
       isMenuAsideCollapse: state => state.d2admin.isMenuAsideCollapse
     }),
     ...mapGetters([
-      'themeActiveSetting',
+      'd2adminThemeActiveSetting',
       'd2adminKeepAliveInclude'
     ]),
     /**
@@ -95,8 +95,8 @@ export default {
      */
     styleLayoutMainGroup () {
       return {
-        ...this.themeActiveSetting.backgroundImage ? {
+        ...this.d2adminThemeActiveSetting.backgroundImage ? {
-          backgroundImage: `url('${this.$baseUrl}${this.themeActiveSetting.backgroundImage}')`
+          backgroundImage: `url('${this.$baseUrl}${this.d2adminThemeActiveSetting.backgroundImage}')`
         } : {}
       }
     }

src/libs/util.js

@@ -5,7 +5,9 @@ import dayjs from 'dayjs'
 import UaParser from 'ua-parser-js'
 import { version } from '../../package.json'
 
-let util = {}
+let util = {
+  cookies: {}
+}
 
 /**
  * @description 存储 cookie 值
@@ -13,7 +15,7 @@ let util = {}
  * @param {String} value cookie value
  * @param {Object} setting cookie setting
  */
-util.cookieSet = function (name = 'default', value = '', setting = {}) {
+util.cookies.set = function (name = 'default', value = '', setting = {}) {
   let cookieSetting = {
     expires: 1
   }
@@ -25,15 +27,22 @@ util.cookieSet = function (name = 'default', value = '', setting = {}) {
  * @description 拿到 cookie 值
  * @param {String} name cookie name
  */
-util.cookieGet = function (name = 'default') {
+util.cookies.get = function (name = 'default') {
   return Cookies.get(`d2admin-${version}-${name}`)
 }
 
+/**
+ * @description 拿到 cookie 全部的值
+ */
+util.cookies.getAll = function () {
+  return Cookies.get()
+}
+
 /**
  * @description 删除 cookie
  * @param {String} name cookie name
  */
-util.cookieRemove = function (name = 'default') {
+util.cookies.remove = function (name = 'default') {
   return Cookies.remove(`d2admin-${version}-${name}`)
 }
 

src/main.js

@@ -11,7 +11,7 @@ import contentmenu from 'v-contextmenu'
 import 'v-contextmenu/dist/index.css'
 import vueJsonTreeView from 'vue-json-tree-view'
 import i18n from './i18n'
-import util from '@/libs/util'
+import util from '@/libs/util.js'
 import store from '@/store/index'
 import { frameInRoutes } from '@/router/routes'
 import { menuAside, menuHeader } from '@/menu'

src/pages/demo/playground/store/sys/index.vue

@@ -61,7 +61,7 @@
           <el-card shadow="never" class="d2-card d2-mb">
             <template slot="header">当前主题信息</template>
             <div style="height: 300px; overflow: auto;">
-              <tree-view class="tree-view-small" :data="themeActiveSetting" :options="{ rootObjectKey: 'themeActiveSetting', maxDepth: 1 }"/>
+              <tree-view class="tree-view-small" :data="d2adminThemeActiveSetting" :options="{ rootObjectKey: 'd2adminThemeActiveSetting', maxDepth: 1 }"/>
             </div>
           </el-card>
         </el-col>
@@ -126,7 +126,7 @@ export default {
       ua: state => state.d2admin.ua
     }),
     ...mapGetters([
-      'themeActiveSetting',
+      'd2adminThemeActiveSetting',
       'd2adminKeepAliveInclude'
     ])
   }

src/pages/demo/plugins/js-cookie/index.vue

@@ -1,44 +1,52 @@
 <template>
   <d2-container>
-    <template slot="header">Cookie 读写</template>
+    <template slot="header">
+      <div class="d2-mb">Cookie 读写</div>
+      <el-alert
+        title="建议"
+        type="warning"
+        description="建议使用 util 内的 cookies 对象，这样会在存储和读取时统一增加前缀，方便对 cookie 统一管理"
+        show-icon>
+      </el-alert>
+    </template>
     <p class="d2-mt-0">基本读写删</p>
-    <el-button type="primary" @click="set('test-user-name', 'test-user')">set('test-user-name', 'normalValue')</el-button>
+    <el-button type="primary" @click="set('demo-user-name', 'demo-user')">set('demo-user-name', 'normalValue')</el-button>
-    <el-button type="info" @click="get('test-user-name')">get('test-user-name')</el-button>
+    <el-button type="info" @click="get('demo-user-name')">get('demo-user-name')</el-button>
-    <el-button type="error" @click="remove('test-user-name')">remove('test-user-name')</el-button>
+    <el-button type="error" @click="remove('demo-user-name')">remove('demo-user-name')</el-button>
     <p>设置有效期</p>
-    <el-button type="primary" @click="setExpires('test-user-pwd', '123456789', 1)">设置 'test-user-pwd' 有效期为一天</el-button>
+    <el-button type="primary" @click="setExpires('demo-user-pwd', '123456789', 1)">设置 'demo-user-pwd' 有效期为一天</el-button>
-    <el-button type="info" @click="get('test-user-pwd')">get('test-user-pwd')</el-button>
+    <el-button type="info" @click="get('demo-user-pwd')">get('demo-user-pwd')</el-button>
-    <el-button type="error" @click="remove('test-user-pwd')">remove('test-user-pwd')</el-button>
+    <el-button type="error" @click="remove('demo-user-pwd')">remove('demo-user-pwd')</el-button>
     <p>获取所有可以获得的数据</p>
     <el-button type="info" @click="getAll">getAll</el-button>
   </d2-container>
 </template>
 
 <script>
-import Cookies from 'js-cookie'
+import util from '@/libs/util.js'
 export default {
   methods: {
     set (name = 'default-name', value = 'default-value') {
-      Cookies.set(name, value)
+      util.cookies.set(name, value)
       this.$message.info(`设置数据 ${name} = ${value}`)
     },
     setExpires (name = 'default-name', value = 'default-value', expires = 1) {
-      Cookies.set(name, value, {
+      util.cookies.set(name, value, {
         expires
       })
       this.$message.info(`设置数据 ${name} = ${value} 有效期 ${expires} 天`)
     },
     get (name = 'default-name') {
-      const value = Cookies.get(name)
+      const value = util.cookies.get(name)
       this.$message.info(`获取数据 ${name} = ${value}`)
     },
     getAll () {
-      const value = Cookies.get()
+      const value = util.cookies.getAll()
       console.log(value)
       this.$message.info('结果已经打印到控制台')
     },
     remove (name = 'default-name') {
-      Cookies.remove(name)
+      util.cookies.remove(name)
       this.$message.info(`删除数据 ${name}`)
     }
   }

src/router/index.js

@@ -19,7 +19,7 @@ router.beforeEach((to, from, next) => {
   if (to.matched.some(r => r.meta.requiresAuth)) {
     // 这里暂时将cookie里是否存有token作为验证是否登陆的条件
     // 请根据自身业务需要修改
-    const token = util.cookieGet('token')
+    const token = util.cookies.get('token')
     if (token && token !== 'undefined') {
       next()
     } else {

src/store/modules/d2admin.js.REMOVED.git-id

@@ -1 +1 @@
-7ef7e525f2d37a8e3fef5528dd88a3b143b5d688
+0e3af290f72b4f94e1ec5e4067127715452f4c47