unicloud-database.uvue 9.0 KB
Newer Older
雪洛's avatar
雪洛 已提交
1 2
<template>
  <!-- #ifdef APP -->
H
hdx 已提交
3
  <scroll-view class="page-scroll-view">
雪洛's avatar
雪洛 已提交
4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
  <!-- #endif -->
    <view>
      <page-head :title="title"></page-head>
      <view class="uni-padding-wrap uni-common-mt">
        <view class="uni-btn-v uni-common-mt">
          <button type="primary" @click="dbAdd">新增单条数据</button>
          <button type="primary" @click="dbBatchAdd">新增多条数据</button>
          <button type="primary" @click="dbUpdate">更新数据</button>
          <button type="primary" @click="dbGet">where传字符串获取数据</button>
          <button type="primary" @click="dbGetWithCommand">where传对象获取数据</button>
          <button type="primary" @click="dbRemove">删除数据</button>
          <button type="primary" @click="dbLookupInit">初始化联表查询数据</button>
          <button type="primary" @click="dbLookup">联表查询</button>
        </view>
      </view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>
H
hdx 已提交
24

雪洛's avatar
雪洛 已提交
25 26 27 28
<script>
  export default {
    data() {
      return {
雪洛's avatar
雪洛 已提交
29 30 31 32 33 34 35 36 37
        title: 'ClientDB',
        addId: '',
        batchAddIds: [] as Array<string>,
        batchAddinserted: 0,
        updateUpdated: 0,
        getData: [] as Array<UTSJSONObject>,
        getWithCommandData: [] as Array<UTSJSONObject>,
        removeDeleted: 0,
        lookupData: [] as Array<UTSJSONObject>,
38
        isUniTest: false
雪洛's avatar
雪洛 已提交
39 40 41 42 43
      }
    },
    onLoad() {
    },
    onUnload() {
44
      if (this.isUniTest) {
45 46
        uni.hideToast()
      }
雪洛's avatar
雪洛 已提交
47
    },
48 49 50 51 52
    computed: {
      dataTag() : string {
        return this.isUniTest ? 'default-tag' + Date.now() : 'default-tag'
      }
    },
雪洛's avatar
雪洛 已提交
53
    methods: {
54 55 56 57 58 59 60 61 62 63 64
      notify(content : string, title : string) {
        if (!this.isUniTest) {
          uni.showModal({
            title,
            content,
            showCancel: false
          })
        } else {
          uni.showToast({
            title: content
          })
雪洛's avatar
雪洛 已提交
65
          console.log(title, content)
66 67
        }
      },
68
      async dbAdd() : Promise<void> {
雪洛's avatar
雪洛 已提交
69 70 71 72
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
73
        await db.collection('type')
雪洛's avatar
雪洛 已提交
74 75
          .add({
            num: 1,
76
            tag: this.dataTag,
雪洛's avatar
雪洛 已提交
77
            date: new Date()
雪洛's avatar
雪洛 已提交
78
          })
雪洛's avatar
雪洛 已提交
79
          .then(res => {
雪洛's avatar
雪洛 已提交
80 81
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
82
            this.addId = res.id
83
            this.notify(`新增成功,id: ${res.id}`, '提示')
雪洛's avatar
雪洛 已提交
84
          })
雪洛's avatar
雪洛 已提交
85
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
86 87
            uni.hideLoading()
            const error = err as UniCloudError
88
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
89 90
          })
      },
