1
0
mirror of https://github.com/ZeroCatDev/Classworks.git synced 2026-02-04 07:53:11 +00:00

feat(grid): 优化只读模式下的作业网格组件

- 实现只读令牌状态检测功能,动态显示不同图标
- 在卡片和按钮中根据只读状态切换图标(加号或取消图标)
- 添加StudentNameManager组件依赖注入
- 重构组件数据结构,添加isReadOnlyToken响应式数据
- 实现异步检查只读状态的方法,支持多种访问方式
- 优化卡片文本显示,只读时显示"当日无作业"提示而不是“点击添加作业”
This commit is contained in:
chenziang 2025-12-31 19:56:13 +08:00
parent 46570636df
commit 9c78356bf5
No known key found for this signature in database
GPG Key ID: A3174D7BE243D848

View File

@ -153,7 +153,9 @@
variant="tonal"
@click="handleCardClick('dialog', subject.name)"
>
<v-icon start size="small">mdi-plus</v-icon>
<v-icon start size="small">
{{ isReadOnlyToken ? 'mdi-cancel' : 'mdi-plus' }}
</v-icon>
{{ subject.name }}
</v-chip>
</div>
@ -165,7 +167,9 @@
:key="subject.name"
@click="handleCardClick('dialog', subject.name)"
>
<v-icon start> mdi-plus</v-icon>
<v-icon start>
{{ isReadOnlyToken ? 'mdi-cancel' : 'mdi-plus' }}
</v-icon>
{{ subject.name }}
</v-btn>
</v-btn-group>
@ -183,8 +187,14 @@
{{ subject.name }}
</v-card-title>
<v-card-text class="text-center">
<v-icon color="grey" size="small"> mdi-plus</v-icon>
<div class="text-caption text-grey">点击添加作业</div>
<template v-if="isReadOnlyToken">
<v-icon color="grey" size="small"> mdi-cancel </v-icon>
<div class="text-caption text-grey"> 当日无作业 </div>
</template>
<template v-else>
<v-icon color="grey" size="small"> mdi-plus </v-icon>
<div class="text-caption text-grey"> 点击添加作业 </div>
</template>
</v-card-text>
</v-card>
</TransitionGroup>
@ -233,10 +243,17 @@ export default {
},
},
emits: ["open-dialog", "open-attendance", "disabled-click"],
mounted() {
data() {
return {
isReadOnlyToken: false,
}
},
async mounted() {
/* eslint-disable no-undef */
this.resizeObserver = new ResizeObserver(() => {
this.resizeAllGridItems();
});
/* eslint-enable no-undef */
// Observe the grid container for width changes
if (this.$refs.gridContainer) {
@ -256,6 +273,9 @@ export default {
});
}
});
//
await this.checkReadOnlyStatus();
},
updated() {
// When items change, re-observe new items
@ -276,6 +296,53 @@ export default {
}
},
methods: {
async checkReadOnlyStatus() {
// StudentNameManager
try {
// Vue 2$parent$root访
let manager = null;
// 访
if (this.$parent && this.$parent.$refs && this.$parent.$refs.studentNameManager) {
manager = this.$parent.$refs.studentNameManager;
} else if (this.$root && this.$root.$refs && this.$root.$refs.studentNameManager) {
manager = this.$root.$refs.studentNameManager;
}
if (manager && typeof manager.isReadOnly !== 'undefined') {
this.isReadOnlyToken = manager.isReadOnly;
} else {
// 访managertoken
// 使utils/settings
const { getSetting } = await import('@/utils/settings');
const token = getSetting('server.kvToken');
if (token) {
// APItoken
const { default: axios } = await import('@/axios/axios');
const serverUrl = getSetting('server.domain');
if (serverUrl) {
try {
const tokenResponse = await axios.get(`${serverUrl}/kv/_token`, {
headers: {
Authorization: `Bearer ${token}`
}
});
if (tokenResponse.data && typeof tokenResponse.data.isReadOnly !== 'undefined') {
this.isReadOnlyToken = tokenResponse.data.isReadOnly;
}
} catch (err) {
console.error('获取Token信息失败:', err);
}
}
}
}
} catch (error) {
console.error('检查只读状态失败:', error);
}
},
resizeGridItem(item) {
const grid = this.$refs.gridContainer;
if (!grid) return;