|
|
|
|
@ -1,7 +1,19 @@ |
|
|
|
|
<template> |
|
|
|
|
<!-- <Draggable |
|
|
|
|
v-slot="{ x, y }" |
|
|
|
|
p="x-4 y-2" |
|
|
|
|
border="~ gray-400/30 rounded" |
|
|
|
|
shadow="~ hover:lg" |
|
|
|
|
class="fixed bg-$vp-c-bg select-none z-24" |
|
|
|
|
:initial-value="{ x: innerWidth / 3.6, y: 240 }" |
|
|
|
|
:prevent-default="true" |
|
|
|
|
:handle="handle" |
|
|
|
|
> --> |
|
|
|
|
<div v-if="!hidePanel" |
|
|
|
|
:class="['panel', { active: visible }]" |
|
|
|
|
id="panel"> |
|
|
|
|
id="panel" |
|
|
|
|
ref="container" |
|
|
|
|
:style="style"> |
|
|
|
|
<el-container class="scrollbar" |
|
|
|
|
id="container" |
|
|
|
|
v-show="visible"> |
|
|
|
|
@ -203,15 +215,24 @@ |
|
|
|
|
</el-container> |
|
|
|
|
</el-container> |
|
|
|
|
|
|
|
|
|
<div class="toggle-panel absolute w-[40px] h-[175px] bg-[url('@/assets/images/panel/right.png')] bg-[length:100%_100%] bg-no-repeat cursor-pointer" |
|
|
|
|
<div :class="['toggle absolute top-[200px] text-center', visible ? 'top-[35%] left-[100%]' : '']"> |
|
|
|
|
<el-icon class="cursor-pointer" |
|
|
|
|
color="#f1772b" |
|
|
|
|
:size="24"> |
|
|
|
|
<Rank id="toggle" /> |
|
|
|
|
</el-icon> |
|
|
|
|
<div class="toggle-panel w-[40px] h-[175px] bg-[length:100%_100%] bg-no-repeat cursor-pointer" |
|
|
|
|
:class="{ active: visible }" |
|
|
|
|
ref="handle" |
|
|
|
|
@click="visible = !visible"></div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- </Draggable> --> |
|
|
|
|
<div v-if="isSubmit && !isReport" |
|
|
|
|
class="z-[199] fixed top-[64px] right-0 bottom-0 left-0 bg-[rgba(0,0,0,.3)]"></div> |
|
|
|
|
</template> |
|
|
|
|
<script setup lang="ts"> |
|
|
|
|
import { ref, reactive, onMounted, toRefs, computed, watch } from 'vue'; |
|
|
|
|
import { ref, reactive, onMounted, inject, computed, watch } from 'vue'; |
|
|
|
|
import { submitOpe } from '@/api/bank'; |
|
|
|
|
import { deleteCache } from '@/api/judgment'; |
|
|
|
|
import { pageStuAssessment, getProjectBySystemId, getProjectDetail, getDetailById, getCompetition } from '@/api/system'; |
|
|
|
|
@ -219,12 +240,13 @@ import Settings from '@/settings'; |
|
|
|
|
import { useRouter, useRoute } from 'vue-router'; |
|
|
|
|
import type { Action } from 'element-plus'; |
|
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus'; |
|
|
|
|
import { Close, Check } from '@element-plus/icons-vue'; |
|
|
|
|
import { Close, Check, Rank } from '@element-plus/icons-vue'; |
|
|
|
|
import dayjs from 'dayjs'; |
|
|
|
|
import Cookies from 'js-cookie'; |
|
|
|
|
import { mavonEditor } from 'mavon-editor'; |
|
|
|
|
import 'mavon-editor/dist/css/index.css'; |
|
|
|
|
import '@vueup/vue-quill/dist/vue-quill.snow.css'; |
|
|
|
|
import { useDraggable } from '@vueuse/core'; |
|
|
|
|
|
|
|
|
|
const router = useRouter(); |
|
|
|
|
const route = useRoute(); |
|
|
|
|
@ -254,6 +276,20 @@ const pannelTab = ref<string>('first'); |
|
|
|
|
const statusTimer = ref<any>(null); |
|
|
|
|
const reportId = ref<string | number>(''); |
|
|
|
|
const countVal = ref<any>(''); |
|
|
|
|
const getLevel = ref(); |
|
|
|
|
const container = ref<HTMLElement | null>(null); |
|
|
|
|
const handle = ref<HTMLElement | null>(null); |
|
|
|
|
// 实验面板拖拽 |
|
|
|
|
const { x, y, style } = useDraggable(container, { |
|
|
|
|
initialValue: { x: 0, y: 200 }, |
|
|
|
|
stopPropagation: true, |
|
|
|
|
// exact: true, |
|
|
|
|
handle: handle.value, |
|
|
|
|
onStart(position, e) { |
|
|
|
|
const { id } = e.target; |
|
|
|
|
if (id !== 'panelHeader' && id !== 'toggle') return false; |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
if (param.token) { |
|
|
|
|
// 从url带进来的参数，存cookie里，其他页面直接取cookie |
|
|
|
|
@ -404,11 +440,19 @@ const getCompetitionStatus = async () => { |
|
|
|
|
}; |
|
|
|
|
// 项目选择回调 |
|
|
|
|
const selectProject = () => { |
|
|
|
|
Cookies.set('sand-projectId', param.projectId); |
|
|
|
|
getProDetail(); |
|
|
|
|
setSubmit(false); |
|
|
|
|
countVal.value = 0; |
|
|
|
|
grade.value = '00'; |
|
|
|
|
pannelTab.value = 'first'; |
|
|
|
|
reload(); |
|
|
|
|
// 在选择关卡的页面，直接刷新；否则调选择关卡页的获取关卡接口 |
|
|
|
|
if (route.path === '/') { |
|
|
|
|
location.reload(); |
|
|
|
|
} else { |
|
|
|
|
getLevel.value && getLevel.value(); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
// 查看实验报告 |
|
|
|
|
const toReport = () => { |
|
|
|
|
@ -539,6 +583,7 @@ const getList = async () => { |
|
|
|
|
getProDetail(); |
|
|
|
|
}; |
|
|
|
|
onMounted(() => { |
|
|
|
|
getLevel.value = inject('getLevel'); // 关卡页面获取关卡方法 |
|
|
|
|
per.value = param.assessmentId ? 1 : param.competitionId ? 2 : 0; |
|
|
|
|
if (param.assessmentId) { |
|
|
|
|
getAssList(); |
|
|
|
|
@ -747,9 +792,9 @@ onMounted(() => { |
|
|
|
|
width: 0; |
|
|
|
|
height: 0; |
|
|
|
|
.toggle-panel { |
|
|
|
|
@apply top-[200px]; |
|
|
|
|
@apply bg-[url('@/assets/images/panel/right.png')]; |
|
|
|
|
&.active { |
|
|
|
|
@apply top-[35%] left-[100%] bg-[url('@/assets/images/panel/left.png')]; |
|
|
|
|
@apply bg-[url('@/assets/images/panel/left.png')]; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
&.active { |
|
|
|
|
|
