judicial-hy / 0.200103

<template>
<div class='container' v-if='lecture.createdate'>
    <div class='para-title'><div/>讲座标题</div>
    <div class='title'>
      {{lecture.lecture_title}}
      <div v-if='lecture.is_auditing==0'>审核中</div>
      <div v-else style='background: tan'>已通过</div>
    </div>
    <div class='para-title'><div/>主讲律师</div>
    <div class='lawyers'>
      <img class='photo' v-if='imgLoaded' :src="rootAvatar+lecture.pic_Name" @error='imgLoaded=false' mode='aspectFill'>
      <img class='photo' v-else src='/static/imgs/avatar.png'>
      <div class='info'>
        <div class='name'>{{lecture.name}}<img :src="lecture.sex==1 ? '/static/imgs/man.png' : '/static/imgs/woman.png'"/></div>
        <!-- <div class='expertin'>{{item.expertin}}</div> -->
        <div class='expertin'>{{lecture.cate_Name}}</div>
        <div class='fame'>{{lecture.firm_Name}}</div>
      </div>
      <div class='btn'>
      <!-- <div class='consult'>&ensp;咨询我&ensp;</div> -->
      <!-- <div class='follow' @tap='follow(i)' :style="item.followed=='true'?'background:tan':''">{{item.followed=='true'?'已关注':'&emsp;关注&emsp;'}}</div> -->
      </div>
    </div>
    <div class='para-title'><div/>讲座概要</div>
    <div class='sub-info'><div>讲座时间：</div><div>{{lecture.lecture_date}}</div></div>
    <div class='sub-info'><div>讲座社区：</div><div>{{lecture.comm_Name}}</div></div>
    <div class='sub-info'><div>社区地点：</div><div>{{lecture.comm_Address}}</div></div>
    <div class='sub-info'><div>社区电话：</div><div>{{lecture.comm_Tel}}</div></div>
    <!-- <div class='sub-info'><div>主讲律师：</div><div>{{lecture.name}}</div></div> -->
    <!-- <div class='sub-info'><div>所属律所：</div><div>{{lecture.firm_Name}}</div></div> -->
    <div class='sub-info'><div>发布时间：</div><div>{{lecture.createdate}}</div></div>
    <!-- <div class='_subtitle'>案情介绍</div> -->
    <div class='para-title'><div/>讲座详情</div>
    <div class='text'>
      <wxParse :content='lecture.lecture_content' noData='加载中……' :imageProp='imageProp'/>
    </div>
    <!-- <img :src='imgs' mode='widthFix'> -->
    <!-- <div style="width:100%;height:90rpx;"/> -->
    <!-- <div class='fix-bar'>
        <div class='collect'>收藏</div>
        <navigator class='consult' url='../lawyerDetail/main'>向李芳芳律师咨询</navigator>
    </div> -->
</div>
<div v-else class='LoadingMask'>
  <img src="/static/imgs/loading.png">
</div>
</template>
<script>
import wxParse from 'mpvue-wxparse'
export default {
  components: {
    wxParse
  },
  data() {
    return {
      lecture: {},
      imgLoaded: false,
      imageProp: {}
    }
  },
  methods: {
    getLectureDetail(lrid) {
      wx.request({
        url: this.rootUrl + '/lecture/getbyid/' + lrid,
        success: res => {
          console.log(res)
          this.lecture = res.data[0]
          this.lecture.lecture_content = this.lecture.lecture_content.replace(/<[^>\\]*\\[^>]*>/g,'')
          this.lecture.createdate = this.service.correctTime(this.lecture.createdate,'full')
          this.lecture.lecture_date = this.service.correctTime(this.lecture.lecture_date,'full')
          this.imgLoaded = true
        }
      })
    }
  },
  onLoad() {
    this.imgLoaded = false
    this.imageProp = {mode:'aspectFit', padding: 0, lazyLoad:false, domain:this.rootAvatar.replace('https:','')}
    this.getLectureDetail(this.$root.$mp.query.lrid)
  },
  onUnload(){
    this.lecture = {}
  }
}
</script>
<style lang="stylus" scoped>
@import url('~mpvue-wxparse/src/wxParse.css')
.container
  position absolute
  padding 0 20rpx
  BorderBox()
  min-height 100%
  width 100%
.para-title
  Flex(flex, , center)
  Font(32rpx, 100rpx, bold)
  color #424242
  div
    margin-right 20rpx
    Height_Width(45rpx, 10rpx)
    background themeColor
.title
  Font(40rpx, 60rpx, bold)
  margin-bottom 30rpx
  > div
    display inline-block
    position relative
    bottom 5rpx
    background themeColor
    color white
    Font(26rpx, 38rpx)
    padding 0 10rpx
    border-radius 5rpx
.sub-info
  Font(28rpx, 50rpx)
  Flex(flex, , flex-start)
  >div
    &:nth-child(1)
      color grey
      width 20%
    &:nth-child(2)
      width 80%
// ._subtitle
// Font(28rpx,50rpx)
.text
  Font(28rpx, 40rpx)
  text-align justify
.subhead, .lawyer
  Font(28rpx, 40rpx)
  color grey
  text-align center
.main
  margin-top 20rpx
  width 100%
  Font(30rpx, 40rpx)
  ._subtitle
    font-weight 600
  img
    margin-top 20rpx
    min-width 100%
.fix-bar
  position fixed
  width 100%
  left 0
  bottom 0
  display flex
  color white
  Font(35rpx, 90rpx)
  text-align center
  .collect
    width 20%
    background themeColor
  .consult
    width 80%
    background #09BB07
.lawyers
  Flex(flex, , center)
  background white
  .photo
    flex none
    margin 20rpx 20rpx 20rpx 10rpx
    Height_Width(140rpx)
    border-radius 50%
  .info
    flex auto
    padding 30rpx 0
    height 180rpx
    BorderBox()
    Flex(flex, , , column)
    .name
      margin-bottom auto
      height 35rpx
      Font(35rpx)
      Flex(flex, , center)
      img
        Height_Width(35rpx)
        margin-left 15rpx
  .btn
    flex none
    align-self flex-start
    color white
    margin-right 30rpx
    Font(30rpx, 50rpx)
    .consult, .follow
      border-radius 25rpx
      padding 0 10rpx
      text-align center
    .consult
      // vertical-align middle
      background blue
      margin 30rpx 0 20rpx 0
    .follow
      // vertical-align middle
      background red
.expertin, .fame
  font-size 24rpx
  color grey
.expertin
  line-height 70rpx
.fame
  line-height 24rpx
</style>