<template>
  <paper>
    <el-descriptions>
      <el-descriptions-item label="编号：">{{ commit.id }}</el-descriptions-item>
      <el-descriptions-item label="提交时间：">{{ formatTimestamp(commit.createdAt) }}</el-descriptions-item>
      <el-descriptions-item label="分数：">{{ commit.score }}</el-descriptions-item>
      <el-descriptions-item label="Git Commit ID：" :span="2">{{ commit.hash }}</el-descriptions-item>
    </el-descriptions>
  </paper>
<!--  <el-divider></el-divider>-->
  <el-table :data="commit.records">
    <el-table-column label="题目">
      <template #default="scope">
        <span>{{ scope.row.problem.name }}</span>
      </template>
    </el-table-column>
    <el-table-column label="状态" width="280">
      <template #default="scope">
        <el-tag :type="buildStatusToTagType(scope.row.status)">
          {{ buildStatusToTagContent(scope.row.status) }}
        </el-tag>
      </template>
    </el-table-column>
    <el-table-column prop="score" label="分数" width="180" />
    <el-table-column label="操作" width="260">
      <template #default="scope">
        <el-button
            type="primary"
            size="mini"
            @click="$router.push(`${$route.path}/record/${scope.row.id}`)"
        >详情</el-button>
        <el-button
            v-if="stopRecordButton(scope.row.status)"
            type="danger"
            size="mini"
            @click="dialog.stop = scope.$index"
        >
          停止
        </el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import Paper from "@/views/ProblemPage/components/Paper";
import {formatTimestamp, buildStatusToTagType, buildStatusToTagContent} from "@/utils/coder-utils";

export default {
  name: "CommitBoard",
  components: {Paper},
  props: {
    commitId: {
      type: Number,
      required: true
    }
  },
  data() {
    return {
      commit: {},
      dialog: {
        stop: -1
      },
      loading: false
    };
  },
  mounted() {
    this.fetchData();
  },
  methods: {
    fetchData() {
      this.$apis.getCommitByCommitId(this.commitId)
          .then(_res => {
            this.commit = _res.data.res;
            console.log(this.commit);
          }).catch(_err => {
        console.log(_err);

      });
    },
    formatTimestamp,
    buildStatusToTagType,
    buildStatusToTagContent,
    stopRecordButton(status) {
      if (this.commit.createdAt !== undefined) {
        return (
            status === "RUNNING" &&
            (Date.parse(new Date().toString()) / 1000 - this.commit.createdAt) /
            60 >
            7
        );
      }
      return false;
    }
  }
};
</script>

<style scoped>

</style>
