Merge branch 'main' of http://182.92.169.222:3000/dlsx/virtualSimulation
commit
7dda839937
23 changed files with 1308 additions and 222 deletions
@ -1,14 +1,60 @@ |
||||
import request from '@/utils/request' |
||||
import request from "@/utils/request"; |
||||
|
||||
export const login = (data: any) => { |
||||
return request({ |
||||
url: '/sys/login', |
||||
method: 'post', |
||||
data |
||||
}) |
||||
} |
||||
return request({ |
||||
url: "/sys/login", |
||||
method: "post", |
||||
data, |
||||
}); |
||||
}; |
||||
export const getCode = (time: any) => { |
||||
return request({ |
||||
url: "/sys/randomImage/" + time, |
||||
}); |
||||
}; |
||||
// 获取用户信息
|
||||
export const getUserInfo = () => { |
||||
return request({ |
||||
url: "/sys/user/getUserInfo", |
||||
method: "get", |
||||
}); |
||||
}; |
||||
|
||||
// 实验步骤
|
||||
export const setStep = (params: any) => { |
||||
return request({ |
||||
url: "/experimentrecords/xnExperimentRecords/check", |
||||
method: "get", |
||||
params |
||||
}) |
||||
} |
||||
// 获取步骤id
|
||||
export const getStepId = () => { |
||||
return request({ |
||||
url: "/experimentrecords/xnExperimentRecords/getProcedureList", |
||||
method: "get", |
||||
|
||||
}) |
||||
} |
||||
//试题表
|
||||
export const subTestapi = () => { |
||||
return request({ |
||||
url: '/sys/randomImage/' + time, |
||||
url: '/questions/xnQuestions/api/list', |
||||
method: 'get', |
||||
}) |
||||
} |
||||
} |
||||
//试题回答检查
|
||||
export const checkapi = (params:any)=> { |
||||
return request({ |
||||
url: '/questionrecords/xnQuestionRecords/check', |
||||
method: 'get', |
||||
params |
||||
}) |
||||
} |
||||
//获取实验目标
|
||||
export const getExperiment = ()=>{ |
||||
return request({ |
||||
url:'/experimental/xnExperimental/selectExperimental', |
||||
method:'get', |
||||
}) |
||||
} |
||||
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 44 KiB |
@ -0,0 +1,12 @@ |
||||
// 格式化时间 年月日时分秒
|
||||
export function formatDate(date: any) { |
||||
const year = date.getFullYear(); |
||||
const month = String(date.getMonth() + 1).padStart(2, "0"); |
||||
const day = String(date.getDate()).padStart(2, "0"); |
||||
const hours = String(date.getHours()).padStart(2, "0"); |
||||
const minutes = String(date.getMinutes()).padStart(2, "0"); |
||||
const seconds = String(date.getSeconds()).padStart(2, "0");
|
||||
console.log(`${year}-${month}-${day} ${hours}:${minutes}:${seconds}`); |
||||
|
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
import { setStep, getStepId } from "../api/index"; |
||||
import settingStore from "../store/modules/setting"; |
||||
import pinia from "@/store"; |
||||
const useStore = settingStore(pinia); |
||||
export const setStepEvent = async (step: number, controlsSt: string) => { |
||||
let id: any = null; |
||||
if (!useStore.stepIds) { |
||||
const data: any = await getStepId(); |
||||
useStore.stepIds = data.result.map((item: any) => item.id); |
||||
id = useStore.stepIds[step - 1]; |
||||
// return id;
|
||||
await setStep({ id, controlsSt }); |
||||
} else { |
||||
await setStep({ id: useStore.stepIds[step - 1], controlsSt }); |
||||
} |
||||
}; |
||||
@ -0,0 +1,77 @@ |
||||
<template> |
||||
<div class="container"> |
||||
<div class="main"> |
||||
<!-- <pre><code ref="editor" class="edit-text html" contenteditable="true" @input="highlightCode">console.log('Hello, World!');</code></pre> --> |
||||
<div class="edit-text" contenteditable="true" spellcheck="false"> |
||||
<!-- <highlightjs ref="editor" :language="language" :code="code" v-model="code" contenteditable="true" @input="highlightCode"></highlightjs> --> |
||||
oisafkahsdkjfhasdf sdfhkjsahfdlkjas \n /n sldhfkajshfd salkdhflkasf asfasdf |
||||
</div> |
||||
</div> |
||||
<div class="setting"> |
||||
<el-button>保存</el-button> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { onMounted, ref } from "vue"; |
||||
|
||||
import hljs from "highlight.js/lib/core"; |
||||
|
||||
const editor = ref(null); |
||||
const code = ref('console.log("Hello, World!");'); |
||||
const highlightCode = () => { |
||||
const codeBlock = editor.value; |
||||
console.log(codeBlock); |
||||
|
||||
if (codeBlock) { |
||||
hljs.highlightElement(code); |
||||
} |
||||
}; |
||||
|
||||
onMounted(() => { |
||||
// highlightCode(); |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.container { |
||||
width: 100%; |
||||
height: 100vh; |
||||
display: flex; |
||||
justify-content: center; |
||||
margin-top: 100px; |
||||
/* position: relative; */ |
||||
} |
||||
|
||||
.main { |
||||
width: 1442px; |
||||
height: 753px; |
||||
background-color: pink; |
||||
background: url("../../assets/images/idea.png") no-repeat; |
||||
background-size: contain; |
||||
background-position: center center; |
||||
position: relative; |
||||
} |
||||
|
||||
.edit-text { |
||||
position: absolute; |
||||
left: 410px; |
||||
top: 60px; |
||||
width: 700px; |
||||
height: 670px; |
||||
background-color: #1e1e1e; |
||||
color: #fff; |
||||
font-family: "Courier New", monospace; |
||||
padding: 10px; |
||||
border-radius: 5px; |
||||
overflow: auto; |
||||
outline: none; |
||||
line-height: 30px; |
||||
} |
||||
.setting{ |
||||
position: absolute; |
||||
top: 20px; |
||||
right: 100px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,167 @@ |
||||
<template> |
||||
<div class="container-bgc"> |
||||
<div class="top"> |
||||
<div class="title">{{ setting.title }}</div> |
||||
</div> |
||||
<!-- 右边箭头 --> |
||||
<button class="submit-right" @click="SubRight"></button> |
||||
<!-- 左边按钮 --> |
||||
<button class="submit-left" @click="SubLeft"></button> |
||||
<div class="question-body"> |
||||
<div class="question" >实验目标</div> |
||||
<el-scrollbar height="330px"> <div class="txt" v-html="Text"></div> </el-scrollbar> |
||||
</div> |
||||
<div class="submit-buttons"> |
||||
<!-- <button class="submit-btn" @click="reset">退出</button> --> |
||||
<!-- <button class="submit-btn" @click="enter">进入仿真实验</button> --> |
||||
<router-link class="submit-btn" to="">退出</router-link> |
||||
<router-link class="submit-btn" to="/program">进入仿真实验</router-link> |
||||
</div> |
||||
|
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import settingStore from "@/store/modules/setting"; |
||||
import {getExperiment} from '@/api/index' |
||||
import { ref,computed,onMounted, onUnmounted} from "vue" |
||||
import { useRouter } from 'vue-router'; |
||||
const setting = settingStore(); |
||||
//左箭头 |
||||
const SubLeft =()=>{ |
||||
|
||||
} |
||||
//右箭头 |
||||
const SubRight =()=>{ |
||||
|
||||
} |
||||
|
||||
const Text = ref() |
||||
const getContent = async()=>{ |
||||
const res:any = await getExperiment(); |
||||
// console.log(res.result.purposeRequirements,'res') |
||||
Text.value = res.result.purposeRequirements |
||||
console.log(Text.value); |
||||
|
||||
} |
||||
|
||||
onMounted(() => {getContent()}); |
||||
|
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.container-bgc { |
||||
position: relative; |
||||
width: 100%; |
||||
// height: 1000px; |
||||
min-height: 100vh; |
||||
// background-color: #091d22; |
||||
background: url("@/assets/images/bg3.png") no-repeat; |
||||
background-size: cover; |
||||
|
||||
.submit-right{ |
||||
background: url("@/assets/images/right.png") no-repeat; |
||||
background-size: contain; |
||||
width: 60px; /* 按钮宽度 */ |
||||
height: 60px; /* 按钮高度 */ |
||||
border: none; |
||||
cursor: pointer; |
||||
position: absolute; |
||||
right: 0; /* 紧靠右部 */ |
||||
top: 40%; /* 垂直居中*/ |
||||
} |
||||
.submit-left{ |
||||
background: url("@/assets/images/left.png") no-repeat; |
||||
background-size: contain; |
||||
width: 60px; /* 按钮宽度 */ |
||||
height: 60px; /* 按钮高度 */ |
||||
border: none; |
||||
cursor: pointer; |
||||
position: absolute; |
||||
left: 0; /* 紧靠左部 */ |
||||
top: 40%; /* 垂直居中*/ |
||||
} |
||||
|
||||
.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-size: cover; |
||||
|
||||
.title { |
||||
color: #fff; |
||||
} |
||||
} |
||||
|
||||
.question-body { |
||||
background: url("@/assets/images/FakeAnimateForPrototype.png") no-repeat center center; /* 添加 background-position */ |
||||
background-size: contain; /* 确保背景图片覆盖整个元素 */ |
||||
width: 1100px; /* 100% 宽度以确保背景图片完全显示 */ |
||||
height: 500px; /* 固定高度 */ |
||||
margin-top: 100px; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
padding-left: 50px; |
||||
padding-right: 50px; |
||||
padding-top: 30px; |
||||
|
||||
.question{ |
||||
font-size: 42px; /* 字体大小 */ |
||||
text-align: center; /* 水平居中 */ |
||||
letter-spacing: 3px; /* 字符间距，单位可以是 px、em 等 */ |
||||
margin-bottom: 30px; |
||||
color: #fff; |
||||
} |
||||
.scrollbar-demo-item { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
height: 50px; |
||||
margin: 10px; |
||||
text-align: center; |
||||
border-radius: 4px; |
||||
background: var(--el-color-primary-light-9); |
||||
color: var(--el-color-primary); |
||||
} |
||||
.txt { |
||||
margin-top: 18px; |
||||
margin-left: 20px; |
||||
margin-right: 20px; |
||||
font-size: 18px; /* 字体大小 */ |
||||
font-family: Consolas, sans-serif; /* 字体样式 */ |
||||
letter-spacing: 1.5px; /* 字符间距，单位可以是 px、em 等 */ |
||||
line-height: 1.5; /* 行间距，1.5 表示字体大小的 1.5 倍 */ |
||||
color: #9b9a9a; |
||||
} |
||||
} |
||||
.submit-buttons { |
||||
display: flex; /* 使用 Flexbox 布局 */ |
||||
flex-direction: row; /* 水平排列按钮 */ |
||||
justify-content: center; /* 水平居中 */ |
||||
gap: 450px; /* 按钮之间的间距 */ |
||||
margin-top: 50px; |
||||
} |
||||
|
||||
.submit-btn { |
||||
background: url("@/assets/images/Button.png") center; |
||||
background-size: contain; /* 确保背景图片覆盖整个元素 */ |
||||
background-color: transparent; /* 背景颜色设置为透明 */ |
||||
border: none; /* 移除边框 */ |
||||
cursor: pointer; /* 鼠标悬停时显示手型 */ |
||||
width: 300px; |
||||
height: 41px; |
||||
font-size: 17px; |
||||
font-weight: bold; /* 文字加粗 */ |
||||
color: #fff; |
||||
display: flex; |
||||
align-items: center; /* 垂直居中 */ |
||||
justify-content: center; /* 水平居中 */ |
||||
text-decoration: none |
||||
} |
||||
|
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue