This commit is contained in:
yuping
2022-12-15 03:02:19 +08:00
parent 7091f153c8
commit bac238d801

View File

@@ -24,7 +24,7 @@
<div class="detail"> <div class="detail">
<div class="detailT"> <div class="detailT">
<div <div
style=" style="
margin-left: 45px; margin-left: 45px;
margin-right: 42px; margin-right: 42px;
position: relative; position: relative;
@@ -33,8 +33,8 @@
> >
<div class="title"> <div class="title">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">作业名称</div> <div class="text">作业名称</div>
<div class="box"></div> <div class="box"></div>
@@ -48,52 +48,52 @@
</div> </div>
<UploadImg v-model="fileList" ref="uploadRef"> <UploadImg v-model="fileList" ref="uploadRef">
<button <button
class="shangchuan" class="shangchuan"
style="cursor: pointer" style="cursor: pointer"
@mousemove="showFileList = 1" @mousemove="showFileList = 1"
@mouseout="showFileList = 0" @mouseout="showFileList = 0"
> >
上传 上传
</button> </button>
</UploadImg> </UploadImg>
<div <div
class="uploadDetail" class="uploadDetail"
:style="{ display: showFileList ? 'block' : 'none' }" :style="{ display: showFileList ? 'block' : 'none' }"
@mousemove="showFileList = 1" @mousemove="showFileList = 1"
@mouseout="showFileList = 0" @mouseout="showFileList = 0"
style="padding-top: 60px" style="padding-top: 60px"
> >
<div class="triangle"></div> <div class="triangle"></div>
<div class="square clearfix"> <div class="square clearfix">
<div <div
class="squarecontent1" class="squarecontent1"
v-for="(file, i) in fileList" v-for="(file, i) in fileList"
:key="i" :key="i"
> >
<FileTypeImg <FileTypeImg
v-model="file.name" v-model="file.name"
:style="{ margin: '12px 15px 0 27px' }" :style="{ margin: '12px 15px 0 27px' }"
></FileTypeImg> ></FileTypeImg>
<div class="rarDetail"> <div class="rarDetail">
<span class="detail1" style="margin-right: 130px"> <span class="detail1" style="margin-right: 130px">
{{ file.name }} {{ file.name }}
</span> </span>
<span class="detail2" style="margin-right: 10px" <span class="detail2" style="margin-right: 10px"
>{{ file.percentage }}%</span >{{ file.percentage }}%</span
> >
<span class="detail1">{{ <span class="detail1">{{
{ {
ready: "正在上传", ready: "正在上传",
abort: "暂停", abort: "暂停",
uploading: "正在上传", uploading: "正在上传",
fail: "上传失败", fail: "上传失败",
success: "上传成功", success: "上传成功",
}[file.status] }[file.status]
}}</span> }}</span>
<div class="progress"> <div class="progress">
<div <div
class="progressinner" class="progressinner"
:style="{ width: `${(291 * file.percentage) / 100}px` }" :style="{ width: `${(291 * file.percentage) / 100}px` }"
></div> ></div>
</div> </div>
</div> </div>
@@ -124,8 +124,8 @@
<div class="title"> <div class="title">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">作业内容</div> <div class="text">作业内容</div>
<div class="box"></div> <div class="box"></div>
@@ -133,11 +133,10 @@
<div class="join"> <div class="join">
<el-input <el-input
v-model="textarea1" v-model="sbValue.content"
:autosize="{ minRows: 12.5, maxRows: 12.5 }" :autosize="{ minRows: 12.5, maxRows: 12.5 }"
resize="none" resize="none"
type="textarea" type="textarea"
@input="textareaInput"
/> />
</div> </div>
<div style="display: flex; justify-content: center"> <div style="display: flex; justify-content: center">
@@ -148,8 +147,8 @@
<div class="title" style="margin-top: 0px"> <div class="title" style="margin-top: 0px">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">历史纪录</div> <div class="text">历史纪录</div>
<div class="box"></div> <div class="box"></div>
@@ -161,10 +160,10 @@
<div class="content2">作业内容</div> <div class="content2">作业内容</div>
</div> </div>
<div <div
v-for="(value, index) in submitList" v-for="(value, index) in submitList"
:key="index" :key="index"
class="historytitle2" class="historytitle2"
:style="{ :style="{
'border-bottom': 'border-bottom':
index === submitList.length - 1 index === submitList.length - 1
? '1px solid rgba(215, 229, 253, 0)' ? '1px solid rgba(215, 229, 253, 0)'
@@ -174,7 +173,7 @@
<div class="content1">{{ value.createTime }}</div> <div class="content1">{{ value.createTime }}</div>
<div class="content2"> <div class="content2">
<div <div
style=" style="
width: 95%; width: 95%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@@ -192,8 +191,8 @@
<div class="right"> <div class="right">
<div class="righttitle"> <div class="righttitle">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">截止时间</div> <div class="text">截止时间</div>
<div class="box"></div> <div class="box"></div>
@@ -210,21 +209,21 @@
<div class="endtimetext"> <div class="endtimetext">
距离结束还有&nbsp;&nbsp; 距离结束还有&nbsp;&nbsp;
<span class="te">{{ <span class="te">{{
parseInt( parseInt(
dayjs(data?.submitEndTime).diff(dayjs(), "minute") / 60 dayjs(data?.submitEndTime).diff(dayjs(), "minute") / 60
) )
}}</span }}</span
>&nbsp;&nbsp; 小时&nbsp;&nbsp;<span class="te">{{ >&nbsp;&nbsp; 小时&nbsp;&nbsp;<span class="te">{{
dayjs(data?.submitEndTime).diff(dayjs(), "minute") % 60 dayjs(data?.submitEndTime).diff(dayjs(), "minute") % 60
}}</span }}</span
>&nbsp;&nbsp;分钟 >&nbsp;&nbsp;分钟
</div> </div>
</div> </div>
</div> </div>
<div class="righttitle"> <div class="righttitle">
<img <img
style="width: 20px; height: 20px" style="width: 20px; height: 20px"
src="../../assets/image/yuan.png" src="../../assets/image/yuan.png"
/> />
<div class="text">作业说明</div> <div class="text">作业说明</div>
@@ -233,9 +232,9 @@
<div class="explain clearfix"> <div class="explain clearfix">
<!-- todo #作业任务详情 作业说明是作业要求字段么--> <!-- todo #作业任务详情 作业说明是作业要求字段么-->
<div <div
class="explain1" class="explain1"
style="margin-top: 26px" style="margin-top: 26px"
v-html="data?.workRequirement" v-html="data?.workRequirement"
></div> ></div>
</div> </div>
</div> </div>
@@ -245,8 +244,8 @@
</template> </template>
<script setup> <script setup>
import { reactive, ref, toRefs } from "vue"; import {reactive, ref, toRefs} from "vue";
import { request, useRequest } from "@/api/request"; import {request, useRequest} from "@/api/request";
import { import {
TASK_WORK_COMMIT, TASK_WORK_COMMIT,
TASK_WORK_DETAIL, TASK_WORK_DETAIL,
@@ -254,40 +253,40 @@ import {
WORK_HISTROY, WORK_HISTROY,
} from "@/api/api"; } from "@/api/api";
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useRouter } from "vue-router"; import {useRouter} from "vue-router";
import UploadImg from "@/components/img/UploadImg.vue"; import UploadImg from "@/components/img/UploadImg.vue";
import FileTypeImg from "@/components/FileTypeImg.vue"; import FileTypeImg from "@/components/FileTypeImg.vue";
import { useRoute } from "vue-router/dist/vue-router"; import {useRoute} from "vue-router/dist/vue-router";
const fileList = ref([]); const fileList = ref([]);
const uploadRef = ref(); const uploadRef = ref();
const showFileList = ref(0); const showFileList = ref(0);
const state = reactive({ const sbValue = ref({
textarea1: "", content: '',
}); attach: ''
const { textarea1 } = toRefs(state); })
const router = useRouter(); const router = useRouter();
const { const {
query: { courseId: workId, type, id: taskId }, query: {courseId: workId, type, id: taskId},
} = useRoute(); } = useRoute();
const { data } = useRequest(TASK_WORK_DETAIL, { workId, taskId }); const {data} = useRequest(TASK_WORK_DETAIL, {workId, taskId});
const { data: submitList } = useRequest(TASK_WORK_SUBMIT_LIST, { workId }); const {data: submitList} = useRequest(TASK_WORK_SUBMIT_LIST, {workId});
const handleClick = () => { const handleClick = () => {
console.log(sbValue.value)
console.log(fileList)
request(TASK_WORK_COMMIT, { request(TASK_WORK_COMMIT, {
projectOrRouterLogo: type, projectOrRouterLogo: type,
workUploadContent: textarea1.value, workUploadContent: sbValue.value.content,
workUploadAddress: fileList.value.map(e => e.url).join(',') || '',
workId, workId,
taskId, taskId,
}).then((res) => { }).then((res) => {
submitList.value.unshift(res.data); submitList.value.unshift(res.data);
}); });
textarea1.value = ""; sbValue.value.content = "";
};
const textareaInput = (e) => {
state.textarea1 = e;
}; };
function remove(i) { function remove(i) {
@@ -701,25 +700,25 @@ function reUpload(i) {
.allbox1 { .allbox1 {
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(160, 193, 230, 0) 0%, rgba(160, 193, 230, 0) 0%,
rgba(161, 195, 231, 0.2) 100% rgba(161, 195, 231, 0.2) 100%
); );
} }
.allbox2 { .allbox2 {
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(177, 219, 229, 0) 0%, rgba(177, 219, 229, 0) 0%,
rgba(172, 216, 227, 0.2) 100% rgba(172, 216, 227, 0.2) 100%
); );
} }
.allbox3 { .allbox3 {
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(195, 209, 234, 0) 0%, rgba(195, 209, 234, 0) 0%,
rgba(191, 206, 231, 0.2) 100% rgba(191, 206, 231, 0.2) 100%
); );
} }