优化问题列表组件,调整表格布局,添加检查错误装饰函数,更新样式以居中对齐

This commit is contained in:
keqingmoe 2024-12-31 00:21:30 +08:00
parent 1b1196cb21
commit 08dfb27ac9

View File

@ -82,14 +82,34 @@
</v-dialog>
</v-toolbar>
</template>
<template v-slot:item.actions="{ item }">
<v-icon class="me-2" size="small" @click="editItem(item)">
mdi-pencil
</v-icon>
<v-icon size="small" @click="deleteItem(item)">
mdi-delete
</v-icon>
<template v-slot:item="{ item }">
<tr>
<td>{{ item.id }}</td>
<td>{{ item.problem }}</td>
<td>{{ item.answer }}</td>
<td>{{ decorateCheckingError(item.check_error) }}</td>
<td class="text-center">
<v-icon class="me-2" size="small" @click="editItem(item)">
mdi-pencil
</v-icon>
<v-icon size="small" @click="deleteItem(item)">
mdi-delete
</v-icon>
</td>
</tr>
</template>
<!-- <template v-slot:item.actions="{ item }">
<tr>
<td class="text-center">
<v-icon class="me-2" size="small" @click="editItem(item)">
mdi-pencil
</v-icon>
<v-icon size="small" @click="deleteItem(item)">
mdi-delete
</v-icon>
</td>
</tr>
</template> -->
</v-data-table>
<v-dialog v-model="dialogShow" width="auto">
<v-card max-width="400" prepend-icon="mdi-update" :text="dialogText" :title="dialogTitle">
@ -175,6 +195,13 @@ const checkingErrorTitle = ref('');
const checkingErrorIcon = ref('');
const checkingError = ref('');
const decorateCheckingError = (checkError: number) => {
if (checkError == 0) {
return '精确匹配';
}
return checkError;
}
watch(preciseMode, () => {
if (preciseMode.value) {
checkingError.value = '精确匹配';
@ -402,4 +429,9 @@ const save = async (event: SubmitEvent) => {
close1();
};
</script>
</script>
<style lang="scss" scoped>
td {
text-align: center;
}
</style>