<template>
    <div class="contet">
        【聊天频道】. <Abutton @click="Refresh">刷新</Abutton><br />
        <Abar href="/news">*更新内容早知道</Abar>
    </div>
    <div class="title">
        <Acheak @click="BindData('0')" :on-value="type" on-cheak="0">公共</Acheak>.
        <Acheak @click="BindData('1')" :on-value="type" on-cheak="1">队伍</Acheak>.
        <Acheak @click="BindData('2')" :on-value="type" on-cheak="2">帮派</Acheak>.
        <Acheak @click="BindData('3')" :on-value="type" on-cheak="3">全区</Acheak>.
        <Acheak @click="BindData('4')" :on-value="type" on-cheak="4">全服</Acheak>.
        <Acheak @click="BindData('5')" :on-value="type" on-cheak="5">系统</Acheak>
    </div>
    <div class="content">
        <GameChat :data="data" :show-time="1"></GameChat>
        <span v-if="data.length == 0">暂无发言.</span>
    </div>
    <div class="content">
        <Pagination :currentPage="currentPage" :limit="10" :total="total" @pageChange="handlePageChange" />
    </div>
    <div class="content" v-if="type != '5'">
        <span>请输入聊天信息:</span><br>
        <div v-if="goodsName != ''">
            {{ goodsName }}：{{ goodsCount }} <span style="font-size: 18px;">(每次发言需要1个哦)</span>
        </div>
        <div>
            <textarea name="sign" id="sign" rows="2" cols="20" maxlength="80" class="ipt emojiTxt"
                v-model="sign"></textarea>
        </div>
        <div>
            <input type="submit" value="发言" class="btn btn-danger" @click="SendChat" />.
            <Abutton @click="Refresh">刷新</Abutton>
        </div>
    </div>
    <div class="content">
        <Abar href="/customer/chat">*公聊频道发言规范</Abar><br />
        <Abar href="/customer/rule">*游戏用户守则规范</Abar>
    </div>
</template>
<script setup lang="ts">

definePageMeta({
    layout: layout.default,
    middleware: 'page-loading'
})

const type = ref('0');
const currentPage = ref<number>(1);
const total = ref<number>(0);
const data = ref<Array<any>>([]);
const goodsCount = ref(0);
const goodsName = ref('');
const sign = ref('');

onMounted(async () => {
    try {
        await BindData(type.value);
    }
    finally {
        PageLoading.Close();
    }
})

const BindData = async (typeid: string): Promise<void> => {
    if (type.value != typeid) {
        type.value = typeid;
    }
    let result = await ChatService.GetChatData(Number(typeid), currentPage.value);
    if (result.code == 0) {
        data.value = result.data.data;
        goodsCount.value = result.data.sendGoodsCount
        goodsName.value = result.data.sendGoodsName
        total.value = result.data.total;
    }
    else {
        MessageExtend.ShowDialog("提示", result.msg);
    }
};

/**刷新 */
const Refresh = async (): Promise<void> => {
    MessageExtend.LoadingToast("刷新中...");
    await BindData(type.value);
    MessageExtend.LoadingClose();
    PageExtend.ScrollToTop();
}

/**翻页 */
const handlePageChange = async (page: number): Promise<void> => {
    currentPage.value = page;
    await BindData(type.value);
};

/**发送消息 */
let send = true;
const SendChat = async (): Promise<void> => {
    if (sign.value == '' || sign.value == null) {
        MessageExtend.ShowToast('聊天内容不能为空!');
        return;
    }
    if (send) {
        send = false;
        //发送消息请求
        let result = await ChatService.SendChat(Number(type.value), sign.value);
        send = true;
        if (result.code == 0) {
            sign.value = '';
            await BindData(type.value);
            PageExtend.ScrollToTop();
        }
        else {
            MessageExtend.ShowDialog("提示", result.msg);
        }
    }

}

</script>