实验报告

20240205 20230705
yujialong 2 years ago
parent 2cf63091a1
commit a823365509
  1. 15
      src/App.vue
  2. 174
      src/components/case/index.vue
  3. 44
      src/components/selectBusiness/index.vue
  4. 18
      src/layouts/header/index.vue
  5. 70
      src/pages/index/list/index.vue
  6. 231
      src/pages/report/index.vue

@ -1,6 +1,8 @@
<template> <template>
<div id="app"> <div id="app">
<select-business class="selectBusiness" :showIt.sync="showIt" v-show="!showIt && showBusiness" /> <select-business class="selectBusiness"
:showIt.sync="showIt"
v-show="!showIt && showBusiness" />
<router-view></router-view> <router-view></router-view>
<vCase :showIt.sync="showIt"></vCase> <vCase :showIt.sync="showIt"></vCase>
<tip-dialog class="Z-9999" /> <tip-dialog class="Z-9999" />
@ -53,12 +55,14 @@
watch: { watch: {
showIt: { showIt: {
handler (newVal) { handler (newVal) {
if(!newVal && !this.businessKey) { console.log("🚀 ~ file: App.vue:58 ~ handler ~ newVal:", newVal, this.businessKey, sessionStorage.getItem('submited'))
if (!newVal && !this.businessKey && !sessionStorage.getItem('submited')) {
this.setShowBusiness(true) this.setShowBusiness(true)
} else { } else {
if (!newVal) { if (!newVal) {
// //
if(!this.businessKey) { if (!this.businessKey && !sessionStorage.getItem('submited')) {
console.log("🚀 ~ file: App.vue:65 ~ handler ~ submited:", sessionStorage.getItem('submited'))
this.$nextTick(() => { this.setShowBusiness(true) }) this.$nextTick(() => { this.setShowBusiness(true) })
} else { } else {
// this.setTipsOperate('' + this.businessKey + ','); // this.setTipsOperate('' + this.businessKey + ',');
@ -91,8 +95,9 @@
height: 100%; height: 100%;
} }
.fade-enter-active, .fade-leave-active { .fade-enter-active,
transition: opacity .5s; .fade-leave-active {
transition: opacity 0.5s;
} }
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ { .fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0; opacity: 0;

@ -5,20 +5,25 @@
<el-container v-show="showIt"> <el-container v-show="showIt">
<el-header> <el-header>
<div class="flex a-center j-between"> <div class="flex a-center j-between">
<div class="flex a-center" style="width: 28%"> <div class="flex a-center"
style="width: 28%">
<p>实训项目</p> <p>实训项目</p>
<el-select v-model.trim="projectId" placeholder="请选择" class="select" :disabled="projectPermissions != 0" @change="selectProject"> <el-select v-model.trim="projectId"
<el-option placeholder="请选择"
v-for="item in topicList" class="select"
:disabled="projectPermissions != 0"
@change="selectProject">
<el-option v-for="item in topicList"
:key="item.projectId" :key="item.projectId"
:label="item.projectName" :label="item.projectName"
:value="item.projectId" :value="item.projectId"></el-option>
></el-option>
</el-select> </el-select>
</div> </div>
<div class="countDownBox"> <div class="countDownBox">
<div style="margin-left: -40px;"> <div style="margin-left: -40px;">
<div :sendSync="sendSync" :autoStart="autoStart" :defaultVal="defaultVal"> <div :sendSync="sendSync"
:autoStart="autoStart"
:defaultVal="defaultVal">
实训{{text}}时间 实训{{text}}时间
<span class="timeSpan">{{day}}</span> <span class="timeSpan">{{day}}</span>
<span class="timeSpan">{{hour}}</span>小时 <span class="timeSpan">{{hour}}</span>小时
@ -34,19 +39,25 @@
</div> </div>
</div> </div>
<div> <div>
<!-- <el-button @click="toReport" v-if="popContainer">查看实验报告</el-button> --> <el-button @click="toReport"
<el-button style="background: #202020;color: #d0d0d0;font-size:16px;" v-show="projectPermissions == 0" v-if="popContainer">查看实验报告</el-button>
@click="reload" :disabled="popContainer && (assessmentId!='' && assessmentId!='null' && assessmentId!=null)"> <el-button style="background: #202020;color: #d0d0d0;font-size:16px;"
v-show="projectPermissions == 0"
@click="reload"
:disabled="popContainer && (assessmentId!='' && assessmentId!='null' && assessmentId!=null)">
重新开始 重新开始
</el-button> </el-button>
<el-button class="submit-btn" style="margin-right:7px" @click="Submit()" :disabled="popContainer || requires.length == 0">提交</el-button> <el-button class="submit-btn"
style="margin-right:7px"
@click="Submit()"
:disabled="popContainer || requires.length == 0">提交</el-button>
</div> </div>
</div> </div>
</el-header> </el-header>
<el-container> <el-container>
<el-aside width="30%" class="flex flex-col"> <el-aside width="30%"
class="flex flex-col">
<div class="aside-header"> <div class="aside-header">
<div class="header_h flex a-center"> <div class="header_h flex a-center">
<i class="el-icon-s-order"></i> <i class="el-icon-s-order"></i>
@ -54,7 +65,9 @@
</div> </div>
<div class="font_css"> <div class="font_css">
<div class="experimentalGoal"> <div class="experimentalGoal">
<div class="break-all" v-html="projectManage.experimentTarget" style="font-size: 0.875rem;"> <div class="break-all"
v-html="projectManage.experimentTarget"
style="font-size: 0.875rem;">
</div> </div>
</div> </div>
</div> </div>
@ -68,27 +81,37 @@
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-card shadow="hover"> <el-card shadow="hover">
<el-table :data="requires" height="43.5vh" v-loading="loading" ref='testTable'> <el-table :data="requires"
height="43.5vh"
v-loading="loading"
ref='testTable'>
<el-table-column type="index"></el-table-column> <el-table-column type="index"></el-table-column>
<el-table-column prop="name" label="判分点" align="left"> <el-table-column prop="name"
label="判分点"
align="left">
</el-table-column> </el-table-column>
<el-table-column prop="score" label="分值" width="60" align="center"> <el-table-column prop="score"
label="分值"
width="60"
align="center">
</el-table-column> </el-table-column>
<el-table-column prop="right" label="完成结果" width="80" align="center"> <el-table-column prop="right"
label="完成结果"
width="80"
align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<i <i v-if="scope.row.right==true"
v-if="scope.row.right==true"
class="el-icon-check" class="el-icon-check"
style="color:green;" style="color:green;"></i>
></i> <i v-else-if="scope.row.right==false"
<i
v-else-if="scope.row.right==false"
class="el-icon-close" class="el-icon-close"
style="color:red;" style="color:red;"></i>
></i>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="scores" label="得分" width="60" align="center"></el-table-column> <el-table-column prop="scores"
label="得分"
width="60"
align="center"></el-table-column>
</el-table> </el-table>
</el-card> </el-card>
</el-col> </el-col>
@ -97,24 +120,36 @@
</div> </div>
</el-aside> </el-aside>
<el-main> <el-main>
<el-tabs v-model.trim="activeName" type="card"> <el-tabs v-model.trim="activeName"
<el-tab-pane label="案例" name="first"> type="card">
<div class="break-all" v-html="projectManage.experimentDescription"></div> <el-tab-pane label="案例"
name="first">
<div class="break-all"
v-html="projectManage.experimentDescription"></div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="实验要求" name="second"> <el-tab-pane label="实验要求"
<el-collapse :value="activeNames" accordion > name="second">
<el-collapse-item v-for="(item,index) in requires" :key="index" :name="item.id"> <el-collapse :value="activeNames"
<template slot="title" style='line-height: 0px;'> accordion>
<el-collapse-item v-for="(item,index) in requires"
:key="index"
:name="item.id">
<template slot="title"
style='line-height: 0px;'>
<i class='el-icon-s-ticket'></i> <i class='el-icon-s-ticket'></i>
<span style="margin: 0px 10px;font-size: 1rem;">{{ item.name }}</span> <span style="margin: 0px 10px;font-size: 1rem;">{{ item.name }}</span>
</template> </template>
<div class="break-all" v-html="item.experimentalRequirements"></div> <div class="break-all"
v-html="item.experimentalRequirements"></div>
</el-collapse-item> </el-collapse-item>
<!-- <p ref="scrollTag" style="font-size:16px;"></p> --> <!-- <p ref="scrollTag" style="font-size:16px;"></p> -->
</el-collapse> </el-collapse>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="实验提示" name="fifth" v-if="hintOpen == 0"> <el-tab-pane label="实验提示"
<div class="break-all" v-html="projectManage.experimentHint"></div> name="fifth"
v-if="hintOpen == 0">
<div class="break-all"
v-html="projectManage.experimentHint"></div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-main> </el-main>
@ -122,26 +157,32 @@
</el-container> </el-container>
<!-- </transition> --> <!-- </transition> -->
<!-- </div> --> <!-- </div> -->
<div class="panel" :class="{active: showIt}"> <div class="panel"
:class="{active: showIt}">
<div @click="toggleCase"> <div @click="toggleCase">
<img src="../../assets/img/case/left.png" alt v-if="showIt" /> <img src="../../assets/img/case/left.png"
<img src="../../assets/img/case/right.png" alt v-else /> alt
v-if="showIt" />
<img src="../../assets/img/case/right.png"
alt
v-else />
</div> </div>
</div> </div>
<div class='popContainer' v-if='popContainer'></div> <div class='popContainer'
v-if='popContainer'></div>
<!-- 遮罩层 --> <!-- 遮罩层 -->
<div class="absolute z-50 h-screen bg-transparent inset-0" v-show="showIt"></div> <div class="absolute z-50 h-screen bg-transparent inset-0"
v-show="showIt"></div>
<el-dialog <el-dialog title="提示"
title="提示"
:visible.sync="closePaneJudge" :visible.sync="closePaneJudge"
width="30%" width="30%"
center> center>
<h4 class="antialiased text-center text-2xl">请选择你将进行的操作</h4> <h4 class="antialiased text-center text-2xl">请选择你将进行的操作</h4>
<span slot="footer" class="dialog-footer"> <span slot="footer"
class="dialog-footer">
<el-button @click="closePane()">再试一次</el-button> <el-button @click="closePane()">再试一次</el-button>
<!-- <el-button type="primary" @click="closePane(true)">其他业务</el-button> --> <!-- <el-button type="primary" @click="closePane(true)">其他业务</el-button> -->
</span> </span>
@ -223,7 +264,6 @@ export default {
schoolId: '', schoolId: '',
studentId: "", studentId: "",
courseId: "", courseId: "",
// projectId: "",
assessmentId: "", assessmentId: "",
classId: '', classId: '',
projectPermissions: 0, //(0 1 2) projectPermissions: 0, //(0 1 2)
@ -322,16 +362,6 @@ export default {
}, },
}, },
mounted () { mounted () {
// let token = this.getQueryVariable('token')
// let cid = this.getQueryVariable('cid')
// let systemId = this.getQueryVariable('systemId')
// let projectId = this.getQueryVariable('projectId')
// let assessmentId = this.getQueryVariable('assessmentId')
// let competitionId = this.getQueryVariable('competitionId')
// let stageId = this.getQueryVariable('stageId')
// let teamId = this.getQueryVariable('teamId')
// let classId = this.getQueryVariable('classId')
// let stopTime = this.getQueryVariable('stopTime')
let token = sessionStorage.getItem('token') || this.getQueryVariable('token') let token = sessionStorage.getItem('token') || this.getQueryVariable('token')
let cid = sessionStorage.getItem('cid') || this.getQueryVariable('cid') let cid = sessionStorage.getItem('cid') || this.getQueryVariable('cid')
let systemId = sessionStorage.getItem('systemId') || this.getQueryVariable('systemId') let systemId = sessionStorage.getItem('systemId') || this.getQueryVariable('systemId')
@ -341,7 +371,7 @@ export default {
} else { } else {
projectId = this.getQueryVariable('projectId') projectId = this.getQueryVariable('projectId')
} }
console.log(projectId) console.log('mounted', projectId)
let assessmentId = sessionStorage.getItem('assessmentId') || this.getQueryVariable('assessmentId') let assessmentId = sessionStorage.getItem('assessmentId') || this.getQueryVariable('assessmentId')
let competitionId = sessionStorage.getItem('competitionId') || this.getQueryVariable('competitionId') let competitionId = sessionStorage.getItem('competitionId') || this.getQueryVariable('competitionId')
let stageId = sessionStorage.getItem('stageId') || this.getQueryVariable('stageId') let stageId = sessionStorage.getItem('stageId') || this.getQueryVariable('stageId')
@ -380,10 +410,9 @@ export default {
this.assessmentId && this.projectId && this.checkVer() this.assessmentId && this.projectId && this.checkVer()
this.codeId && this.codeIds.push(this.codeId) this.codeId && this.codeIds.push(this.codeId)
if (JSON.parse(assessmentId != null && assessmentId != '' && assessmentId != 'null' || this.competitionId)) { if (JSON.parse(assessmentId != null && assessmentId != '' && assessmentId != 'null' || this.competitionId)) {
let params = { this.selectProjects({
"projectId":projectId, projectId
} })
this.selectProjects(params)
} else { } else {
this.getData() this.getData()
} }
@ -404,6 +433,7 @@ export default {
let classId = sessionStorage.getItem('classId') let classId = sessionStorage.getItem('classId')
let timestamp = sessionStorage.getItem('timestamp') let timestamp = sessionStorage.getItem('timestamp')
let startTime = sessionStorage.getItem('startTime') let startTime = sessionStorage.getItem('startTime')
const storeProjectId = sessionStorage.getItem('storeProjectId') const storeProjectId = sessionStorage.getItem('storeProjectId')
sessionStorage.clear() sessionStorage.clear()
sessionStorage.setItem('token', token) sessionStorage.setItem('token', token)
@ -626,6 +656,7 @@ export default {
sessionStorage.setItem('accountVoucher', JSON.stringify(formList)) sessionStorage.setItem('accountVoucher', JSON.stringify(formList))
sessionStorage.setItem('accountPasswordAll', '') sessionStorage.setItem('accountPasswordAll', '')
sessionStorage.setItem('projectId', this.projectId) sessionStorage.setItem('projectId', this.projectId)
sessionStorage.setItem('submited', 0)
getProjectDetail(params).then((data) => { getProjectDetail(params).then((data) => {
if (data.status == 200) { if (data.status == 200) {
const { systemId, projectId } = data.data.projectManage const { systemId, projectId } = data.data.projectManage
@ -671,8 +702,8 @@ export default {
}, },
// //
toReport () { toReport () {
// this.lockIt = false this.popContainer = false
this.setShowBusiness(false) // this.setShowBusiness(false)
this.$emit('update:showIt', !this.showIt) this.$emit('update:showIt', !this.showIt)
this.$router.push(`/index/report?reportId=${this.reportId}`) this.$router.push(`/index/report?reportId=${this.reportId}`)
}, },
@ -754,6 +785,7 @@ export default {
sessionStorage.setItem('ruleReqs', JSON.stringify(formList)) sessionStorage.setItem('ruleReqs', JSON.stringify(formList))
sessionStorage.setItem('accountVoucher', JSON.stringify(formList)) sessionStorage.setItem('accountVoucher', JSON.stringify(formList))
sessionStorage.setItem('accountPasswordAll', '') sessionStorage.setItem('accountPasswordAll', '')
sessionStorage.setItem('submited', 1)
let list = this.requires let list = this.requires
this.grade = retMap.totalScore this.grade = retMap.totalScore
for (var j = 0; j < list.length; j++) { for (var j = 0; j < list.length; j++) {
@ -874,6 +906,7 @@ export default {
sessionStorage.setItem('ruleReqs', JSON.stringify(formList)) sessionStorage.setItem('ruleReqs', JSON.stringify(formList))
sessionStorage.setItem('accountVoucher', JSON.stringify(formList)) sessionStorage.setItem('accountVoucher', JSON.stringify(formList))
sessionStorage.setItem('accountPasswordAll', '') sessionStorage.setItem('accountPasswordAll', '')
sessionStorage.setItem('submited', 0)
let params = { let params = {
"projectId": projectId, "projectId": projectId,
} }
@ -1003,7 +1036,8 @@ $togetherFontSize: 16px;
.el-aside { .el-aside {
font-size: $togetherFontSize; font-size: $togetherFontSize;
color: #333; color: #333;
[class*=" el-icon-"],[class^="el-icon-"]{ [class*=' el-icon-'],
[class^='el-icon-'] {
line-height: 40px; line-height: 40px;
font-size: 16px; font-size: 16px;
font-size: $togetherFontSize; font-size: $togetherFontSize;
@ -1023,7 +1057,7 @@ $togetherFontSize: 16px;
.aside-header { .aside-header {
margin: 0px 10px 10px 10px; margin: 0px 10px 10px 10px;
background-color: #fff; background-color: #fff;
font-size: .875rem; font-size: 0.875rem;
} }
.aside-footer { .aside-footer {
margin: 0px 10px 10px 10px; margin: 0px 10px 10px 10px;
@ -1059,7 +1093,7 @@ $togetherFontSize: 16px;
line-height: 60px; line-height: 60px;
} }
.el-select__caret:before { .el-select__caret:before {
content: "\e78f"; content: '\e78f';
font-size: 16px; font-size: 16px;
padding: 3px; padding: 3px;
background-color: $main-color; background-color: $main-color;
@ -1144,7 +1178,8 @@ $togetherFontSize: 16px;
font-weight: 100; font-weight: 100;
} }
} }
th,tr{ th,
tr {
background-color: #badfff; background-color: #badfff;
} }
} }
@ -1154,7 +1189,7 @@ $togetherFontSize: 16px;
} }
} }
/deep/ .el-collapse { /deep/ .el-collapse {
font-size: .875rem; font-size: 0.875rem;
} }
.el-collapse-item__content { .el-collapse-item__content {
padding-left: 10px; padding-left: 10px;
@ -1207,7 +1242,6 @@ $togetherFontSize: 16px;
height: calc(100vh - 422px); height: calc(100vh - 422px);
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
} }
/deep/.el-collapse-item { /deep/.el-collapse-item {
font-size: $togetherFontSize; font-size: $togetherFontSize;

@ -1,22 +1,38 @@
<template> <template>
<!-- 业务选择列表 --> <!-- 业务选择列表 -->
<el-dialog :visible="true" class="" :modal="false" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia 2xl:w-7/12 xl:w-9/12 lg:w-full h-9/12"> <el-dialog :visible="true"
<div slot="title" class="dia-header2"> class=""
:modal="false"
@close="closeData"
:close-on-click-modal="false"
:show-close="false"
custom-class="data-dia 2xl:w-7/12 xl:w-9/12 lg:w-full h-9/12">
<div slot="title"
class="dia-header2">
<div class="data-title2">业务选择</div> <div class="data-title2">业务选择</div>
<div class="close"><img v-lazy="closeImg" alt="" @click="showBusinessSelect(false)" /></div> <div class="close"><img v-lazy="closeImg"
alt=""
@click="showBusinessSelect(false)" /></div>
</div> </div>
<p class="tips2">请选择您要办理的业务:</p> <p class="tips2">请选择您要办理的业务:</p>
<ul class="take-list2"> <ul class="take-list2">
<li v-for="(item) in getBusinessSelectList" :class="{checked: takeCheck == item.myKey}" :key="item.myKey" @click="checkTake(item.myKey)"> <li v-for="(item) in getBusinessSelectList"
<img v-lazy="businessImg" alt=""> :class="{checked: takeCheck == item.myKey}"
:key="item.myKey"
@click="checkTake(item.myKey)">
<img v-lazy="businessImg"
alt="">
<p>{{ item.myKey + item.text}}</p> <p>{{ item.myKey + item.text}}</p>
</li> </li>
<li v-for="(item) in (3 - getBusinessSelectList.length%3)" class="sitting" :key="item"></li> <li v-for="(item) in (3 - getBusinessSelectList.length%3)"
class="sitting"
:key="item"></li>
</ul> </ul>
<div class="dia-footer2"> <div class="dia-footer2">
<div class='busyButtonBox'> <div class='busyButtonBox'>
<el-button @click="showBusinessSelect(false)">取消</el-button> <el-button @click="showBusinessSelect(false)">取消</el-button>
<el-button type="primary" @click="selectBusiness()">确定</el-button> <el-button type="primary"
@click="selectBusiness()">确定</el-button>
</div> </div>
</div> </div>
</el-dialog> </el-dialog>
@ -129,6 +145,7 @@ export default {
sessionStorage.setItem('cid', cid) sessionStorage.setItem('cid', cid)
sessionStorage.setItem('systemId', systemId) sessionStorage.setItem('systemId', systemId)
sessionStorage.setItem('projectId', projectId) sessionStorage.setItem('projectId', projectId)
sessionStorage.removeItem('submited')
if (assessmentId) { if (assessmentId) {
sessionStorage.setItem('assessmentId', assessmentId) sessionStorage.setItem('assessmentId', assessmentId)
} }
@ -202,10 +219,10 @@ export default {
height: 10vh; height: 10vh;
font-size: 16px; font-size: 16px;
margin: 1vh 0; margin: 1vh 0;
border: 4px solid #DBDBDB; border: 4px solid #dbdbdb;
border-radius: 20px; border-radius: 20px;
cursor: pointer; cursor: pointer;
background-color: rgba(216,216,216,0.10); background-color: rgba(216, 216, 216, 0.1);
// &:first-child{ // &:first-child{
// margin: 0 0px 50px 0; // margin: 0 0px 50px 0;
// } // }
@ -231,16 +248,17 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical -webkit-box-orient: vertical;
} }
&.checked { &.checked {
background: rgba(97,145,255,0.10) url('../../assets/svg/checked.svg') 96% 7%/auto no-repeat; background: rgba(97, 145, 255, 0.1) url('../../assets/svg/checked.svg') 96% 7% / auto no-repeat;
border-color: #6191FF; border-color: #6191ff;
} }
} }
} }
.dia-header2 { .dia-header2 {
position: relative;height: 50px; position: relative;
height: 50px;
line-height: 50px; line-height: 50px;
background-color: rgb(98, 149, 243); background-color: rgb(98, 149, 243);
border-top-left-radius: 14px; border-top-left-radius: 14px;

@ -1,11 +1,17 @@
<template> <template>
<div class="header" ref="exitHeader"> <div class="header"
<div class="inner" style="width: 100%"> ref="exitHeader">
<div class="logo" @click="toIndex" style="float: left"> <div class="inner"
<img src="../../assets/img/logo.png" alt=""> style="width: 100%">
<div class="logo"
@click="toIndex"
style="float: left">
<img src="../../assets/img/logo.png"
alt="">
</div> </div>
<div style="float: right;margin:0 60px;font-size: 18px"> <div style="float: right;margin:0 60px;font-size: 18px">
<span style="cursor:pointer" @click="exit"> <span style="cursor:pointer"
@click="exit">
退出<i class="icon el-icon-s-unfold"></i> 退出<i class="icon el-icon-s-unfold"></i>
</span> </span>
</div> </div>
@ -37,7 +43,7 @@ export default {
const url = location.href const url = location.href
let href = process.env.NODE_ENV === 'development' ? let href = process.env.NODE_ENV === 'development' ?
`http://${location.hostname}:8082/#/` : `http://${location.hostname}:8082/#/` :
`${url.includes('huorantech.cn') ? `http://www.occupationlab.com` : location.origin}${Cookie.get('manager') ? `${url.includes('huorantech.cn') ? `https://www.occupationlab.com` : location.origin}${Cookie.get('manager') ?
'/admin' : '/admin' :
(url.includes('huorantech.cn') || url.includes('izhixinyun.com')) ? (url.includes('huorantech.cn') || url.includes('izhixinyun.com')) ?
'' : '' :

@ -1,39 +1,61 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<img class="sth bg" src="@/assets/img/index-bg.png" alt=""> <img class="sth bg"
<div class="case" @click="setShowBusiness(true)">业务选择</div> src="@/assets/img/index-bg.png"
alt="">
<div class="case"
@click="setShowBusiness(true)">业务选择</div>
<!-- 业务选择 --弹框 --> <!-- 业务选择 --弹框 -->
<div class="sth integrated-counter cp"> <div class="sth integrated-counter cp">
<img width="100%" v-lazy="lazy1" alt="" @click="toPart('/counter')"> <img width="100%"
v-lazy="lazy1"
alt=""
@click="toPart('/counter')">
<!-- src="@/assets/img/integrated-counter.png" --> <!-- src="@/assets/img/integrated-counter.png" -->
<div class="name" @click="toPart('/counter')">综合柜台</div> <div class="name"
@click="toPart('/counter')">综合柜台</div>
</div> </div>
<div class="sth international cp"> <div class="sth international cp">
<!-- <img width="100%" v-lazy="lazy1" alt="" @click="toPart('/counter')"> --> <!-- <img width="100%" v-lazy="lazy1" alt="" @click="toPart('/counter')"> -->
<img width="100%" v-lazy="lazy2" alt="" @click="showComing" /> <img width="100%"
v-lazy="lazy2"
alt=""
@click="showComing" />
<!-- src="@/assets/img/integrated-counter.png" --> <!-- src="@/assets/img/integrated-counter.png" -->
<!-- <div class="name" @click="showComing">国际结算部</div> --> <!-- <div class="name" @click="showComing">国际结算部</div> -->
</div> </div>
<!-- <img class="sth international cp" v-lazy="lazy2" alt="" @click="showComing"> --> <!-- <img class="sth international cp" v-lazy="lazy2" alt="" @click="showComing"> -->
<div class="sth manager cp" @click="toPart('/lobbyManager')"> <div class="sth manager cp"
<img width="100%" v-lazy="lazy3" alt=""> @click="toPart('/lobbyManager')">
<img width="100%"
v-lazy="lazy3"
alt="">
<div class="name">大堂经理</div> <div class="name">大堂经理</div>
</div> </div>
<img class="sth credit-dep cp" v-lazy="lazy4" alt="" @click="showComing"> <img class="sth credit-dep cp"
<img class="sth company-finance cp" v-lazy="lazy5" alt="" @click="showComing"> v-lazy="lazy4"
<img class="sth personal-finance cp" v-lazy="lazy6" alt="" @click="showComing"> alt=""
@click="showComing">
<img class="sth company-finance cp"
v-lazy="lazy5"
alt=""
@click="showComing">
<img class="sth personal-finance cp"
v-lazy="lazy6"
alt=""
@click="showComing">
<div class="coming" :class="{active: comingVisible}"> <div class="coming"
:class="{active: comingVisible}">
<div style="width: 20%;margin: auto"> <div style="width: 20%;margin: auto">
<img style="width: 100%" v-lazy="lazy7" alt=""> <img style="width: 100%"
v-lazy="lazy7"
alt="">
</div> </div>
<p class="text">敬请期待</p> <p class="text">敬请期待</p>
</div> </div>
@ -144,7 +166,6 @@ export default {
z-index: 100; z-index: 100;
} }
.wrap { .wrap {
position: relative; position: relative;
min-height: calc(100vh - 68px); min-height: calc(100vh - 68px);
@ -164,7 +185,7 @@ export default {
top: -14%; top: -14%;
left: 24%; left: 24%;
width: 43%; width: 43%;
transition: all .5s; transition: all 0.5s;
&:hover { &:hover {
margin-top: -10px; margin-top: -10px;
} }
@ -179,7 +200,7 @@ export default {
top: -9%; top: -9%;
left: 72%; left: 72%;
width: 28%; width: 28%;
transition: all .5s; transition: all 0.5s;
// &:hover{ // &:hover{
// margin-top: -10px; // margin-top: -10px;
// } // }
@ -195,13 +216,12 @@ export default {
right: 0; right: 0;
@include nameTip; @include nameTip;
} }
} }
.manager { .manager {
bottom: 0; bottom: 0;
left: 57%; left: 57%;
width: 39%; width: 39%;
transition: all .5s; transition: all 0.5s;
&:hover { &:hover {
bottom: 10px; bottom: 10px;
} }
@ -216,7 +236,7 @@ export default {
top: 31%; top: 31%;
left: 0; left: 0;
width: 20%; width: 20%;
transition: all .5s; transition: all 0.5s;
// &:hover{ // &:hover{
// top: 29%; // top: 29%;
// } // }
@ -225,7 +245,7 @@ export default {
top: 52%; top: 52%;
left: 9%; left: 9%;
width: 28%; width: 28%;
transition: all .5s; transition: all 0.5s;
// &:hover{ // &:hover{
// top: 50%; // top: 50%;
// } // }
@ -234,7 +254,7 @@ export default {
bottom: 0; bottom: 0;
left: 25%; left: 25%;
width: 30%; width: 30%;
transition: all .5s; transition: all 0.5s;
// &:hover{ // &:hover{
// bottom: 10px; // bottom: 10px;
// } // }
@ -285,8 +305,8 @@ export default {
text-align: center; text-align: center;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
border-radius: 16px; border-radius: 16px;
background-color: rgba(0,0,0,0.80); background-color: rgba(0, 0, 0, 0.8);
transition: all .3s; transition: all 0.3s;
&.active { &.active {
top: 50%; top: 50%;
} }

@ -1,113 +1,168 @@
<template> <template>
<!-- 实验报告 --> <!-- 实验报告 -->
<div class="wrap"> <div class="wrap">
<breadcrumb data="返回实验/我的数据"></breadcrumb> <breadcrumb data="返回实验/实验报告"></breadcrumb>
<div class="content" :class="{loading}" id="pdfDom"> <div class="content"
<div style="text-align: right" v-if="!loading"> :class="{loading}"
<el-button size="mini" @click="editReport"> id="pdfDom">
<div style="text-align: right"
v-if="!loading">
<el-button size="mini"
@click="editReport">
{{ editing ? "保存" : "编辑" }} {{ editing ? "保存" : "编辑" }}
</el-button> </el-button>
<el-button type="primary" size="mini" @click="exportPage">导出报告</el-button> <el-button type="primary"
size="mini"
@click="exportPage">导出报告</el-button>
</div> </div>
<h6 class="r-title">标准实验报告</h6> <h6 class="r-title">标准实验报告</h6>
<div class="info"> <div class="info">
<h6 class="l-title"> <h6 class="l-title">
<img src="@/assets/img/report1.png" alt=""> <img src="@/assets/img/report1.png"
alt="">
基本信息 基本信息
</h6> </h6>
<ul :class="['info-list', {edit: editing}]"> <ul :class="['info-list', {edit: editing}]">
<li> <li>
<label>学生姓名</label> <label>学生姓名</label>
<el-input v-if="editing" v-model="infoData.userName" disabled></el-input> <el-input v-if="editing"
v-model="infoData.userName"
disabled></el-input>
<span v-else>{{ infoData.userName }}</span> <span v-else>{{ infoData.userName }}</span>
</li> </li>
<li> <li>
<label>学生学号</label> <label>学生学号</label>
<el-input v-if="editing" v-model="infoData.workNumber" disabled></el-input> <el-input v-if="editing"
v-model="infoData.workNumber"
disabled></el-input>
<span v-else>{{ infoData.workNumber }}</span> <span v-else>{{ infoData.workNumber }}</span>
</li> </li>
<li> <li>
<label>实验时间</label> <label>实验时间</label>
<el-input v-if="editing" v-model="infoData.submitTime" disabled></el-input> <el-input v-if="editing"
v-model="infoData.submitTime"
disabled></el-input>
<span v-else>{{ infoData.submitTime }}</span> <span v-else>{{ infoData.submitTime }}</span>
</li> </li>
<li> <li>
<label>实验成绩</label> <label>实验成绩</label>
<el-input v-if="editing" v-model="infoData.score" disabled></el-input> <el-input v-if="editing"
<div v-else class="score-wrap"> v-model="infoData.score"
disabled></el-input>
<div v-else
class="score-wrap">
<em>{{ infoData.score }}</em> <em>{{ infoData.score }}</em>
<img src="@/assets/img/point.png" alt=""> <img src="@/assets/img/point.png"
alt="">
</div> </div>
</li> </li>
<li> <li>
<label>学生班级</label> <label>学生班级</label>
<el-input v-if="editing" v-model="infoData.className"></el-input> <el-input v-if="editing"
v-model="infoData.className"></el-input>
<span v-else>{{ infoData.className }}</span> <span v-else>{{ infoData.className }}</span>
</li> </li>
<li> <li>
<label>指导老师</label> <label>指导老师</label>
<el-input v-if="editing" v-model="infoData.instructor"></el-input> <el-input v-if="editing"
v-model="infoData.instructor"></el-input>
<span v-else>{{ infoData.instructor }}</span> <span v-else>{{ infoData.instructor }}</span>
</li> </li>
<li> <li>
<label>实验学时</label> <label>实验学时</label>
<el-input v-if="editing" v-model="infoData.period"></el-input> <el-input v-if="editing"
v-model="infoData.period"></el-input>
<span v-else>{{ infoData.period }}</span> <span v-else>{{ infoData.period }}</span>
</li> </li>
</ul> </ul>
<div class="m-b-20"> <div class="m-b-20">
<h6 class="l-title"> <h6 class="l-title">
<img src="@/assets/img/report2.png" alt=""> <img src="@/assets/img/report2.png"
alt="">
实验项目名称 实验项目名称
</h6> </h6>
<el-input v-if="editing" v-model="infoData.projectName" type="textarea"></el-input> <el-input v-if="editing"
<div v-else class="pre-wrap" v-html="infoData.projectName"></div> v-model="infoData.projectName"
type="textarea"></el-input>
<div v-else
class="pre-wrap"
v-html="infoData.projectName"></div>
</div> </div>
<div class="m-b-20"> <div class="m-b-20">
<h6 class="l-title"> <h6 class="l-title">
<img src="@/assets/img/report3.png" alt=""> <img src="@/assets/img/report3.png"
alt="">
实验目的 实验目的
</h6> </h6>
<quill v-if="editing" :border="true" v-model="infoData.purpose" :height="150" /> <quill v-if="editing"
<div v-else :class="['pre-wrap', {edit: editing}]" v-html="infoData.purpose"></div> :border="true"
v-model="infoData.purpose"
:height="150" />
<div v-else
:class="['pre-wrap', {edit: editing}]"
v-html="infoData.purpose"></div>
</div> </div>
<div class="m-b-20"> <div class="m-b-20">
<h6 class="l-title"> <h6 class="l-title">
<img src="@/assets/img/report4.png" alt=""> <img src="@/assets/img/report4.png"
alt="">
实验数据 实验数据
</h6> </h6>
<el-table :data="expData" class="table" border stripe header-align="center"> <el-table :data="expData"
<el-table-column type="index" label="序号" align="center" width="60"> class="table"
border
stripe
header-align="center">
<el-table-column type="index"
label="序号"
align="center"
width="60">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.$index + 1 }} {{ scope.$index + 1 }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="judgmentName" label="判分点" width="270" align="center"></el-table-column> <el-table-column prop="judgmentName"
<el-table-column v-if='project' prop="judgmentName" label="考核点" align="center" width="150"> label="判分点"
width="200"
align="center"></el-table-column>
<el-table-column v-if='project'
prop="judgmentName"
label="考核点"
align="center"
width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<div v-for="(item, index) in scope.row.lcRuleRecords" :key="index"> <div v-for="(item, index) in scope.row.lcRuleRecords"
:key="index">
<span> <span>
<span>{{index+1}}. </span>{{item.name}} <span>{{index+1}}. </span>{{item.name}}
</span> </span>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="ruleAnswer" label="参考答案" style='word-wrap: break-word'> <el-table-column prop="ruleAnswer"
label="参考答案"
width="280"
style='word-wrap: break-word'>
<template slot-scope="scope"> <template slot-scope="scope">
<div v-if='scope.row.lcRuleRecords'> <div v-if='scope.row.lcRuleRecords'>
<div v-for="(item, index) in scope.row.lcRuleRecords" :key="index"> <div v-for="(item, index) in scope.row.lcRuleRecords"
:key="index">
<span> <span>
<span>{{index+1}}. </span>{{item.ruleAnswer}} <span>{{index+1}}. </span>{{item.ruleAnswer}}
</span> </span>
</div> </div>
</div> </div>
<div v-else v-html="scope.row.referenceAnswer"></div> <div v-else
v-html="scope.row.referenceAnswer"></div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="userAnswer" label="学生答案"> <el-table-column prop="userAnswer"
width="280"
label="学生答案">
<template slot-scope="scope"> <template slot-scope="scope">
<div v-if='scope.row.lcRuleRecords'> <div v-if='scope.row.lcRuleRecords'>
<div v-for="(item, index) in scope.row.lcRuleRecords" :key="index"> <div v-for="(item, index) in scope.row.lcRuleRecords"
:key="index">
<span v-if='item.userAnswer'> <span v-if='item.userAnswer'>
<span>{{index+1}}. </span>{{item.userAnswer}} <span>{{index+1}}. </span>{{item.userAnswer}}
</span> </span>
@ -116,23 +171,42 @@
</span> </span>
</div> </div>
</div> </div>
<div v-else v-html='scope.row.answer' style='white-space: pre-wrap'></div> <div v-else
v-html='scope.row.answer'
style='white-space: pre-wrap'></div>
<template v-if="scope.row.runThePictureList"> <template v-if="scope.row.runThePictureList">
<img v-for="(img, i) in scope.row.runThePictureList" :key="i" width="200" class="result-pic" :src="img" alt=""> <img v-for="(img, i) in scope.row.runThePictureList"
:key="i"
width="200"
class="result-pic"
:src="img"
alt="">
</template> </template>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="quesScore" label="分值" width="80" align="center"></el-table-column> <el-table-column prop="quesScore"
<el-table-column prop="score" label="得分" width="80" align="center"></el-table-column> label="分值"
width="80"
align="center"></el-table-column>
<el-table-column prop="score"
label="得分"
width="80"
align="center"></el-table-column>
</el-table> </el-table>
</div> </div>
<div class="m-b-20"> <div class="m-b-20">
<h6 class="l-title"> <h6 class="l-title">
<img src="@/assets/img/report5.png" alt=""> <img src="@/assets/img/report5.png"
alt="">
实验总结与体会 实验总结与体会
</h6> </h6>
<quill v-show="editing" :border="true" v-model="infoData.summarize" :height="150" /> <quill v-show="editing"
<div v-show="!editing" class="pre-wrap" v-html="infoData.summarize"></div> :border="true"
v-model="infoData.summarize"
:height="150" />
<div v-show="!editing"
class="pre-wrap"
v-html="infoData.summarize"></div>
</div> </div>
</div> </div>
</div> </div>
@ -170,11 +244,8 @@ export default {
methods: { methods: {
getData () { // getData () { //
const { reportId } = this const { reportId } = this
reportDetail({ reportDetail(reportId).then(({ data }) => {
reportId const { report, userScores } = data
}).then((data)=>{
console.log(33, data)
// this.$get(`${this.api.reportDetail}?reportId=${reportId}`).then(({ report, userScores }) => {
this.form = report this.form = report
const form = this.form const form = this.form
this.infoData = { this.infoData = {
@ -192,24 +263,22 @@ export default {
purpose: form.purpose, purpose: form.purpose,
summarize: form.summarize summarize: form.summarize
} }
// const data = report.data const expData = report.data
// this.userScores = userScores this.userScores = userScores
// // data使 // data使
// if (!data) { if (!expData) {
// this.handleList(userScores) this.handleList(userScores)
// this.$post(this.api.editExperimentalData, { this.$post(this.api.editExperimentalData, {
// reportId, reportId,
// data: JSON.stringify(userScores) data: JSON.stringify(userScores)
// }).then(res => {}).catch(err => {}) }).then(res => { }).catch(err => { })
// } else { } else {
// this.handleList(userScores.find(e => e.lcRuleRecords) ? userScores : JSON.parse(data)) this.handleList(userScores)
// } }
}).catch(res => { }) }).catch(res => { })
}, },
// //
handleList (list) { handleList (list) {
this.project = list.find(e => e.lcRuleRecords) // lcRuleRecords
if (this.project) {
list.map(e => { list.map(e => {
e.assessmentPoint = '' e.assessmentPoint = ''
e.referenceAnswer = '' e.referenceAnswer = ''
@ -220,7 +289,6 @@ export default {
e.answer += `${i + 1}.${n.userAnswer}` e.answer += `${i + 1}.${n.userAnswer}`
}) })
}) })
}
this.expData = list this.expData = list
}, },
exportPage () { exportPage () {
@ -242,13 +310,13 @@ export default {
this.loadIns = Loading.service({ this.loadIns = Loading.service({
background: "#fff" background: "#fff"
}); });
this.$post(this.project ? this.api.exportBankExperimentReport : this.api.exportLabReport, { exportBankExperimentReport({
...form, ...form,
experimentalData: list experimentalData: list
}).then(res => { }).then(res => {
this.loadIns.close(); this.loadIns.close();
this.loading = false; this.loading = false;
util.downloadFileDirect(`实验报告.docx`,new Blob([res])) util.downloadFileDirect(`实验报告.docx`, new Blob([res.data]))
}).catch(res => { }).catch(res => {
this.loadIns.close(); this.loadIns.close();
this.loading = false; this.loading = false;
@ -256,7 +324,7 @@ export default {
}, },
editReport () { // editReport () { //
if (this.editing) { if (this.editing) {
this.$post(`${this.api.updateReport}`, this.infoData).then(res => { updateReport(this.infoData).then(res => {
this.editing = false; this.editing = false;
this.$message.success('修改成功') this.$message.success('修改成功')
}).catch(err => { }); }).catch(err => { });
@ -275,8 +343,10 @@ export default {
.wrap { .wrap {
padding: 12px 300px 20px; padding: 12px 300px 20px;
} }
code, kbd, samp{ code,
font-family: 'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif; kbd,
samp {
font-family: 'PingFang SC', 'Helvetica Neue', Helvetica, 'microsoft yahei', arial, STHeiTi, sans-serif;
word-wrap: break-word; word-wrap: break-word;
white-space: pre-wrap; white-space: pre-wrap;
} }
@ -290,7 +360,7 @@ code, kbd, samp{
overflow: hidden; overflow: hidden;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
font-family:'PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif font-family: 'PingFang SC', 'Helvetica Neue', Helvetica, 'microsoft yahei', arial, STHeiTi, sans-serif;
} }
.content { .content {
padding: 16px 0; padding: 16px 0;
@ -306,7 +376,7 @@ code, kbd, samp{
} }
.info { .info {
padding: 20px 16px; padding: 20px 16px;
border: 1px solid #E1E6F2; border: 1px solid #e1e6f2;
} }
.l-title { .l-title {
display: flex; display: flex;
@ -315,7 +385,7 @@ code, kbd, samp{
margin-bottom: 12px; margin-bottom: 12px;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
background-color: #F7F9FC; background-color: #f7f9fc;
img { img {
margin-right: 5px; margin-right: 5px;
} }
@ -343,7 +413,7 @@ code, kbd, samp{
span { span {
min-width: 150px; min-width: 150px;
padding: 0 10px 3px; padding: 0 10px 3px;
border-bottom: 1px solid #E1E6F2; border-bottom: 1px solid #e1e6f2;
} }
/deep/.el-input { /deep/.el-input {
width: 174px; width: 174px;
@ -352,7 +422,7 @@ code, kbd, samp{
.score-wrap { .score-wrap {
position: relative; position: relative;
min-width: 150px; min-width: 150px;
border-bottom: 1px solid #E1E6F2; border-bottom: 1px solid #e1e6f2;
em { em {
position: absolute; position: absolute;
top: -12px; top: -12px;
@ -360,7 +430,7 @@ code, kbd, samp{
font-family: din; font-family: din;
font-size: 30px; font-size: 30px;
font-weight: 600; font-weight: 600;
color: #0B1D30; color: #0b1d30;
} }
img { img {
position: absolute; position: absolute;
@ -368,16 +438,17 @@ code, kbd, samp{
left: 0; left: 0;
} }
} }
/deep/.el-textarea .el-textarea__inner, .pre-wrap { /deep/.el-textarea .el-textarea__inner,
.pre-wrap {
min-height: 72px; min-height: 72px;
padding: 10px 16px; padding: 10px 16px;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
&.edit { &.edit {
color: #ABB3C6; color: #abb3c6;
border: 1px solid #CACFDB; border: 1px solid #cacfdb;
border-radius: 4px; border-radius: 4px;
background-color: #F6F7F9; background-color: #f6f7f9;
} }
} }
/deep/ .table th { /deep/ .table th {
@ -388,6 +459,18 @@ code, kbd, samp{
} }
} }
} }
/deep/ .el-table {
width: 100%;
.el-table__header-wrapper table,
.el-table__body-wrapper table {
width: 100% !important;
}
.el-table__body,
.el-table__footer,
.el-table__header {
table-layout: auto;
}
}
.result-pic { .result-pic {
margin: 10px 0; margin: 10px 0;
} }

Loading…
Cancel
Save