linquan
1 month ago
21 changed files with 1224 additions and 538 deletions
@ -0,0 +1,296 @@
|
||||
<template> |
||||
<div class="game-maintenance-container"> |
||||
<el-form shadow="hover" label-width="90px"> |
||||
<el-card header="排行榜"> |
||||
<el-form :inline="true"> |
||||
<el-form-item label="选择服务器" prop="serverId"> |
||||
<el-select v-model="serverSwitch" class="m-2" placeholder="选择服务器" size="large" style="width: 80px"> |
||||
<el-option v-for="item in serverCategorize" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
<el-select v-model="queryParams.serverId" class="m-2" placeholder="选择服务器" size="large" filterable> |
||||
<el-option v-for="item in switchServer()" :key="item.id + ''" :label="item.name" :value="item.id + ''" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="累充" prop="rechargeTotal"> |
||||
<el-input v-model="queryParams.rechargeTotal" placeholder="请填写累充" class="w-50 m-2" clearable> |
||||
<template #prepend> |
||||
<el-select v-model="queryParams.compareType" class="m-2" placeholder="" size="default" style="width: 80px"> |
||||
<el-option v-for="item in tableData.compareType" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</template> |
||||
</el-input> |
||||
</el-form-item> |
||||
<el-form-item label="uid" prop="uid"> |
||||
<el-input v-model="queryParams.uid" placeholder="请填写uid" class="w-50 m-2" clearable></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="桃花石" prop="stoneAmount"> |
||||
<el-input v-model="queryParams.stoneAmount" placeholder="请填写桃花石" class="w-50 m-2" clearable></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="代金券" prop="vouchersNum"> |
||||
<el-input v-model="queryParams.vouchersNum" placeholder="请填写代金券" class="w-50 m-2" clearable></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="状态" prop="state"> |
||||
<el-select v-model="queryParams.state" class="m-2" placeholder="选择状态" size="large"> |
||||
<el-option label="登录" :value="1" /> |
||||
<el-option label="登出" :value="2" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="起始日期" prop="startTime"> |
||||
<el-date-picker type="datetime" size="large" v-model="queryParams.cDate" format="YYYY-MM-DD HH:mm:ss" value-format="x" /> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="onList"> |
||||
<el-icon> |
||||
<ele-Search /> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-table :data="tableData.loginOutData" style="width: 100%" stripe border> |
||||
<el-table-column type="index" label="序号" width="80" /> |
||||
<el-table-column prop="uid" label="uid"></el-table-column> |
||||
<el-table-column prop="baseFood" label="基础食物" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="copper" label="铜币" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="goldIngot" label="金币" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="prosperity" label="繁荣度" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="scale" label="规模" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="vouchersNum" label="代金券" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="stoneAmount" label="桃花石" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="rechargeTotal" label="累充" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="state" label="状态" width="80"> |
||||
<template #default="scope"> |
||||
<el-tag type="success" v-if="scope.row.state === 1">登录</el-tag> |
||||
<el-tag type="info" v-else>登出</el-tag> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="Name" label="游戏时间" width="150"> |
||||
<template #default="scope"> {{ scope.row.day }} 天 {{ scope.row.gameTime }} 时间</template> |
||||
</el-table-column> |
||||
<el-table-column prop="server" label="区服" width="120"> |
||||
<template #default="scope"> |
||||
<span>{{ servers.find((r) => r.id == scope.row.server)?.name }}</span> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="cDate" label="记录时间" width="165"></el-table-column> |
||||
</el-table> |
||||
<el-row justify="space-evenly"> |
||||
<el-pagination |
||||
:hide-on-single-page="true" |
||||
v-model:page-size="queryParams.pageSize" |
||||
v-model:current-page="queryParams.pageNum" |
||||
:pager-count="5" |
||||
layout="total, prev, pager, next" |
||||
:total="queryParams.total" |
||||
@current-change="onList" |
||||
/> |
||||
</el-row> |
||||
</el-card> |
||||
</el-form> |
||||
</div> |
||||
</template> |
||||
<script lang="ts"> |
||||
import { reactive, toRefs, defineComponent, onMounted } from 'vue'; |
||||
import { gameLoginOutGm } from '/@/api/game'; |
||||
import { ElLoading } from 'element-plus'; |
||||
import { serverList, ServerCategorize, CompareType } from '/@/utils/game'; |
||||
import { gSwitchServer } from '/@/utils/utils'; |
||||
|
||||
interface TableDataState { |
||||
queryParams: { |
||||
uid: number; |
||||
id: number; |
||||
serverId: number; |
||||
pageSize: number; |
||||
pageNum: number; |
||||
total: number; |
||||
name: string; |
||||
account: string; |
||||
state: number; |
||||
compareType: number; |
||||
rechargeTotal: number; |
||||
stoneAmount: number; |
||||
vouchersNum: number; |
||||
cDate: string; |
||||
}; |
||||
tableData: { |
||||
loginOutData: object[]; |
||||
compareType: object; |
||||
}; |
||||
servers: object[]; |
||||
serverSwitch: number; |
||||
serverCategorize: object[]; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameRoleLogInfoGm', |
||||
setup: function () { |
||||
const state = reactive<TableDataState>({ |
||||
queryParams: { |
||||
uid: '', |
||||
id: '', |
||||
account: '', |
||||
serverId: '', |
||||
name: '', |
||||
pageSize: 10, |
||||
pageNum: 0, |
||||
total: 0, |
||||
state: '', |
||||
compareType: 5, |
||||
rechargeTotal: '', |
||||
stoneAmount: '', |
||||
vouchersNum: '', |
||||
cDate: '', |
||||
}, |
||||
tableData: { |
||||
loginOutData: [], |
||||
compareType: CompareType, |
||||
}, |
||||
serverSwitch: 0, |
||||
servers: [], |
||||
serverCategorize: ServerCategorize, |
||||
}); |
||||
|
||||
const onList = () => { |
||||
const loading = ElLoading.service({ |
||||
lock: true, |
||||
text: 'Loading', |
||||
background: 'rgba(0, 0, 0, 0.7)', |
||||
}); |
||||
state.tableData.loginOutData = []; |
||||
gameLoginOutGm(state.queryParams) |
||||
.then((res) => { |
||||
if (!res.data.logs || res.data.logs.length == 0) { |
||||
// ElMessage.error('未查询到登录登出信息！'); |
||||
|
||||
return; |
||||
} |
||||
console.log('loginOut: ', res.dat2); |
||||
state.queryParams.total = res.data.total; |
||||
state.queryParams.total = res.data.total; |
||||
state.tableData.loginOutData = res.data.logs; |
||||
}) |
||||
.finally((res) => { |
||||
loading.close(); |
||||
}); |
||||
}; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
serverList().then((res) => { |
||||
state.servers = res; |
||||
}); |
||||
}); |
||||
|
||||
const switchServer = () => { |
||||
return gSwitchServer(state.serverSwitch, state.servers); |
||||
}; |
||||
return { |
||||
switchServer, |
||||
onList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.el-table { |
||||
--el-table-border-color: var(--el-border-color-lighter); |
||||
--el-table-border: 0px solid var(--el-table-border-color); |
||||
} |
||||
|
||||
::v-deep .table-style { |
||||
margin-top: -15px; |
||||
padding-top: -20px; |
||||
} |
||||
|
||||
::v-deep .el-table .el-table__cell { |
||||
padding: 0; |
||||
margin-left: -20px; |
||||
min-width: 0; |
||||
box-sizing: border-box; |
||||
text-overflow: ellipsis; |
||||
vertical-align: middle; |
||||
position: relative; |
||||
text-align: left; |
||||
z-index: 1; |
||||
} |
||||
|
||||
.tree-border { |
||||
margin-top: 5px; |
||||
border: 1px solid #e5e6e7 !important; |
||||
background: #fff none !important; |
||||
border-radius: 4px; |
||||
} |
||||
|
||||
.system-edit-post-container { |
||||
.menu-data-tree { |
||||
border: var(--el-input-border, var(--el-border-base)); |
||||
border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
||||
padding: 5px; |
||||
} |
||||
} |
||||
|
||||
.editable-cell__input { |
||||
display: inline; |
||||
width: 10%; |
||||
|
||||
.el-input__inner { |
||||
padding: 0 8px; |
||||
font-size: 12px; |
||||
} |
||||
} |
||||
|
||||
/*.table-left-block {*/ |
||||
/* margin-left: 0px;*/ |
||||
/*}*/ |
||||
|
||||
.left-block { |
||||
margin-left: -20px; |
||||
} |
||||
|
||||
.table-num-left { |
||||
margin-left: -85px; |
||||
} |
||||
|
||||
.num-left { |
||||
margin-left: -30px; |
||||
} |
||||
|
||||
.table-item { |
||||
margin-top: 10px; |
||||
margin-bottom: -10px; |
||||
} |
||||
|
||||
.title-label-block { |
||||
margin-left: -20px; |
||||
} |
||||
|
||||
.label-block { |
||||
padding-left: 10px; |
||||
} |
||||
|
||||
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td { |
||||
background: #ffffd5; |
||||
} |
||||
|
||||
.warning-row { |
||||
background: #ffffd5; |
||||
} |
||||
|
||||
::v-deep .warning-row .el-table__body tr { |
||||
background-color: #ffffd5; |
||||
} |
||||
|
||||
::v-deep .warning-row .el-table--enable-row-hover .el-table__body tr:hover > td { |
||||
background-color: inherit; |
||||
} |
||||
|
||||
::v-deep .warning-row .el-table__cell { |
||||
background-color: #ffffd5; |
||||
} |
||||
|
||||
::v-deep .tableCell { |
||||
margin-left: -15px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,183 @@
|
||||
<template> |
||||
<el-form ref="loginForm" size="large" class="login-content-form" :model="ruleForm"> |
||||
<el-form-item class="login-animation1"> |
||||
<el-input type="text" :placeholder="$t('message.email.placeholder1')" v-model="ruleForm.userName" clearable autocomplete="off"> |
||||
<template #prefix> |
||||
<el-icon class="el-input__icon"> |
||||
<ele-Message /> |
||||
</el-icon> |
||||
</template> |
||||
</el-input> |
||||
</el-form-item> |
||||
<el-form-item class="login-animation2"> |
||||
<el-col :span="15"> |
||||
<el-input type="text" maxlength="6" :placeholder="$t('message.email.placeholder2')" v-model="ruleForm.code" clearable autocomplete="off"> |
||||
<template #prefix> |
||||
<el-icon class="el-input__icon"> |
||||
<ele-Position /> |
||||
</el-icon> |
||||
</template> |
||||
</el-input> |
||||
</el-col> |
||||
<el-col :span="1"></el-col> |
||||
<el-col :span="8"> |
||||
<el-button class="login-content-code" @click="smsCode">{{ $t('message.email.codeText') }}</el-button> |
||||
</el-col> |
||||
</el-form-item> |
||||
<el-form-item class="login-animation3"> |
||||
<el-button round type="primary" class="login-content-submit" @click="sendSms"> |
||||
<span>{{ $t('message.email.btnText') }}</span> |
||||
</el-button> |
||||
</el-form-item> |
||||
<!-- <div class="font12 mt30 login-animation4 login-msg">{{ $t('message.email.msgText') }}</div>--> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import { toRefs, reactive, defineComponent, getCurrentInstance, computed, onMounted } from 'vue'; |
||||
import { emailCode, loginEmail } from '/@/api/login'; |
||||
import { Session } from '/@/utils/storage'; |
||||
import { initFrontEndControlRoutes } from '/@/router/frontEnd'; |
||||
import { initBackEndControlRoutes } from '/@/router/backEnd'; |
||||
import { useI18n } from 'vue-i18n'; |
||||
import { useStore } from '/@/store'; |
||||
import { useRoute, useRouter } from 'vue-router'; |
||||
import { ElMessage } from 'element-plus'; |
||||
import { formatAxis } from '/@/utils/formatTime'; |
||||
import initIconfont from '/@/utils/getStyleSheets'; |
||||
|
||||
export default defineComponent({ |
||||
name: 'loginMobile', |
||||
setup() { |
||||
const { t } = useI18n(); |
||||
const store = useStore(); |
||||
const route = useRoute(); |
||||
const router = useRouter(); |
||||
const { proxy } = <any>getCurrentInstance(); |
||||
const state = reactive({ |
||||
ruleForm: { |
||||
userName: '', |
||||
code: '', |
||||
}, |
||||
loading: { |
||||
signIn: false, |
||||
}, |
||||
}); |
||||
// 时间获取 |
||||
const currentTime = computed(() => { |
||||
return formatAxis(new Date()); |
||||
}); |
||||
const sendSms = () => { |
||||
proxy.$refs.loginForm |
||||
.validate((valid: boolean) => { |
||||
if (valid) { |
||||
loginEmail(state.ruleForm) |
||||
.then(async (res) => { |
||||
console.log(res); |
||||
const userInfos = res.data.userInfo; |
||||
userInfos.avatar = proxy.getUpFileUrl(userInfos.avatar); |
||||
// 存储 token 到浏览器缓存 |
||||
Session.set('token', res.data.token); |
||||
// 存储用户信息到浏览器缓存 |
||||
Session.set('userInfo', userInfos); |
||||
// 设置用户菜单 |
||||
Session.set('userMenu', res.data.menuList); |
||||
// 设置按钮权限 |
||||
Session.set('permissions', res.data.permissions); |
||||
// 1、请注意执行顺序(存储用户信息到vuex) |
||||
await store.dispatch('userInfos/setUserInfos', userInfos); |
||||
await store.dispatch('userInfos/setPermissions', res.data.permissions); |
||||
if (!store.state.themeConfig.themeConfig.isRequestRoutes) { |
||||
// 前端控制路由，2、请注意执行顺序 |
||||
await initFrontEndControlRoutes(); |
||||
signInSuccess(); |
||||
} else { |
||||
// 模拟后端控制路由，isRequestRoutes 为 true，则开启后端控制路由 |
||||
// 添加完动态路由，再进行 router 跳转，否则可能报错 No match found for location with path "/" |
||||
await initBackEndControlRoutes(); |
||||
// 执行完 initBackEndControlRoutes，再执行 signInSuccess |
||||
signInSuccess(); |
||||
} |
||||
}) |
||||
.catch(() => { |
||||
state.loading.signIn = false; |
||||
}); |
||||
} |
||||
}) |
||||
.catch(() => {}); |
||||
}; |
||||
// 登录成功后的跳转 |
||||
const signInSuccess = () => { |
||||
// 初始化登录成功时间问候语 |
||||
let currentTimeInfo = currentTime.value; |
||||
// 登录成功，跳到转首页 |
||||
// 添加完动态路由，再进行 router 跳转，否则可能报错 No match found for location with path "/" |
||||
// 如果是复制粘贴的路径，非首页/登录页，那么登录成功后重定向到对应的路径中 |
||||
if (route.query?.redirect) { |
||||
router.push({ |
||||
path: <string>route.query?.redirect, |
||||
query: Object.keys(<string>route.query?.params).length > 0 ? JSON.parse(<string>route.query?.params) : '', |
||||
}); |
||||
} else { |
||||
router.push('/'); |
||||
} |
||||
// 登录成功提示 |
||||
// 关闭 loading |
||||
state.loading.signIn = false; |
||||
const signInText = t('message.signInText'); |
||||
ElMessage.success(`${currentTimeInfo}，${signInText}`); |
||||
}; |
||||
const smsCode = () => { |
||||
console.log(state.ruleForm); |
||||
emailCode(state.ruleForm).then((res) => { |
||||
console.log(res); |
||||
}); |
||||
}; |
||||
onMounted(() => { |
||||
initGetStyleSheets(); |
||||
}); |
||||
const initGetStyleSheets = () => { |
||||
initIconfont.ali().then((res: any) => { |
||||
// state.sheetsIconList = res; |
||||
console.log(res); |
||||
}); |
||||
}; |
||||
return { |
||||
sendSms, |
||||
smsCode, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.login-content-form { |
||||
margin-top: 20px; |
||||
@for $i from 1 through 4 { |
||||
.login-animation#{$i} { |
||||
opacity: 0; |
||||
animation-name: error-num; |
||||
animation-duration: 0.5s; |
||||
animation-fill-mode: forwards; |
||||
animation-delay: calc($i/10) + s; |
||||
} |
||||
} |
||||
|
||||
.login-content-code { |
||||
width: 100%; |
||||
padding: 0; |
||||
} |
||||
|
||||
.login-content-submit { |
||||
width: 100%; |
||||
letter-spacing: 2px; |
||||
font-weight: 300; |
||||
margin-top: 15px; |
||||
} |
||||
|
||||
.login-msg { |
||||
color: var(--el-text-color-placeholder); |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue