QingdaoU/OnlineJudge
1
0
Fork 0
mirror of https://github.com/QingdaoU/OnlineJudge.git synced 2024-09-21 00:13:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

增加进度条

Browse Source
This commit is contained in:
LiYang 2016-08-07 23:14:18 +08:00
parent 94c56fc39f
commit 201611948c
2 changed files with 45 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
frontend/admin/src/components/problem/testCaseMgnt.vue
View File

@ -1,41 +1,44 @@
<template>
<div>
<div class="col-md-12">
<label>{{ $t("problem.testCase") }}
<a v-show="downloadUrl" v-bind:href="downloadUrl">{{ $t("adminUtils.download") }}</a>
</label>
<small class="text-info">
请将所有测试用例打包在一个zip文件中上传，所有文件要在压缩包的根目录，且输入输出文件名要以从1开始连续数字标识要对应例如：
<br>1.in 1.out 2.in 2.out(普通题目)或者1.in 2.in 3.in(Special Judge)
<a href="https://github.com/QingdaoU/OnlineJudge/wiki/%E6%B5%8B%E8%AF%95%E7%94%A8%E4%BE%8B%E4%B8%8A%E4%BC%A0"
target="_blank">{{ $t("adminUtils.help") }}
</a>
</small>
<p>{{ $t("problem.uploadProgress") }}<span v-text="uploadProgress"></span>%</p>
<table class="table table-striped" v-if="testCaseList">
<tr>
<td>ID</td>
<td>{{ $t("adminUtils.input") }}</td>
<td>{{ $t("adminUtils.output") }}</td>
</tr>
<tr v-for="testCase in testCaseList">
<td>{{ $index + 1 }}</td>
<td>{{ testCase.input }}</td>
<td>{{ testCase.output }}</td>
</tr>
</table>
</div>
<div class="col-md-12">
<div class="form-group">
<uploader uploader-id="testCaseUploader"
upload-path="/"
:accept="{title: 'testcase zip', extensions: 'zip', mimeTypes: 'application/zip'}"
:upload-success="uploadSuccess"
:upload-error="uploadError"
:upload-progress="uploadProgress">
</uploader>
<div class="col-md-12">
<label>
{{ $t("problem.testCase") }}
<a href="https://github.com/QingdaoU/OnlineJudge/wiki/%E6%B5%8B%E8%AF%95%E7%94%A8%E4%BE%8B%E4%B8%8A%E4%BC%A0"
target="_blank">{{ $t("adminUtils.help") }}
</a>
<a v-show="downloadUrl" v-bind:href="downloadUrl">{{ $t("adminUtils.download") }}</a>
</label>
<br>
<label>{{ $t("problem.uploadProgress") }}</label>
<div class="progress">
<div class="progress-bar progress-bar-striped" role="progressbar " aria-valuenow="{{ uploadProgress }}"
aria-valuemin="0"
aria-valuemax="100"
v-bind:style="{width: uploadProgress+'%'}">
{{ uploadProgress }} %
</div>
</div>
<table class="table table-striped" v-if="testCaseList">
<tr>
<td>ID</td>
<td>{{ $t("adminUtils.input") }}</td>
<td>{{ $t("adminUtils.output") }}</td>
</tr>
<tr v-for="testCase in testCaseList">
<td>{{ $index + 1 }}</td>
<td>{{ testCase.input }}</td>
<td>{{ testCase.output }}</td>
</tr>
</table>
<div class="form-group">
<uploader uploader-id="testCaseUploader"
upload-path="/"
:accept="{title: 'testcase zip', extensions: 'zip', mimeTypes: 'application/zip'}"
:upload-success="uploadSuccess"
:upload-error="uploadError"
:upload-progress.sync="uploadProgress">
</uploader>
</div>
</div>
</template>
@ -54,14 +57,12 @@
uploader
},
methods: {
uploadSuccess: (f, response)=> {
uploadSuccess(f, response){
alert("success");
},
uploadError: (f, reason)=> {
uploadError(f, reason){
this.uploadProgress = 0;
alert("error");
},
uploadProgress: (file, percentage)=> {
console.log(percentage);
}
}
})

6
frontend/admin/src/components/utils/uploader.vue
View File

@ -46,9 +46,11 @@
uploader.on("uploadBeforeSend", (obj, data, headers)=> {
headers["X-CSRFToken"] = getCookie("csrftoken");
});
uploader.on("uploadSuccess", this.uploadSuccess);
uploader.on("uploadProgress", (f, percentage)=> {
this.uploadProgress = Math.round(percentage * 100);
});
uploader.on("uploadError", this.uploadError);
uploader.on("uploadProgress", this.uploadProgress);
uploader.on("uploadSuccess", this.uploadSuccess);
}
})
</script>