11 changed files with 176 additions and 7 deletions
@ -0,0 +1,106 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<md-dialog :md-active.sync="show" @close="show=false"> |
||||
|
<div class="md-layout md-alignment-bottom-center"> |
||||
|
<div class="md-layout-item md-size-100 md-small-size-100 md-alignment-bottom-center rounded-only"> |
||||
|
<md-table v-model="messages.mdData" md-card class="api-table"> |
||||
|
<md-table-row slot="md-table-row" slot-scope="{ item }" v-on:click="steam64 !== null?'':$refs.md_fp.showFPD(item.account_name)" :class="steam64 !== null?'':'clickable'"> |
||||
|
<md-table-cell md-label="Никнейм" v-if="steam64 === null">{{ item.account_name }}</md-table-cell> |
||||
|
<md-table-cell md-label="Время">{{ new Date(item.utime*1000).toLocaleString() }}</md-table-cell> |
||||
|
<md-table-cell md-label="Сервер">{{ $API.getHumanServerName(item.server_id) }}</md-table-cell> |
||||
|
<md-table-cell md-label="Сообщение">{{ item.message }}</md-table-cell> |
||||
|
</md-table-row> |
||||
|
|
||||
|
<md-table-pagination ref="md_p" |
||||
|
:md-page-size="rowsPerPage" |
||||
|
:md-page-options="[5, 10, 15]" |
||||
|
:md-update="update" |
||||
|
:md-data.sync="messages" |
||||
|
:md-label="''" |
||||
|
:md-separator="'из'" |
||||
|
style="font-family: tf2build"/> |
||||
|
</md-table> |
||||
|
<div style="padding-right: 2.5%; padding-left: 2.5%"> |
||||
|
<md-field style="margin: 0% 0%;" v-if="srv_setted===false"> |
||||
|
<label style="font-family: tf2secondary">Выбрать сервер</label> |
||||
|
<md-select v-model="srv" :mdClass="'ssm'"> |
||||
|
<md-option :value="''">Выбрать все</md-option> |
||||
|
<md-option v-for="srv in $API.getServers4Selector()" :key="srv['srv']" :value="srv['srv']">{{srv['name']}}</md-option> |
||||
|
</md-select> |
||||
|
</md-field> |
||||
|
<md-field style="margin: 0% 0%"> |
||||
|
<label style="font-family: tf2secondary">Фильтр сообщений</label> |
||||
|
<md-input v-model="filter"></md-input> |
||||
|
</md-field> |
||||
|
</div> |
||||
|
<md-button style="float: left" class="btn-hand" v-on:click="update(1, rowsPerPage)">Искать</md-button> |
||||
|
<md-button style="float: right" class="btn-colored" v-on:click="showMe(false)">Закрыть</md-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</md-dialog> |
||||
|
<md-dialog :md-active.sync="loading"> |
||||
|
<div class="md-layout md-alignment-bottom-center"> |
||||
|
<div class="md-layout-item md-size-100 md-small-size-100 md-alignment-bottom-center rounded-only"> |
||||
|
<h3 class="tf2rainbow" style="text-align: center; padding: 2% 5%">Загрузка</h3> |
||||
|
</div> |
||||
|
</div> |
||||
|
</md-dialog> |
||||
|
<FindPlayer ref="md_fp"/> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import axios from "axios"; |
||||
|
import Random from "@/api/Random"; |
||||
|
import FindPlayer from "@/components/ActionDialogs/FindPlayer.vue"; |
||||
|
|
||||
|
export default { |
||||
|
name: "MessagesDialog", |
||||
|
components: {FindPlayer}, |
||||
|
data: () => ({ |
||||
|
show: false, |
||||
|
loading: false, |
||||
|
rowsPerPage: 5, |
||||
|
filter: "", |
||||
|
steam64: null, |
||||
|
srv: null, |
||||
|
srv_setted: false, |
||||
|
messages: { |
||||
|
mdCount: 1, |
||||
|
mdPage: 1, |
||||
|
mdData: [] |
||||
|
}, |
||||
|
}), |
||||
|
methods: { |
||||
|
showMe(b, steam64, srv) { |
||||
|
if (steam64 !== undefined) this.steam64 = steam64; |
||||
|
if (srv !== undefined) { |
||||
|
this.srv_setted = true; |
||||
|
this.srv = srv; |
||||
|
} |
||||
|
if (b===true) this.update(1, this.rowsPerPage) |
||||
|
else this.show = b; |
||||
|
}, |
||||
|
update(page, limit) { |
||||
|
if (this.loading === true) return; |
||||
|
console.log(page, limit, this.rowsPerPage); |
||||
|
const offset = Math.abs((page - 1) * limit); |
||||
|
this.loading = true; |
||||
|
axios.post(`api/profile/messages${this.steam64 !== null ? '/account' : ''}?${this.steam64 === null?'':`steam64=${this.steam64}&`}${this.srv===null?'':`srv=${this.srv}&`}limit=${Math.abs(limit)}&offset=${offset}` + Random.getRndWebAppend(), {"message":this.filter}).then( |
||||
|
(response) => { |
||||
|
if (response.status === 200) { |
||||
|
this.messages.mdData = response.data['result']; |
||||
|
this.messages.mdCount = response.data['count']; |
||||
|
this.messages.mdPage = page; |
||||
|
} else { |
||||
|
console.log("cannot get messages list"); |
||||
|
} |
||||
|
this.show = true; |
||||
|
if (this.$refs.md_p !== undefined) |
||||
|
this.$refs.md_p.updatePage(); |
||||
|
} |
||||
|
).catch((e) => {console.log(e)}).finally(() => this.loading = false) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
@ -0,0 +1,24 @@ |
|||||
|
<template> |
||||
|
<md-select v-model="selected"> |
||||
|
<md-option :value="null">Выбрать все</md-option> |
||||
|
<md-option v-for="srv in servers" :key="srv['srv']" :value="srv['srv']">{{srv['name']}}</md-option> |
||||
|
</md-select> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "ServerSelect", |
||||
|
data: () => ({ |
||||
|
servers: [], |
||||
|
selected: null |
||||
|
}), |
||||
|
beforeMount() { |
||||
|
this.servers = this.$API.getServers4Selector(); |
||||
|
console.log(this.servers); |
||||
|
}, |
||||
|
methods: { |
||||
|
getSelected() { return this.selected; } |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</script> |
@ -0,0 +1,16 @@ |
|||||
|
@media(width > 300px) { |
||||
|
} |
||||
|
|
||||
|
@media(width > 600px) { |
||||
|
.api-table { |
||||
|
max-width: 600px; min-width: 600px |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
@media(width > 960px) { |
||||
|
.api-table { |
||||
|
max-width: 800px; min-width: 800px |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
Loading…
Reference in new issue