<template>
  <el-card class="box-card" style="margin-left: 0px;height: 407px;">
    <div slot="header" class="clearfix">
      <img src="../../assets/image/sq.png" style="display: block;float: left;margin: 1px 5px 0 0;" height="15" width="17"/>
      <span>我的申请</span>
      <el-button style="float: right; padding: 3px 0;color: #000000;" type="text" @click="more">更多</el-button>
    </div>

      <el-table :data="myApplication" size="mini" style="width: 100%;" :header-cell-style="{}">
        <!--             <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>-->
        <el-table-column prop="taskName" label="流程名称"  width="180" align="left">
          <template slot-scope="scope">
            <el-button type="text"  style="color: #606266"><span>{{scope.row.taskName}}</span></el-button>
          </template>
        </el-table-column>
        <el-table-column prop="fwtitle" label="标题"  align="left" >
          <template slot-scope="scope">
            <el-button type="text" @click="myAppReturn(scope.row)" style="color: #606266">{{scope.row.fwtitle}}</el-button>
          </template>
        </el-table-column>

        <el-table-column prop="dispose" label="当前处理"  width="180" align="center" >
          <template slot-scope="scope">
            <el-button type="text"  style="color: #606266"><span>{{scope.row.dispose}}</span></el-button>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="180" align="center">
          <template slot-scope="scope">
            <el-button type="text"  style="color: #606266"><span>{{scope.row.create_time | timefilters}}</span></el-button>
          </template>
        </el-table-column>
      </el-table>


    <el-dialog id="actform" title="流程详情" :visible.sync="actOpen" :before-close="cancel" append-to-body width="80%"
               top="10" height="90%">
      <!-- 动态引入组件-->
      <component :is="actForm" :data="details":actOpen="actOpen" @getList="getList" ></component>
    </el-dialog>

  </el-card>
</template>

<script>
  import { listInfo} from '@/api/system/meapply/meapply'
  import {getStartFormKey } from '@/api/activiti/process/startprocess'
  import moment from "moment";
  export default {
    filters: {
      timefilters(val) {
        if (val == null || val == "") {
          return "暂无时间";
        } else {
          let d = new Date(val);   //val 为表格内取到的后台时间
          let month =
            d.getMonth() + 1 < 10 ? "0" + (d.getMonth() + 1) : d.getMonth() + 1;
          let day = d.getDate() < 10 ? "0" + d.getDate() : d.getDate();
          let hours = d.getHours() < 10 ? "0" + d.getHours() : d.getHours();
          let min = d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes();
          let sec = d.getSeconds() < 10 ? "0" + d.getSeconds() : d.getSeconds();
          let times=d.getFullYear() + '-' + month + '-' + day + ' ' + hours + ':' + min + ':' + sec;
          return moment(val).format("YYYY-MM-DD HH:mm")
        }
      }
    },
    data() {
      return {
        //流程遮罩层
        actOpen: false,
        //传入到下一页面的值
        details:{getactkey: '',
          formId:'',
          flg:'2'},
        actForm: null,
        doneList: [],
        queryParams: {
          pageNum: 1,
          pageSize: 7,
          // orderByColumn: "createTime",
          // isAsc:"desc",//排序方式
        },
        myApplication: [
          {
            title:'',
            taskName:'',
            applyUser:'',
            createUserName :'',
            taskid: '',
            fwtitle: '',
            fwdept: '',
            create_time: '',
            dispose: '',
            definitionId:'',
            businessKey:''
          }
        ],
      }
    },
    created() {
      this.getList();
    },
    methods:{
      getList() {
        this.loading = true;
        //我的申请
        listInfo(this.queryParams).then(response => {

          this.myApplication=response.rows
          if(this.myApplication.length<7){
            this.myApplication.length=response.rows.length
          }else{
            this.myApplication.length=7
          }
          // this.title = response.title;
          this.loading = false;
          // this.$emit('getNum','sq',response.total)
          // this.loading = true
        });

      },
      myAppReturn(row){
        var actkey=row.definitionId
        var id=row.businessKey
        let vue = this
        actkey=actkey.split(":")[0];
        this.details.getactkey = actkey//动态传参到下面的页面
        this.details.formId = id//动态传参到下面的页面
        getStartFormKey(actkey).then(response => {
          var path = response.msg
          this.actForm = () => Promise.resolve().then(() => require(`@/views/${path}`))
        })
        this.actOpen = true
        return vue.actForm = this.actForm
        // const actkey = row.actkey
        // const form = row || this.form
        // this.$router.push({path:'/actwork/havedone/havedetails',query: {bd:form,id:actkey }})
      },
      more(){
        this.$router.replace('/meapply')
      },

    }
  }
</script>
<style lang="less" scoped>
  .clearfix{
    color:#1890ff;
  }
  .el-card__header{
    background: #f5f5f5;
  }
  .body{
    height: 319px;
  }
  .el-card__body {
    padding: 15px 20px 20px 20px;
    height: 354px;
  }

</style>
