<template>
  <div>
    <div class="menu-title">
      我的好友
    </div>
    <div class="menu-content">
      <div>
        <el-table :data="list" style="width: 100%" v-loading="loading">
          <el-table-column type="index" label="行号" width="60"></el-table-column>
          <el-table-column prop="vid" label="用户ID"></el-table-column>
          <el-table-column prop="Labels" label="标签">
            <div slot-scope="scope">
              <template v-if="scope.row.Labels">
                <template v-for="(tag,index) in scope.row.Labels">
                  <el-tag :key="index" v-if="index < 5">{{ tag }}</el-tag>
                </template>
                <el-tag v-if="scope.row.Labels.length > 5">...</el-tag>
              </template>
            </div>
          </el-table-column>
          <el-table-column label="操作" width="240">
            <template slot-scope="scope">
              <el-button @click.native.prevent="feedbackHistory(scope.row)" type="text" size="small">
                Ta的喜欢
              </el-button>
              <el-button @click.native.prevent="similarUser(scope.row)" type="text" size="small">
                相似用户
              </el-button>
              <el-button @click.native.prevent="recommendItem(scope.row)" type="text" size="small">
                Ta的推荐
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>
import request, {getBaseUrl} from '@/utils/request';
import {getFriends} from "@/api/user";

var _this;
export default {
  name: "userManage",
  data() {
    return {
      list: [],
      loading: false,
    }
  },
  mounted() {
    _this = this;
    _this.queryData();
  },
  methods: {
    queryData() {
      _this.list = [];
      let myId = this.$store.getters.name;
      getFriends(myId).then(res => {
        let _list = res.data.nodes;
        _list.forEach(item => {
          if (item.vid !== myId) {
            _this.list.push(item);
          }
        });
      });
    },
    feedbackHistory(item) {
      _this.$router.push({
        path: "feedbackHistory", query: {
          userId: item.UserId,
          cursorArr: JSON.stringify(_this.cursorArr)
        }
      });
    },
    similarUser(item) {
      _this.$router.push({
        path: "similarUser", query: {
          userId: item.UserId,
          qo: JSON.stringify(_this.qo)
        }
      });
    },
    recommendItem(item) {
      _this.$router.push({
        path: "recommendItem", query: {
          userId: item.UserId,
          qo: JSON.stringify(_this.qo)
        }
      });
    }
  }
}
</script>

<style lang="scss">
</style>
