54 lines
2.3 KiB
HTML
54 lines
2.3 KiB
HTML
|
<div id="uploadModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="uploadModalLabel" aria-hidden="true">
|
||
|
<div class="modal-dialog" role="document">
|
||
|
<div class="modal-content">
|
||
|
<div class="modal-header">
|
||
|
<h5 class="modal-title" id="uploadModalLabel">上传文件</h5>
|
||
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||
|
</div>
|
||
|
<div class="modal-body">
|
||
|
<!-- 上传表单 -->
|
||
|
<form id="upload-form" enctype="multipart/form-data">
|
||
|
<input type="file" class="form-control" id="inputGroupFile01" hidden accept=".xlsx">
|
||
|
<label class="btn btn-outline-primary" for="inputGroupFile01">选择文件</label>
|
||
|
<span id="file-chosen" style="font-size: 12px; margin-left: 10px;">未选择文件</span>
|
||
|
</form>
|
||
|
</div>
|
||
|
<div class="modal-footer">
|
||
|
<a href="{{ download_template_url }}" class="btn btn-secondary">下载模板</a>
|
||
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal">取消</button>
|
||
|
<button type="button" class="btn btn-primary" id="uploadBtn">上传</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<script>
|
||
|
$(document).ready(function() {
|
||
|
// 当选择文件变化时,更新文件名显示
|
||
|
$('#inputGroupFile01').on('change', function() {
|
||
|
var fileName = $(this).val().split('\\').pop();
|
||
|
$('#file-chosen').text(fileName || '未选择文件');
|
||
|
});
|
||
|
|
||
|
// 处理上传按钮的点击事件
|
||
|
$('#uploadBtn').on('click', function() {
|
||
|
var formData = new FormData($('#upload-form')[0]);
|
||
|
$.ajax({
|
||
|
url: '{{ parse_excel_url }}', // 使用从父模板传递的URL
|
||
|
type: 'POST',
|
||
|
data: formData,
|
||
|
contentType: false,
|
||
|
processData: false,
|
||
|
success: function(response) {
|
||
|
// 上传成功后的回调函数
|
||
|
$('#uploadModal').modal('hide');
|
||
|
// 其他逻辑...
|
||
|
},
|
||
|
error: function(xhr, status, error) {
|
||
|
// 上传失败的回调函数
|
||
|
// 错误处理...
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
});
|
||
|
</script>
|