feat: 学生信息管理系统开发完成
- 完成学生信息管理核心功能开发 - 新增学生信息采集批次管理功能 - 完成班干部管理模块开发 - 修复物业报修模块附件上传逻辑 - 完善数据库表结构和权限配置 - 更新API文档和变更记录 - 优化前端页面交互体验 详细变更记录见: - docs/变更管理/code-adjust-record-2025-01-13-wuzhen.md - docs/变更管理/code-adjust-record-2025-07-11-wuzilong.md - docs/变更管理/code-adjust-record-2025-07-12-wuzhen.md
This commit is contained in:
commit
8697b21b4d
237 files changed
+35787
-2878
No files matched your search
@@ -0,0 +1,126 @@
|
||||
<template>
|
||||
<el-dialog title="导入数据" v-model="dialogVisible" width="600px" append-to-body @close="handleClose">
|
||||
<el-form>
|
||||
<el-form-item label="选择文件">
|
||||
<el-upload
|
||||
ref="uploadRef"
|
||||
:action="uploadUrl"
|
||||
:headers="headers"
|
||||
:on-success="handleSuccess"
|
||||
:on-error="handleError"
|
||||
:before-upload="beforeUpload"
|
||||
:file-list="fileList"
|
||||
:auto-upload="false"
|
||||
accept=".xlsx,.xls"
|
||||
drag
|
||||
>
|
||||
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
||||
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
||||
<template #tip>
|
||||
<div class="el-upload__tip">只能上传xlsx/xls文件,且不超过10MB</div>
|
||||
</template>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="handleDownloadTemplate">下载模板</el-button>
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="handleUpload" :loading="uploading">
|
||||
{{ uploading ? '导入中...' : '确定导入' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus';
|
||||
import { getToken } from '@/utils/auth';
|
||||
|
||||
interface Props {
|
||||
visible: boolean;
|
||||
uploadUrl: string;
|
||||
templateUrl: string;
|
||||
}
|
||||
|
||||
interface Emits {
|
||||
(e: 'update:visible', value: boolean): void;
|
||||
(e: 'success'): void;
|
||||
}
|
||||
|
||||
const props = defineProps<Props>();
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
const uploadRef = ref<UploadInstance>();
|
||||
const uploading = ref(false);
|
||||
const fileList = ref([]);
|
||||
|
||||
const dialogVisible = computed({
|
||||
get: () => props.visible,
|
||||
set: (value) => emit('update:visible', value)
|
||||
});
|
||||
|
||||
const headers = computed(() => ({
|
||||
Authorization: 'Bearer ' + getToken()
|
||||
}));
|
||||
|
||||
const beforeUpload: UploadProps['beforeUpload'] = (rawFile: UploadRawFile) => {
|
||||
const isExcel = rawFile.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || rawFile.type === 'application/vnd.ms-excel';
|
||||
const isLt10M = rawFile.size / 1024 / 1024 < 10;
|
||||
|
||||
if (!isExcel) {
|
||||
ElMessage.error('只能上传 Excel 文件!');
|
||||
return false;
|
||||
}
|
||||
if (!isLt10M) {
|
||||
ElMessage.error('文件大小不能超过 10MB!');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
const handleSuccess = (response: any) => {
|
||||
uploading.value = false;
|
||||
if (response.code === 200) {
|
||||
ElMessage.success('导入成功');
|
||||
emit('success');
|
||||
handleClose();
|
||||
} else {
|
||||
ElMessage.error(response.msg || '导入失败');
|
||||
}
|
||||
};
|
||||
|
||||
const handleError = () => {
|
||||
uploading.value = false;
|
||||
ElMessage.error('导入失败');
|
||||
};
|
||||
|
||||
const handleUpload = () => {
|
||||
if (fileList.value.length === 0) {
|
||||
ElMessage.warning('请先选择文件');
|
||||
return;
|
||||
}
|
||||
uploading.value = true;
|
||||
uploadRef.value?.submit();
|
||||
};
|
||||
|
||||
const handleDownloadTemplate = () => {
|
||||
window.open(props.templateUrl, '_blank');
|
||||
};
|
||||
|
||||
const handleClose = () => {
|
||||
dialogVisible.value = false;
|
||||
fileList.value = [];
|
||||
uploading.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog-footer {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user