1
0
mirror of https://github.com/ZeroCatDev/Classworks.git synced 2025-07-04 18:39:22 +00:00

全屏按钮!

This commit is contained in:
SunWuyuan 2025-03-23 10:07:51 +08:00
parent 3988773341
commit ac417b1432
No known key found for this signature in database
GPG Key ID: A6A54CF66F56BB64
4 changed files with 96 additions and 2 deletions

View File

@ -58,6 +58,23 @@
</template>
</v-list-item>
<v-divider class="my-2" />
<v-list-item>
<template #prepend>
<v-icon icon="mdi-fullscreen" class="mr-3" />
</template>
<v-list-item-title>显示全屏按钮</v-list-item-title>
<v-list-item-subtitle>在主页面显示全屏切换按钮</v-list-item-subtitle>
<template #append>
<v-switch
v-model="localSettings.showFullscreenButton"
density="comfortable"
hide-details
/>
</template>
</v-list-item>
<div class="d-flex gap-2 mt-4">
<v-btn
color="primary"
@ -91,7 +108,8 @@ export default {
const settings = {
emptySubjectDisplay: getSetting('display.emptySubjectDisplay'),
dynamicSort: getSetting('display.dynamicSort'),
showRandomButton: getSetting('display.showRandomButton')
showRandomButton: getSetting('display.showRandomButton'),
showFullscreenButton: getSetting('display.showFullscreenButton')
};
return {

View File

@ -148,6 +148,16 @@
>
随机点名
</v-btn>
<v-btn
v-if="showFullscreenButton"
:color="state.isFullscreen ? 'blue-grey' : 'blue'"
:prepend-icon="state.isFullscreen ? 'mdi-fullscreen-exit' : 'mdi-fullscreen'"
size="large"
class="ml-2"
@click="toggleFullscreen"
>
{{ state.isFullscreen ? '退出全屏' : '全屏显示' }}
</v-btn>
</v-container>
<!-- 出勤统计区域 -->
@ -429,6 +439,7 @@ export default {
{ key: "地理", name: "地理" },
{ key: "其他", name: "其他" },
],
isFullscreen: false,
},
loading: {
download: false,
@ -561,6 +572,9 @@ export default {
shouldBlockAutoSave() {
return !this.isToday && this.autoSave && this.blockNonTodayAutoSave;
},
showFullscreenButton() {
return getSetting("display.showFullscreenButton");
},
},
watch: {
@ -601,6 +615,12 @@ export default {
this.unwatchSettings = watchSettings(() => {
this.updateSettings();
});
//
document.addEventListener('fullscreenchange', this.fullscreenChangeHandler);
document.addEventListener('webkitfullscreenchange', this.fullscreenChangeHandler);
document.addEventListener('mozfullscreenchange', this.fullscreenChangeHandler);
document.addEventListener('MSFullscreenChange', this.fullscreenChangeHandler);
} catch (err) {
console.error("初始化失败:", err);
this.showError("初始化失败,请刷新页面重试");
@ -615,6 +635,12 @@ export default {
// state
clearInterval(this.state.refreshInterval);
}
//
document.removeEventListener('fullscreenchange', this.fullscreenChangeHandler);
document.removeEventListener('webkitfullscreenchange', this.fullscreenChangeHandler);
document.removeEventListener('mozfullscreenchange', this.fullscreenChangeHandler);
document.removeEventListener('MSFullscreenChange', this.fullscreenChangeHandler);
},
methods: {
@ -1212,6 +1238,50 @@ export default {
await this.trySave(true);
}
},
//
toggleFullscreen() {
if (!this.state.isFullscreen) {
this.enterFullscreen();
} else {
this.exitFullscreen();
}
},
enterFullscreen() {
const docElm = document.documentElement;
if (docElm.requestFullscreen) {
docElm.requestFullscreen();
} else if (docElm.webkitRequestFullScreen) {
docElm.webkitRequestFullScreen();
} else if (docElm.mozRequestFullScreen) {
docElm.mozRequestFullScreen();
} else if (docElm.msRequestFullscreen) {
docElm.msRequestFullscreen();
}
},
exitFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
},
fullscreenChangeHandler() {
this.state.isFullscreen = !!(
document.fullscreenElement ||
document.webkitFullscreenElement ||
document.mozFullScreenElement ||
document.msFullscreenElement
);
},
},
};
</script>

View File

@ -213,7 +213,8 @@ export default {
display: {
emptySubjectDisplay: getSetting('display.emptySubjectDisplay'),
dynamicSort: getSetting('display.dynamicSort'),
showRandomButton: getSetting('display.showRandomButton')
showRandomButton: getSetting('display.showRandomButton'),
showFullscreenButton: getSetting('display.showFullscreenButton')
},
developer: {
enabled: getSetting('developer.enabled'),

View File

@ -97,6 +97,11 @@ const settingsDefinitions = {
default: false,
description: "是否显示随机按钮",
},
"display.showFullscreenButton": {
type: "boolean",
default: true,
description: "是否显示全屏按钮",
},
// 服务器设置(合并了数据提供者设置)
"server.domain": {