0e61d7cee9
Former-commit-id: 61b3ce81f703f3b83d29c7ec9f1f58ac351e9feb [formerly 85631772690b91e0d39e1b9e90d23dae7d929c9a] [formerly 61b3ce81f703f3b83d29c7ec9f1f58ac351e9feb [formerly 85631772690b91e0d39e1b9e90d23dae7d929c9a] [formerly 61b3ce81f703f3b83d29c7ec9f1f58ac351e9feb [formerly 85631772690b91e0d39e1b9e90d23dae7d929c9a] [formerly 85631772690b91e0d39e1b9e90d23dae7d929c9a [formerly 8194f7e92144427b7c4947a93812a1cd0564a642 [formerly f4b7b47afbed6f98890de3ee269cbeae522f819e]]]]] Former-commit-id: ea4bebdc76ac4332d037f141867abe2d88211643 Former-commit-id: 2be71d915c7aca35f87f3cd91b313a4e1d92fdc5 Former-commit-id: cf55d88b39e1f3293deada0f7294e9938a15667b [formerly 19d9709c2a3c71a1a4cf268f80ebcaff05a6c97d] Former-commit-id: e8c7b6443a38f5d4311d19a8ecf9d5a65a5e3cd2 Former-commit-id: c68ed1fe39857770bef0feb198d6c8ab55a97959 Former-commit-id: cad71a8eb5306a6303be52cd6eed4021c16c93b6 Former-commit-id: 22d6241afd1762a0f999c89dcb24052504660e82 Former-commit-id: 3a183f17d724638f25c5f5ea70a368cdc3cd4f85
124 lines
3.0 KiB
Vue
124 lines
3.0 KiB
Vue
<template>
|
|
<d2-container :filename="filename">
|
|
<template slot="header">
|
|
<el-alert
|
|
type="success"
|
|
:closable="false"
|
|
title="公用存储指所有用户共用的存储区域，
|
|
使用 await this.$store.dispatch('d2admin/db/database') 获得存储实例进行操作"/>
|
|
</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 { uniqueId } from 'lodash'
|
|
import { mapActions } from 'vuex'
|
|
export default {
|
|
data () {
|
|
return {
|
|
dataDisplay: '',
|
|
keyNameToSet: '',
|
|
valueToSet: '',
|
|
keyNameList: [],
|
|
keyNameToDelete: ''
|
|
}
|
|
},
|
|
watch: {
|
|
keyNameToDelete (value) {
|
|
if (value) {
|
|
this.handleDelete(value)
|
|
}
|
|
}
|
|
},
|
|
mounted () {
|
|
this.load()
|
|
},
|
|
methods: {
|
|
...mapActions('d2admin/db', [
|
|
'database',
|
|
'databaseClear'
|
|
]),
|
|
/**
|
|
* 加载本地数据
|
|
*/
|
|
async load () {
|
|
const db = await this.database()
|
|
this.dataDisplay = JSON.stringify(db.value(), null, 2)
|
|
this.keyNameList = Object.keys(db.value()).map(k => ({
|
|
value: k,
|
|
label: k
|
|
}))
|
|
},
|
|
/**
|
|
* 删除一个字段
|
|
*/
|
|
async handleDelete (name) {
|
|
const db = await this.database()
|
|
db
|
|
.unset(name)
|
|
.write()
|
|
this.load()
|
|
this.keyNameToDelete = ''
|
|
},
|
|
/**
|
|
* 清空当前用户的数据
|
|
*/
|
|
async handleClear () {
|
|
await this.databaseClear()
|
|
this.load()
|
|
},
|
|
/**
|
|
* 添加一个数据
|
|
*/
|
|
async handleSet () {
|
|
if (this.keyNameToSet === '') {
|
|
this.$message.error('字段名不能为空')
|
|
return
|
|
}
|
|
const db = await this.database()
|
|
db
|
|
.set(this.keyNameToSet, this.valueToSet)
|
|
.write()
|
|
this.load()
|
|
},
|
|
/**
|
|
* 添加一个随机数据
|
|
*/
|
|
async handleSetRandom () {
|
|
const id = uniqueId()
|
|
const db = await this.database()
|
|
db
|
|
.set(`uniqueKey${id}`, `value${id}`)
|
|
.write()
|
|
this.load()
|
|
}
|
|
}
|
|
}
|
|
</script>
|