sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

db update

Browse Source 
Former-commit-id: 227391acd445196d063c7e5424cbf5243ed34fff [formerly 227391acd445196d063c7e5424cbf5243ed34fff [formerly 227391acd445196d063c7e5424cbf5243ed34fff [formerly 227391acd445196d063c7e5424cbf5243ed34fff [formerly 09be4dfe2d27d6b5cae7f5229fd89e107df524d2 [formerly af907a0206a24d385946e44d22e9dc02e65c3d5d]]]]]
Former-commit-id: 8c415cd0ae09c25683be79488e84cf39aa6143a7
Former-commit-id: 7e7392d78cdbd636dc856df3276ee66a2a14b9cb
Former-commit-id: 4417f57b963cce4a8b24e6729c2f914505cfaf16 [formerly 0addaeab1e075b68324da0c7a29fcac878fb938a]
Former-commit-id: 596cd1e5b343e096aa7974e42ff238138b45b65a
Former-commit-id: 87e1da947c638b286f5a7e4d63ec99b063acdbbc
Former-commit-id: f6b6ba6cb2a25ae7fabb657f0903e856058c1647
Former-commit-id: ce0fbdb1493e80b5afd920c95a78f1e919f221e4
Former-commit-id: df86d4b69730e071f71e34511d8fb6cc39664726
This commit is contained in:
liyang
2018-08-10 10:58:08 +08:00
parent 7c97a2ed0d
commit 0453ab7f36
10 changed files with 170 additions and 356 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/menu/modules/demo-playground.js
View File