91
      async dbBatchAdd() : Promise<void> {
雪洛's avatar
雪洛 已提交
92 93 94 95
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
96
        await db.collection('type')
雪洛's avatar
雪洛 已提交
97 98
          .add([{
            num: 2,
99
            tag: this.dataTag,
雪洛's avatar
雪洛 已提交
100 101
          }, {
            num: 3,
102
            tag: this.dataTag,
雪洛's avatar
雪洛 已提交
103
          }])
雪洛's avatar
雪洛 已提交
104
          .then((res) => {
雪洛's avatar
雪洛 已提交
105 106
            uni.hideLoading()
            console.log(res)
107
            console.log('JSON.stringify(res.inserted)', JSON.stringify(res.inserted))
雪洛's avatar
雪洛 已提交
108 109
            this.batchAddIds = res.ids
            this.batchAddinserted = res.inserted
110
            this.notify(`新增成功条数${res.inserted}, id列表: ${res.ids.join(',')}`, '提示')
雪洛's avatar
雪洛 已提交
111
          })
雪洛's avatar
雪洛 已提交
112
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
113 114
            uni.hideLoading()
            const error = err as UniCloudError
115
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
116 117
          })
      },
118
      async dbGet() : Promise<void> {
雪洛's avatar
雪洛 已提交
119 120 121 122
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
123
        await db.collection('type')
雪洛's avatar
雪洛 已提交
124
          .where(
125
            `tag == "${this.dataTag}"`
雪洛's avatar
雪洛 已提交
126
          )
雪洛's avatar
雪洛 已提交
127 128 129 130 131
          .field('num, tag')
          .orderBy('num desc')
          .skip(1)
          .limit(2)
          .get()
雪洛's avatar
雪洛 已提交
132
          .then(res => {
雪洛's avatar
雪洛 已提交
133 134
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
135
            this.getData = res.data
136
            this.notify(`获取成功,取到了${res.data.length}条数据`, '提示')
雪洛's avatar
雪洛 已提交
137
          })
雪洛's avatar
雪洛 已提交
138
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
139 140
            uni.hideLoading()
            const error = err as UniCloudError
141
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
142 143
          })
      },
144
      async dbGetWithCommand() : Promise<void> {
雪洛's avatar
雪洛 已提交
145 146 147 148
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
149
        await db.collection('type')
雪洛's avatar
雪洛 已提交
150
          .where({
151 152
            num: db.command.gt(1),
            tag: this.dataTag
雪洛's avatar
雪洛 已提交
153
          })
雪洛's avatar
雪洛 已提交
154 155 156 157 158
          .field('num, tag')
          .orderBy('num desc')
          .skip(1)
          .limit(2)
          .get()
雪洛's avatar
雪洛 已提交
159
          .then(res => {
雪洛's avatar
雪洛 已提交
160 161
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
162
            this.getWithCommandData = res.data
163
            this.notify(`获取成功,取到了${res.data.length}条数据`, '提示')
雪洛's avatar
雪洛 已提交
164
          })
雪洛's avatar
雪洛 已提交
165
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
166 167
            uni.hideLoading()
            const error = err as UniCloudError
168
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
169 170
          })
      },
171
      async dbUpdate() : Promise<void> {
雪洛's avatar
雪洛 已提交
172 173 174 175
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
176
        await db.collection('type')
雪洛's avatar
雪洛 已提交
177
          .where(
178
            `tag == "${this.dataTag}"`
雪洛's avatar
雪洛 已提交
179 180 181
          )
          .update({
            num: 4
雪洛's avatar
雪洛 已提交
182
          })
雪洛's avatar
雪洛 已提交
183
          .then(res => {
雪洛's avatar
雪洛 已提交
184 185
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
186
            this.updateUpdated = res.updated
187
            this.notify(`更新成功,更新了${res.updated}条数据`, '提示')
雪洛's avatar
雪洛 已提交
188
          })
雪洛's avatar
雪洛 已提交
189
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
190 191
            uni.hideLoading()
            const error = err as UniCloudError
192
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
193 194
          })
      },
