12121

Web/src/pages/map/index.vue

@@ -31,7 +31,7 @@
     <div class="content" v-if="mapRes.length > 0">
         特产:<br>
         <div class="item" v-for="item in mapRes">
-            <Abutton>{{item.resName}}</Abutton>            
+            <Abutton @click="showResProp(item)">{{ item.resName }}({{ item.lev }}级)</Abutton>
         </div>
     </div>
 
@@ -89,6 +89,20 @@
 
         </div>
     </GamePopup>
+    <GamePopup v-model:show="showRes" title="【采集】" style="width: 60%;">
+        <!-- 自定义内容 -->
+        <div class="content">
+            物品名称：{{ showResData.resName }}<br>
+            采集要求：{{ showResData.lev }}级采集术<br>
+            消耗活力：{{ showResData.needVigour }}<br>
+            冷却时间：{{ showResData.gather }}秒<br>
+        </div>
+        <div class="content" style="max-height: 300px;text-align: center; margin-top: 15px;;">
+            <van-button type="success" :disabled="resLockDiff > 0 ? true : false" @click="CollectRes">
+                {{ resLockDiff > 0 ? `${resLockDiff}秒后可采集` : "立即采集" }}
+            </van-button>
+        </div>
+    </GamePopup>
 </template>
 <script setup lang="ts">
 definePageMeta({
@@ -132,8 +146,6 @@ const BindData = async (map: string): Promise<void> => {
         mapRes.value = result.data.mapRes;
         MapVent(result.data.mapInfo.near);
         onMap.value = mapInfo.value.mapId;
-        console.log(result.data);
-
     }
     else if (result.code == 103) {
         PageExtend.Redirect("/map/runing");
@@ -235,4 +247,46 @@ const StartToMap = () => {
 }
 
 
+/**采集相关 */
+const showRes = ref(false);
+const showResData = ref<any>({});
+const resLockDiff = ref(0);
+const reslockTimer = ref(0) // 定时器实例
+const showResProp = async (data: any) => {
+    showRes.value = true;
+    showResData.value = data;
+    resLockDiff.value = data.lockTime;
+    if (resLockDiff.value > 0) {
+        reslockTimer.value = setInterval(async () => {
+            resLockRun();
+        }, 1000)
+    }
+}
+const resLockRun = () => {
+    if (resLockDiff.value > 0) {
+        resLockDiff.value = resLockDiff.value - 1;
+    }
+    else {
+        clearInterval(reslockTimer.value);
+    }
+}
+
+const CollectRes = async () => {
+    MessageExtend.LoadingToast("采集中...");
+    let result = await MapService.CollectMapRes(showResData.value.resId);
+    MessageExtend.LoadingClose();
+    if (result.code == 0) {
+        resLockDiff.value = result.data;
+        MessageExtend.ShowToast(result.msg);
+        clearInterval(reslockTimer.value);
+        reslockTimer.value = setInterval(async () => {
+            resLockRun();
+        }, 1000)
+    }
+    else {
+        MessageExtend.ShowDialog("提示", result.msg);
+    }
+
+}
+
 </script>

Web/src/pages/user/skill/index.vue

@@ -1 +1,49 @@
-<template></template>
+<template>
+    <div class="content">【我的技能】</div>
+    <div class="content">
+    <div class="item" v-for="(item,index) in data" :key="index">
+        {{index+1}}.<Abutton @click="showView(item)">{{item.name}}({{item.lev}}级)</Abutton>
+    </div>
+        <span v-if="data.length==0">暂无技能.</span>
+    </div>
+    <GamePopup v-model:show="showInfo" title="【技能说明】" style="width: 50%;">
+        <!-- 自定义内容 -->
+        <div class="content" v-html="onShow.remark">
+        </div>
+    </GamePopup>
+</template>
+<script setup lang="ts">
+definePageMeta({
+    layout: layout.default,
+    middleware: middleware.loading
+})
+
+const data = ref<Array<any>>([]);
+const showInfo = ref(false);
+const onShow = ref<any>({});
+
+onMounted(async () => {
+    try {
+        await BindData();
+    }
+    finally {
+        PageLoading.Close();
+    }
+})
+
+const BindData = async () => {
+    let result = await UserService.GetUserSkill();
+    if (result.code == 0) {
+        data.value = result.data;        
+    }
+    else {
+        MessageExtend.ShowDialog("技能", result.msg);
+    }
+}
+
+const showView = (data: any) => {
+    showInfo.value = true;
+    onShow.value = data;
+}
+
+</script>