83 lines
2.5 KiB
Vue
83 lines
2.5 KiB
Vue
<script lang="tsx">
|
||
import { useAsyncState } from '@vueuse/core'
|
||
import { defineComponent, ref } from 'vue'
|
||
import api from '@/api'
|
||
import { useDialog } from '@/components/hooks/dialog'
|
||
import { isShow, onShow } from '@/components/hooks/show'
|
||
import { useConfigStore } from '@/stores'
|
||
import { UiButton } from '@/components/ui/button'
|
||
import { UiInput } from '@/components/ui/input'
|
||
|
||
export default defineComponent({
|
||
setup() {
|
||
const configStore = useConfigStore()
|
||
const uid = ref('')
|
||
|
||
const { state, execute, isLoading } = useAsyncState(
|
||
async () => {
|
||
const res = await api.getConfigFromHelper(uid.value)
|
||
configStore.config.equips = res.equips
|
||
configStore.config.avatar = res.avatars
|
||
configStore.config.avatarLink = res.avatarLink
|
||
configStore.config.emblems = res.emblems
|
||
configStore.config.sundry.fog = res.fogOathLv
|
||
configStore.config.oaths = res.oaths
|
||
const { alert } = useDialog()
|
||
visible.value = false
|
||
await alert({
|
||
content: '导入成功',
|
||
})
|
||
return res
|
||
},
|
||
undefined,
|
||
{
|
||
resetOnExecute: false,
|
||
immediate: false,
|
||
onError: Promise.reject,
|
||
},
|
||
)
|
||
|
||
onShow(
|
||
() => {
|
||
uid.value = ''
|
||
state.value = undefined
|
||
},
|
||
{ immediate: true },
|
||
)
|
||
|
||
const visible = isShow()
|
||
|
||
return () => {
|
||
return (
|
||
<>
|
||
<div class="box-border flex min-h-30 w-full max-w-80 flex-col justify-center gap-2 px-4 py-2 text-[color:var(--ui-primary-foreground)]">
|
||
<label class="grid grid-cols-[auto_minmax(0,1fr)] items-center gap-2">
|
||
<span>助手社区ID</span>
|
||
<UiInput class="min-w-0" v-model={uid.value} />
|
||
</label>
|
||
<div class="leading-5">
|
||
<p class="m-0 text-[color:var(--ui-muted-foreground)]">
|
||
*
|
||
点击导入后会从助手通过文字识别获取打造
|
||
</p>
|
||
<p class="m-0 text-[color:var(--ui-muted-foreground)]">
|
||
*
|
||
部分打造无法获取，此处仅做快捷导入
|
||
</p>
|
||
</div>
|
||
<div class="flex items-center justify-center gap-3">
|
||
<UiButton onClick={() => execute()} disabled={isLoading.value}>
|
||
导入
|
||
</UiButton>
|
||
<UiButton variant="outline" onClick={() => (visible.value = false)}>
|
||
取消
|
||
</UiButton>
|
||
</div>
|
||
</div>
|
||
</>
|
||
)
|
||
}
|
||
},
|
||
})
|
||
</script>
|