You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 lines
4.0 KiB
146 lines
4.0 KiB
2 weeks ago
|
<template>
|
||
|
<div class="game-online-container">
|
||
|
<el-card shadow="hover">
|
||
|
<div class="system-user-search mb15">
|
||
|
<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="tableData.param.serverId" class="m-2" placeholder="选择服务器" size="large" multiple 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>
|
||
|
<el-button size="default" type="primary" class="ml10" @click="onlineList">
|
||
|
<el-icon>
|
||
|
<ele-Search />
|
||
|
</el-icon>
|
||
|
重载
|
||
|
</el-button>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
</div>
|
||
|
|
||
|
<el-table :data="tableData.data" style="width: 100%" @selection-change="handleSelectionChange" stripe border>
|
||
|
<el-table-column type="selection" width="55" align="center" />
|
||
|
<el-table-column type="index" label="序号" width="71" />
|
||
|
<el-table-column prop="name" label="服务器名" width="250"></el-table-column>
|
||
|
<el-table-column prop="msg" label="发送状态">
|
||
|
<template #default="scope">
|
||
|
<div v-if="scope.row.msg == '发送成功'" style="color: #e60000">{{ scope.row.msg }}</div>
|
||
|
<div v-else-if="!!scope.row.msg">{{ scope.row.msg }}</div>
|
||
|
<div v-else style="color: #a5a5a5">未发送</div>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
</el-table>
|
||
|
</el-card>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script lang="ts">
|
||
|
import { toRefs, reactive, onMounted, defineComponent } from 'vue';
|
||
|
import { serverList, ServerCategorize, ServerList } from '/@/utils/game';
|
||
|
import { gameServerReloadDll } from '/@/api/game/serverConfig';
|
||
|
|
||
|
// 定义接口来定义对象的类型
|
||
|
interface TableData {
|
||
|
serverId: number;
|
||
|
name: string;
|
||
|
ip: string;
|
||
|
status: string;
|
||
|
msg: string;
|
||
|
}
|
||
|
|
||
|
interface TableDataState {
|
||
|
serverSwitch: number;
|
||
|
tableData: {
|
||
|
data: Array<TableData>;
|
||
|
param: {
|
||
|
serverId: number[];
|
||
|
};
|
||
|
};
|
||
|
servers: object[];
|
||
|
serverCategorize: object[];
|
||
|
}
|
||
|
|
||
|
export default defineComponent({
|
||
|
name: 'apiV1ServerReloadDll',
|
||
|
setup() {
|
||
|
const state = reactive<TableDataState>({
|
||
|
serverSwitch: 0,
|
||
|
tableData: {
|
||
|
data: [],
|
||
|
param: {
|
||
|
serverId: '',
|
||
|
},
|
||
|
},
|
||
|
servers: ServerList,
|
||
|
serverCategorize: ServerCategorize,
|
||
|
});
|
||
|
const onlineList = () => {
|
||
|
if (state.tableData.param.serverId.length > 0) {
|
||
|
for (let server in state.tableData.param.serverId) {
|
||
|
onlines(state.tableData.param.serverId[server]);
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
const onlines = (serverId: number) => {
|
||
|
if (!serverId) {
|
||
|
return;
|
||
|
}
|
||
|
gameServerReloadDll({ serverId: serverId }).then((res) => {
|
||
|
console.log(res.data);
|
||
|
let data = state.tableData.data.find((r) => r.id === serverId);
|
||
|
if (data) {
|
||
|
if (res.data.message) {
|
||
|
data.msg = res.data.message;
|
||
|
} else {
|
||
|
data.msg = '发送失败';
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
// 页面加载时
|
||
|
onMounted(() => {
|
||
|
serverList().then((res) => {
|
||
|
// console.log(res);
|
||
|
state.tableData.data = res;
|
||
|
});
|
||
|
});
|
||
|
const handleSelectionChange = (selection: any[]) => {
|
||
|
state.tableData.param.serverId = selection.map((item) => item.id);
|
||
|
console.log(state.tableData.param.serverId, selection);
|
||
|
};
|
||
|
return {
|
||
|
handleSelectionChange,
|
||
|
onlineList,
|
||
|
...toRefs(state),
|
||
|
};
|
||
|
},
|
||
|
});
|
||
|
</script>
|
||
|
|
||
|
<style scoped lang="scss">
|
||
|
::v-deep .el-table .el-table__cell {
|
||
|
padding: 5px;
|
||
|
margin-left: -20px;
|
||
|
min-width: 0;
|
||
|
box-sizing: border-box;
|
||
|
text-overflow: ellipsis;
|
||
|
vertical-align: middle;
|
||
|
position: relative;
|
||
|
text-align: left;
|
||
|
z-index: 1;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td {
|
||
|
background: #ffffd5;
|
||
|
}
|
||
|
|
||
|
::v-deep .el-table .el-table--enable-row-hover .el-table__body tr:hover > td {
|
||
|
background: inherit;
|
||
|
}
|
||
|
</style>
|