<template>
	<!-- 权限管理确认  任务：我处理的 -->
	  <div style="padding:20px">
		<el-form :inline="true">
			<el-form-item label="名称">
				<el-input v-model="queryParams.taskName" size="small" placeholder="请输入任务名称"></el-input>
			</el-form-item>
			<el-form-item label="处理人">
				<el-input v-model="queryParams.handlePersonName" size="small" placeholder="请输入发起人名称"></el-input>
			</el-form-item>
			<el-form-item label="类型">
				<el-select clearable v-model="queryParams.type" size="small" placeholder="请选择任务类型">
					<el-option v-for="(item,key) in reportType" :key="key" :label="item" :value="key"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item>
				<el-button type="" size="small" @click="getList">查询</el-button>
			</el-form-item>
		</el-form>
       <!-- <div style=" margin-bottom: 10px; float: right;" >
          <div class="btn1" @click="sift" style="width:80px;height:32px;right: 100px;display:flex;justify-content:space-around;border-radius:5px; cursor: pointer; background-color: rgb(144 147 153);">
            <img src="@/assets/img/filtrationSearch.png" alt="" style="width:16px;height:16px;margin-top:9px;margin-left:8px"><p style="margin:0 8px 0 0;line-height:32px;color:white;font-size:14px">筛选 </p> 
          </div>
      </div> -->
		  <!-- 序号/任务名称/创建人/创建时间/状态/完成时间/操作 -->
		  <el-table
			border
			style="width: 100%;"
			:data="tableData"
			v-loading="loading"
			header-row-class-name="custom-table-header"
			:default-sort="{ prop: 'date', order: 'descending' }"
		>
			  <el-table-column prop="id" type="index" label="序号" width="100" align="center"></el-table-column>
			  <el-table-column prop="taskName" label="任务名称" width="230" align="center">
          <template slot-scope="scope">
            <div v-if="scope.row.type==0">
              {{scope.row.taskName}}
            </div>
            <div v-else @click="rowTaskType(scope.row)">
              <el-link type="primary">{{scope.row.taskName}}</el-link>
            </div>
          </template>
        </el-table-column>
			  <el-table-column prop="handlePersonName" label="处理人" width="150" align="center"></el-table-column>
			  <el-table-column prop="createName" label="发起人" width="150" align="center"></el-table-column>
			  <el-table-column prop="createTime" label="创建时间" sortable width="180" align="center"></el-table-column>
			  <el-table-column prop="endTime" label="期限" sortable width="200" align="center"></el-table-column>
			  <el-table-column prop="remark" label="备注" sortable width="200" align="center"></el-table-column>
			  <el-table-column prop="type" label="类型" sortable width="120" align="center">
				<template slot-scope="scope">
					<div>
					{{reportType[scope.row.type]}}
					</div>
				</template>
			  </el-table-column>
        <!-- <el-table-column label="任务进度" align="center" min-width="200px" show-overflow-tooltip>
            <template slot-scope="scope">
              <el-progress :text-inside="true" :stroke-width="20" :percentage="scope.row.progress" :color="customColors"></el-progress>
            </template>
        </el-table-column> -->
			  <el-table-column prop="taskStatus" label="状态" sortable width="120" align="center">
				<template slot-scope="scope">
					<div>
					{{status[scope.row.taskStatus]}}
					</div>
				</template>
			  </el-table-column>
			  <el-table-column prop="finishTime" label="实际完成时间" width="180" sortable  align="center"></el-table-column>
			  <el-table-column prop="result" label="结果" sortable  align="center">
				<template slot-scope="scope">
					<div v-if="scope.row.type==0">
						<span v-if="btnObj.filter(item=>{return item.value == scope.row.result}).length>0">{{btnObj.filter(item=>{return item.value == scope.row.result})[0].label}}</span>
					</div>
					<div v-else>
						{{status[scope.row.taskStatus]}}
					</div>
				</template>
			  </el-table-column>
		  </el-table>
		  <div style="text-align: center;">
        <el-pagination background layout="total, prev, pager, next, jumper" :current-page.sync="queryParams.current"
          :page-size.sync="queryParams.size" @current-change="handleCurrentChange" :total="total">
        </el-pagination>
	    </div>
	  </div>
