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