195
      async dbRemove() : Promise<void> {
雪洛's avatar
雪洛 已提交
196 197 198 199
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
200
        await db.collection('type')
雪洛's avatar
雪洛 已提交
201
          .where(
202
            `tag == "${this.dataTag}"`
雪洛's avatar
雪洛 已提交
203 204
          )
          .remove()
雪洛's avatar
雪洛 已提交
205
          .then(res => {
雪洛's avatar
雪洛 已提交
206 207
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
208
            this.removeDeleted = res.deleted
209
            this.notify(`删除成功,删掉了${res.deleted}条数据`, '提示')
雪洛's avatar
雪洛 已提交
210
          })
雪洛's avatar
雪洛 已提交
211
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
212 213
            uni.hideLoading()
            const error = err as UniCloudError
214
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
215 216
          })
      },
217
      async dbLookupInit() : Promise<void> {
雪洛's avatar
雪洛 已提交
218 219 220 221
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
222 223
        await db.collection('local')
          .where(`tag == "${this.dataTag}"`)
雪洛's avatar
雪洛 已提交
224 225 226
          .remove()
          .then(() : Promise<UniCloudDBRemoveResult> => {
            return db.collection('foreign')
227
              .where(`tag == "${this.dataTag}"`)
雪洛's avatar
雪洛 已提交
228 229 230 231 232 233 234
              .remove()
          })
          .then(() : Promise<UniCloudDBBatchAddResult> => {
            return db.collection('local')
              .add([{
                id: "local_1",
                name: "local_1_name",
235
                tag: this.dataTag,
雪洛's avatar
雪洛 已提交
236 237 238 239
                foreign_id: "foreign_1"
              }, {
                id: "local_2",
                name: "local_2_name",
240
                tag: this.dataTag,
雪洛's avatar
雪洛 已提交
241 242 243 244 245 246 247 248
                foreign_id: "foreign_2"
              }])
          })
          .then(() : Promise<UniCloudDBBatchAddResult> => {
            return db.collection('foreign')
              .add([{
                id: "foreign_1",
                name: "foreign_1_name",
249
                tag: this.dataTag
雪洛's avatar
雪洛 已提交
250 251 252
              }, {
                id: "foreign_2",
                name: "foreign_2_name",
253
                tag: this.dataTag
雪洛's avatar
雪洛 已提交
254 255
              }])
          })
雪洛's avatar
雪洛 已提交
256
          .then((_) : void => {
雪洛's avatar
雪洛 已提交
257
            uni.hideLoading()
258
            this.notify('数据初始化成功', '提示')
雪洛's avatar
雪洛 已提交
259
          })
雪洛's avatar
雪洛 已提交
260
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
261 262 263
            uni.hideLoading()
            console.error(err)
            const error = err as UniCloudError
264
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
265 266
          })
      },
267
      async dbLookup() : Promise<void> {
雪洛's avatar
雪洛 已提交
268 269 270 271 272
        uni.showLoading({
          title: '加载中...'
        })
        const db = uniCloud.databaseForJQL()
        const local = db.collection('local')
273
          .where(`tag == "${this.dataTag}"`)
雪洛's avatar
雪洛 已提交
274 275
          .getTemp()
        const foreign = db.collection('foreign')
276
          .where(`tag == "${this.dataTag}"`)
雪洛's avatar
雪洛 已提交
277
          .getTemp()
278
        await db.collection(local, foreign)
雪洛's avatar
雪洛 已提交
279
          .get()
雪洛's avatar
雪洛 已提交
280
          .then(res => {
雪洛's avatar
雪洛 已提交
281 282
            uni.hideLoading()
            console.log(res)
雪洛's avatar
雪洛 已提交
283
            this.lookupData = res.data
284
            this.notify(`联表查询成功,取到了${res.data.length}条数据`, '提示')
雪洛's avatar
雪洛 已提交
285
          })
雪洛's avatar
雪洛 已提交
286
          .catch((err : any | null) => {
雪洛's avatar
雪洛 已提交
287 288
            uni.hideLoading()
            const error = err as UniCloudError
289
            this.notify(error.errMsg, '错误')
雪洛's avatar
雪洛 已提交
290 291 292 293 294 295 296
          })
      }
    }
  }
</script>

<style>
雪洛's avatar
雪洛 已提交
297
</style>