cpdm_manage/src/views/manage/gameRecordDetail.vue

<template>
  <div class="record-warp">
    <div class="record-main">
      <el-row>
        <el-col :span="24">

          <div class="search-head">
            <el-input
                v-model="keyword"
                clearable
                class="main_input"
                placeholder="请输入账号"
            ></el-input>&nbsp;&nbsp;
            <el-date-picker
                clearable
                class="popperClass"
                v-model="value1"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                @change="timeFo"
            >
            </el-date-picker>&nbsp;&nbsp;
            <el-button type="primary" @click="searchTarget">搜索</el-button>
          </div>

        </el-col>
      </el-row>

      <div class="table-content">
        <el-table
          :data="tableData"
          :row-style="{ height: '0px' }"
          :cell-style="{ padding: '5px' }"
        >
          <el-table-column
            prop="gameName"
            label="游戏名称"
            align="center"
            width=""
          >
          </el-table-column>
          <el-table-column prop="userId" label="账号" align="center" width="">
          </el-table-column>
          <el-table-column
            prop="updateTime"
            label="测试时间"
            align="center"
            width=""
          >
          </el-table-column>
          <el-table-column
            prop="totalScore"
            label="得分"
            align="center"
            width=""
          >
          </el-table-column>
          <!-- <el-table-column label="操作" width="" align="center">
            <template slot-scope="scope">
              <el-button
                @click.native.prevent="view(scope.$index, scope.row)"
                type="text"
                size="small"
                style="font-size: 14px"
              >
                查看
              </el-button>
            </template>
          </el-table-column> -->
        </el-table>
      </div>

      <el-pagination
        small
        background
        @current-change="handleCurrentChange"
        :current-page.sync="pageNum"
        layout="total, prev, pager, next"
        :page-size="pageSize"
        :total="total"
      >
      </el-pagination>
      <!-- <el-pagination small background layout="total prev, pager, next" :total="36">
      </el-pagination> -->
    </div>
  </div>
</template>

<script>
import { oSessionStorage } from "../../utils/utils";

export default {
  name: "gameRecordDetail",
  components: {},
  data() {
    return {
      startTime: "",
      endTime: "",
      value1: null,
      total: 0,
      pageSize: 10,
      pageNum: 1,
      keyword: "",
      tableData: [],
      userInfo: {}, //用户信息
      gameId: "", //用户id
      type: 0, //用户查询类型0超管查询某游戏所有普通用户;1医生查询某游戏所有下属普通用户;2代理查询某游戏所有下属普通用户
    };
  },
  created() {},
  mounted() {
    this.userInfo = JSON.parse(oSessionStorage.getItem("userInfo"));
    this.gameId = sessionStorage.getItem("gameManageId");
    this.type = this.userInfo.roleType == 1 ? 0 : this.userInfo.roleType == 2 ? 1 : this.userInfo.roleType == 3 ? 2 : "";
    this.searchTarget();
  },
  methods: {
    timeFo(val) {
      if (val !== null) {
        this.startTime = this.formatterTime(val[0]);
        this.endTime = this.formatterTime(val[1]);
      } else {
        this.startTime = "";
        this.endTime = "";
      }
      this.searchTarget();
    },
    formatterTime(val) {
      let year = val.getFullYear();
      let month = val.getMonth() + 1;
      if (month < 10) {
        month = "0" + month;
      }
      let day = val.getDate();
      if (day < 10) {
        day = "0" + day;
      }
      return year + "-" + month + "-" + day;
    },
    //格式化时间
    view(val, value) {
      //跳转页面
      sessionStorage.setItem("manageUserId", value.id);
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.searchList();
    },
    //根据现有情况进行搜索
    searchList() {
      this.$http.get(
        `gameRecord/findListByGameFlag?beginTime=${this.startTime}&endTime=${this.endTime}&phone=${this.keyword}&pageNum=${this.pageNum}&pageSize=${this.pageSize}&gameFlag=${this.gameId}&type=${this.type}&invitationCode=${this.userInfo.invitationCode}`,
        {},
        (res) => {
          // console.log(res,'用户测试记录')
          if (res && res.code == 200) {
            this.tableData = res.data.userEntities;
            this.total = res.data.num;
          } else {
            // this.$toast.fail(res.msg);
            this.$message.error(res.msg);
          }
        }
      );
    },
    searchTarget() {
      this.pageNum = 1;
      this.searchList();
    },
    //跳转首页
    goHome() {
      this.$router.push({ path: "/home" });
    },
    //跳转记录页
    goRecord() {
      this.$router.push({ path: "/record" });
    },
    //退出登陆
    logout() {
      oSessionStorage.removeItem("userInfo");
      oSessionStorage.removeItem("token");
      this.$router.push({ path: "/" });
    },
    //点击日历获取日期
    getDate(param) {
      // console.log(param,"日期。。。")
      this.userRecord(param.dateStr);
    },
    //点击获取月出勤次数
    getTimes(param) {
      this.monthTimes = param;
    },
    // 用户测试记录显示
    userRecord(date) {
      this.$http.get(
        `gameRecord/findListByUserIdAndDate/${this.userId}/${date}`,
        {},
        (res) => {
          // console.log(res,'用户测试记录')
          if (res && res.code == 200) {
            this.listData = res.data;
          } else {
            this.$toast.fail(res.msg);
          }
        }
      );
    },
  },
};
</script>

<style lang="less" scoped>
@import "../../styles/theme.less";

.record-warp {
  width: 100%;
  height: 100%;
  //background: url(../../assets/img/index/19.png) no-repeat center;
  //background-size: 100% 100%;
  position: relative;

  .record-main {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    overflow-y: auto;
    .search-head {
      width: 100%;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: center;
    }
    .table-content {
      margin: 10px 0;
    }
  }
}
</style>