@@ -40,9 +40,7 @@ export default {
title: '数据持久化',
icon: 'database',
children: [
{ path: `${pre}db/all`, title: '全部数据', icon: 'table' },
{ path: `${pre}db/user`, title: '用户数据', icon: 'user' },
{ path: `${pre}db/public`, title: '公用数据', icon: 'users' }
{ path: `${pre}db/util`, title: 'db.util', icon: 'cube' }
]
},
{

29
src/pages/demo/playground/db/all/index.vue
View File

@@ -1,29 +0,0 @@
<template>
<d2-container class="page">
<template slot="header">
<el-button type="primary" @click="load">
重新获取本地数据
</el-button>
</template>
<d2-highlight :code="dbData"/>
</d2-container>
</template>
<script>
import db from '@/libs/db.js'
export default {
data () {
return {
dbData: ''
}
},
mounted () {
this.load()
},
methods: {
load () {
this.dbData = JSON.stringify(db.value(), null, 2)
}
}
}
</script>

121
src/pages/demo/playground/db/public/index.vue
View File

@@ -1,121 +0,0 @@
<template>
<d2-container class="page">
<template slot="header">持久化存储公用数据（所有用户共享）</template>
<el-row>
<el-col :span="12">
<p class="d2-mt-0">增加不重复字段</p>
<el-button @click="handleSetRandom">增加</el-button>
<p>增加自定义字段</p>
<el-input v-model="keyNameToSet" placeholder="字段名" class="d2-mr-5" style="width: 100px;"/>
<el-input v-model="valueToSet" placeholder="值" class="d2-mr-5" style="width: 100px;"/>
<el-button @click="handleSet">增加</el-button>
<p>删除字段</p>
<el-select
v-model="keyNameToDelete"
placeholder="请选择要删除的 key">
<el-option
v-for="item in keyNameList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<p>清空当前用户数据</p>
<el-button @click="handleClear">清空</el-button>
</el-col>
<el-col :span="12">
<d2-highlight :code="dataDisplay"/>
</el-col>
</el-row>
</d2-container>
</template>
<script>
import day from 'dayjs'
import { mapMutations } from 'vuex'
export default {
data () {
return {
dataDisplay: '',
keyNameToSet: '',
valueToSet: '',
keyNameList: [],
keyNameToDelete: ''
}
},
watch: {
keyNameToDelete (value) {
if (value) {
this.handleDelete(value)
}
}
},
mounted () {
this.load()
},
methods: {
...mapMutations('d2admin', [
'utilDatabase',
'utilDatabaseClear'
]),
/**
* 加载本地数据
*/
load () {
this.utilDatabase(database => {
this.dataDisplay = JSON.stringify(database.value(), null, 2)
this.keyNameList = Object.keys(database.value()).map(k => ({
value: k,
label: k
}))
})
},
/**
* 删除一个字段
*/
handleDelete (name) {
this.utilDatabase(database => {
database
.unset(name)
.write()
})
this.load()
this.keyNameToDelete = ''
},
/**
* 清空当前用户的数据
*/
handleClear () {
this.utilDatabaseClear()
this.load()
},
/**
* 添加一个数据
*/
handleSet () {
if (this.keyNameToSet === '') {
this.$message.error('字段名不能为空')
return
}
this.utilDatabase(database => {
database
.set(this.keyNameToSet, this.valueToSet)
.write()
})
this.load()
},
/**
* 添加一个随机数据
*/
handleSetRandom () {
this.utilDatabase(database => {
const id = day().valueOf()
database
.set(id, Math.round(id * Math.random()))
.write()
})
this.load()
}
}
}
</script>

121
src/pages/demo/playground/db/user/index.vue
View File

@@ -1,121 +0,0 @@
<template>
<d2-container class="page">
<template slot="header">持久化存储用户数据（用户区分存储）</template>
<el-row>
<el-col :span="12">
<p class="d2-mt-0">增加不重复字段</p>
<el-button @click="handleSetRandom">增加</el-button>
<p>增加自定义字段</p>
<el-input v-model="keyNameToSet" placeholder="字段名" class="d2-mr-5" style="width: 100px;"/>
<el-input v-model="valueToSet" placeholder="值" class="d2-mr-5" style="width: 100px;"/>
<el-button @click="handleSet">增加</el-button>
<p>删除字段</p>
<el-select
v-model="keyNameToDelete"
placeholder="请选择要删除的 key">
<el-option
v-for="item in keyNameList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<p>清空当前用户数据</p>
<el-button @click="handleClear">清空</el-button>
</el-col>
<el-col :span="12">
<d2-highlight :code="dataDisplay"/>
</el-col>
</el-row>
</d2-container>
</template>
<script>
import day from 'dayjs'
import { mapMutations } from 'vuex'
export default {
data () {
return {
dataDisplay: '',
keyNameToSet: '',
valueToSet: '',
keyNameList: [],
keyNameToDelete: ''
}
},
watch: {
keyNameToDelete (value) {
if (value) {
this.handleDelete(value)
}
}
},
mounted () {
this.load()
},
methods: {
...mapMutations('d2admin', [
'utilDatabaseUser',
'utilDatabaseUserClear'
]),
/**
* 加载本地数据
*/
load () {
this.utilDatabaseUser(database => {
this.dataDisplay = JSON.stringify(database.value(), null, 2)
this.keyNameList = Object.keys(database.value()).map(k => ({
value: k,
label: k
}))
})
},
/**
* 删除一个字段
*/
handleDelete (name) {
this.utilDatabaseUser(database => {
database
.unset(name)
.write()
})
this.load()
this.keyNameToDelete = ''
},
/**
* 清空当前用户的数据
*/
handleClear () {
this.utilDatabaseUserClear()
this.load()
},
/**
* 添加一个数据
*/
handleSet () {
if (this.keyNameToSet === '') {
this.$message.error('字段名不能为空')
return
}
this.utilDatabaseUser(database => {
database
.set(this.keyNameToSet, this.valueToSet)
.write()
})
this.load()
},
/**
* 添加一个随机数据
*/
handleSetRandom () {
this.utilDatabaseUser(database => {
const id = day().valueOf()
database
.set(id, Math.round(id * Math.random()))
.write()
})
this.load()
}
}
}
</script>

116
src/pages/demo/playground/db/util/index.vue Normal file
View File

@@ -0,0 +1,116 @@
<template>
<d2-container>
<template slot="header">header</template>
<el-alert
:title="alertTitle"
type="success"
:closable="false"
class="d2-mb"/>
<el-row :gutter="10">
<el-col :span="12">
<el-row :gutter="10">
<el-col :span="12">
<p class="d2-mt-0">dbName</p>
<el-input v-model="dbName" placeholder="dbName" disabled/>
</el-col>
<el-col :span="12">
<p class="d2-mt-0">path</p>
<el-input v-model="path" placeholder="path" disabled/>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="12">
<p>key</p>
<el-input v-model="key" placeholder="key"/>
</el-col>
<el-col :span="12">
<p>value</p>
<el-input v-model="value" placeholder="value"/>
</el-col>
</el-row>
<p>存储</p>
<el-button @click="handleSet" class="d2-mb-10">保存 {{key}} = "{{value}}"</el-button>
<br>
<el-button @click="handleSetByUser">保存 {{key}} = "{{value}}" 当前用户</el-button>
<p>取值</p>
<el-button @click="handleGet" class="d2-mb-10">取值 {{key}}</el-button>
<br>
<el-button @click="handleGetByUser">取值 {{key}} 当前用户</el-button>
</el-col>
<el-col :span="12">
<el-card shadow="never">
<template slot="header">db.get('{{dbName}}').value()</template>
<div style="height: 400px; overflow: auto;">
<d2-highlight :code="dbData"/>
</div>
</el-card>
</el-col>
</el-row>
</d2-container>
</template>
<script>
import { mapMutations, mapActions } from 'vuex'
import db from '@/libs/db.js'
export default {
data () {
return {
dbName: 'db',
path: 'sandbox.demo-playground-db-util',
key: 'demo',
value: 'demo text',
dbData: ''
}
},
mounted () {
this.load()
},
computed: {
alertTitle () {
return `数据将会在 "${this.dbName}" 数据库下的 "${this.path}.${this.key}" 路径下更新，请在右侧数据中查看`
}
},
methods: {
...mapMutations('d2admin/db', [
'set',
'setByUser'
]),
...mapActions('d2admin/db', [
'get',
'getByUser'
]),
load () {
this.dbData = JSON.stringify(db.get(this.dbName).value(), null, 2)
},
handleSet () {
this.set({
dbName: this.dbName,
path: `${this.path}.${this.key}`,
value: this.value
})
this.load()
},
handleSetByUser () {
this.setByUser({
dbName: this.dbName,
path: `${this.path}.${this.key}`,
value: this.value
})
this.load()
},
async handleGet () {
const value = await this.get({
dbName: this.dbName,
path: `${this.path}.${this.key}`
})
this.$alert(`value: ${value}`, `${this.dbName}.${this.path}.${this.key}`)
},
async handleGetByUser () {
const value = await this.getByUser({
dbName: this.dbName,
path: `${this.path}.${this.key}`
})
this.$alert(`value: ${value}`, `${this.dbName}.${this.path}.${this.key}`)
}
}
}
</script>

2
src/router/routes.js.REMOVED.git-id
View File

@@ -1 +1 @@
ca12a11b6d9d0552250eb2da1e7bac555902f68d
16b7e123957b7e4ef7d5c6270616b8f00d2dd381

2
src/store/modules/d2admin/index.js.REMOVED.git-id
View File

@@ -1 +1 @@
4fee0ebd82dca4d2b9cd0ff053df6807cfd880ac
03c3404e1d1584485b9a7b73671b1dd1d17a0e14

11
src/store/modules/d2admin/modules/account.js
View File

@@ -34,17 +34,6 @@ export default {
}, { root: true })
// 用户登陆后从数据库加载一系列的设置
commit('d2admin/account/load', null, { root: true })
// 测试
// commit('d2admin/db/set', {
// dbName: 'db',
// path: 'log.login',
// value: res.data.name
// }, { root: true })
commit('d2admin/db/push', {
dbName: 'db',
path: 'log.login',
value: res.data.name
}, { root: true })
// 跳转路由
vm.$router.push({
name: 'index'

116
src/store/modules/d2admin/modules/db.js
View File

@@ -5,83 +5,50 @@ import util from '@/libs/util.js'
* @description 检查路径是否存在 不存在的话初始化
* @param {Object} param dbName {String} 数据库名称
* @param {Object} param path {String} 路径
* @param {Object} param user {Boolean} 区分用户
* @param {Object} param validator {Function} 数据校验钩子 返回 true 表示验证通过
* @param {Object} param defaultValue {*} 初始化默认值
*/
function pathInit ({
dbName = 'db',
path = '',
user = true,
validator = () => true,
defaultValue = ''
}) {
const sys = db.get(dbName)
const value = sys.get(path).value()
const uuid = util.cookies.get('uuid') || 'ghost-uuid'
const currentPath = `${user ? `user.${uuid}` : 'public'}.${path}`
const value = sys.get(currentPath).value()
if (!(value && validator(value))) {
sys
.set(path, defaultValue)
.set(currentPath, defaultValue)
.write()
}
return sys.get(path)
}
/**
* @description 检查路径下是否有当前用户的档案
* @param {Object} param dbName {String} 数据库名称
* @param {Object} param path {String} 路径
*/
function isRowExistByUser ({
dbName = 'sys',
path = ''
}) {
const sys = db.get(dbName)
const row = sys
.get(path)
.find({
uuid: util.cookies.get('uuid')
})
// 返回可以操作的 row 或者布尔值 false
// 外部判断返回值的时候建议使用 if (!isRowExistByUser({}))
if (row.value()) {
return row
} else {
return false
}
return `${dbName}.${currentPath}`
}
export default {
namespaced: true,
mutations: {
/**
* @description 将数据存储到指定位置 | 路径不存在会自动初始化 [不区分用户]
* @description 将数据存储到指定位置 | 路径不存在会自动初始化
* @description 效果类似于 dbName.path = value
* @param {Object} state vuex state
* @param {Object} param dbName {String} 数据库名称
* @param {Object} param path {String} 存储路径
* @param {Object} param value {*} 需要存储的值
*/
set (state, { dbName = 'db', path = '', value = '' }) {
db
.get(dbName)
.set(path, value)
.write()
},
/**
* @description 将数据 push 到指定位置 | 路径不存在会自动初始化 [不区分用户]
* @description 效果类似于 dbName.path.push(value)
* @param {Object} state vuex state
* @param {Object} param dbName {String} 数据库名称
* @param {Object} param path {String} 存储路径
* @param {Object} param value {*} 需要存储的值
*/
push (state, { dbName = 'db', path = '', value = '' }) {
pathInit({
set (state, {
dbName = 'db',
path = '',
value = ''
}) {
db.set(pathInit({
dbName,
path,
validator: value => Array.isArray(value),
defaultValue: []
})
.push(value)
.write()
user: false
}), value).write()
},
/**
* @description 将数据存储到指定位置 | 路径不存在会自动初始化 [区分用户]
@@ -96,24 +63,35 @@ export default {
path = '',
value = ''
}) {
// 得到路径在数据库中的对象 没有初始化会自动初始化
// ByUser 类型的默认值设置为数组
// 以后数组的每一项是一个用户的存档
const currentPath = pathInit({ dbName, path, defaultValue: [] })
// 得到当前用户在数据库此路径下的存档
const row = isRowExistByUser({ dbName, path })
// 合并 or 追加
if (!row) {
currentPath.push({
uuid: util.cookies.get('uuid'),
value
}).write()
} else {
row.assign({ value }).write()
}
db.set(pathInit({
dbName,
path
}), value).write()
}
},
actions: {
/**
* @description 获取数据
* @description 效果类似于 dbName.path || defaultValue
* @param {Object} state vuex state
* @param {Object} param dbName {String} 数据库名称
* @param {Object} param path {String} 存储路径
* @param {Object} param defaultValue {*} 取值失败的默认值
*/
get (context, {
dbName = 'db',
path = '',
defaultValue = ''
}) {
return new Promise((resolve, reject) => {
resolve(db.get(pathInit({
dbName,
path,
user: false,
defaultValue
})).value())
})
},
/**
* @description 获取数据 [区分用户]
* @description 效果类似于 dbName.path[user] || defaultValue
@@ -128,10 +106,12 @@ export default {
defaultValue = ''
}) {
return new Promise((resolve, reject) => {
// 得到当前用户在数据库此路径下的存档
const row = isRowExistByUser({ path })
// 返回存档或者默认值
resolve(!row ? defaultValue : row.value().value)
resolve(db.get(pathInit({
dbName,
path,
user: true,
defaultValue
})).value())
})
}
}

4
src/store/modules/d2admin/modules/user.js
View File

@@ -31,7 +31,9 @@ export default {
state.info = await this.dispatch('d2admin/db/getByUser', {
dbName: 'sys',
path: 'user.info',
defaultValue: '请重新登陆'
defaultValue: {
name: 'Ghost'
}
})
}
}