实验报告

20240205 20230705
yujialong 1 year ago
parent 2cf63091a1
commit a823365509
  1. 55
      src/App.vue
  2. 470
      src/components/case/index.vue
  3. 124
      src/components/selectBusiness/index.vue
  4. 50
      src/layouts/header/index.vue
  5. 164
      src/pages/index/list/index.vue
  6. 263
      src/pages/report/index.vue

@ -1,19 +1,21 @@
<template>
<div id="app" >
<select-business class="selectBusiness" :showIt.sync="showIt" v-show="!showIt && showBusiness" />
<div id="app">
<select-business class="selectBusiness"
:showIt.sync="showIt"
v-show="!showIt && showBusiness" />
<router-view></router-view>
<vCase :showIt.sync="showIt"></vCase>
<tip-dialog class="Z-9999" />
</div>
</template>
<script>
import vCase from '@/components/case'
import Setting from '@/setting';
import util from '@/libs/util';
import selectBusiness from '@/components/selectBusiness'
import TipDialog from '@/components/tipDialog'
import { mapState, mapMutations } from 'vuex'
export default {
import vCase from '@/components/case'
import Setting from '@/setting';
import util from '@/libs/util';
import selectBusiness from '@/components/selectBusiness'
import TipDialog from '@/components/tipDialog'
import { mapState, mapMutations } from 'vuex'
export default {
name: 'App',
components: {
vCase,
@ -22,23 +24,23 @@
},
created () {
//localStorage
if (util.local.get(Setting.storeKey) ) {
this.$store.replaceState(Object.assign({}, this.$store.state,util.local.get(Setting.storeKey)))
if (util.local.get(Setting.storeKey)) {
this.$store.replaceState(Object.assign({}, this.$store.state, util.local.get(Setting.storeKey)))
this.$store.system.replaceState(Object.assign({}, sessionStorage.getItem('systemData')))
}
//vuexlocalStorage
window.addEventListener("beforeunload",()=>{
if(this.$route.fullPath.includes('/counter/list/manage')) {
window.addEventListener("beforeunload", () => {
if (this.$route.fullPath.includes('/counter/list/manage')) {
sessionStorage.setItem('computerPath', this.$route.fullPath)
}
util.local.get(Setting.tokenKey) && util.local.set(Setting.storeKey,this.$store.state)
util.local.get(Setting.tokenKey) && util.local.set(Setting.storeKey, this.$store.state)
sessionStorage.setItem('systemData', this.$store.system.state)
})
},
data() {
data () {
return {
showIt: true,
showSelect: false
@ -52,18 +54,20 @@
},
watch: {
showIt: {
handler(newVal) {
if(!newVal && !this.businessKey) {
handler (newVal) {
console.log("🚀 ~ file: App.vue:58 ~ handler ~ newVal:", newVal, this.businessKey, sessionStorage.getItem('submited'))
if (!newVal && !this.businessKey && !sessionStorage.getItem('submited')) {
this.setShowBusiness(true)
}else {
if(!newVal) {
} else {
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) })
}else {
} else {
// this.setTipsOperate('' + this.businessKey + ',');
}
}else {
} else {
this.$nextTick(() => { this.setShowBusiness(false) })
}
}
@ -78,7 +82,7 @@
businessKey: state => state.system.businessKey
})
},
}
}
</script>
<style lang="scss" scoped>
@ -91,8 +95,9 @@
height: 100%;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .5s;
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;

File diff suppressed because it is too large Load Diff

@ -1,22 +1,38 @@
<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">
<div slot="title" class="dia-header2">
<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">
<div slot="title"
class="dia-header2">
<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>
<p class="tips2">请选择您要办理的业务:</p>
<ul class="take-list2">
<li v-for="(item) in getBusinessSelectList" :class="{checked: takeCheck == item.myKey}" :key="item.myKey" @click="checkTake(item.myKey)">
<img v-lazy="businessImg" alt="">
<li v-for="(item) in getBusinessSelectList"
:class="{checked: takeCheck == item.myKey}"
:key="item.myKey"
@click="checkTake(item.myKey)">
<img v-lazy="businessImg"
alt="">
<p>{{ item.myKey + item.text}}</p>
</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>
<div class="dia-footer2">
<div class='busyButtonBox'>
<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>
</el-dialog>
@ -33,13 +49,13 @@ export default {
// }
// default: ''
},
mounted() {
if(this.businessKey) {
mounted () {
if (this.businessKey) {
//
this.takeCheck = this.businessKey
}
},
data() {
data () {
return {
checkList: [],
takeCheck: '',
@ -54,13 +70,13 @@ export default {
setShowBusiness: 'system/setShowBusiness',
setTipsOperate: 'system/setTipsOperate',
}),
closeData() {
closeData () {
this.checkList = [];
},
// /
showBusinessSelect (judge) {
//
if(!judge && !this.businessKey) {
if (!judge && !this.businessKey) {
this.$confirm('由于您未选择一个业务,这将回到业务列表,是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
@ -81,17 +97,17 @@ export default {
//
this.setTipsOperate('您正在进行' + this.businessKey + ',加油!');
},
checkTake(myKey){
checkTake (myKey) {
//
if(this.takeCheck === myKey) {
if (this.takeCheck === myKey) {
this.takeCheck = ''
}else {
} else {
this.takeCheck = myKey
}
},
selectBusiness() {
selectBusiness () {
//
if(!this.takeCheck) {
if (!this.takeCheck) {
this.$message({
type: 'info',
message: '请选择一个业务'
@ -102,7 +118,7 @@ export default {
this.setBusinessKey(this.takeCheck)
// this.$store.dispatch('system/getJudgeData')
// id
if(!this.$store.state.system.businessSelect[this.$store.state.system.businessKey].id) {
if (!this.$store.state.system.businessSelect[this.$store.state.system.businessKey].id) {
this.$message({
type: 'info',
message: '业务开发中,尽请期待!'
@ -129,19 +145,20 @@ export default {
sessionStorage.setItem('cid', cid)
sessionStorage.setItem('systemId', systemId)
sessionStorage.setItem('projectId', projectId)
if(assessmentId) {
sessionStorage.removeItem('submited')
if (assessmentId) {
sessionStorage.setItem('assessmentId', assessmentId)
}
if(classId) {
if (classId) {
sessionStorage.setItem('classId', classId)
}
if(timestamp) {
if (timestamp) {
sessionStorage.setItem('timestamp', timestamp)
}
if(startTime) {
if (startTime) {
sessionStorage.setItem('startTime', startTime)
}
if(storeProjectId) {
if (storeProjectId) {
sessionStorage.setItem('storeProjectId', storeProjectId)
}
@ -161,9 +178,9 @@ export default {
})
},
watch: {
showBusiness(newVal) {
showBusiness (newVal) {
console.log('what')
if(newVal) {
if (newVal) {
this.takeCheck = this.businessKey
}
}
@ -187,7 +204,7 @@ export default {
max-height: 600px;
overflow: auto;
//
.take-list2{
.take-list2 {
width: 100%;
display: flex;
justify-content: space-around;
@ -195,30 +212,30 @@ export default {
flex-wrap: wrap;
height: 40vh;
overflow: auto;
li{
li {
display: inline-flex;
align-items: center;
width: 30%;
height: 10vh;
font-size: 16px;
margin: 1vh 0;
border: 4px solid #DBDBDB;
border: 4px solid #dbdbdb;
border-radius: 20px;
cursor: pointer;
background-color: rgba(216,216,216,0.10);
background-color: rgba(216, 216, 216, 0.1);
// &:first-child{
// margin: 0 0px 50px 0;
// }
// &:last-child{
// margin-left: 50px;
// }
img{
img {
width: 15%;
margin: 0;
//height: 154px;
//margin: 0 45px;
}
p{
p {
font-size: 16px;
color: #000;
text-align: left;
@ -231,27 +248,28 @@ export default {
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical
-webkit-box-orient: vertical;
}
&.checked{
background: rgba(97,145,255,0.10) url('../../assets/svg/checked.svg') 96% 7%/auto no-repeat;
border-color: #6191FF;
&.checked {
background: rgba(97, 145, 255, 0.1) url('../../assets/svg/checked.svg') 96% 7% / auto no-repeat;
border-color: #6191ff;
}
}
}
.dia-header2 {
position: relative;height: 50px;
position: relative;
height: 50px;
line-height: 50px;
background-color: rgb(98, 149, 243) ;
border-top-left-radius:14px;
border-top-right-radius:14px;
background-color: rgb(98, 149, 243);
border-top-left-radius: 14px;
border-top-right-radius: 14px;
.data-title2 {
position: absolute;
left: 15px;
height: 50px;
font-size: 16px;
line-height: 50px;
color:#fff;
color: #fff;
}
.close {
height: 50px;
@ -280,7 +298,7 @@ export default {
margin: 0 auto;
display: flex;
align-items: center;
.img-wrap{
.img-wrap {
background: url('../../assets/img/data-frame.png') 0 0 / cover no-repeat;
width: 180px;
height: 180px;
@ -294,7 +312,7 @@ export default {
max-width: 180px;
max-height: 130px;
text-align: center;
margin: 10px 10px ;
margin: 10px 10px;
img {
margin-top: 45px;
}
@ -308,13 +326,13 @@ export default {
color: #000;
}
}
.text{
.text {
font-size: 18px;
white-space:nowrap;
white-space: nowrap;
position: absolute;
bottom: 15px;
left: 50%;
transform: translate(-50%,0);
transform: translate(-50%, 0);
}
&.checked {
background: url('../../assets/img/data-frame-checked.png') 0 0 / cover no-repeat,
@ -325,19 +343,19 @@ export default {
}
}
}
.seal{
.seal {
width: 1100px;
padding: 0 5%;
display: flex;
justify-content: space-between;
.box{
.box {
border: 2px solid #e6e6e6;
width: 45%;
min-height: 300px;
border-radius: 10px;
padding: 10px;
}
.left{
.left {
display: flex;
width: 50%;
flex-wrap: wrap;
@ -349,14 +367,14 @@ export default {
background: url('../../assets/img/data-frame.png') 0 0 / cover no-repeat;
cursor: pointer;
margin: 5px 7px;
img{
img {
width: 130px;
max-height: 90px;
}
&:last-child {
margin-right: 0;
}
&:nth-child(n>1){
&:nth-child(n > 1) {
margin-top: 0;
}
img {
@ -394,10 +412,10 @@ export default {
}
}
}
.right{
.right {
margin-left: 5%;
}
.else{
.else {
width: 100%;
}
}
@ -416,6 +434,6 @@ export default {
.sitting {
opacity: 0;
cursor: default!important;
cursor: default !important;
}
</style>

@ -1,11 +1,17 @@
<template>
<div class="header" ref="exitHeader">
<div class="inner" style="width: 100%">
<div class="logo" @click="toIndex" style="float: left">
<img src="../../assets/img/logo.png" alt="">
<div class="header"
ref="exitHeader">
<div class="inner"
style="width: 100%">
<div class="logo"
@click="toIndex"
style="float: left">
<img src="../../assets/img/logo.png"
alt="">
</div>
<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>
</span>
</div>
@ -13,39 +19,39 @@
</div>
</template>
<script>
import { mapState,mapActions } from 'vuex'
import { mapState, mapActions } from 'vuex'
import Setting from '@/setting'
import util from '@/libs/util'
import Cookie from 'js-cookie'
export default {
data() {
data () {
return {
token: util.local.get(Setting.tokenKey),
};
},
mounted(){
mounted () {
this.$route.query.manager && Cookie.set('manager', 1)
},
methods: {
toIndex(){
toIndex () {
this.$refs.nav.jump({
index: '/index/list',
title: '首页'
})
},
exit(){
exit () {
const url = location.href
let href = process.env.NODE_ENV === 'development' ?
`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' :
(url.includes('huorantech.cn') || url.includes('izhixinyun.com')) ?
'' :
'/student'}/#/`
let assessmentId = sessionStorage.getItem('assessmentId')
if (assessmentId != 'null' && assessmentId != null && assessmentId != ''){
if (assessmentId != 'null' && assessmentId != null && assessmentId != '') {
href += `ass/list`
}else{
} else {
const cid = sessionStorage.getItem('cid')
href += `station/preview?courseId=${cid}&curriculumName=银行项目`
}
@ -54,12 +60,12 @@ export default {
},
watch: {
'$route.path': {
handler(newVal) {
handler (newVal) {
this.$nextTick(() => {
console.log(newVal)
if(newVal === '/index/list') {
if (newVal === '/index/list') {
this.$refs.exitHeader.style.backgroundColor = 'rgb(250, 250, 250)'
}else {
} else {
this.$refs.exitHeader.style.backgroundColor = 'rgb(244, 245, 248)'
}
})
@ -70,22 +76,22 @@ export default {
};
</script>
<style lang="scss" scoped>
.header{
width:100%;
.header {
width: 100%;
display: flex;
align-items: center;
position: relative;
height: 68px;
// background-color: #fff;
background-color: rgb(244,245,248);
background-color: rgb(244, 245, 248);
z-index: 1001;
.logo{
.logo {
width: 500px;
margin-left: 42px;
cursor: pointer;
img{
img {
width: 100%;
}
}
}
}
</style>

@ -1,39 +1,61 @@
<template>
<div class="wrap">
<img class="sth bg" src="@/assets/img/index-bg.png" alt="">
<div class="case" @click="setShowBusiness(true)">业务选择</div>
<img class="sth bg"
src="@/assets/img/index-bg.png"
alt="">
<div class="case"
@click="setShowBusiness(true)">业务选择</div>
<!-- 业务选择 --弹框 -->
<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" -->
<div class="name" @click="toPart('/counter')">综合柜台</div>
<div class="name"
@click="toPart('/counter')">综合柜台</div>
</div>
<div class="sth international cp">
<!-- <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" -->
<!-- <div class="name" @click="showComing">国际结算部</div> -->
</div>
<!-- <img class="sth international cp" v-lazy="lazy2" alt="" @click="showComing"> -->
<div class="sth manager cp" @click="toPart('/lobbyManager')">
<img width="100%" v-lazy="lazy3" alt="">
<div class="sth manager cp"
@click="toPart('/lobbyManager')">
<img width="100%"
v-lazy="lazy3"
alt="">
<div class="name">大堂经理</div>
</div>
<img class="sth credit-dep cp" v-lazy="lazy4" 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">
<img class="sth credit-dep cp"
v-lazy="lazy4"
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">
<img style="width: 100%" v-lazy="lazy7" alt="">
<img style="width: 100%"
v-lazy="lazy7"
alt="">
</div>
<p class="text">敬请期待</p>
</div>
@ -45,8 +67,8 @@ import { mapMutations, mapState } from 'vuex';
import saveSystemModule from '@/mixins/saveSystemModule'
export default {
name: 'index',
mixins: [ saveSystemModule ],
data() {
mixins: [saveSystemModule],
data () {
return {
caseVisible: true,
comingVisible: false,
@ -60,8 +82,8 @@ export default {
lazy7: require('@/assets/svg/coming.svg')
}
},
created() {
if(!sessionStorage.getItem('firstLoad2')) {
created () {
if (!sessionStorage.getItem('firstLoad2')) {
const loading = this.$loading({
lock: true,
// text: 'Loading',
@ -75,17 +97,17 @@ export default {
}, 1000);
}
if(!this.businessKey) {
if (!this.businessKey) {
this.setShowBusiness(true)
}
},
mounted() {
mounted () {
let token = this.getQueryVariable('token')
let cid = this.getQueryVariable('cid')
let systemId = this.getQueryVariable('systemId')
let stopTime = this.getQueryVariable('stopTime')
let timestamp =+stopTime;
if (token != null){
let timestamp = +stopTime;
if (token != null) {
sessionStorage.setItem('token', token)
sessionStorage.setItem('cid', cid)
sessionStorage.setItem('systemId', systemId)
@ -102,34 +124,34 @@ export default {
...mapMutations({
setShowBusiness: 'system/setShowBusiness'
}),
getQueryVariable(name) {
var reg = new RegExp('(^|&)'+name+'=([^&]*)(&|$)')
if( window.location.href.split('?')[1]){
getQueryVariable (name) {
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
if (window.location.href.split('?')[1]) {
var r = window.location.href.split('?')[1].match(reg)
if (r != null){
if (r != null) {
return (r[2])
}else{
} else {
return null
}
}
},
toPart(path){
toPart (path) {
this.$router.push(path)
},
showComing(){
showComing () {
this.comingVisible = true
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.comingVisible = false
},1500)
}, 1500)
}
}
};
</script>
<style lang="scss" scoped>
//
@mixin nameTip {
//
@mixin nameTip {
width: 200px;
height: 70px;
line-height: 60px;
@ -142,44 +164,43 @@ export default {
border-radius: 16px;
// box-shadow: 0 6px 8px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
z-index: 100;
}
}
.wrap{
.wrap {
position: relative;
min-height: calc(100vh - 68px);
.sth{
.sth {
position: absolute;
&.cp{
&.cp {
cursor: pointer;
}
}
.bg{
.bg {
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.integrated-counter{
.integrated-counter {
top: -14%;
left: 24%;
width: 43%;
transition: all .5s;
&:hover{
transition: all 0.5s;
&:hover {
margin-top: -10px;
}
.name{
.name {
position: absolute;
top: 23%;
left: 20%;
@include nameTip;
}
}
.international{
.international {
top: -9%;
left: 72%;
width: 28%;
transition: all .5s;
transition: all 0.5s;
// &:hover{
// margin-top: -10px;
// }
@ -189,20 +210,19 @@ export default {
// margin-top: -10px;
// }
// }
.name{
.name {
position: absolute;
top: 23%;
right: 0;
@include nameTip;
}
}
.manager{
.manager {
bottom: 0;
left: 57%;
width: 39%;
transition: all .5s;
&:hover{
transition: all 0.5s;
&:hover {
bottom: 10px;
}
.name {
@ -212,34 +232,34 @@ export default {
@include nameTip;
}
}
.credit-dep{
.credit-dep {
top: 31%;
left: 0;
width: 20%;
transition: all .5s;
transition: all 0.5s;
// &:hover{
// top: 29%;
// }
}
.company-finance{
.company-finance {
top: 52%;
left: 9%;
width: 28%;
transition: all .5s;
transition: all 0.5s;
// &:hover{
// top: 50%;
// }
}
.personal-finance{
.personal-finance {
bottom: 0;
left: 25%;
width: 30%;
transition: all .5s;
transition: all 0.5s;
// &:hover{
// bottom: 10px;
// }
}
.case{
.case {
position: absolute;
top: 92px;
left: 150px;
@ -249,52 +269,52 @@ export default {
text-align: center;
color: #fff;
font-size: 24px;
background: url(../../../assets/img/case.png) 0 0 /cover no-repeat;
background: url(../../../assets/img/case.png) 0 0 / cover no-repeat;
background-size: 150px 50px;
cursor: pointer;
// &:hover{
// top: 76px;
// }
}
@media(max-width: 1440px){
.credit-dep{
@media (max-width: 1440px) {
.credit-dep {
top: 32%;
}
.company-finance{
.company-finance {
top: 53%;
}
.personal-finance{
.personal-finance {
top: 72%;
}
.integrated-counter{
.integrated-counter {
width: 44%;
}
}
@media(max-width: 1300px){
@media (max-width: 1300px) {
& {
min-height: calc(100vh - 76px);
}
}
}
.coming{
}
.coming {
position: fixed;
top: -200%;
left: 50%;
width: 376px;
padding: 40px 0;
text-align: center;
transform: translate(-50%,-50%);
transform: translate(-50%, -50%);
border-radius: 16px;
background-color: rgba(0,0,0,0.80);
transition: all .3s;
&.active{
background-color: rgba(0, 0, 0, 0.8);
transition: all 0.3s;
&.active {
top: 50%;
}
.text{
.text {
margin-top: 24px;
font-size: 22px;
font-weight: 400;
color: #fff;
}
}
}
</style>

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

Loading…
Cancel
Save