julian/win-softmgr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

selection states preserve

Browse Source
This commit is contained in:
Julian Freeman
2026-03-14 19:04:06 -04:00
parent 34ad167ad2
commit cdee6b47c7
3 changed files with 65 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/store/software.ts
View File

@@ -9,12 +9,14 @@ export const useSoftwareStore = defineStore('software', {
essentials: [] as any[],
updates: [] as any[],
allSoftware: [] as any[],
selectedEssentialIds: [] as string[],
selectedUpdateIds: [] as string[],
loading: false,
lastFetched: 0 // 记录上次完整同步的时间戳
lastFetched: 0
}),
getters: {
mergedEssentials: (state) => {
const items = state.essentials.map(item => {
return state.essentials.map(item => {
const isInstalled = state.allSoftware.some(s => s.id.toLowerCase() === item.id.toLowerCase());
const hasUpdate = state.updates.some(s => s.id.toLowerCase() === item.id.toLowerCase());
@@ -30,18 +32,45 @@ export const useSoftwareStore = defineStore('software', {
}
}
return {
...item,
status: displayStatus,
actionLabel
};
return { ...item, status: displayStatus, actionLabel };
});
return items; // Essentials 通常保持自定义顺序
},
sortedUpdates: (state) => [...state.updates].sort(sortByName),
sortedAllSoftware: (state) => [...state.allSoftware].sort(sortByName)
},
actions: {
// 通用的勾选切换逻辑
toggleSelection(id: string, type: 'essential' | 'update') {
const list = type === 'essential' ? this.selectedEssentialIds : this.selectedUpdateIds;
const index = list.indexOf(id);
if (index === -1) {
list.push(id);
} else {
list.splice(index, 1);
}
},
selectAll(type: 'essential' | 'update') {
if (type === 'essential') {
const selectable = this.mergedEssentials.filter(s => s.status !== 'installed');
this.selectedEssentialIds = selectable.map(s => s.id);
} else {
this.selectedUpdateIds = this.updates.map(s => s.id);
}
},
deselectAll(type: 'essential' | 'update') {
if (type === 'essential') this.selectedEssentialIds = [];
else this.selectedUpdateIds = [];
},
invertSelection(type: 'essential' | 'update') {
if (type === 'essential') {
const selectable = this.mergedEssentials.filter(s => s.status !== 'installed').map(s => s.id);
this.selectedEssentialIds = selectable.filter(id => !this.selectedEssentialIds.includes(id));
} else {
const selectable = this.updates.map(s => s.id);
this.selectedUpdateIds = selectable.filter(id => !this.selectedUpdateIds.includes(id));
}
},
async fetchEssentials() {
this.essentials = await invoke('get_essentials')
},
@@ -50,6 +79,8 @@ export const useSoftwareStore = defineStore('software', {
try {
const res = await invoke('get_updates')
this.updates = res as any[]
// 刷新数据后，如果没选过，默认全选
if (this.selectedUpdateIds.length === 0) this.selectAll('update');
} finally {
this.loading = false
}
@@ -63,16 +94,13 @@ export const useSoftwareStore = defineStore('software', {
this.loading = false
}
},
// 智能同步：如果数据较新，则直接返回
async syncDataIfNeeded(force = false) {
const now = Date.now();
const CACHE_TIMEOUT = 5 * 60 * 1000; // 5 分钟缓存
const CACHE_TIMEOUT = 5 * 60 * 1000;
if (!force && this.allSoftware.length > 0 && (now - this.lastFetched < CACHE_TIMEOUT)) {
if (this.essentials.length === 0) await this.fetchEssentials();
return;
}
await this.fetchAllData();
},
async fetchAllData() {
@@ -87,6 +115,8 @@ export const useSoftwareStore = defineStore('software', {
this.allSoftware = all as any[];
this.updates = updates as any[];
this.lastFetched = Date.now();
// 如果没选过，默认全选
if (this.selectedEssentialIds.length === 0) this.selectAll('essential');
} finally {
this.loading = false;
}
@@ -112,9 +142,11 @@ export const useSoftwareStore = defineStore('software', {
software.status = status
software.progress = progress
}
if (status === 'success') {
this.lastFetched = 0;
// 安装成功后从选择列表中移除
this.selectedEssentialIds = this.selectedEssentialIds.filter(i => i !== id);
this.selectedUpdateIds = this.selectedUpdateIds.filter(i => i !== id);
}
})
}

51
src/views/Essentials.vue
View File

@@ -23,9 +23,9 @@
<button
@click="installSelected"
class="primary-btn action-btn"
:disabled="store.loading || selectedIds.length === 0"
:disabled="store.loading || store.selectedEssentialIds.length === 0"
>
安装/更新所选 ({{ selectedIds.length }})
安装/更新所选 ({{ store.selectedEssentialIds.length }})
</button>
</div>
</header>
@@ -33,14 +33,14 @@
<!-- 批量选择控制栏 -->
<div class="selection-toolbar" v-if="selectableItems.length > 0">
<div class="toolbar-left">
<span class="selection-count">已选 {{ selectedIds.length }} / {{ selectableItems.length }} 项</span>
<span class="selection-count">已选 {{ store.selectedEssentialIds.length }} / {{ selectableItems.length }} 项</span>
</div>
<div class="toolbar-actions">
<button @click="selectAll" class="text-btn">全选</button>
<button @click="store.selectAll('essential')" class="text-btn">全选</button>
<div class="divider"></div>
<button @click="deselectAll" class="text-btn">取消</button>
<button @click="store.deselectAll('essential')" class="text-btn">取消</button>
<div class="divider"></div>
<button @click="invertSelection" class="text-btn">反选</button>
<button @click="store.invertSelection('essential')" class="text-btn">反选</button>
</div>
</div>
@@ -56,9 +56,9 @@
:software="item"
:action-label="item.actionLabel"
:selectable="true"
:is-selected="selectedIds.includes(item.id)"
:is-selected="store.selectedEssentialIds.includes(item.id)"
@install="store.install"
@toggle-select="toggleSelection"
@toggle-select="id => store.toggleSelection(id, 'essential')"
/>
</div>
</main>
@@ -67,51 +67,20 @@
<script setup lang="ts">
import SoftwareCard from '../components/SoftwareCard.vue';
import { useSoftwareStore } from '../store/software';
import { onMounted, ref, computed, watch } from 'vue';
import { onMounted, computed } from 'vue';
const store = useSoftwareStore();
const selectedIds = ref<string[]>([]);
// 1. 先定义所有计算属性和函数
const selectableItems = computed(() => {
return store.mergedEssentials.filter(s => s.status !== 'installed');
});
const toggleSelection = (id: string) => {
const index = selectedIds.value.indexOf(id);
if (index === -1) {
selectedIds.value.push(id);
} else {
selectedIds.value.splice(index, 1);
}
};
const selectAll = () => {
selectedIds.value = selectableItems.value.map(s => s.id);
};
const deselectAll = () => {
selectedIds.value = [];
};
const invertSelection = () => {
const currentSelectable = selectableItems.value.map(s => s.id);
selectedIds.value = currentSelectable.filter(id => !selectedIds.value.includes(id));
};
const installSelected = () => {
selectedIds.value.forEach(id => {
store.selectedEssentialIds.forEach(id => {
store.install(id);
});
};
// 2. 再定义副作用（watch, onMounted）
watch(() => store.mergedEssentials, (newVal) => {
if (newVal.length > 0 && selectedIds.value.length === 0) {
selectAll();
}
}, { immediate: true });
onMounted(() => {
store.syncDataIfNeeded();
store.initListener();

52
src/views/Updates.vue
View File

@@ -23,9 +23,9 @@
<button
@click="updateSelected"
class="primary-btn action-btn"
:disabled="selectedIds.length === 0 || store.loading"
:disabled="store.selectedUpdateIds.length === 0 || store.loading"
>
更新所选 ({{ selectedIds.length }})
更新所选 ({{ store.selectedUpdateIds.length }})
</button>
</div>
</header>
@@ -33,14 +33,14 @@
<!-- 批量选择控制栏 -->
<div class="selection-toolbar" v-if="store.sortedUpdates.length > 0">
<div class="toolbar-left">
<span class="selection-count">已选 {{ selectedIds.length }} / {{ store.sortedUpdates.length }} 项</span>
<span class="selection-count">已选 {{ store.selectedUpdateIds.length }} / {{ store.sortedUpdates.length }} 项</span>
</div>
<div class="toolbar-actions">
<button @click="selectAll" class="text-btn">全选</button>
<button @click="store.selectAll('update')" class="text-btn">全选</button>
<div class="divider"></div>
<button @click="deselectAll" class="text-btn">取消</button>
<button @click="store.deselectAll('update')" class="text-btn">取消</button>
<div class="divider"></div>
<button @click="invertSelection" class="text-btn">反选</button>
<button @click="store.invertSelection('update')" class="text-btn">反选</button>
</div>
</div>
@@ -61,9 +61,9 @@
:software="item"
action-label="更新"
:selectable="true"
:is-selected="selectedIds.includes(item.id)"
:is-selected="store.selectedUpdateIds.includes(item.id)"
@install="store.install"
@toggle-select="toggleSelection"
@toggle-select="id => store.toggleSelection(id, 'update')"
/>
</div>
</main>
@@ -72,48 +72,16 @@
<script setup lang="ts">
import SoftwareCard from '../components/SoftwareCard.vue';
import { useSoftwareStore } from '../store/software';
import { onMounted, ref, watch } from 'vue';
import { onMounted } from 'vue';
const store = useSoftwareStore();
const selectedIds = ref<string[]>([]);
// 1. 定义操作函数
const toggleSelection = (id: string) => {
const index = selectedIds.value.indexOf(id);
if (index === -1) {
selectedIds.value.push(id);
} else {
selectedIds.value.splice(index, 1);
}
};
const selectAll = () => {
selectedIds.value = store.sortedUpdates.map(s => s.id);
};
const deselectAll = () => {
selectedIds.value = [];
};
const invertSelection = () => {
const currentIds = store.sortedUpdates.map(s => s.id);
selectedIds.value = currentIds.filter(id => !selectedIds.value.includes(id));
};
const updateSelected = () => {
selectedIds.value.forEach(id => {
store.selectedUpdateIds.forEach(id => {
store.install(id);
});
};
// 2. 定义副作用
watch(() => store.sortedUpdates, (newVal) => {
// 仅在初始加载或强制刷新数据后且当前未选择任何项时自动全选
if (newVal.length > 0 && selectedIds.value.length === 0) {
selectAll();
}
}, { immediate: true });
onMounted(() => {
if (store.updates.length === 0) {
store.fetchUpdates();