</template>
  
  <script>
  export default {
	// props:['activeName','reportType','status'],
	props:['reportId'],
	data() {
    return {
      // customColors: [
      //   {color: '#f56c6c', percentage: 20},
      //   {color: '#e6a23c', percentage: 40},
      //   {color: '#5cb87a', percentage: 60},
      //   {color: '#1989fa', percentage: 80},
      //   {color: '#6f7ad3', percentage: 100}
      // ],
		tableData:[],
		form:[],
		size:'',
		taskId:'',
		remark:'',
		btn:{
				label:'同意创建',
				value:1
			},
    queryParams: {
      reportId:this.reportId,
		  size: 10,
		  current: 1,
		  taskStatus:"",
		  roleInTask:1,
		  taskName:'',
		  handlePersonName:'',
      type: null,
		},
		btnObj:[
			{
				label:'同意创建',
				value:1
			},
			{
				label:'取消创建',
				value:4
			},
			{
				label:'缺少材料',
				value:5
			}
		],
		total: 0,
		loading:false,
      showDialog: false,
      // finish: {
      //           '0':'未完成',
      //           '1':'完成'
      //         },
      status: ['未完成', '已完成','负责人处理中'],
      taskId: null,
      visible: false,
      siftForm:{},
	  };
	},
	watch:{
	  // activeName(val){
		// this.queryParams.taskStatus = this.activeName=='first'?0:1
		//   this.getList()
	  // }
  },
  computed:{
    reportType(){
      var a = this.$store.state.dictMessage.dictMessage.TASK_TYPE
      console.log(a);
      var b = {}
      if(a){
         a.forEach(item => {
          b[item.dictChildValue] = item.dictChildLabel
        });
        return b
      }
     return []
      
    }
  },
	mounted() {
    this.getList()
	},
  methods: {
	  //查询任务
    getList() {
      console.log(this.queryParams);
      this.loading=true
      this.$api.ReviewTheTasks(this.queryParams).then(response => {

        response.data.forEach(item=>{//传任务id
          if(item.type!=0){
            this.$api.taskProgress({id:item.id}).then(response=>{
              if(response.code == 200){
                item.progress =Number((response.data.finish / response.data.total *100).toFixed(2))
              }
            })
          } else {
            if(item.taskStatus == 1){
              item.progress = 100
            }else{
              item.progress = 0
            }
          }
         
		  })
        this.tableData = response.data
        this.total = response.pageColumn.total
        this.loading=false
      })
    },
    //点击任务名称
    rowTaskType(row) { 
      if (row.type==1) {
        let a=this.$router.resolve({
          path: '/Incomplete',
          query: {
            taskStatus: this.queryParams.taskStatus,
            taskId: row.id,
            reportId:row.reportId,
            type:row.type,
            signPatentNo: row.signPatentNo,
            reportType:3,
            taskWorkRemak:0,
          }
        })
        window.open(a.href,"_blank")
      } else {
        let a=this.$router.resolve({
          path: '/Incomplete',
          query: {
            taskStatus: this.queryParams.taskStatus,
            taskId: row.id,
            reportId:row.reportId,
            type:row.type,
            signPatentNo:row.signPatentNo,
          }
        })
        window.open(a.href,"_blank")
      }
      
    },
    
	  //切换按钮
	  // onChangeFamily(key) {
		// this.btn = key
	  // },
	  //完成任务
    handleEdit(row) {
      switch (row.type) {
        case 0://开卷
          this.bookReviewTask(row)
          break;
        case 1://协同
          this.coordinationTask(row)
          break;
        case 2://对比
		case 3://初筛
          this.contrastTask(row)
          break;
      
        default:
          break;
      }
    },
    // handleFinsh(row) {
    //   console.log(row);
    //   this.$api.taskFinish({id:row.id}).then((res) => {
    //     console.log("成功");
    //     this.getList()
    //   })
    // },
    // bookReviewTask(row) {
    //   this.taskId = row.id
    //   var queryParams={
    //     reportId:row.reportId
    //   }
    //   this.$api.QueryReport(queryParams).then(response=>{
    //     console.log(response)
    //     this.showDialog=true
    //     this.form = response.data[0]
    //   })
    // },
    coordinationTask(row){},
    contrastTask(row) {
		// this.$store.commit('SET_ADMIN_SIGNPATENTNO',row.signPatentNo)
		// console.log(row.signPatentNo,this.$store.state.admin)
		// localStorage.signPatentNo = row.signPatentNo
    // console.log(row);
      let a=this.$router.resolve({
        path: '/Incomplete',
        query: {
          // taskStatus: this.queryParams.taskStatus,
          taskId: row.id,
          reportId:row.reportId,
          type:row.type,
          signPatentNo:row.signPatentNo
        }
      })
      window.open(a.href,"_blank")
    },
	  // submit(){
		// var a = {
		// 	taskId:this.taskId,
		// 	status:1,
		// 	remark:this.remark,
		// 	result: this.btn.value,
		// 	reportStatus:this.btn.value
    //   }
    // console.log(a);
    //   this.$api.AuditTask(a).then(response => {
    //   console.log(response);
		// 	if(response.code == 200){
		// 		// this.$message.success('审核通过')
		// 		this.showDialog = false
		// 		this.getList()
		// 	}
		// })
	  // },
	  //分页
	  handleCurrentChange(val) {
		this.queryParams.current = val;
		this.getList();
	  },
	  //关闭弹窗
	  handleClose(){
		this.showDialog = false
	  }
	},
	
  };
  </script>
  
  <style lang="scss" scoped>
  </style>