<template>
  <!-- 互评记录 -->
  <el-card v-loading="loading">
    <div class="mutualRecord">
      <div class="recordDiv" v-for="(item, index) in resultData" :key="index">
        <div class="record-list">
          <div class="left">
            <div>
              <span style="color: #171721;">{{item.user_name}}</span>
              <span style="font-size: 12px;color: #8083a3;margin-left: 10px;">{{item.create_dateline}}</span>
            </div>
            <div>
              <el-rate size="large" disabled v-model="item.ksh_star" allow-half />
            </div>
          </div>
          <div class="right">双师一生 -- {{item.kc_name}}</div>
        </div>
        <el-divider border-style="dashed" />
      </div>
    </div>
  </el-card>
</template>

<script>
export default {
  data() {
    return {
      loading: false,
      resultData: [
        {
          name: "余枫",
          time: "2021-01-23 11:15",
          title: "走进生肖文化寅虎卯兔",
          score: 4.5,
          fl: "双师一生"
        },
        {
          name: "余枫",
          time: "2021-01-23 11:15",
          title: "走进生肖文化寅虎卯兔",
          score: 4.5,
          fl: "双师一生"
        }
      ]
    }
  },
  methods: {
    initData() {
      this.loading = true;
      request({
        url: '/kzkt/ssyskc_hpjl/index',
        data: {}
      }).then(res => {
        if (res.code == 1) {
          this.resultData = res.data.page_data;
          this.loading = false;
        }
      })
    }
  },
  created() {
    this.initData();
  }
}
</script>

<style lang="scss" scoped>
.mutualRecord {
  padding: 20px;
  .recordDiv {
    .record-list {
      padding: 0 30px;
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      font-size: 14px;
      .left {
      }
      .right {
        color: #00a3ff;
        line-height: 40px;
      }
    }
    .el-divider--horizontal {
      margin: 15px 0;
    }
  }
}
</style>