|
|
@@ -0,0 +1,137 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
|
|
|
+ <el-form-item label="游戏名称" prop="gameName">
|
|
|
+ <el-input v-model="queryParams.gameName" placeholder="请输入游戏名称" clearable size="small"
|
|
|
+ @keyup.enter.native="handleQuery" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="游戏类型" prop="gameType">
|
|
|
+ <el-select v-model="queryParams.gameType" placeholder="请选择">
|
|
|
+ <el-option v-for="item in dict.type.game_type" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-table v-loading="loading" :data="listData" row-key="id">
|
|
|
+ <el-table-column prop="gameName" label="游戏名称">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-link :href="scope.row.gameUrl + '?isDevelop=true'" target="_blank" type="primary">{{ scope.row.gameName
|
|
|
+ }}</el-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="gameCode" label="游戏编码"></el-table-column>
|
|
|
+
|
|
|
+ <el-table-column prop="gameCoverImage" label="游戏封面">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-image :preview-src-list="[scope.row.gameCoverImage]" style="width: 50px; height: 50px; border-radius: 8px;"
|
|
|
+ :src="scope.row.gameCoverImage" fit="fill"></el-image>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="gameBackgroundImage" label="游戏背景">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-image :preview-src-list="[scope.row.gameBackgroundImage]"
|
|
|
+ style="width: 50px; height: 50px; border-radius: 8px;" :src="scope.row.gameBackgroundImage"
|
|
|
+ fit="fill"></el-image>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="totalNum" label="关卡总数"></el-table-column>
|
|
|
+ <el-table-column prop="gameDuration" label="关卡时长(分)"></el-table-column>
|
|
|
+ <el-table-column prop="gameDifficulty" label="游戏难度">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <dict-tag :options="dict.type.game_difficulty" :value="scope.row.gameDifficulty" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="gameType" label="游戏类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <dict-tag :options="dict.type.game_type" :value="scope.row.gameType" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="text" @click="recoverGame(scope.row.id)">恢复</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <!-- 分页 -->
|
|
|
+ <pagination v-show="total > 0" :total="total" :page.sync="queryParams.page" :limit.sync="queryParams.limit"
|
|
|
+ @pagination="getList" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {listData,recoverGame} from "@/api/game/pastRecords";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "game_past_records",
|
|
|
+ dicts: ['game_type','game_difficulty'],
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // 遮罩层
|
|
|
+ loading: true,
|
|
|
+ // 显示搜索条件
|
|
|
+ showSearch: true,
|
|
|
+ // 表格树数据
|
|
|
+ listData: [],
|
|
|
+ // 弹出层标题
|
|
|
+ title: "",
|
|
|
+ // 是否显示弹出层
|
|
|
+ open: false,
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ status: 0,
|
|
|
+ gameType:undefined,
|
|
|
+ gameName:undefined
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ // 查询
|
|
|
+ getList(){
|
|
|
+ this.loading = true;
|
|
|
+ listData(this.queryParams).then(res=>{
|
|
|
+ this.listData = res.data.records
|
|
|
+ this.total = res.data.total;
|
|
|
+ this.loading = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** 搜索按钮操作 */
|
|
|
+ handleQuery() {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ /** 重置按钮操作 */
|
|
|
+ resetQuery() {
|
|
|
+ this.queryParams.gameType = undefined
|
|
|
+ this.resetForm("queryForm");
|
|
|
+ this.handleQuery();
|
|
|
+ },
|
|
|
+ recoverGame(id){
|
|
|
+ this.$confirm('是否将已删除的游戏恢复','提示',{
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(()=>{
|
|
|
+ recoverGame({id}).then(res=>{
|
|
|
+ this.$modal.msgSuccess(`恢复成功`);
|
|
|
+ this.getList()
|
|
|
+ })
|
|
|
+
|
|
|
+ }).catch(() => {
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|