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