diff --git a/frontend/src/views/teachBusiness/trainingPlan/index.vue b/frontend/src/views/teachBusiness/trainingPlan/index.vue index b8d32aa28..22b7b695d 100644 --- a/frontend/src/views/teachBusiness/trainingPlan/index.vue +++ b/frontend/src/views/teachBusiness/trainingPlan/index.vue @@ -60,34 +60,16 @@ - - -
- 新建 - 下载 -
-
- 【人才培养方案目录模板】下载 -
-
-
- 选择文件 - - - - - -
-
- 上传数据 -
-
-
- - +
人才培养方案列表
+
+ 新建 + 下载 + 【人才培养方案目录模板】下载 + 数据上传 +
@@ -353,6 +335,33 @@ 关 闭 + + + + + + + 【人才培养方案目录模板】下载 + + +
+ + 选择文件 + + {{ selectedFile ? fileName : '未选择任何文件' }} + + 清除 +
+
+
+ +
@@ -400,6 +409,10 @@ export default { // 上传 selectedFile: null, fileName: '', + uploadDialog: { + visible: false, + uploading: false + }, // 新增/编辑弹窗 dialog: { visible: false, @@ -622,6 +635,9 @@ export default { this.$message.success('模板下载成功') }).catch(() => {}) }, + openUploadDialog() { + this.uploadDialog.visible = true + }, handleChooseFile() { this.$refs.fileInputRef && this.$refs.fileInputRef.click() }, @@ -630,19 +646,26 @@ export default { this.selectedFile = file || null this.fileName = file ? file.name : '' }, + clearUploadFile() { + this.selectedFile = null + this.fileName = '' + if (this.$refs.fileInputRef) this.$refs.fileInputRef.value = '' + }, handleUpload() { if (!this.selectedFile) { this.$message.warning('请先选择文件') return } + this.uploadDialog.uploading = true importTrainingProgram(this.selectedFile).then(response => { const count = (response && response.data) || 0 this.$message.success(`导入成功,共导入 ${count} 条`) - this.selectedFile = null - this.fileName = '' - if (this.$refs.fileInputRef) this.$refs.fileInputRef.value = '' + this.uploadDialog.visible = false + this.clearUploadFile() this.fetchList() - }).catch(() => {}) + }).catch(() => {}).finally(() => { + this.uploadDialog.uploading = false + }) }, /* ---------- 工具 ---------- */ @@ -800,45 +823,6 @@ export default { } } - .action-card { - margin-bottom: 16px; - - .action-row { - margin-bottom: 12px; - - &:last-of-type { - margin-bottom: 0; - } - } - - .upload-row { - display: flex; - align-items: center; - justify-content: space-between; - flex-wrap: wrap; - gap: 12px; - padding: 12px; - background: #fafafa; - border: 1px dashed #dcdfe6; - border-radius: 4px; - - .upload-left { - display: flex; - align-items: center; - gap: 12px; - - .file-name { - font-size: 13px; - color: #909399; - - &.has-file { - color: #409eff; - } - } - } - } - } - .table-card { .list-header { display: flex; @@ -851,6 +835,16 @@ export default { font-weight: 600; color: #303133; } + + .list-actions { + display: flex; + gap: 12px; + flex-wrap: wrap; + + .el-button + .el-button { + margin-left: 0; + } + } } .pagination { @@ -859,6 +853,27 @@ export default { } } + .upload-tip { + margin-bottom: 16px; + } + + .upload-form { + .file-input { + display: flex; + align-items: center; + gap: 12px; + + .file-name { + font-size: 14px; + color: #606266; + + &.has-file { + color: #409eff; + } + } + } + } + .detail-body { min-height: 60px; }