mirror of
https://github.com/ZeroCatDev/Classworks.git
synced 2025-07-05 11:09:29 +00:00
1
This commit is contained in:
SunWuyuan
parent
99f3f1b0ef
commit
5cfeba57ba
@ -24,7 +24,6 @@
|
||||
<v-menu
|
||||
v-model="datePickerDialog"
|
||||
:close-on-content-click="false"
|
||||
|
||||
>
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-btn
|
||||
@ -60,26 +59,10 @@
|
||||
fluid
|
||||
>
|
||||
<div v-if="showNoDataMessage && !isToday" class="no-data-message">
|
||||
<v-card class="text-center pa-4" variant="outlined">
|
||||
<v-card-title class="text-h6">{{ noDataMessage }}</v-card-title>
|
||||
<v-card class="text-center pa-4" >
|
||||
<v-card-title class="text-h6">别看未来的作业了</v-card-title>
|
||||
<v-card-text>
|
||||
<div class="text-body-1">该日期未上传作业数据</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</div>
|
||||
|
||||
<template v-else>
|
||||
<div v-if="showNoDataMessage && isToday" class="no-data-message">
|
||||
<v-card class="text-center pa-4" variant="outlined">
|
||||
<v-card-title class="text-h6">开始今天的作业</v-card-title>
|
||||
<v-card-text>
|
||||
<div class="text-body-1 mb-4">今天还没有上传作业哦～</div>
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="initializeAndOpenDialog"
|
||||
>
|
||||
开始添加作业
|
||||
</v-btn>
|
||||
<div class="text-body-1">{{ noDataMessage }}</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</div>
|
||||
@ -97,10 +80,10 @@
|
||||
:style="{
|
||||
'grid-row-end': `span ${item.rowSpan}`,
|
||||
order: item.order,
|
||||
cursor: uploadLoading || downloadLoading ? 'not-allowed' : 'pointer',
|
||||
cursor: uploadLoading || downloadLoading || isPastDate ? 'not-allowed' : 'pointer',
|
||||
opacity: uploadLoading || downloadLoading ? '0.7' : '1'
|
||||
}"
|
||||
@click="!uploadLoading && !downloadLoading && openDialog(item.key)"
|
||||
@click="!uploadLoading && !downloadLoading && !isPastDate && openDialog(item.key)"
|
||||
>
|
||||
<v-card border height="100%">
|
||||
<v-card-title :class="{ 'text-subtitle-1': !item.content }">
|
||||
@ -129,81 +112,41 @@
|
||||
</div>
|
||||
|
||||
<!-- 空科目按钮组 -->
|
||||
<div v-if="emptySubjectDisplay === 'button'" class="empty-subjects-container">
|
||||
<v-btn-group v-if="emptySubjectDisplay === 'button'" class="empty-subjects-container">
|
||||
<v-btn
|
||||
v-for="subject in emptySubjects"
|
||||
:key="subject.key"
|
||||
variant="outlined"
|
||||
variant="tonal"
|
||||
color="primary"
|
||||
class="empty-subject-btn"
|
||||
@click="!uploadLoading && !downloadLoading && openDialog(subject.key)"
|
||||
:disabled="uploadLoading || downloadLoading"
|
||||
>
|
||||
<v-icon start>mdi-plus</v-icon>
|
||||
{{ subject.name }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</template>
|
||||
</v-btn-group>
|
||||
</template>
|
||||
</v-container>
|
||||
|
||||
<!-- 出勤统计区域 -->
|
||||
<v-navigation-drawer
|
||||
v-if="studentList.length > 1"
|
||||
location="right"
|
||||
permanent
|
||||
width="300"
|
||||
class="attendance-drawer"
|
||||
<v-col
|
||||
v-if="studentList.length"
|
||||
class="attendance-area"
|
||||
cols="1"
|
||||
@click="!isPastDate ? setAttendanceArea() : null"
|
||||
>
|
||||
<v-card
|
||||
class="h-100 attendance-card"
|
||||
flat
|
||||
>
|
||||
<v-card-text class="text-center">
|
||||
<div class="attendance-numbers">
|
||||
<div class="total-number mb-4">
|
||||
<div class="text-h2 font-weight-bold">{{ studentList.length }}</div>
|
||||
<div class="text-overline">应到</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-space-around">
|
||||
<div class="status-number text-success">
|
||||
<div class="text-h3 font-weight-bold">
|
||||
{{ studentList.length - selectedSet.size - lateSet.size }}
|
||||
</div>
|
||||
<div class="text-overline">实到</div>
|
||||
</div>
|
||||
|
||||
<div class="status-number text-error">
|
||||
<div class="text-h3 font-weight-bold">
|
||||
{{ selectedSet.size }}
|
||||
</div>
|
||||
<div class="text-overline">请假</div>
|
||||
</div>
|
||||
|
||||
<div class="status-number text-warning">
|
||||
<div class="text-h3 font-weight-bold">
|
||||
{{ lateSet.size }}
|
||||
</div>
|
||||
<div class="text-overline">迟到</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="pa-4">
|
||||
<v-btn
|
||||
block
|
||||
color="primary"
|
||||
size="large"
|
||||
prepend-icon="mdi-pencil"
|
||||
@click="setAttendanceArea"
|
||||
>
|
||||
编辑出勤
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-navigation-drawer>
|
||||
<h1>出勤</h1>
|
||||
<h2>应到: {{ studentList.length }}人</h2>
|
||||
<h2>实到: {{ studentList.length - selectedSet.size }}人</h2>
|
||||
<h2>请假: {{ selectedSet.size }}人</h2>
|
||||
<h3 v-for="(i, index) in selectedSet" :key="'absent-' + index">
|
||||
{{ `${index + 1}. ${studentList[i]}` }}
|
||||
</h3>
|
||||
<h2>迟到: {{ lateSet.size }}人</h2>
|
||||
<h3 v-for="(i, index) in lateSet" :key="'late-' + index">
|
||||
{{ `${index + 1}. ${studentList[i]}` }}
|
||||
</h3>
|
||||
</v-col>
|
||||
</div>
|
||||
<v-container fluid>
|
||||
<v-btn
|
||||
@ -232,7 +175,9 @@
|
||||
>
|
||||
<v-card border>
|
||||
<v-card-title>{{ dialogTitle }}</v-card-title>
|
||||
<v-card-subtitle>写完后点击上传谢谢喵</v-card-subtitle>
|
||||
<v-card-subtitle>
|
||||
{{ autoSave ? "喵？喵呜！" : "写完后点击上传谢谢喵" }}
|
||||
</v-card-subtitle>
|
||||
<v-card-text>
|
||||
<v-textarea
|
||||
ref="inputRef"
|
||||
@ -420,13 +365,6 @@
|
||||
.empty-subjects-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.empty-subject-btn {
|
||||
flex: 1;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
@ -440,10 +378,6 @@
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.empty-subject-btn {
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.empty-card {
|
||||
transform: scale(0.95);
|
||||
}
|
||||
@ -635,12 +569,15 @@ export default {
|
||||
return true;
|
||||
});
|
||||
|
||||
// 根据排序模式选择不同的排序方法
|
||||
if (this.dynamicSort) {
|
||||
return this.optimizeGridLayout(items);
|
||||
} else {
|
||||
return this.fixedGridLayout(items);
|
||||
}
|
||||
// Sort items: prioritize non-empty content first
|
||||
return items.sort((a, b) => {
|
||||
// If one item has content and the other does not, prioritize the one with content
|
||||
if (a.content && !b.content) return -1;
|
||||
if (!a.content && b.content) return 1;
|
||||
|
||||
// If both have content or both are empty, sort by order
|
||||
return a.order - b.order;
|
||||
});
|
||||
},
|
||||
attendanceVisible() {
|
||||
return this.studentList.length > 0;
|
||||
@ -670,6 +607,14 @@ export default {
|
||||
dynamicSort() {
|
||||
return getSetting('display.dynamicSort');
|
||||
},
|
||||
isPastDate() {
|
||||
const selectedDate = new Date(this.dateString);
|
||||
const today = new Date();
|
||||
// 将时间部分归零以进行比较
|
||||
selectedDate.setHours(0, 0, 0, 0);
|
||||
today.setHours(0, 0, 0, 0);
|
||||
return selectedDate < today; // 如果选择的日期在今天之前，则返回 true
|
||||
},
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
@ -806,13 +751,30 @@ export default {
|
||||
|
||||
this.synced = true;
|
||||
} else {
|
||||
// Handle the error case
|
||||
// Handle the error case for today's date
|
||||
if (this.isToday && res.data.status == false) {
|
||||
this.showNoDataMessage = false; // Ensure we show the empty data
|
||||
this.homeworkData = {
|
||||
"语文": { name: "语文", content: "" },
|
||||
"数学": { name: "数学", content: "" },
|
||||
"英语": { name: "英语", content: "" },
|
||||
"物理": { name: "物理", content: "" },
|
||||
"化学": { name: "化学", content: "" },
|
||||
"生物": { name: "生物", content: "" },
|
||||
"历史": { name: "历史", content: "" },
|
||||
"地理": { name: "地理", content: "" },
|
||||
"政治": { name: "政治", content: "" },
|
||||
};
|
||||
this.noDataMessage = ''; // Clear any previous message
|
||||
} else {
|
||||
// Handle other error cases
|
||||
this.showNoDataMessage = true;
|
||||
this.noDataMessage = res.data.msg || '未找到数据';
|
||||
this.homeworkData = {};
|
||||
this.selectedSet.clear();
|
||||
this.lateSet.clear();
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('下载数据失败:', error);
|
||||
this.showError('下载数据失败，请重试');
|
||||
@ -1076,24 +1038,6 @@ export default {
|
||||
}));
|
||||
},
|
||||
|
||||
initializeAndOpenDialog() {
|
||||
// 初始化作业数据
|
||||
this.initializeHomeworkData();
|
||||
this.showNoDataMessage = false;
|
||||
this.synced = false; // 设置为未同步状态
|
||||
|
||||
// 如果启用了自动保存，初始化后自动上传
|
||||
if (this.autoSave) {
|
||||
this.uploadData();
|
||||
}
|
||||
|
||||
// 打开第一个科目的对话框
|
||||
const firstSubject = Object.keys(this.homeworkData)[0];
|
||||
if (firstSubject) {
|
||||
this.openDialog(firstSubject);
|
||||
}
|
||||
},
|
||||
|
||||
setAllPresent() {
|
||||
this.selectedSet.clear();
|
||||
this.lateSet.clear();
|
||||
|
||||
@ -1,19 +1,14 @@
|
||||
<template>
|
||||
<v-app-bar elevation="1">
|
||||
<template #prepend>
|
||||
<v-btn
|
||||
icon="mdi-arrow-left"
|
||||
variant="text"
|
||||
@click="$router.push('/')"
|
||||
class="mr-2"
|
||||
/>
|
||||
<v-btn icon="mdi-arrow-left" variant="text" @click="$router.push('/')" class="mr-2" />
|
||||
</template>
|
||||
<v-app-bar-title class="text-h6 font-weight-medium">设置</v-app-bar-title>
|
||||
</v-app-bar>
|
||||
|
||||
<v-container class="py-4">
|
||||
<v-row>
|
||||
<v-col cols="12" md="6">
|
||||
<v-col cols="12" md="4">
|
||||
<v-card elevation="2" class="rounded-lg">
|
||||
<v-card-item>
|
||||
<template v-slot:prepend>
|
||||
@ -23,35 +18,15 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="settings.server.domain"
|
||||
label="服务器域名"
|
||||
placeholder="例如: http://example.com"
|
||||
prepend-inner-icon="mdi-web"
|
||||
variant="outlined"
|
||||
density="comfortable"
|
||||
class="mb-4"
|
||||
required
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="settings.server.classNumber"
|
||||
label="班号"
|
||||
placeholder="例如: 1 或 A"
|
||||
prepend-inner-icon="mdi-account-group"
|
||||
variant="outlined"
|
||||
density="comfortable"
|
||||
required
|
||||
:rules="[v => !!v || '班号不能为空', v => /^[A-Za-z0-9]+$/.test(v) || '班号只能包含字母和数字']"
|
||||
/>
|
||||
<v-text-field v-model="settings.server.domain" label="服务器域名" placeholder="例如: http://example.com"
|
||||
prepend-inner-icon="mdi-web" variant="outlined" density="comfortable" class="mb-4" required />
|
||||
<v-text-field v-model="settings.server.classNumber" label="班号" placeholder="例如: 1 或 A"
|
||||
prepend-inner-icon="mdi-account-group" variant="outlined" density="comfortable" required
|
||||
:rules="[v => !!v || '班号不能为空', v => /^[A-Za-z0-9]+$/.test(v) || '班号只能包含字母和数字']" />
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="px-4 pb-4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
block
|
||||
@click="saveSettings('server')"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('server')">
|
||||
保存设置
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
@ -60,7 +35,7 @@
|
||||
|
||||
|
||||
|
||||
<v-col cols="12" md="6">
|
||||
<v-col cols="12" md="4">
|
||||
<v-card elevation="2" class="rounded-lg">
|
||||
<v-card-item>
|
||||
<template v-slot:prepend>
|
||||
@ -70,42 +45,23 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-switch
|
||||
v-model="settings.refresh.auto"
|
||||
label="启用自动刷新"
|
||||
color="primary"
|
||||
hide-details
|
||||
class="mb-4"
|
||||
/>
|
||||
<v-text-field
|
||||
v-model="settings.refresh.interval"
|
||||
type="number"
|
||||
label="刷新间隔"
|
||||
suffix="秒"
|
||||
:disabled="!settings.refresh.auto"
|
||||
variant="outlined"
|
||||
density="comfortable"
|
||||
:rules="[
|
||||
<v-switch v-model="settings.refresh.auto" label="启用自动刷新" color="primary" hide-details class="mb-4" />
|
||||
<v-text-field v-model="settings.refresh.interval" type="number" label="刷新间隔" suffix="秒"
|
||||
:disabled="!settings.refresh.auto" variant="outlined" density="comfortable" :rules="[
|
||||
v => v >= 10 || '刷新间隔不能小于10秒',
|
||||
v => v <= 3600 || '刷新间隔不能大于3600秒'
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="px-4 pb-4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
block
|
||||
@click="saveSettings('refresh')"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('refresh')">
|
||||
保存设置
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" md="6">
|
||||
<v-col cols="12" md="4">
|
||||
<v-card elevation="2" class="rounded-lg">
|
||||
<v-card-item>
|
||||
<template v-slot:prepend>
|
||||
@ -115,44 +71,26 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="settings.font.size"
|
||||
type="number"
|
||||
label="字体大小"
|
||||
suffix="px"
|
||||
variant="outlined"
|
||||
density="comfortable"
|
||||
class="mb-4"
|
||||
:rules="[
|
||||
<v-text-field v-model="settings.font.size" type="number" label="字体大小" suffix="px" variant="outlined"
|
||||
density="comfortable" class="mb-4" :rules="[
|
||||
v => v >= 16 || '字体大小不能小于16px',
|
||||
v => v <= 100 || '字体大小不能大于100px'
|
||||
]"
|
||||
/>
|
||||
]" />
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="px-4 pb-4">
|
||||
<v-btn
|
||||
color="error"
|
||||
variant="outlined"
|
||||
prepend-icon="mdi-refresh"
|
||||
class="flex-grow-1"
|
||||
@click="resetFontSize"
|
||||
>
|
||||
<v-btn color="error" variant="outlined" prepend-icon="mdi-refresh" class="flex-grow-1"
|
||||
@click="resetFontSize">
|
||||
重置
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
class="flex-grow-1"
|
||||
@click="saveSettings('font')"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" class="flex-grow-1" @click="saveSettings('font')">
|
||||
保存设置
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="12" md="6">
|
||||
<v-col cols="12" md="4">
|
||||
<v-card elevation="2" class="rounded-lg">
|
||||
<v-card-item>
|
||||
<template v-slot:prepend>
|
||||
@ -162,43 +100,22 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-switch
|
||||
v-model="settings.edit.autoSave"
|
||||
label="启用自动保存"
|
||||
color="primary"
|
||||
hide-details
|
||||
class="mb-4"
|
||||
>
|
||||
<v-switch v-model="settings.edit.autoSave" label="启用自动保存" color="primary" hide-details class="mb-4">
|
||||
<template v-slot:append>
|
||||
<v-tooltip location="right">
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-icon
|
||||
v-bind="props"
|
||||
icon="mdi-help-circle-outline"
|
||||
size="small"
|
||||
class="ml-2"
|
||||
/>
|
||||
<v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
|
||||
</template>
|
||||
编辑完成后自动上传到服务器
|
||||
</v-tooltip>
|
||||
</template>
|
||||
</v-switch>
|
||||
|
||||
<v-switch
|
||||
v-model="settings.edit.refreshBeforeEdit"
|
||||
label="编辑前自动刷新"
|
||||
color="primary"
|
||||
hide-details
|
||||
>
|
||||
<v-switch v-model="settings.edit.refreshBeforeEdit" label="编辑前自动刷新" color="primary" hide-details>
|
||||
<template v-slot:append>
|
||||
<v-tooltip location="right">
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-icon
|
||||
v-bind="props"
|
||||
icon="mdi-help-circle-outline"
|
||||
size="small"
|
||||
class="ml-2"
|
||||
/>
|
||||
<v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
|
||||
</template>
|
||||
打开编辑框前自动从服务器获取最新数据
|
||||
</v-tooltip>
|
||||
@ -207,17 +124,12 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="px-4 pb-4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
block
|
||||
@click="saveSettings('edit')"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('edit')">
|
||||
保存设置
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col> <v-col cols="12" md="6">
|
||||
</v-col> <v-col cols="12" md="4">
|
||||
<v-card elevation="2" class="rounded-lg">
|
||||
<v-card-item>
|
||||
<template v-slot:prepend>
|
||||
@ -227,23 +139,12 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-switch
|
||||
v-model="settings.display.dynamicSort"
|
||||
label="启用动态排序"
|
||||
hint="动态排序会根据内容长度自动调整卡片位置以优化显示效果"
|
||||
persistent-hint
|
||||
class="mb-4"
|
||||
@change="saveSettings('display')"
|
||||
>
|
||||
<v-switch v-model="settings.display.dynamicSort" label="启用动态排序" hint="动态排序会根据内容长度自动调整卡片位置以优化显示效果"
|
||||
persistent-hint class="mb-4" @change="saveSettings('display')">
|
||||
<template v-slot:append>
|
||||
<v-tooltip location="right">
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-icon
|
||||
v-bind="props"
|
||||
icon="mdi-help-circle-outline"
|
||||
size="small"
|
||||
class="ml-2"
|
||||
/>
|
||||
<v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
|
||||
</template>
|
||||
<div>
|
||||
<p>启用：根据内容长度动态调整位置</p>
|
||||
@ -255,48 +156,28 @@
|
||||
|
||||
<v-divider class="my-4" />
|
||||
|
||||
<v-radio-group
|
||||
v-model="settings.display.emptySubjectDisplay"
|
||||
label="空作业显示方式"
|
||||
class="mt-4"
|
||||
@change="saveSettings('display')"
|
||||
>
|
||||
<v-radio
|
||||
value="card"
|
||||
label="显示为空卡片"
|
||||
>
|
||||
<v-radio-group v-model="settings.display.emptySubjectDisplay" label="空作业显示方式" class="mt-4"
|
||||
@change="saveSettings('display')">
|
||||
<v-radio value="card" label="显示为空卡片">
|
||||
<template v-slot:label>
|
||||
<div class="d-flex align-center">
|
||||
显示为空卡片
|
||||
<v-tooltip location="right">
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-icon
|
||||
v-bind="props"
|
||||
icon="mdi-help-circle-outline"
|
||||
size="small"
|
||||
class="ml-2"
|
||||
/>
|
||||
<v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
|
||||
</template>
|
||||
在主界面中显示为可点击的空白卡片
|
||||
</v-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
</v-radio>
|
||||
<v-radio
|
||||
value="button"
|
||||
label="显示为按钮组"
|
||||
>
|
||||
<v-radio value="button" label="显示为按钮组">
|
||||
<template v-slot:label>
|
||||
<div class="d-flex align-center">
|
||||
显示为按钮组
|
||||
<v-tooltip location="right">
|
||||
<template v-slot:activator="{ props }">
|
||||
<v-icon
|
||||
v-bind="props"
|
||||
icon="mdi-help-circle-outline"
|
||||
size="small"
|
||||
class="ml-2"
|
||||
/>
|
||||
<v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
|
||||
</template>
|
||||
在主界面底部显示为一组添加按钮
|
||||
</v-tooltip>
|
||||
@ -307,12 +188,7 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions class="px-4 pb-4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
block
|
||||
@click="saveSettings('display')"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('display')">
|
||||
保存设置
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
@ -326,32 +202,17 @@
|
||||
</template>
|
||||
<v-card-title class="text-h6">学生列表设置</v-card-title>
|
||||
<template v-slot:append>
|
||||
<v-btn
|
||||
:color="showAdvancedEdit ? 'primary' : undefined"
|
||||
variant="text"
|
||||
prepend-icon="mdi-code-braces"
|
||||
@click="showAdvancedEdit = !showAdvancedEdit"
|
||||
>
|
||||
<v-btn :color="showAdvancedEdit ? 'primary' : undefined" variant="text" prepend-icon="mdi-code-braces"
|
||||
@click="showAdvancedEdit = !showAdvancedEdit">
|
||||
{{ showAdvancedEdit ? '返回基础编辑' : '高级编辑' }}
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-progress-linear
|
||||
v-if="studentsLoading"
|
||||
indeterminate
|
||||
color="primary"
|
||||
class="mb-4"
|
||||
/>
|
||||
<v-progress-linear v-if="studentsLoading" indeterminate color="primary" class="mb-4" />
|
||||
|
||||
<v-alert
|
||||
v-if="studentsError"
|
||||
type="error"
|
||||
variant="tonal"
|
||||
closable
|
||||
class="mb-4"
|
||||
>
|
||||
<v-alert v-if="studentsError" type="error" variant="tonal" closable class="mb-4">
|
||||
{{ studentsError }}
|
||||
</v-alert>
|
||||
|
||||
@ -359,137 +220,68 @@
|
||||
<div v-if="!showAdvancedEdit">
|
||||
<v-row class="mb-6">
|
||||
<v-col cols="12" sm="6" md="4">
|
||||
<v-text-field
|
||||
v-model="newStudent"
|
||||
label="添加学生"
|
||||
placeholder="输入学生姓名后回车添加"
|
||||
prepend-inner-icon="mdi-account-plus"
|
||||
variant="outlined"
|
||||
hide-details
|
||||
@keyup.enter="addStudent"
|
||||
>
|
||||
<v-text-field v-model="newStudent" label="添加学生" placeholder="输入学生姓名后回车添加"
|
||||
prepend-inner-icon="mdi-account-plus" variant="outlined" hide-details @keyup.enter="addStudent">
|
||||
<template #append>
|
||||
<v-btn
|
||||
icon="mdi-plus"
|
||||
variant="text"
|
||||
color="primary"
|
||||
:disabled="!newStudent.trim()"
|
||||
@click="addStudent"
|
||||
/>
|
||||
<v-btn icon="mdi-plus" variant="text" color="primary" :disabled="!newStudent.trim()"
|
||||
@click="addStudent" />
|
||||
</template>
|
||||
</v-text-field>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(student, index) in studentsList"
|
||||
:key="index"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
>
|
||||
<v-col v-for="(student, index) in studentsList" :key="index" cols="12" sm="6" md="4" lg="3">
|
||||
<v-hover v-slot="{ isHovering, props }">
|
||||
<v-card
|
||||
v-bind="props"
|
||||
:elevation="isMobile ? 1 : (isHovering ? 4 : 1)"
|
||||
:class="[
|
||||
<v-card v-bind="props" :elevation="isMobile ? 1 : (isHovering ? 4 : 1)" :class="[
|
||||
'student-card',
|
||||
{
|
||||
'bg-primary-subtle': isHovering && !isMobile,
|
||||
'mobile': isMobile
|
||||
}
|
||||
]"
|
||||
border
|
||||
>
|
||||
]" border>
|
||||
<v-card-text class="d-flex align-center pa-3">
|
||||
<v-menu
|
||||
location="bottom"
|
||||
:open-on-hover="!isMobile"
|
||||
:open-on-long-press="isMobile"
|
||||
>
|
||||
<v-menu location="bottom" :open-on-hover="!isMobile" :open-on-long-press="isMobile">
|
||||
<template v-slot:activator="{ props: menuProps }">
|
||||
<v-btn
|
||||
variant="tonal"
|
||||
size="small"
|
||||
class="mr-3 font-weight-medium"
|
||||
v-bind="menuProps"
|
||||
>
|
||||
<v-btn variant="tonal" size="small" class="mr-3 font-weight-medium" v-bind="menuProps">
|
||||
{{ index + 1 }}
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list density="compact" nav>
|
||||
<v-list-item
|
||||
prepend-icon="mdi-arrow-up-bold"
|
||||
:disabled="index === 0"
|
||||
@click="moveToTop(index)"
|
||||
>
|
||||
<v-list-item prepend-icon="mdi-arrow-up-bold" :disabled="index === 0"
|
||||
@click="moveToTop(index)">
|
||||
置顶
|
||||
</v-list-item>
|
||||
<v-divider />
|
||||
<v-list-item
|
||||
prepend-icon="mdi-arrow-up"
|
||||
:disabled="index === 0"
|
||||
@click="moveStudent(index, 'up')"
|
||||
>
|
||||
<v-list-item prepend-icon="mdi-arrow-up" :disabled="index === 0"
|
||||
@click="moveStudent(index, 'up')">
|
||||
上移
|
||||
</v-list-item>
|
||||
<v-list-item
|
||||
prepend-icon="mdi-arrow-down"
|
||||
:disabled="index === studentsList.length - 1"
|
||||
@click="moveStudent(index, 'down')"
|
||||
>
|
||||
<v-list-item prepend-icon="mdi-arrow-down" :disabled="index === studentsList.length - 1"
|
||||
@click="moveStudent(index, 'down')">
|
||||
下移
|
||||
</v-list-item>
|
||||
<v-divider />
|
||||
<v-list-item
|
||||
prepend-icon="mdi-format-list-numbered"
|
||||
@click="setStudentNumber(index)"
|
||||
>
|
||||
<v-list-item prepend-icon="mdi-format-list-numbered" @click="setStudentNumber(index)">
|
||||
设置序号
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
|
||||
<v-text-field
|
||||
v-if="editingIndex === index"
|
||||
v-model="editingName"
|
||||
density="compact"
|
||||
variant="underlined"
|
||||
hide-details
|
||||
class="flex-grow-1"
|
||||
@keyup.enter="saveEdit"
|
||||
@blur="saveEdit"
|
||||
autofocus
|
||||
/>
|
||||
<span
|
||||
v-else
|
||||
class="text-body-1 flex-grow-1"
|
||||
<v-text-field v-if="editingIndex === index" v-model="editingName" density="compact"
|
||||
variant="underlined" hide-details class="flex-grow-1" @keyup.enter="saveEdit"
|
||||
@blur="saveEdit" autofocus />
|
||||
<span v-else class="text-body-1 flex-grow-1"
|
||||
@click="isMobile ? startEdit(index, student) : null"
|
||||
@dblclick="!isMobile ? startEdit(index, student) : null"
|
||||
>
|
||||
@dblclick="!isMobile ? startEdit(index, student) : null">
|
||||
{{ student }}
|
||||
</span>
|
||||
|
||||
<div
|
||||
class="d-flex gap-1 action-buttons"
|
||||
:class="{'opacity-100': isHovering || isMobile}"
|
||||
>
|
||||
<v-btn
|
||||
icon="mdi-pencil"
|
||||
variant="text"
|
||||
color="primary"
|
||||
size="small"
|
||||
@click="startEdit(index, student)"
|
||||
/>
|
||||
<v-btn
|
||||
icon="mdi-delete"
|
||||
variant="text"
|
||||
color="error"
|
||||
size="small"
|
||||
@click="confirmDelete(index)"
|
||||
/>
|
||||
<div class="d-flex gap-1 action-buttons" :class="{ 'opacity-100': isHovering || isMobile }">
|
||||
<v-btn icon="mdi-pencil" variant="text" color="primary" size="small"
|
||||
@click="startEdit(index, student)" />
|
||||
<v-btn icon="mdi-delete" variant="text" color="error" size="small"
|
||||
@click="confirmDelete(index)" />
|
||||
</div>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
@ -501,39 +293,19 @@
|
||||
|
||||
<v-expand-transition>
|
||||
<div v-if="showAdvancedEdit" class="pt-2">
|
||||
<v-textarea
|
||||
v-model="students"
|
||||
label="批量编辑学生列表"
|
||||
placeholder="每行输入一个学生姓名"
|
||||
hint="使用文本编辑模式批量编辑学生名单"
|
||||
persistent-hint
|
||||
variant="outlined"
|
||||
rows="10"
|
||||
/>
|
||||
<v-textarea v-model="students" label="批量编辑学生列表" placeholder="每行输入一个学生姓名" hint="使用文本编辑模式批量编辑学生名单"
|
||||
persistent-hint variant="outlined" rows="10" />
|
||||
</div>
|
||||
</v-expand-transition>
|
||||
|
||||
<v-row class="mt-6">
|
||||
<v-col cols="12" class="d-flex gap-2">
|
||||
<v-btn
|
||||
color="primary"
|
||||
prepend-icon="mdi-content-save"
|
||||
size="large"
|
||||
:loading="studentsLoading"
|
||||
:disabled="studentsLoading"
|
||||
@click="saveStudents"
|
||||
>
|
||||
<v-btn color="primary" prepend-icon="mdi-content-save" size="large" :loading="studentsLoading"
|
||||
:disabled="studentsLoading" @click="saveStudents">
|
||||
保存学生列表
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="error"
|
||||
variant="outlined"
|
||||
prepend-icon="mdi-refresh"
|
||||
size="large"
|
||||
:loading="studentsLoading"
|
||||
:disabled="studentsLoading"
|
||||
@click="reloadStudentList"
|
||||
>
|
||||
<v-btn color="error" variant="outlined" prepend-icon="mdi-refresh" size="large"
|
||||
:loading="studentsLoading" :disabled="studentsLoading" @click="reloadStudentList">
|
||||
重置列表
|
||||
</v-btn>
|
||||
</v-col>
|
||||
@ -554,45 +326,25 @@
|
||||
<v-row justify="center" align="center">
|
||||
<v-col cols="12" md="8" class="text-center">
|
||||
<v-avatar size="120" class="mb-4">
|
||||
<v-img
|
||||
src="https://avatars.githubusercontent.com/u/88357633?v=4"
|
||||
alt="作者头像"
|
||||
/>
|
||||
<v-img src="https://avatars.githubusercontent.com/u/88357633?v=4" alt="作者头像" />
|
||||
</v-avatar>
|
||||
<h2 class="text-h5 mb-2">HomeworkPage</h2>
|
||||
<p class="text-body-1 mb-4">
|
||||
由 <a
|
||||
href="https://github.com/sunwuyuan"
|
||||
target="_blank"
|
||||
class="text-decoration-none font-weight-medium"
|
||||
>Sunwuyuan</a> 开发
|
||||
由 <a href="https://github.com/sunwuyuan" target="_blank"
|
||||
class="text-decoration-none font-weight-medium">Sunwuyuan</a> 开发
|
||||
</p>
|
||||
<div class="d-flex justify-center gap-2 flex-wrap">
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/SunWuyuan/homeworkpage-frontend"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
>
|
||||
<v-btn color="primary" variant="outlined" href="https://github.com/SunWuyuan/homeworkpage-frontend"
|
||||
target="_blank" prepend-icon="mdi-github">
|
||||
前端 GitHub
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/SunWuyuan/homeworkpage-backend"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
>
|
||||
<v-btn color="primary" variant="outlined" href="https://github.com/SunWuyuan/homeworkpage-backend"
|
||||
target="_blank" prepend-icon="mdi-github">
|
||||
后端 GitHub
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/SunWuyuan/homeworkpage-backend/issues"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-bug"
|
||||
>
|
||||
<v-btn color="primary" variant="outlined"
|
||||
href="https://github.com/SunWuyuan/homeworkpage-backend/issues" target="_blank"
|
||||
prepend-icon="mdi-bug">
|
||||
报告问题
|
||||
</v-btn>
|
||||
</div>
|
||||
@ -622,11 +374,7 @@
|
||||
<v-btn color="primary" variant="text" @click="deleteDialog = false">
|
||||
取消
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="error"
|
||||
variant="text"
|
||||
@click="removeStudent(studentToDelete?.index)"
|
||||
>
|
||||
<v-btn color="error" variant="text" @click="removeStudent(studentToDelete?.index)">
|
||||
删除
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
@ -637,17 +385,11 @@
|
||||
<v-card>
|
||||
<v-card-title>设置序号</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="newPosition"
|
||||
type="number"
|
||||
label="新序号"
|
||||
:rules="[
|
||||
<v-text-field v-model="newPosition" type="number" label="新序号" :rules="[
|
||||
v => !!v || '序号不能为空',
|
||||
v => v > 0 || '序号必须大于0',
|
||||
v => v <= studentsList.length || `序号不能大于${studentsList.length}`
|
||||
]"
|
||||
@keyup.enter="applyNewPosition"
|
||||
/>
|
||||
]" @keyup.enter="applyNewPosition" />
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
|
||||
@ -72,12 +72,12 @@ const settingsDefinitions = {
|
||||
// 编辑设置
|
||||
'edit.autoSave': {
|
||||
type: 'boolean',
|
||||
default: false,
|
||||
default: true,
|
||||
description: '是否启用自动保存'
|
||||
},
|
||||
'edit.refreshBeforeEdit': {
|
||||
type: 'boolean',
|
||||
default: false,
|
||||
default: true,
|
||||
description: '编辑前是否自动刷新'
|
||||
}
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user