mirror of
https://github.com/LifeArchiveProject/WeChatDataAnalysis.git
synced 2026-02-19 14:20:51 +08:00
- 移除复古主题切换入口(控制面板/左上角按钮)与 Win98/CRT 相关 UI - 简化 useWrappedTheme:仅保留 off(Modern),历史主题值自动回退 - Modern 下也展示 LuckyBlock 占位图,并同步更新 README 说明
85 lines
3.8 KiB
Vue
85 lines
3.8 KiB
Vue
<template>
|
||
<div class="bg-white rounded-2xl border border-[#EDEDED] p-5 sm:p-6 controls-panel">
|
||
<div class="flex flex-col gap-4">
|
||
<div class="flex flex-col sm:flex-row gap-3 sm:items-end sm:justify-between">
|
||
<div class="flex flex-col sm:flex-row gap-3 sm:items-end">
|
||
<div v-if="showAccount">
|
||
<div class="wrapped-label text-xs text-[#00000099] mb-1 controls-label">Account</div>
|
||
<select
|
||
class="w-full sm:w-56 px-3 py-2 rounded-lg border border-[#EDEDED] bg-white text-sm wrapped-body focus:outline-none focus:ring-2 focus:ring-[#07C160] controls-select"
|
||
:disabled="accountsLoading || accounts.length === 0"
|
||
:value="modelAccount"
|
||
@change="$emit('update:account', $event.target.value || '')"
|
||
>
|
||
<option value="" :disabled="accounts.length > 0">默认(自动选择)</option>
|
||
<option v-for="a in accounts" :key="a" :value="a">{{ a }}</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="wrapped-label text-xs text-[#00000099] mb-1 controls-label">Year</div>
|
||
<select
|
||
class="w-full sm:w-40 px-3 py-2 rounded-lg border border-[#EDEDED] bg-white text-sm wrapped-body focus:outline-none focus:ring-2 focus:ring-[#07C160] controls-select"
|
||
:value="String(modelYear)"
|
||
@change="$emit('update:year', Number($event.target.value))"
|
||
>
|
||
<option v-for="y in yearOptions" :key="y" :value="String(y)">{{ y }}年</option>
|
||
</select>
|
||
</div>
|
||
|
||
<label class="inline-flex items-center gap-2 select-none">
|
||
<input
|
||
type="checkbox"
|
||
class="h-4 w-4 rounded border-[#EDEDED] text-[#07C160] focus:ring-[#07C160] controls-checkbox"
|
||
:checked="modelRefresh"
|
||
@change="$emit('update:refresh', !!$event.target.checked)"
|
||
/>
|
||
<span class="wrapped-body text-sm text-[#7F7F7F] controls-hint">强制刷新(忽略缓存)</span>
|
||
</label>
|
||
</div>
|
||
|
||
<div class="flex gap-2 items-end">
|
||
<button
|
||
class="inline-flex items-center justify-center px-4 py-2 rounded-lg bg-[#07C160] text-white text-sm wrapped-label hover:bg-[#06AD56] disabled:opacity-60 disabled:cursor-not-allowed transition controls-btn"
|
||
:disabled="loading"
|
||
@click="$emit('reload')"
|
||
>
|
||
<span v-if="!loading">Generate</span>
|
||
<span v-else>Loading...</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div v-if="accountsLoading" class="wrapped-body text-xs text-[#7F7F7F] controls-hint">
|
||
{{ showAccount ? '正在加载账号列表...' : '正在检查数据...' }}
|
||
</div>
|
||
<div v-else-if="accounts.length === 0" class="wrapped-body text-xs text-[#B37800] controls-warning">
|
||
{{ showAccount ? '未发现已解密账号(请先解密数据库)。' : '未发现可用数据(请先解密数据库)。' }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
const props = defineProps({
|
||
accounts: { type: Array, default: () => [] },
|
||
accountsLoading: { type: Boolean, default: false },
|
||
loading: { type: Boolean, default: false },
|
||
modelYear: { type: Number, required: true },
|
||
modelAccount: { type: String, default: '' },
|
||
modelRefresh: { type: Boolean, default: false },
|
||
showAccount: { type: Boolean, default: true }
|
||
})
|
||
|
||
defineEmits(['update:year', 'update:account', 'update:refresh', 'reload'])
|
||
|
||
const yearOptions = computed(() => {
|
||
const now = new Date().getFullYear()
|
||
const years = []
|
||
for (let i = 0; i < 8; i++) years.push(now - i)
|
||
// Ensure selected year is present
|
||
if (props.modelYear && !years.includes(props.modelYear)) years.unshift(props.modelYear)
|
||
return years
|
||
})
|
||
</script>
|