<template>
<div class='container' v-if='affair.createDate'>
  <div class='para-title'><div/>咨询者详情</div>

  <div class='sub-info'><div>姓名：</div><div>{{'' || affair.consultant_Name}}</div></div>
  <div class='sub-info'><div>性别：</div><div>{{'' || affair.consultant_Sex}}</div></div>
  <div class='sub-info'><div>年龄：</div><div>{{'' || affair.consultant_Age}}</div></div>
  <div class='sub-info'><div>地址：</div><div>{{'' || affair.consultant_address}}</div></div>
  <div class='sub-info'><div>电话：</div><div>{{'' || affair.consultant_Tel}}</div></div>
  <div class='sub-info'><div>咨询时间：</div><div>{{'' || affair.createDate}}</div></div>

  <div class='para-title'><div/>咨询问题</div>
  <div class='text'>{{'' || affair.consultant_question}}</div>

  <div class='para-title'><div/>律师回答</div>
  <div class='text'>{{'' || affair.consultant_Answer}}</div>

  <div v-if='imgfiles.length > 0' class='para-title'><div/>相关图片</div>
  <div v-if='imgfiles.length > 0' class="img-box" style='padding: 0;margin:-25rpx 0 20rpx 0;'>
    <img v-for="(v,i) in imgfiles" :key="i" @tap='previewImg(i)' :src='v' mode='aspectFill'>
  </div>

  <div v-if='videoSrc' class='para-title'><div/>相关视频</div>
  <video v-if='videoSrc' show-mute-btn :src='rootAvatar + videoSrc' id='affairVideo'></video>

  <div style='height:100rpx;width:100%;'/>
</div>
<div v-else class='LoadingMask'>
  <img src="/static/imgs/loading.png">
</div>
</template>
<script>
export default {
  data() {
    return {
      affair: {},
      imgfiles: [],
      videoSrc: ''
    }
  },
  methods:{
    previewImg(i) {
      wx.previewImage({
        urls: this.imgfiles,
        current: this.imgfiles[i]
      })
    }
  },
  onLoad() {
    wx.request({
      url: this.rootUrl + '/con/getByFileID/' + this.$root.$mp.query.ciid,
      success: res => {
        console.log(res)
        let imgfiles = []
        const isImage = new RegExp(/.png|.jpg|.jpeg/)
        res.data.file.forEach(v => {
          if(isImage.test(v.pic_Name))
            imgfiles.push(this.rootAvatar + v.pic_Name)
          else
            this.videoSrc = v.pic_Name
        })
        this.imgfiles = imgfiles
        this.affair = res.data.ConsultantInfo
        this.affair.createDate = this.service.correctTime(this.affair.createDate)
        this.affair.consultant_Sex = this.affair.consultant_Sex == 1 ? '男' : '女'
      }
    })
  },
  onUnload(){
    this.affair = {}
    this.imgfiles = []
    this.videoSrc = ''
  }
}
</script>


<style lang="stylus" scoped>
.container
  position absolute
  padding 0 20rpx
  BorderBox()
  min-height 100%
  width 100%
  font-size 0
.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
.sub-info
  Font(30rpx, 50rpx)
  Flex(flex, , flex-start)
  >div
    &:nth-child(1)
      color grey
      width 25%
    &:nth-child(2)
      width 75%
.text
  Font(30rpx, 40rpx)
  text-align justify
video
  width 100%
</style>
