From e661f60f13c4714502373538635f4b55fef4747e Mon Sep 17 00:00:00 2001 From: hb0730 <1278032416@qq.com> Date: Wed, 29 Sep 2021 09:07:54 +0800 Subject: [PATCH] feat(storage): add new storage (#48) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat(storage): add new storage，新增 database 和 cookie 存储 * fix(storage): 区分用户，获取当前存储路径时,应该获取当前用户，用来区分用户 * fix: ts alias mapping * chore: remove lodash * fix(storage): replace lodash with lodash-es * fix(storage): initialization，Initialization failed, unable to write --- .env | 5 ++- .env.development | 5 ++- package.json | 3 +- src/utils/storage/cookie.ts | 53 ++++++++++++++++++++++ src/utils/storage/db.ts | 87 +++++++++++++++++++++++++++++++++++++ tsconfig.json | 1 + types/global.d.ts | 2 + vite.config.ts | 1 + yarn.lock | 30 +++++++++---- 9 files changed, 175 insertions(+), 12 deletions(-) create mode 100644 src/utils/storage/cookie.ts create mode 100644 src/utils/storage/db.ts diff --git a/.env b/.env index 37d43eb91..85952ff23 100644 --- a/.env +++ b/.env @@ -1,6 +1,9 @@ # port VITE_PORT = 8848 - +# title +VITE_TITLE = vue-pure-admin +# version +VITE_VERSION = 1.0.0 # open VITE_OPEN = false diff --git a/.env.development b/.env.development index 37d43eb91..85952ff23 100644 --- a/.env.development +++ b/.env.development @@ -1,6 +1,9 @@ # port VITE_PORT = 8848 - +# title +VITE_TITLE = vue-pure-admin +# version +VITE_VERSION = 1.0.0 # open VITE_OPEN = false diff --git a/package.json b/package.json index d8c82aa94..b2e78cf6a 100644 --- a/package.json +++ b/package.json @@ -27,12 +27,12 @@ "axios": "^0.21.1", "cropperjs": "^1.5.11", "dayjs": "^1.10.6", - "dotenv": "^8.2.0", "echarts": "^5.1.2", "element-plus": "^1.1.0-beta.16", "element-resize-detector": "^1.2.3", "font-awesome": "^4.7.0", "lodash-es": "^4.17.21", + "lowdb": "^3.0.0", "mitt": "^2.1.0", "mockjs": "^1.1.0", "nprogress": "^0.2.0", @@ -42,6 +42,7 @@ "resize-observer-polyfill": "^1.5.1", "responsive-storage": "^1.0.10", "sortablejs": "1.13.0", + "typescript-cookie": "^1.0.0", "v-contextmenu": "^3.0.0", "vue": "^3.2.19", "vue-i18n": "^9.2.0-beta.3", diff --git a/src/utils/storage/cookie.ts b/src/utils/storage/cookie.ts new file mode 100644 index 000000000..6c77ef3da --- /dev/null +++ b/src/utils/storage/cookie.ts @@ -0,0 +1,53 @@ +import { loadEnv } from "@build/utils"; +import { merge } from "lodash-es"; +import tsCookies from "typescript-cookie/dist/src/compat"; + +class Cookies { + private static env = loadEnv(); + constructor() {} + /** + * 存储 cookie 值 + * @param name + * @param value + * @param cookieSetting + */ + set(name = "default", value = "", cookieSetting = {}) { + const currentCookieSetting = { + expires: 1 + }; + merge(currentCookieSetting, cookieSetting); + tsCookies.set( + `${Cookies.env.VITE_TITLE}-${Cookies.env.VITE_VERSION}-${name}`, + value, + currentCookieSetting + ); + } + /** + * 拿到 cookie 值 + * @param name + * @returns + */ + get(name = "default"): any { + return tsCookies.get( + `${Cookies.env.VITE_TITLE}-${Cookies.env.VITE_VERSION}-${name}` + ); + } + /** + * 拿到 cookie 全部的值 + * @returns + */ + getAll(): any { + return tsCookies.get(); + } + /** + * 删除 cookie + * @param name + */ + remove(name = "default") { + tsCookies.remove( + `${Cookies.env.VITE_TITLE}-${Cookies.env.VITE_VERSION}-${name}` + ); + } +} + +export const cookies = new Cookies(); diff --git a/src/utils/storage/db.ts b/src/utils/storage/db.ts new file mode 100644 index 000000000..f02e005dc --- /dev/null +++ b/src/utils/storage/db.ts @@ -0,0 +1,87 @@ +import { loadEnv } from "@build/utils"; +import { LocalStorage, LowSync } from "lowdb"; +import { chain, cloneDeep } from "lodash-es"; +import { storageLocal } from "."; +import { cookies } from "./cookie"; +type Data = { + database: {}; + sys: {}; +}; +/** + * db 数据存储,采用 LocalStorage存储 + */ +class DB { + private db: LowSync; + private static env = loadEnv(); + constructor() { + this.db = new LowSync( + new LocalStorage(`${DB.env.VITE_TITLE}-${DB.env.VITE_VERSION}`) + ); + this.initialization(); + this.db.chain = chain(this.db.data); + } + private initialization() { + this.db.data = storageLocal.getItem( + `${DB.env.VITE_TITLE}-${DB.env.VITE_VERSION}` + ) || { database: {}, sys: {} }; + this.db.write(); + } + /** + * 检查路径是否存在 不存在的话初始化 + * @param param0 + * @returns path + */ + pathInit({ + dbName = "database", + path = "", + user = true, + validator = () => true, + defaultValue = "" + }): string { + const uuid = cookies.get("uuid") || "ghost-uuid"; + const currentPath = `${dbName}.${user ? `user.${uuid}` : "public"}${ + path ? `.${path}` : "" + }`; + const value = this.db.chain.get(currentPath).value(); + if (!(value !== undefined && validator(value))) { + this.db.chain.set(currentPath, defaultValue).value(); + this.db.write(); + } + return currentPath; + } + /** + *将数据存储到指定位置 | 路径不存在会自动初始化 + * + * 效果类似于取值 dbName.path = value + * @param param0 + */ + dbSet({ dbName = "database", path = "", value = "", user = false }): void { + const currentPath = this.pathInit({ + dbName, + path, + user + }); + this.db.chain.set(currentPath, value).value(); + this.db.write(); + } + /** + * 获取数据 + * + * 效果类似于取值 dbName.path || defaultValue + * @param param0 + * @returns + */ + dbGet({ + dbName = "database", + path = "", + defaultValue = "", + user = false + }): any { + const values = this.db.chain + .get(this.pathInit({ dbName, path, user, defaultValue })) + .value(); + return cloneDeep(values); + } +} + +export const db = new DB(); diff --git a/tsconfig.json b/tsconfig.json index d1c251b11..2cd16858c 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -21,6 +21,7 @@ "incremental": true, "paths": { "/@/*": ["src/*"], + "@build/*": ["build/*"], "/#/*": ["types/*"] }, "types": ["node", "vite/client"], diff --git a/types/global.d.ts b/types/global.d.ts index 7fd62a01e..95e997cd7 100644 --- a/types/global.d.ts +++ b/types/global.d.ts @@ -65,6 +65,8 @@ declare global { declare interface ViteEnv { VITE_PORT: number; + VITE_TITLE: string; + VITE_VERSION: string; VITE_USE_MOCK: boolean; VITE_USE_PWA: boolean; VITE_PUBLIC_PATH: string; diff --git a/vite.config.ts b/vite.config.ts index 3c4de6b52..cd5e07f20 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -15,6 +15,7 @@ const pathResolve = (dir: string): any => { const alias: Record = { "/@": pathResolve("src"), + "@build": pathResolve("build"), //解决开发环境下的警告 You are running the esm-bundler build of vue-i18n. It is recommended to configure your bundler to explicitly replace feature flag globals with boolean literals to get proper tree-shaking in the final bundle. "vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js" }; diff --git a/yarn.lock b/yarn.lock index 34553b67a..781a8fb8a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1732,11 +1732,6 @@ dot-prop@^5.1.0: dependencies: is-obj "^2.0.0" -dotenv@^8.2.0: - version "8.6.0" - resolved "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz#061af664d19f7f4d8fc6e4ff9b584ce237adcb8b" - integrity sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g== - downloadjs@1.4.7: version "1.4.7" resolved "https://registry.npmjs.org/downloadjs/-/downloadjs-1.4.7.tgz#f69f96f940e0d0553dac291139865a3cd0101e3c" @@ -2872,8 +2867,8 @@ locate-path@^6.0.0: lodash-es@^4.17.21: version "4.17.21" - resolved "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee" - integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw== + resolved "https://registry.npm.taobao.org/lodash-es/download/lodash-es-4.17.21.tgz?cache=0&sync_timestamp=1613836838613&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flodash-es%2Fdownload%2Flodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee" + integrity sha1-Q+YmxG5lkbd1C+srUBFzkMYJ4+4= lodash.camelcase@^4.3.0: version "4.3.0" @@ -2897,8 +2892,8 @@ lodash.truncate@^4.4.2: lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21: version "4.17.21" - resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" - integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== + resolved "https://registry.npm.taobao.org/lodash/download/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" + integrity sha1-Z5WRxWTDv/quhFTPCz3zcMPWkRw= log-symbols@^4.1.0: version "4.1.0" @@ -2923,6 +2918,13 @@ longest-streak@^2.0.0: resolved "https://registry.npmjs.org/longest-streak/-/longest-streak-2.0.4.tgz#b8599957da5b5dab64dee3fe316fa774597d90e4" integrity sha512-vM6rUVCVUJJt33bnmHiZEvr7wPT78ztX7rojL+LW51bHtLh6HTjx84LA5W4+oa6aKEJA7jJu5LR6vQRBpA5DVg== +lowdb@^3.0.0: + version "3.0.0" + resolved "https://registry.nlark.com/lowdb/download/lowdb-3.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Flowdb%2Fdownload%2Flowdb-3.0.0.tgz#c10ab4e7eb86f1cbe255e35e60ffb0c6f42049e0" + integrity sha1-wQq05+uG8cviVeNeYP+wxvQgSeA= + dependencies: + steno "^2.1.0" + lower-case@^2.0.2: version "2.0.2" resolved "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28" @@ -4027,6 +4029,11 @@ statuses@~1.5.0: resolved "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c" integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow= +steno@^2.1.0: + version "2.1.0" + resolved "https://registry.nlark.com/steno/download/steno-2.1.0.tgz#05a9c378ce42ed04f642cda6fcb41787a10e4e33" + integrity sha1-BanDeM5C7QT2Qs2m/LQXh6EOTjM= + string-argv@0.3.1: version "0.3.1" resolved "https://registry.npmjs.org/string-argv/-/string-argv-0.3.1.tgz#95e2fbec0427ae19184935f816d74aaa4c5c19da" @@ -4344,6 +4351,11 @@ typedarray-to-buffer@^3.1.5: dependencies: is-typedarray "^1.0.0" +typescript-cookie@^1.0.0: + version "1.0.0" + resolved "https://registry.npmmirror.com/typescript-cookie/download/typescript-cookie-1.0.0.tgz#5354bf5d827b98dfe40807bf19b143cdd595a772" + integrity sha1-U1S/XYJ7mN/kCAe/GbFDzdWVp3I= + typescript@^4.4.2: version "4.4.3" resolved "https://registry.npmjs.org/typescript/-/typescript-4.4.3.tgz#bdc5407caa2b109efd4f82fe130656f977a29324"