12121

Web/src/pages/trade/user.vue

@@ -1 +1,117 @@
-<template></template>
+<template>
+    <div class="module-title">
+        交易信息
+    </div>
+    <div class="module-content">
+        <div class="item border-btm" v-for="(item, index) in data" :key="index">
+            {{ PageExtend.GetPageIndex(currentPage, 10, index + 1) }}.[{{ GetRankName(item.code) }}]
+           <span v-if="item.code == 'Equ'">
+                <Abar :href='"/trade/info?id=" + item.tradeId'>{{ item.name }}({{ item.price }}铜贝)</Abar>
+            </span>
+            <span v-else>
+                <Abar :href='"/prop/goods?id=" + item.propId'>{{ item.name }}({{ item.price }}铜贝)</Abar>
+            </span>
+            [<Abutton @click="Buy(item)">购买</Abutton>]
+        </div>
+        <span v-if="data.length == 0">
+            暂无交易.
+        </span>
+    </div>
+    <div class="content">
+        <Pagination :currentPage="currentPage" :limit="10" :total="total" @pageChange="handlePageChange" />
+    </div>
+    <GamePopup v-model:show="showBuy" title="【购买】">
+        <!-- 自定义内容 -->
+        <div class="common">
+            物品名称：{{ showGoods.name }}<br>
+            购买单价：{{ showGoods.price }} 铜贝<br>
+            <span v-if="showGoods.code != 'Equ'">
+                剩余数量：{{ showGoods.count }}
+            </span>
+        </div>
+        <div class="common" style="text-align: center;">
+            <span v-if="showGoods.code != 'Equ'">
+                购买数量：<input type="number" class="search-ipt" v-model="count"><br>
+            </span>
+            <button class="ipt-btn" name="serch" @click="ShopOk" style="margin-top: 15px;">购买</button>
+        </div>
+    </GamePopup>
+</template>
+<script setup lang="ts">
+
+definePageMeta({
+    layout: layout.default,
+    middleware: 'page-loading'
+})
+
+const currentPage = ref<number>(1);
+const total = ref<number>(0);
+const data = ref<Array<any>>([]);
+const showBuy = ref(false);
+const count = ref(1);
+const showGoods = ref<any>({});
+
+
+let no = PageExtend.QueryString("no");
+
+onMounted(async () => {
+    try {
+        await BindData();
+    }
+    finally {
+        PageLoading.Close();
+    }
+})
+
+const BindData = async (): Promise<void> => {
+    let result = await TradeService.GetTradeData(no, 0, "", currentPage.value);
+    if (result.code == 0) {
+        data.value = result.data.data;
+        total.value = result.data.total;
+
+    }
+    else {
+        MessageExtend.ShowDialog("提示", result.msg);
+    }
+};
+
+/**翻页 */
+const handlePageChange = async (page: number): Promise<void> => {
+    currentPage.value = page;
+    await BindData();
+};
+
+const GetRankName = (type: string) => {
+    let result = '其他';
+    switch (type) {
+        case "Equ":
+            result = "装备"; break;
+        case "Goods":
+            result = "物品"; break;
+
+    }
+    return result;
+}
+const Buy = (info: any) => {
+    showGoods.value = info;
+    count.value = 1;
+    showBuy.value = true;
+}
+const ShopOk = async () => {
+    if (count.value < 1 || count.value > 99) {
+        MessageExtend.ShowToast("每次购买数量在1~99哦.");
+        return;
+    }
+    MessageExtend.LoadingToast("购买中...");
+    let result = await TradeService.Buy(showGoods.value.tradeId, count.value);
+    MessageExtend.LoadingClose();
+    if (result.code == 0) {
+        showBuy.value = false;
+        await BindData();
+        MessageExtend.Notify(`成功购买${showGoods.value.name}×${count.value}`, "success");        
+    }
+    else {
+        MessageExtend.ShowDialog("提示", result.msg);
+    }
+}
+</script>