smart-search-web/src/stores/indexDB.ts

import {defineStore} from "pinia";
import {readonly} from "vue";
import {ElLoading, ElNotification} from "element-plus";
import {useThemeStore} from "@/stores/theme";


export const useIndexDBStore = defineStore('indexDB', {
  state: () => ({
    DB: <any>null
  }),
  getters: {

  },
  actions: {
    initDB() {
      return new Promise((resolve, reject) => {
        const loading = ElLoading.service({
          lock: true,
          text: '数据库加载中',
          background: useThemeStore().loadingBg,
        })
        const request: any = window.indexedDB.open('SmartSearch', 1)
        request.onerror = (event) => {}
        request.onupgradeneeded = (event: any) => {
          this.DB = event.target.result
          if (!this.DB.objectStoreNames.contains('timestamp')) {
            const objectStore = this.DB.createObjectStore('timestamp', { keyPath: 'timestamp' })
          }
        }
        request.onsuccess = (event) => {
          this.DB = event.target.result
          resolve(this.DB)
          loading.close()
        }
      })
    },
    setTimestamp(params) {
      return new Promise((resolve, reject) => {
        const loading = ElLoading.service({
          lock: true,
          text: '查询参数构建中',
          background: useThemeStore().loadingBg,
        })
        const timestamp = String(new Date().getTime())
        const obj = {
          timestamp,
          json: JSON.stringify(params)
        }
        const re = this.DB.transaction(['timestamp'], 'readwrite').objectStore('timestamp').add(obj)
        re.onsuccess = (e: any) => {
          resolve(timestamp)
          loading.close()
        }
      })
    },
    getTimestamp(timestamp) {
      return new Promise((resolve, reject) => {
        const loading = ElLoading.service({
          lock: true,
          text: '查询参数解析中',
          background: useThemeStore().loadingBg,
        })
        const re = this.DB.transaction(['timestamp']).objectStore('timestamp').get(timestamp)
        re.onsuccess = (e: any) => {
          if (re.result) {
            resolve(JSON.parse(re.result.json))
            loading.close()
          } else {
            ElNotification({
              duration: 0,
              title: '提示',
              message: '查询条件获取失败，请重新输入！',
              type: 'warning',
              onClose: () => {
              }
            })
            reject()
            loading.close()
          }
        }
      })
    },
    clearTimestamp() {
      return new Promise((resolve, reject) => {
        const loading = ElLoading.service({
          lock: true,
          text: '数据库创建中',
          background: useThemeStore().loadingBg,
        })
        if (this.DB.objectStoreNames.contains('timestamp')) {
          const oldRe = this.DB.transaction(['timestamp'])?.objectStore('timestamp')
          oldRe.openCursor().onsuccess = (e: any) => {
            const cursor = e.target.result
            if (cursor) {
              this.DB.transaction(['timestamp'], 'readwrite').objectStore('timestamp').delete(cursor.primaryKey)
              cursor.continue();
            } else {
              resolve('')
              loading.close()
            } 
          }
        } else {
          resolve('')
          loading.close()
        }
      })
    }
  },
})