<template>
    <div class="past-meeting">
        <el-empty style="height:100%" v-if="pastList.length == 0" :image="require('@/assets/images/empty.png')" description="暂无数据~"></el-empty>
        <el-scrollbar style="height: 100%" v-else>
          <div class="collapse-con">
            <div class="collapse-item" v-for="i in pastList" :key="i.id">
              <div class="collapse-left"><i class="el-icon-caret-right" @click="changePanel(i.id)" :class="{'active': currentPanel == i.id}"></i></div>
              <div class="collapse-right">
                <div class="past-head" @click="changePanel(i.id)">
                  <div class="past-right">
                    <div>
                      <p>{{i.subject}}</p><el-tag :style="{cursor: i.meetingNodeStatus == 6 ? 'pointer' : 'default'}" @click.stop="check(i)" size="small"
                        >{{i.meetingType == 'MDT会议' ? 'MDT会议' : 'Tumor Board会议'}}</el-tag
                      >
                    </div>
                    <p>{{getTimeStr(i.endTime)}}</p>
                  </div>
                  <div class="btn-cancle">
                    <i class="iconfont iconyijieshu" v-if="i.meetingNodeStatus == 6"></i>
                    <i class="iconfont iconyibohui" v-if="i.meetingNodeStatus == 7"></i>
                  </div>
                </div>
                <el-collapse-transition>
                  <div class="past-content" v-if="currentPanel == i.id">
                    <!--会议信息组件-->
                    <meetingTemps
                    v-bind="$attrs"
                    v-on="$listeners"
                    @refreshList="refreshList"
                    :step="4"
                    :item="item"
                    v-model="isEdit"/>
                  </div>
                </el-collapse-transition>
              </div>
            </div>
          </div>
        </el-scrollbar>
        <!--pdf预览-->
        <previewPdf ref="checkPdf"/>
    </div>
</template>
<script>
import previewPdf from '../components/previewPdf.vue'
import moment from 'moment'
import { getMdtMeetingList, getInfoById } from '@/request/mdt.js'
import meetingTemps from '../components/meeting-temps.vue'
export default {
    components: { meetingTemps, previewPdf },
    props: {
      step: {
        type: [Number, String],
      },
      patientId: [Number, String],
      oldMdtId: [Number, String],
    },
    inject: ['topObj'],
     data () {
    return {
      currentPanel: 0,
      current: 0,
      edit: true,
      isEdit: false,
      item: {
        "mdtMeeting": {
            "meetingNodeStatus": 1,            //改版新增的参数 mdt会议节点 0'会议节点:1召集  2准备  3进入  4结束  5填写  6归档'; 
            "createMeetingTemporaryStatus": 1  //改版新增的参数   暂存状态: 暂存(会议没填写完) 0   完成(会议填写完成) 1
        },
        doctorList: []
      },
      pastList: [],
      currentId: ''
    }
  },
  watch: {
    patientId: {
      handler(v){
        if(v) this.getMdtMeetingList()
      },
      immediate: true
    },
    step(v){
      if(v == 6) {
        this.getMdtMeetingList()
        this.getMeetingInfo()
      }
    },
    oldMdtId: {
      handler(v){
        if(v) {
          this.currentId = v;
          this.getMeetingInfo(() => {
            this.currentPanel = v
          })
          this.$emit('refresh',v)
        }
      },
      immediate: true
    }
  },
  methods: {
    //显示时间处理
    getTimeStr(time) {
      return moment(time).format('YYYY/MM/DD')
    },
    //获取会议信息
    getMeetingInfo(cal) {
      getInfoById(this.currentId).then(({data,code,msg}) => {
        this.topObj.handleOption(1,{pointLoading: false})
          if(code === 0){
            this.item = {
              mdtMeeting: {
                ...data
              },
              doctorList: data.doctorList || []
            }
            cal ? cal() : null
          } else {
            this.$message.error(msg)
          }
        })
    },
    //过往会议面板点击获取会议信息
    changePanel (i) {
      this.currentId = i;
      this.topObj.handleOption(2,'')
      if(this.currentPanel === i){
        this.currentPanel = '';
      } else {
        this.topObj.handleOption(1,{pointLoading: true})
        this.$emit('refresh',i)
        this.getMeetingInfo(() => {
          this.currentPanel = this.currentPanel === i ? '' : i;
        })
      }
    },
    //获取既往历史会议列表
    async getMdtMeetingList () {
      const { code, data, msg} = await getMdtMeetingList(this.patientId)
      if(code === 0) {
        this.pastList = data
      } else {
        this.$message.error(msg)
      }
    },
    //查看拼接的pdf
    check(i) {
      //会议退回之后不能再查看拼接的pdf
      if(i.meetingNodeStatus == 7){
        return
      }
      this.$refs.checkPdf.open({src: i.mergePdfUrl})
    },
    refreshList(e) {
      if(e){

      } else {
        this.getMdtMeetingList()
      }
    }
  }
}
</script>
<style lang="less" scoped>
.past-meeting {
    height: 100%;
    padding-top: 10px;
    .collapse-con {
      // padding: 10px;
    }
    /deep/ .el-scrollbar__wrap {
      overflow-x: hidden;
    }
}
.collapse-item {
  display: flex;
  margin-bottom: 10px;
  margin-right: 15px;
  margin-left: 10px;
  .collapse-left {
    height: 65px;
    line-height: 65px;
    i {
      margin-right: 5px;
      font-size: 18px;
      color: #409EFF;
      transform: rotate(0);
      transition: transform 0.5s;
    }
    .active {
      transform: rotate(90deg);
      transition: transform 0.5s;
    }
  }
  .collapse-right {
    border: 1px solid #b2d6ff;
    flex: 1;
    background: #f2f5f9;
    border-radius: 8px;
    overflow: hidden;
    // padding: 0 12px;
    .el-tag {
      height: 20px;
      margin-left: 15px;
      font-weight: 400;
      border-radius: 10px;
      background: #e6f7ff;
      border: 1px solid #91d5ff;
      font-size: 12px;
      font-family: PingFangSC, PingFangSC-Regular;
      line-height: 18px;
      color: #1890ff;
    }
  }
}
 .past-head {
   height: 65px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: PingFangSC, PingFangSC-Regular;
    padding: 0 10px 0 20px;
    .past-right {
      flex: 1;
      overflow: hidden;
      div {
        display: flex;
        align-items: center;
        p {
          max-width: 240px;
          font-size: 14px;
          font-family: PingFangSC, PingFangSC-Semibold;
          font-weight: 600;
          color: rgba(0, 0, 0, 0.85);
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
          margin: 0;
        }

      }
      > p {
        margin: 0;
        line-height: 24px;
        font-size: 14px;
        opacity: 0.6;
      }
    }
    .btn-cancle {
      width: 66px;
      height: 66px;
      line-height: 66px;
      text-align: center;
      color: #3e98ff;
      cursor: pointer;
      i {
        font-size: 60px;
        opacity: 0.5;
      }
      i.iconyibohui {
        color: #E92626;
      }
    }
  }
    .past-content {
    border-top: 1px dashed #b2d6ff;
    display: flex;
    flex-wrap: wrap;
    padding: 12px 0 10px;
    background-color: #fff;

  }
</style>
