xy 7 days ago
commit 491e8ba75a
  1. 8
      src/api/index.ts
  2. BIN
      src/assets/images/bg10.png
  3. 50
      src/layout/index.vue
  4. 2
      src/layout/loginPage.vue
  5. 316
      src/layout/studyPage.vue
  6. 2
      src/permissions.ts
  7. 9
      src/utils/request.ts
  8. 7
      src/views/program/index.vue
  9. 56
      src/views/resultsAnnounced/index.vue
  10. 10
      src/views/subjectTest/index.vue

@ -73,4 +73,12 @@ export const getExperiment = ()=>{
url:'/experimental/xnExperimental/selectExperimental',
method:'get',
})
}
// 确认实验
export const submitExperiment = (data:any) => {
return request({
url:'/xnRecords/verifyExperimentaInfo',
method:"POST",
data
})
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1018 B

After

Width:  |  Height:  |  Size: 679 B

@ -2,8 +2,9 @@
<div class="container-bgc">
<div class="top">
<div class="loginBtn">
<p @click="loginFn">{{user.token?'已登录':'登录/注册'}}</p>
<p @click="loginFn">{{ user.token ? "已登录" : "登录/注册" }}</p>
</div>
<div class="title">{{ setting.title }}</div>
</div>
<router-view v-slot="{ Component }">
@ -17,19 +18,25 @@
</template>
<script lang="ts" setup>
import { useRouter } from 'vue-router'
import { useRouter } from "vue-router";
// import { onMounted, reactive, ref, toRefs, watch } from "vue";
import settingStore from "@/store/modules/setting";
import userStore from '@/store/modules/user';
import userStore from "@/store/modules/user";
const user = userStore();
const setting = settingStore();
const router = useRouter()
const router = useRouter();
console.log(setting.title);
user.token ? router.push('/spacePage') : ''
const loginFn=()=>{
router.push('/login')
const loginFn = () => {
// user.token ? router.push("/spacePage") : "";
if(user.token){
router.push("/spacePage")
return
}
router.push("/login");
};
</script>
<style lang="scss" scoped>
@ -58,30 +65,29 @@ const loginFn=()=>{
}
.loginBtn {
position: absolute;
/* 清除浮动影响 */
position: absolute;
/* 清除浮动影响 */
float: left;
/* 向左浮动 */
/* 向左浮动 */
top: 10px;
left: 230px;
border: 1px solid #33FEFE;
left: 230px;
border: 1px solid #33fefe;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 142px;
height: 40px;
line-height: 37px;
background: linear-gradient(to bottom, #08B9C1, #0758B8);
background: linear-gradient(to bottom, #08b9c1, #0758b8);
transform: skew(-30deg);
cursor: pointer;
/* 在X轴方向倾斜 -35 度 */
border-radius: 5%;
p{
transform: skew(30deg);
/* 反向倾斜,抵消父元素的变形 */
font-size: 18px;
color: #fff;
}
/* 在X轴方向倾斜 -35 度 */
border-radius: 5%;
p {
transform: skew(30deg);
/* 反向倾斜,抵消父元素的变形 */
font-size: 18px;
color: #fff;
}
}
}
}
</style>

@ -428,7 +428,7 @@ const login = async () => {
};
const res = await user.logIn(data);
if (res) {
router.push('/')
router.push('/studyPage')
}
};

@ -1,157 +1,223 @@
<template>
<div class="login_container">
<div class="top">
<div class="loginBtn">
<p @click="loginFn">{{ user.token ? '已登录' : '登录/注册' }}</p>
</div>
<div class="title">{{ setting.title }}</div>
</div>
<div class="main-content">
<div class="box" :style="{ backgroundImage: isBox1Clicked ? `url(${btn1})` : `url(${btn2})` }"
@click="handleBoxClick(1)">
知识点学习
</div>
<div class="box" :style="{ backgroundImage: isBox2Clicked ? `url(${btn1})` : `url(${btn2})` }"
@click="handleBoxClick(2)">测试</div>
<div class="box" :style="{ backgroundImage: isBox3Clicked ? `url(${btn1})` : `url(${btn2})` }"
style="margin-bottom: 80px;" @click="handleBoxClick(3)">仿真实验</div>
</div>
<div class="login_container">
<div class="top">
<div class="loginBtn">
<p @click="loginFn">{{ user.token ? "已登录" : "登录/注册" }}</p>
</div>
<div class="submit">
<p @click="submit">提交</p>
</div>
<div class="title">{{ setting.title }}</div>
</div>
<div class="main-content">
<div
class="box"
:style="{
backgroundImage: isBox1Clicked ? `url(${btn1})` : `url(${btn2})`,
}"
@click="handleBoxClick(1)"
>
知识点学习
</div>
<div
class="box"
:style="{
backgroundImage: isBox2Clicked ? `url(${btn1})` : `url(${btn2})`,
}"
@click="handleBoxClick(2)"
>
学习
</div>
<div
class="box"
:style="{
backgroundImage: isBox3Clicked ? `url(${btn1})` : `url(${btn2})`,
}"
style="margin-bottom: 80px"
@click="handleBoxClick(3)"
>
仿真实验
</div>
</div>
</div>
</template>
<script setup lang="ts" name="studyPage">
import { ref } from "vue"
import { useRouter } from 'vue-router'
import { ref } from "vue";
import { useRouter } from "vue-router";
import settingStore from "@/store/modules/setting";
const setting = settingStore();
import userStore from '@/store/modules/user';
import btn1 from '@/assets/images/btn1.png'
import btn2 from '@/assets/images/btn2.png'
console.log(btn1, 'btn1');
const router = useRouter()
import userStore from "@/store/modules/user";
import btn1 from "@/assets/images/btn1.png";
import btn2 from "@/assets/images/btn2.png";
import { submitExperiment } from "@/api";
import { ElMessage } from "element-plus";
const router = useRouter();
const user = userStore();
const loginFn = () => {
router.push('/login')
}
// user.token ? router.push("/spacePage") : "";
if (user.token) {
router.push("/spacePage");
return;
}
router.push("/login");
};
const isBox1Clicked = ref(false);
const isBox2Clicked = ref(false);
const isBox3Clicked = ref(false);
const handleBoxClick = (boxNumber) => {
isBox1Clicked.value = false;
isBox2Clicked.value = false;
isBox3Clicked.value = false;
switch (boxNumber) {
case 1:
isBox1Clicked.value = true;
// router.push('/page1'); // /page1
router.push('/knowledgePage')
break;
case 2:
isBox2Clicked.value = true;
// router.push('/page2');
break;
case 3:
isBox3Clicked.value = true;
// router.push('/page3');
break;
default:
break;
isBox1Clicked.value = false;
isBox2Clicked.value = false;
isBox3Clicked.value = false;
switch (boxNumber) {
case 1:
isBox1Clicked.value = true;
// router.push('/page1'); // /page1
router.push("/knowledgePage");
break;
case 2:
isBox2Clicked.value = true;
router.push("/subjectTest");
break;
case 3:
isBox3Clicked.value = true;
router.push("/");
break;
default:
break;
}
};
const submit = async () => {
await submitExperiment({ getStudyRecords_id: user.userInfo.id }).then(
(res: any) => {
console.log(res);
if (res.code == 500) {
ElMessage.error(res.message);
} else {
ElMessage.success(res.message);
}
}
);
};
</script>
<style lang="less" scoped>
.login_container {
position: relative;
position: relative;
width: 100%;
// height: 1080px;
min-height: 100vh;
background-color: #091d22;
background: url("../assets//images/bg1.png") no-repeat;
background-size: cover;
.top {
width: 100%;
// height: 1080px;
min-height: 100vh;
background-color: #091d22;
background: url("../assets//images/bg1.png") no-repeat;
height: 75px;
text-align: center;
font-size: 42px;
line-height: 75px;
font-style: italic;
background: url("../assets/images/topbgc.png") no-repeat;
// background-position: center bottom -10px;
background-size: cover;
.top {
width: 100%;
height: 75px;
text-align: center;
font-size: 42px;
line-height: 75px;
font-style: italic;
background: url("../assets/images/topbgc.png") no-repeat;
// background-position: center bottom -10px;
background-size: cover;
.title {
color: #fff;
}
.title {
color: #fff;
}
.loginBtn {
position: absolute;
/* 清除浮动影响 */
float: left;
/* 向左浮动 */
top: 10px;
left: 230px;
border: 1px solid #33fefe;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 142px;
height: 40px;
line-height: 37px;
background: linear-gradient(to bottom, #08b9c1, #0758b8);
transform: skew(-30deg);
cursor: pointer;
/* 在X轴方向倾斜 -35 度 */
border-radius: 5%;
.loginBtn {
position: absolute;
/* 清除浮动影响 */
float: left;
/* 向左浮动 */
top: 10px;
left: 230px;
border: 1px solid #33FEFE;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 142px;
height: 40px;
line-height: 37px;
background: linear-gradient(to bottom, #08B9C1, #0758B8);
transform: skew(-30deg);
cursor: pointer;
/* 在X轴方向倾斜 -35 度 */
border-radius: 5%;
p {
transform: skew(30deg);
/* 反向倾斜,抵消父元素的变形 */
font-size: 18px;
color: #fff;
}
}
.submit {
position: absolute;
/* 清除浮动影响 */
// float: right;
/* 向左浮动 */
top: 10px;
right: 230px;
border: 1px solid #33fefe;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
width: 142px;
height: 40px;
line-height: 37px;
background: linear-gradient(to bottom, #08b9c1, #0758b8);
transform: skew(-30deg);
cursor: pointer;
/* 在X轴方向倾斜 -35 度 */
border-radius: 5%;
p {
transform: skew(30deg);
/* 反向倾斜,抵消父元素的变形 */
font-size: 18px;
color: #fff;
}
}
p {
transform: skew(30deg);
/* 反向倾斜,抵消父元素的变形 */
font-size: 18px;
color: #fff;
}
}
}
}
.main-content {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
margin: 0;
// background: url("../assets/images/login.png") no-repeat;
background-position: center;
background-size: 50% auto;
flex-direction: column;
.box {
width: 520px;
height: 162px;
// background-color: #007BFF;
// background: url("../assets/images/btn2.png") no-repeat;
background-repeat: no-repeat;
margin: 30px 0 0 25px;
cursor: pointer;
background-repeat: no-repeat;
background-size: contain;
/* 让图片完整显示在盒子内 */
background-position: center;
/* 图片在盒子中水平和垂直居中 */
display: flex;
/* 使用 flex 布局 */
justify-content: center;
align-items: center;
min-height: 100vh;
margin: 0;
// background: url("../assets/images/login.png") no-repeat;
background-position: center;
background-size: 50% auto;
flex-direction: column;
.box {
width: 520px;
height: 162px;
// background-color: #007BFF;
// background: url("../assets/images/btn2.png") no-repeat;
background-repeat: no-repeat;
margin: 30px 0 0 25px;
cursor: pointer;
background-repeat: no-repeat;
background-size: contain;
/* 让图片完整显示在盒子内 */
background-position: center;
/* 图片在盒子中水平和垂直居中 */
display: flex;
/* 使用 flex 布局 */
justify-content: center;
/* 水平居中 */
// align-items: center;
/* 垂直居中 */
color: white;
/* 设置文字颜色 */
text-align: center;
/* 文本居中对齐 */
font-size: 49px;
font-weight: 700;
line-height: 190px;
}
/* 水平居中 */
// align-items: center;
/* 垂直居中 */
color: white;
/* 设置文字颜色 */
text-align: center;
/* 文本居中对齐 */
font-size: 49px;
font-weight: 700;
line-height: 190px;
}
}
</style>
</style>

@ -6,7 +6,7 @@ const store = userStore(pinia);
router.beforeEach((to: any, from: any, next: any) => {
if (to.path === "/login") {
if (store.token) {
next("/");
next("/studyPage");
} else {
next();
}

@ -2,8 +2,9 @@
import axios from "axios";
import pinia from "@/store";
import { ElMessage } from "element-plus";
import {removeToken} from '@/utils/auth'
import userStore from "@/store/modules/user";
import router from '@/router'
// 创建axios实例
const server = axios.create({
baseURL: import.meta.env.VITE_APP_BASE_API,
@ -26,8 +27,14 @@ server.interceptors.response.use((response) => {
// useuserStore.clearStatus();
// return Promise.reject(response);
}
if(response.data.code=== 401){
ElMessage.error(response.data.message);
return Promise.reject(response);
}
if (response.data.code === 412) {
ElMessage.error(response.data.message);
removeToken()
router.push('/login')
return Promise.reject(response);
}
return response.data;

@ -1391,7 +1391,7 @@ const onSave = async () => {
// console.log(graph.toJSON());
// return;
clearLocalStorage();
clearLocalStorage(false);
const data = graph.toJSON().cells.map((item: any) => {
return {
node: item,
@ -1474,10 +1474,13 @@ function loadFromLocalStorage() {
return JSON.parse(localStorage.getItem(SESSION_KEY) as string) || [];
}
function clearLocalStorage() {
function clearLocalStorage(falg=true) {
localStorage.removeItem(SESSION_KEY);
if(falg){
window.location.reload();
}
}
//
function restoreGraph() {

@ -41,7 +41,7 @@
<div class="bottom">
<img src="@/assets/images/bg10.png"/>
<div class="txt">
{{0}}
错误 {{ 0 }}
</div>
</div>
<div class="bottom">
@ -57,9 +57,8 @@
</div>
</div>
<div class="footer">
<button class="btn1" @click="Study">去学习</button>
<button class="btn2" @click="Recreate">重做</button>
<button class="btn3" @click="Back">回首页</button>
<button class="btn2" @click="Recreate">重做</button>
</div>
</div>
</template>
@ -100,13 +99,13 @@ const Back =()=>{
<style lang="scss" scoped>
.container {
width: 600px;
height: 540px;
height: 550px;
background: url("@/assets/images/bg4.png") no-repeat center center;
background-size: contain;
margin-top: -5px;
padding-top: 15px;
padding-left: 25px;
padding-right:25px;
position: relative; /* 添加相对定位 */
}
.top{
color: #b6b3b3;
@ -160,12 +159,13 @@ const Back =()=>{
}
.bottoms{
display: flex;
height: 28px;
height: 26px;
width: 100%;
position: absolute; /* 绝对定位 */
bottom: 210px;
gap: 90px;
left: 110px;
left: 95px;
// left: 100px;
}
.bottom{
display: flex;
@ -184,25 +184,25 @@ const Back =()=>{
bottom: 15px; /* 置于底部 */
display: flex;
flex-direction: row;
padding-left: 50px;
gap: 50px;
}
.btn1{
background: url("@/assets/images/bg5.png") no-repeat;
background-size: contain;
background-color: transparent; /* 背景颜色设置为透明 */
border: none; /* 移除边框 */
cursor: pointer; /* 鼠标悬停时显示手型 */
width: 120px;
height: auto;
font-size: 17px;
color:rgb(13, 58, 102);
/* 调整文字位置 */
padding: 10px 0 20px; /* 上内边距为 10px,下内边距为 20px */
display: flex; /* 使用 Flexbox 布局 */
align-items: flex-end; /* 文字对齐到底部 */
justify-content: center; /* 文字水平居中 */
}
padding-left: 80px;
gap: 150px;
}
// .btn1{
// background: url("@/assets/images/bg5.png") no-repeat;
// background-size: contain;
// background-color: transparent; /* */
// border: none; /* */
// cursor: pointer; /* */
// width: 120px;
// height: auto;
// font-size: 17px;
// color:rgb(196, 202, 209);
// /* */
// padding: 10px 0 20px; /* 10px 20px */
// display: flex; /* 使 Flexbox */
// align-items: flex-end; /* */
// justify-content: center; /* */
// }
.btn2{
background: url("@/assets/images/bg6.png") no-repeat;
background-size: contain;
@ -212,7 +212,7 @@ const Back =()=>{
width: 120px;
height: auto;
font-size: 17px;
color:rgb(13, 58, 102);
color:rgb(196, 202, 209);
/* 调整文字位置 */
padding: 10px 0 20px; /* 上内边距为 10px,下内边距为 20px */
display: flex; /* 使用 Flexbox 布局 */
@ -228,7 +228,7 @@ const Back =()=>{
width: 120px;
height: auto;
font-size: 17px;
color:rgb(13, 58, 102);
color:rgb(196, 202, 209);
/* 调整文字位置 */
padding: 10px 0 20px; /* 上内边距为 10px,下内边距为 20px */
display: flex; /* 使用 Flexbox 布局 */

@ -12,7 +12,7 @@
<span class="question-count" >{{ currentSum }}</span>
<div class="timer">{{ formattedTime }} </div>
</div>
<p class="questions"><span class="questions-count">10</span></p>
<p class="questions"><span class="questions-count">{{questions.length}}</span></p>
<!-- 遍历题目 -->
<div v-if="currentQuestionIndex < questions.length" class="txt">
<span>{{ currentQuestion }}</span>
@ -157,7 +157,7 @@ import { useRouter } from 'vue-router';
// 退
const router = useRouter()
const resetAnswers = () => {
router.push('/spacePage')
router.push('/studyPage')
};
//
const timer = ref<number | null>(null); // setInterval
@ -276,12 +276,12 @@ import { useRouter } from 'vue-router';
font-size: 55px; /* 数字字体大小 */
}
.timer{
font-size: 19.5px; /* 字体大小 */
font-size: 18px; /* 字体大小 */
letter-spacing: 3px; /* 字符间距 */
text-align: right;
position: absolute; /* 使用绝对定位 */
top: 22%; /* 距离顶部 */
left: 69%; /* 距离左侧 */
top: 25%; /* 距离顶部 */
left: 71.3%; /* 距离左侧 */
}
.questions{
font-size: 23px; /* 字体大小 */

Loading…
Cancel
Save