<template>
  <div >
    <!-- 无效流程 -->
    <div style="display: flex;justify-content: end;margin-bottom: 10px;" v-if="!taskId">
      <!-- <el-button type="primary" size="small" @click="addOption">添加陈述意见</el-button> -->
      <el-dropdown @command="handleCommand">
        <el-button type="primary" size="small">
          添加无效请求书<i class="el-icon-arrow-down el-icon--right"></i>
        </el-button>
        <el-dropdown-menu slot="dropdown" >
          <el-dropdown-item command="1">添加无效请求书</el-dropdown-item>
          <el-dropdown-item command="6">添加权要修改记录</el-dropdown-item>
          <el-dropdown-item command="7">补充证据及理由记录</el-dropdown-item>
          <el-dropdown-item command="2">添加陈述意见书</el-dropdown-item>
          <el-dropdown-item command="0">添加口审记录</el-dropdown-item>
          <el-dropdown-item command="3">添加无效决定书</el-dropdown-item>
          <el-dropdown-item command="4">添加行政诉讼书</el-dropdown-item>
          <el-dropdown-item command="5">添加行政诉讼判决书</el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>
    <div >
      <el-timeline>
        <el-timeline-item v-for="item in timelineList" :timestamp="item.occurredTime" :key="item.id" placement="top">
          <el-card>
            <div>
              <span>{{ timeType[item.affairType] }}：</span><span>{{ item.occurredTime}}</span>
              <div style="float: right;">
                  <span style="margin-right: 10px;"  @click="edit(item)"><el-link>编辑</el-link></span>
                  <span  @click="dele(item)"><el-link>删除</el-link></span>
              </div>
            </div>
            
            <div v-if="item.affairType==0">
              <p><span>地点：</span><span>{{ item.oralTrailVO.position }}</span></p>
              <p><span>参与人：</span><span>{{ item.oralTrailVO.participator }}</span></p>
            </div>
            <div v-if="item.affairType==1">
              <p><span>发文日：</span><span>{{ item.invalidRequestFileVO.invalidFileSendDate }}</span></p>
            </div>
            <div v-if="item.affairType==3">
              <p><span>决定书号码：</span><span>{{ item.invalidDecisionFileVO.fileNo }}</span></p>
              <p><span>法律依据：</span><span>{{ item.invalidDecisionFileVO.legalBase }}</span></p>
              <p><span>决定要点：</span><span>{{ item.invalidDecisionFileVO.decisionKey }}</span></p>
              <p><span>结论：</span><span>{{ item.invalidDecisionFileVO.conclusion }}</span></p>
            </div>
            <div>
              <p>备注：{{ item.description }}</p> 
            </div>
            <div style="margin-top: 10px;">
              <div v-if="item.systemFileList" class="upload-file">
                <div v-for="(file, index) in item.systemFileList" :key="index" style="margin:0;display:flex;justify-content:space-around;">
                  <p style="margin:0;width:calc(100% - 40px);overflow: hidden;white-space: nowrap;text-overflow:ellipsis;cursor: pointer;">{{file.originalName}}</p> 
                  <myMenu :data="file" @delFile="delFile(file,item)" :isDelete="true" ></myMenu>
                </div>
              </div>
            </div>
          </el-card>
        </el-timeline-item>
      </el-timeline>
    </div>

    <responseDialog ref="responseDialog" :projectId="projectId" @save="getList"></responseDialog>
  </div>
</template>

<script>
import responseDialog from '../dialog/editFlowPath.vue'

export default {
  props:['projectId','signPatentNo','taskId'],
  components: {
    responseDialog,
  },
  data() {
    return {
      timelineList:[],
      isOpen: false,
      isOpenNum: null,
      form: {},
      queryParams: {},
      timeType: {
        '1': '提出无效时间',
        '2': '陈述答复时间',
        '0': '口审时间',
        '3': '无效决定时间',
        '4': '发起诉讼时间',
        '5': '法院判决时间',
        '6':  '权要修改时间',
        '7':  '补充证据和理由时间',
      },
    }
  },
  computed: {},
  watch: {},
  mounted() {
    this.getList()
  },
  methods: {

    getList() {
      this.queryParams.projectId = this.projectId
      // 1正序
      this.queryParams.orderBy = 1
      this.$api.queryReportAffair(this.queryParams).then((res) => {
        if (res.code==200) {
          this.timelineList = res.data.data
        }
      }).catch((error) => {
        
      })
    },

    // 删除文件
    delFile(file,item) {
      var index = item.systemFileList.findIndex(i=>{
        return item.guid == file.guid
      })
      if(index !=-1){
        item.systemFileList.splice(index,1)
      }
      var form = {
        description:item.description,
        systemFileList:item.systemFileList,
        ...item[field[item.affairType]]
      }
    },
    // 编辑
    edit(item) {
      var field= {
        0:'oralTrailVO',
        1:'invalidRequestFileVO',
        2:'stateOpinionVO',
        3:'invalidDecisionFileVO',
        4:'adminProceedVO',
        5:'judgementVO',
        6:'claimHistoryVO',
        7:'supplyEvidenceVO'
      }
      var form = {
        id:item.id,
        projectId:item.projectId,
        affairType:item.affairType,
        description:item.description,
        systemFileList:item.systemFileList,
        ...item[field[item.affairType]]
      }
      this.$refs.responseDialog.open(item.affairType,form)
    },
    // 删除
    dele(item) {
      var ids = [item.id]
      this.$confirm('确认删除本条数据吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$api.deleteReportAffair(ids).then((res) => {
            if (res.code==200) {
              this.$message.success('删除成功')
              this.getList()
            }
          })
        }).catch(err => {
          this.$message.error('删除失败')
      })
      
    },
    // 添加
    handleCommand(option) {
      var form = {
        systemFileList:[]
      }
      form.type = option
      this.$refs.responseDialog.open(option,form)
    },
  },
}
</script>

<style lang="scss" scoped>
.edit{
  float: right;
  margin-right: 10px;
}
</style>