This commit is contained in:
dongruihua
2023-01-18 19:54:23 +08:00
5 changed files with 116 additions and 15 deletions

2
.env
View File

@@ -1,5 +1,5 @@
VITE_BASE=/fe-student-h5 VITE_BASE=/fe-student-h5
VITE_BASE_API=/ VITE_BASE_API=
VITE_OUTPUT_DIR=./dist VITE_OUTPUT_DIR=./dist
VITE_BASE_LOGIN_URL=https://u-pre.boe.com/web?returnUrl= VITE_BASE_LOGIN_URL=https://u-pre.boe.com/web?returnUrl=
VITE_PROXY_URL=http://111.231.196.214/manageApi VITE_PROXY_URL=http://111.231.196.214/manageApi

View File

@@ -2,13 +2,13 @@
* @Author: lixg lixg@dongwu-inc.com * @Author: lixg lixg@dongwu-inc.com
* @Date: 2023-01-13 11:42:48 * @Date: 2023-01-13 11:42:48
* @LastEditors: lixg lixg@dongwu-inc.com * @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2023-01-17 17:06:24 * @LastEditTime: 2023-01-18 14:57:44
* @FilePath: /stu_h5/src/api/api.js * @FilePath: /stu_h5/src/api/api.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
export const BASE = 'http://localhost:3000' export const BASE = 'http://localhost:3000'
export const LOGIN = '/admin/CheckUser/userLogin post' export const LOGIN = '/admin/CheckUser/userLogin post'
export const FILE_UPLOAD = '/file/upload' export const FILE_UPLOAD = import.meta.env.VITE_BASE_API + '/file/upload'
export const ROUTER_CHAPTER_LIST = '/stu/router/chapterList' export const ROUTER_CHAPTER_LIST = '/stu/router/chapterList'
export const ROUTER_LIST = '/stu/router/list post' export const ROUTER_LIST = '/stu/router/list post'
export const ROUTER_PROCESS = '/stu/router/process' export const ROUTER_PROCESS = '/stu/router/process'
@@ -37,4 +37,4 @@ export const TASK_WORK_SUBMIT_LIST = '/workSubmit/queryWorkSubmitDetailById'
export const WORK_HISTROY = '/workSubmit/queryWorkDetailListByStuId' export const WORK_HISTROY = '/workSubmit/queryWorkDetailListByStuId'
export const ASSESSMENT_QUERY = assessmentId => `/stu/task/queryAssessmentDetailById` export const ASSESSMENT_QUERY = assessmentId => `/stu/task/queryAssessmentDetailById`
export const ASSESSMENT_SUBMIT = '/stu/task/evaluate/commit post' export const ASSESSMENT_SUBMIT = '/stu/task/evaluate/commit post'
export const FILE_UPLOAD_ANNEX = import.meta.env.VITE_BASE_API + '/file/stuUploadAnnex'

Binary file not shown.

After

Width:  |  Height:  |  Size: 457 B

View File

@@ -0,0 +1,97 @@
<!--
* @Author: lixg lixg@dongwu-inc.com
* @Date: 2023-01-18 14:40:26
* @LastEditors: lixg lixg@dongwu-inc.com
* @LastEditTime: 2023-01-18 14:58:06
* @FilePath: /stu_h5/src/components/img/UploadImg.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<el-upload
:file-list="files"
:action="FILE_UPLOAD"
method="POST"
:show-file-list="false"
:on-change="handleChange"
:limit="max"
ref="imageRef"
:on-exceed="exceed"
>
<template #trigger>
<div>
<slot></slot>
</div>
</template>
</el-upload>
</template>
<script setup>
import { FILE_UPLOAD } from "@/api/api";
import { defineProps, ref, watch } from "vue";
import { ElMessage } from "element-plus";
const props = defineProps({
value: [],
max: {
type: Number,
default: 1,
},
});
const emit = defineEmits();
const files = ref([]);
const imageRef = ref();
watch(props.value, () => {
props.value.length || (files.value = props.value);
});
function exceed() {
ElMessage.error(`只能上传${props.max}个附件`);
}
function handleChange(e) {
if (e.response && e.response.code === 200) {
e.url = e.response.data;
}
const index = files.value.findIndex((f) => f.uid === e.uid);
if (index === -1) {
files.value.unshift(e);
} else {
files.value[index] = e;
}
emit("update:value", files.value);
}
function remove(i) {
files.value.splice(i, 1);
console.log(imageRef);
}
function clearFiles() {
imageRef.value.clearFiles();
}
function reUpload(i) {
if (
files.value[i].status === "ready" ||
files.value[i].status === "uploading"
) {
imageRef.value.abort(files.value[i].raw);
files.value[i].status = "abort";
} else if (
files.value[i].status === "fail" ||
files.value[i].status === "abort"
) {
imageRef.value.handleStart(files.value[i].raw);
imageRef.value.submit();
}
}
function abort(i) {
imageRef.value.abort(files.value[i].raw);
}
defineExpose({ reUpload, remove, clearFiles });
</script>

View File

@@ -25,7 +25,9 @@
<div class="line"></div> <div class="line"></div>
</div> </div>
<div class="allimg"> <div class="allimg">
<img src="../../assets/image/homeworkpage/link.png" /> <UploadImg v-model:value="fileList" ref="uploadRef">
<img src="../../assets/image/homeworkpage/link.png" />
</UploadImg>
<!-- <img src="../../assets/image/homeworkpage/pre.png" /> <!-- <img src="../../assets/image/homeworkpage/pre.png" />
<img src="../../assets/image/homeworkpage/next.png" /> --> <img src="../../assets/image/homeworkpage/next.png" /> -->
<img <img
@@ -45,10 +47,12 @@ import { request, useRequest } from "@/api/request";
import { TASK_WORK_COMMIT } from "@/api/api"; import { TASK_WORK_COMMIT } from "@/api/api";
import { useRoute } from "vue-router/dist/vue-router"; import { useRoute } from "vue-router/dist/vue-router";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import UploadImg from "@/components/img/UploadImg.vue";
export default { export default {
name: "UploadWork", name: "UploadWork",
components: { components: {
ReturnHead, ReturnHead,
UploadImg,
}, },
setup() { setup() {
const state = reactive({ const state = reactive({
@@ -76,16 +80,16 @@ export default {
type, type,
taskId: taskId || infoId, taskId: taskId || infoId,
}; };
console.log("obj", obj); console.log("obj", obj, fileList.value);
request(TASK_WORK_COMMIT, obj).then((res) => { // request(TASK_WORK_COMMIT, obj).then((res) => {
console.log("上传作业", res); // console.log("上传作业", res);
// submitList.value.unshift(res.data); // // submitList.value.unshift(res.data);
// open(); // // open();
textarea.value = ""; // textarea.value = "";
fileList.value = []; // fileList.value = [];
// remove(0); // // remove(0);
// clearFiles(); // // clearFiles();
}); // });
}; };
const deleteAll = () => { const deleteAll = () => {
console.log("点击"); console.log("点击");