12121

Web/src/pages/fight/index.vue

@@ -0,0 +1,165 @@
+<template>
+    <div class="content">
+        <div class="common">
+            <Abutton>{{ autoFight == 0 ? "开启自动攻击" : "关闭自动攻击" }}</Abutton>
+        </div>
+        <div class="common">
+            你向{{ otAttr.name }}发起了攻击!
+        </div>
+        <div class="common">
+            <Abutton @click="FightAtk">攻击</Abutton>
+            <span>&nbsp;.&nbsp;</span>
+            <span v-if="otAttr.code == 'Monster'">
+                <Abar :href='"/prop/monster?m=" + otAttr.viceId'>查看</Abar>
+            </span>
+            <span v-else>
+                <Abar :href='"/user/user?no=" + otAttr.viceId'>查看</Abar>
+            </span>
+            <span>&nbsp;.&nbsp;</span>
+            <Abutton @click="ExitFight">撤退({{ exitCopper }}铜贝)</Abutton>
+        </div>
+        <div class="common">
+            <div>
+                {{ otAttr.name }}体力({{ otAttr.blood }}/{{ otAttr.upBlood }})
+                <span v-if="otHarm != 0">
+                    {{ otHarm > 0 ? "+" + otHarm : otHarm }}
+                </span>
+            </div>
+            <div>
+                你体力({{ myAttr.blood }}/{{ myAttr.upBlood }})
+                <span v-if="myHarm != 0">
+                    {{ myHarm > 0 ? "+" + myHarm : myHarm }}
+                </span>
+            </div>
+        </div>
+        <div class="common">
+            你状态：
+            <span v-for="item in myLoad">
+                {{ item.name }}({{ item.count }})
+            </span>
+        </div>
+        <div class="common">
+            <span v-for="(item, index) in myDrug" :key="index">
+                <Abutton @click="UseFightDrug(item.id)">{{ item.name }}({{ item.count }})</Abutton>
+                <span v-if="(index + 1) != myDrug.length">&nbsp;.&nbsp;</span>
+            </span>
+        </div>
+        <div class="common">
+            <Abar href="/user/equ">状态</Abar>
+            <span>&nbsp;.&nbsp;</span>
+            <Abar href="/user/bag">物品</Abar>
+            <span>&nbsp;.&nbsp;</span>
+            <Abar href="/pet">宠物</Abar>
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+definePageMeta({
+    layout: layout.empty,
+    middleware: 'page-loading'
+})
+let fightId = PageExtend.QueryString("f");
+const autoFight = ref(0);
+const myHarm = ref(0);
+const otHarm = ref(0);
+const myAttr = ref<IUserAttr | any>({} as IUserAttr);
+const otAttr = ref<IUserAttr | any>({} as IUserAttr);
+const myDrug = ref<Array<any>>([]);
+const myLoad = ref<Array<any>>([]);
+const exitCopper = ref(0);
+const coolTime = ref(0);
+
+let coolLock = false;//冷却锁
+const coolTimer = ref(0);//冷却定时器
+let dataLock = false;//数据锁
+
+onMounted(async () => {
+    try {
+        await BindData("");
+    }
+    finally {
+        PageLoading.Close();
+    }
+})
+
+onUnmounted(() => {
+    clearTimeout(coolTimer.value)
+})
+
+/**加载方法 */
+const BindData = async (data: string): Promise<void> => {
+    let result = await FightService.Fight(fightId, data);
+    if (result.code == 0) {
+        myAttr.value = result.data.myAttr as IUserAttr;
+        otAttr.value = result.data.otAttr as IUserAttr;
+        myDrug.value = result.data.myDrug;
+        myLoad.value = result.data.myLoad;
+        exitCopper.value = result.data.exitCopper;
+        coolTime.value = result.data.cool;
+        dataLock = false;
+        myHarm.value = result.data.myHarm;
+        otHarm.value = result.data.otHarm;        
+    }
+    else if (result.code == 100) {
+        PageExtend.RedirectTo("/fight/result?f=" + fightId);
+    }
+    else {
+        PageExtend.RedirectTo("/map");
+    }
+};
+
+/**退出战斗 */
+const ExitFight = async () => {
+    MessageExtend.LoadingToast("退出战斗中...");
+    let result = await FightService.Exit(fightId);
+    MessageExtend.LoadingClose();
+    if (result.code == 0) {
+        if (result.data == "") {
+            PageExtend.RedirectTo("/map");
+        }
+        else {
+            PageExtend.RedirectTo("/fight?f=" + result.data);
+        }
+    }
+    else if (result.code == 100) {
+        PageExtend.RedirectTo("/fight/result?f=" + fightId);
+    }
+    else if (result.code == 101) {
+        MessageExtend.Notify(result.msg, "danger");
+    }
+    else {
+        PageExtend.RedirectTo("/map");
+    }
+}
+
+/**使用药品 */
+const UseFightDrug = async (drugId: string) => {
+    MessageExtend.LoadingToast("药品使用中...");
+    let result = await FightService.UseFightDrug(fightId, drugId);
+    MessageExtend.LoadingClose();
+    if (result.code == 0) {
+        await BindData("");
+    }
+    else {
+        MessageExtend.Notify(result.msg, "danger");
+    }
+}
+
+/**攻击 */
+const FightAtk = async () => {
+    if (coolLock == false && dataLock == false) {
+        StartCool();
+        let result = FightTool.FightHandle(myAttr.value, otAttr.value);
+        let data = JSON.stringify(result);        
+        await BindData(data);
+    }
+}
+
+const StartCool = () => {
+    coolLock = true;
+    dataLock = true;
+    coolTimer.value = setTimeout(() => {
+        coolLock = false;
+    }, coolTime.value)
+}
+</script>