20 changed files with 312 additions and 42 deletions
@ -0,0 +1,184 @@ |
|||
<!-- |
|||
Copyright (c) 2020. |
|||
author: song |
|||
email: 15235360226@163.com |
|||
--> |
|||
|
|||
<template> |
|||
<div class="inner pa-10 white" v-if="teachers && teachers.length > 0"> |
|||
<div :key="teacher.categoryId" class="mb-4" v-for="teacher in teachers"> |
|||
<p class="font-bold-20 title-color">{{ teacher.categoryName }}</p> |
|||
<div class="d-flex flex-wrap mb-10" v-if="teacher.services && teacher.services.length"> |
|||
<div |
|||
:class="(index + 1) % 4 === 0 ? 'teacher-box1' : ''" |
|||
:key="index" |
|||
class="teacher-box font-24 mb-3" |
|||
v-for="(item, index) in teacher.services" |
|||
> |
|||
<div :class="index === 0 ? 'teacher-item-active' : ''" @click="changeShow(item)" class="teacher-item font-24 mb-3"> |
|||
<div class="font-26 teacher-title mb-5">{{ item.name }}</div> |
|||
<div class="font-14 teacher-txt"> |
|||
会组成按理事会章程执行，经理 层设总经理 1 名、会组成按理事 会章程执行，经理层设总经理 1 名导师。 |
|||
</div> |
|||
<div class="d-flex flex-row justify-center py-5"> |
|||
<span></span> |
|||
</div> |
|||
<div class="d-flex flex-row justify-center"> |
|||
<img src="~assets/teacher01.png" v-if="index === 0" /> |
|||
<img src="~assets/teacher02.png" v-else /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<a-modal |
|||
v-if="teacherData" |
|||
:footer="null" |
|||
title="导师详情" |
|||
:visible="showProfile" |
|||
@cancel="handleCancel" |
|||
@ok="handleCancel" |
|||
width="50%" |
|||
> |
|||
<a-form-item> |
|||
<a-form-item :label-col="formTailLayout.labelCol" :wrapper-col="formTailLayout.wrapperCol" label="导师姓名"> |
|||
{{ teacherData.name }} |
|||
</a-form-item> |
|||
<a-form-item :label-col="formTailLayout.labelCol" :wrapper-col="formTailLayout.wrapperCol" label="导师简介"> |
|||
{{ teacherData.intro }} |
|||
</a-form-item> |
|||
<a-form-item :label-col="formTailLayout.labelCol" :wrapper-col="formTailLayout.wrapperCol" label="导师照片"> |
|||
<img v-if="teacherData.teacherPhoto" :src="teacherData.teacherPhoto" alt="" /> |
|||
</a-form-item> |
|||
</a-form-item> |
|||
</a-modal> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState, mapMutations, mapActions } from 'vuex'; |
|||
import { selTeacher } from 'config/api'; |
|||
const formItemLayout = { |
|||
labelCol: { span: 6 }, |
|||
wrapperCol: { span: 12 }, |
|||
}; |
|||
const formTailLayout = { |
|||
labelCol: { span: 6 }, |
|||
wrapperCol: { span: 12, offset: 6 }, |
|||
}; |
|||
export default { |
|||
name: 'Tutor', |
|||
data() { |
|||
return { |
|||
title: '孵化平台-创业导师', |
|||
showPage: 44, |
|||
arr: [ |
|||
{ name: '孵化平台', url: '/IncubationPlatform/MakerSpace' }, |
|||
{ name: '创业导师', url: '' }, |
|||
], |
|||
teachers: [], |
|||
formItemLayout, |
|||
formTailLayout, |
|||
teacherData: null, |
|||
showProfile: false, |
|||
}; |
|||
}, |
|||
|
|||
created() { |
|||
this.handleTeacher(); |
|||
}, |
|||
|
|||
methods: { |
|||
changeShow(obj) { |
|||
this.teacherData = obj; |
|||
this.showProfile = true; |
|||
}, |
|||
handleCancel() { |
|||
this.showProfile = false; |
|||
}, |
|||
|
|||
// 查询 导师 |
|||
async handleTeacher() { |
|||
try { |
|||
const res = await selTeacher(); |
|||
const { code, msg, data } = res.data; |
|||
if (code === 200) { |
|||
this.teachers = data; |
|||
for (let i = 0; i < this.teachers.length; i++) { |
|||
const element = this.teachers[i]; |
|||
for (let j = 0; j < element.services.length; j++) { |
|||
for (let k = 0; k < element.services.length - j; k++) { |
|||
if (k + 1 < element.services.length - j) { |
|||
if (element.services[k].order && element.services[k].order > element.services[k + 1].order) { |
|||
let a = null; |
|||
a = element.services[k + 1]; |
|||
element.services[k + 1] = element.services[k]; |
|||
element.services[k] = a; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} else { |
|||
this.$message.error(456); |
|||
} |
|||
} catch (error) { |
|||
this.$message.error(123); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.teacher-box { |
|||
width: 22%; |
|||
margin-right: 4%; |
|||
} |
|||
|
|||
.teacher-box1 { |
|||
margin-right: 0; |
|||
} |
|||
|
|||
.teacher-item { |
|||
width: 100%; |
|||
padding: 24px 12px 30px; |
|||
background: #f8f8f8; |
|||
color: rgba(80, 80, 80, 0.7); |
|||
text-align: center; |
|||
|
|||
.teacher-title { |
|||
text-align: center; |
|||
color: rgba(80, 80, 80, 0.4); |
|||
} |
|||
|
|||
.teacher-txt { |
|||
text-align: justify; |
|||
height: 85px; |
|||
overflow: hidden; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 4; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
span { |
|||
display: inline-block; |
|||
width: 28px; |
|||
height: 3px; |
|||
background: #E77816; |
|||
} |
|||
} |
|||
|
|||
.teacher-item-active { |
|||
background: #E77816; |
|||
color: #fff; |
|||
|
|||
.teacher-title { |
|||
color: #fff; |
|||
} |
|||
|
|||
span { |
|||
background: #fff; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,16 @@ |
|||
<template> |
|||
<div> |
|||
<router-view></router-view> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'Index', |
|||
data() { |
|||
return {}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="stylus"></style> |
|||
Loading…
Reference in new issue