输入代码查询 以及 优化 数据库储存
This commit is contained in:
parent
8ce9714a0a
commit
ad682a2f78
|
@ -22,7 +22,7 @@
|
|||
v-model:value="value"
|
||||
:options="options"
|
||||
:show-search="{ filter }"
|
||||
placeholder="请输入搜索关键词"
|
||||
placeholder="请选择行政区划"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item v-else label="行政区划">
|
||||
|
@ -64,6 +64,7 @@
|
|||
<div>账户:{{ account }}</div>
|
||||
<div>密码:{{ password }}</div>
|
||||
</a-card>
|
||||
<a-input v-if="isHasAccount" class="w-40 mb-8" v-model:value="searchCode.code" autocomplete="off" placeholder="请输入单位代码查询" />
|
||||
<a-button v-if="isHasAccount" size="large" type="primary" :loading="loading" @click="getCheckStatus"> 查询审核状态 </a-button>
|
||||
<a-button v-if="isLogin" size="large" type="primary" @click="toLogin"> 去登录 </a-button>
|
||||
</div>
|
||||
|
@ -142,40 +143,44 @@ const storeTreeData = async (data: any) => {
|
|||
|
||||
// 从 IndexedDB 中加载缓存数据的函数
|
||||
const loadTreeFromCache = async (): Promise<any | null> => {
|
||||
const db = await openDB() // 打开数据库并获取数据库实例
|
||||
const transaction = db.transaction(storeName, 'readonly') // 创建一个只读事务
|
||||
const store = transaction.objectStore(storeName) // 获取存储空间
|
||||
const db = await openDB()
|
||||
const transaction = db.transaction(storeName, 'readonly')
|
||||
const store = transaction.objectStore(storeName)
|
||||
|
||||
// 获取存储在 'treeData' 键下的数据
|
||||
const request = store.get('treeData')
|
||||
return new Promise<any | null>((resolve, reject) => {
|
||||
const request = store.get('treeData')
|
||||
|
||||
// 数据成功读取后执行此回调
|
||||
request.onsuccess = () => {
|
||||
if (request.result) {
|
||||
// 如果存在缓存数据
|
||||
options.value = request.result // 将数据赋值给 options.value
|
||||
request.onsuccess = () => {
|
||||
// console.log('🚀 ~ loadTreeFromCache ~ request.result:', request.result)
|
||||
if (request.result !== undefined) {
|
||||
resolve(request.result) // 返回缓存数据
|
||||
} else {
|
||||
resolve(null) // 如果没有缓存数据,返回 null
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
request.onerror = () => {
|
||||
reject(request.error)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 获取树形结构数据并存储在 IndexedDB 中的主函数
|
||||
const getTree = async () => {
|
||||
// 先尝试从缓存中加载数据
|
||||
const cachedData = await loadTreeFromCache()
|
||||
|
||||
// console.log('🚀 ~ getTree ~ cachedData:', cachedData)
|
||||
if (cachedData) {
|
||||
console.log('未发请求')
|
||||
// 如果缓存存在,直接使用缓存数据
|
||||
options.value = cachedData
|
||||
console.log('Loaded from cache:', cachedData)
|
||||
// console.log('Loaded from cache:', cachedData)
|
||||
} else {
|
||||
console.log('发起了请求')
|
||||
// 如果缓存不存在,发起 API 请求
|
||||
const res = await api.get<any>('/common/administrativeDivisionTree')
|
||||
console.log(res)
|
||||
options.value = res.data
|
||||
|
||||
// 将获取到的数据存储在 IndexedDB 中
|
||||
await storeTreeData(res.data)
|
||||
console.log('Loaded from API and stored in cache')
|
||||
}
|
||||
}
|
||||
import type { Rule } from 'ant-design-vue/es/form'
|
||||
|
@ -217,7 +222,7 @@ const checkIsNull = async (_rule: Rule, value: string) => {
|
|||
}
|
||||
}
|
||||
const checkOBJ = async (_rule: Rule, value: ContactPersonInfo) => {
|
||||
console.log('🚀 ~ checkOBJ ~ value:', value)
|
||||
// console.log('🚀 ~ checkOBJ ~ value:', value)
|
||||
|
||||
if (value.telephone !== '' && value.name !== '') {
|
||||
return Promise.resolve()
|
||||
|
@ -262,6 +267,7 @@ const handleFinishFailed = (errors: any) => {
|
|||
}
|
||||
const resetForm = () => {
|
||||
formRef.value.resetFields()
|
||||
value.value = []
|
||||
}
|
||||
const handleValidate = (...args: any[]) => {
|
||||
console.log(args)
|
||||
|
@ -273,19 +279,29 @@ const account = ref<string>('')
|
|||
const password = ref<string>('')
|
||||
const isHasAccount = ref<boolean>(true)
|
||||
const isLogin = ref<boolean>(false)
|
||||
// const searchCode = ref<string>()
|
||||
//
|
||||
const searchCode = reactive({
|
||||
code: __APP_ENV.VITE_APP_ENV === 'development' ? 'dawda' : '',
|
||||
})
|
||||
|
||||
const getCheckStatus = () => {
|
||||
loading.value = true
|
||||
api.post<any>('/management/getCheckStatus', { onlyCode: 'dawda', unitOptType: 'POLICE_UNIT' }).then((res) => {
|
||||
console.log('🚀 ~ api.post<any> ~ res:', res)
|
||||
if (res.code === 200) {
|
||||
api
|
||||
.post<any>('/management/getCheckStatus', { onlyCode: searchCode.code, unitOptType: 'POLICE_UNIT' })
|
||||
.then((res) => {
|
||||
console.log('🚀 ~ api.post<any> ~ res:', res)
|
||||
if (res.code === 200) {
|
||||
loading.value = false
|
||||
isHasAccount.value = false
|
||||
isLogin.value = true
|
||||
account.value = res.data.account
|
||||
password.value = res.data.password
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false
|
||||
isHasAccount.value = false
|
||||
isLogin.value = true
|
||||
account.value = res.data.account
|
||||
password.value = res.data.password
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
const toLogin = () => {
|
||||
router.replace({ path: '/login' })
|
||||
|
|
Loading…
Reference in New Issue