<template>
  <div>
    <div>
      <el-row>
        <el-button @click="returnTestPlanList">返回</el-button>
        <el-button type="danger" @click="performApiTestPlan">执行</el-button>
      </el-row>
      <div>
        <el-table
            :data="tableData"
            style="width: 100%">
          <!--                    :default-sort = "{prop: 'date', order: 'descending'}">-->
          <el-table-column
              prop="id"
              label="id"
              sortable
              width="180">
          </el-table-column>
          <el-table-column
              prop="api_test_result_name"
              label="测试报告名称"
              sortable
              width="180">
          </el-table-column>
          <el-table-column
              prop="api_total_number"
              label="总数"
              sortable
              width="180">
          </el-table-column>
          <el-table-column
              prop="api_successful_total_number"
              label="成功"
              sortable
              width="180">
          </el-table-column>
          <el-table-column
              prop="api_error_total_number"
              label="失败"
              sortable
              width="180">
          </el-table-column>

          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button
                  size="mini"
                  type="danger"
                  @click="detailsApiPlanReport(scope.row)">查看报告</el-button>
              <el-button
                  size="mini"
                  type="danger"
                  @click="deleteTestPlanReport(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[1,10, 20, 30, 40, 50]"
            :page-size="size_page"
            layout="total, sizes, prev, pager, next, jumper"
            :total="api_result_total"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import {
  deleteApiTestPlanResultRequest,
  getApiPlanResultRequest,
  postPerformApiPlanRequest
} from "../../../../api/apiAutomation/apiTestPlan";
import {deleteApiCaseResultRequest} from "../../../../api/apiAutomation/apiTestTask";

export default {
  name: "apiTestPlanResult",
  inject:['reload'],
  props: ['apiTestPlanData', 'apiTestPlanId'],
  data(){

    return{

      tableData: [],
      currentPage: 1,
      size_page: 10,
      testPlanId: "",
      api_result_total : 0,
      result_id: "",
      api_Result: "",


    }



  },
  mounted() {
    this.getApiPlanResultFun()
  },
  methods: {
    detailsApiPlanReport(data){
      const {href} = this.$router.resolve({
        path: '/api_test_plan_result',
        query: {
          apiResultId:data.id,
        }
      })
      window.open(href, '_blank')

    },

    // 删除测试报告
    deleteTestPlanReport(data){
      this.$confirm('此操作将永久删除该报告, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.result_id = data.id
        deleteApiTestPlanResultRequest(this.result_id).then(data =>{
          if (true === data.data.success){
            this.getApiPlanResultFun()
            this.$message.success("删除API测试报告成功")
          }
          else {
            this.$message.error("删除API测试报告失败")
          }

        })

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });

    },

    // 页签-条/页 跳转
    handleSizeChange(val) {
      this.size_page = val
      this.getApiPlanResultFun()

    },
    // 底部页签跳转
    handleCurrentChange(val) {
      this.currentPage = val
      this.getApiPlanResultFun()

    },

    // 获取测试报告
    getApiPlanResultFun() {
      getApiPlanResultRequest(this.testPlanId,this.size_page, this.currentPage).then(data =>{
        if (true === data.data.success){
          this.tableData = data.data.data.data;
          this.api_result_total = data.data.data.api_result_total;

        }else {
          this.$message.info("获取接口失败")
        }

      })
    },

    // 返回测试计划列表
    returnTestPlanList(){
      this.$parent.returnApiPlanList();

    },

    // 执行测试任务
    performApiTestPlan(){
      postPerformApiPlanRequest(this.testPlanId).then(data => {
        if (true === data.data.success){
          this.$message.success("执行测试计划成功")
        }
        else if(10200 === data.data.error.code.status){
          this.$message.error("当前有测试计划正在执行！")

        }
        else {
          this.$message.error("执行API测试计划失败")
        }
      })
    },


  },
  components: {
  },
  created() {
    this.testPlanId = this.apiTestPlanData.id

  }
}
</script>

<style scoped>

</style>