update

src/components/Comment/index.vue

@@ -1,4 +1,5 @@
 <script setup>
+import {computed} from "vue";
 import Api from "../../api/index.js";
 import {Message} from "@arco-design/web-vue";
 
@@ -13,6 +14,7 @@ const {data, hideDelete} = defineProps({
         default: false,
     }
 });
+const list = computed(() => data?.flatMap(v => v.children ? [v, ...v.children] : [v]));
 const del = async (id) => {
     const {msg} = await Api.merchant.delChildrenComment(id);
     Message.success(msg);
@@ -21,12 +23,12 @@ const del = async (id) => {
 </script>
 
 <template>
-    <div v-for="(item, index) in data" :key="item.id" class="flex items-center">
+    <div v-for="(item, index) in list" :key="item.id" class="flex items-center">
         <div class="mr-[5px] min-w-[15px]">{{ index + 1 }}.</div>
         <div class="box">
             <div class="flex items-center whitespace-nowrap" v-if="item.pid>0">
                 <img class="size-[9px] mr-[5px]" src="../../assets/images/back.png" alt=""/>
-                回复{{ data.findIndex(k => k.pid === item.pid) }}:
+                回复{{ list.findIndex(k => k.pid === item.pid) }}:
             </div>
             <img class="size-[32px]" v-if="item.image" :src="item.image" alt=""/>
             <div class="whitespace-nowrap">{{ item.intro }}</div>

src/components/Pay/Alipay.vue

@@ -30,7 +30,10 @@ const initQR = async () => {
 </script>
 
 <template>
-    <a-button type="primary" @click="open">立即充值</a-button>
+    <a-button v-if="!$slots.default" type="primary" @click="open">立即充值</a-button>
+    <div @click="open">
+        <slot></slot>
+    </div>
 
     <a-modal
         :footer="false"

src/components/Pay/GoPay.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import {ref} from "vue";
+import Alipay from "./Alipay.vue";
+
+const visible = ref(false);
+const money = ref(null);
+</script>
+
+<template>
+    <div @click="visible=true">
+        <slot></slot>
+    </div>
+
+    <a-modal
+        title="充值"
+        :width="600"
+        title-align="start"
+        id="GoTask-Modal"
+        v-model:visible="visible">
+        <a-alert>平台提示：该款项不会直接打给达人，只有您对子任务确认结算后，才会打款给达人</a-alert>
+        <div class="p-[24px] h-[370px]">
+            <a-form layout="vertical">
+                <a-form-item label="支付方式">
+                    <a-radio :default-checked="true">支付宝</a-radio>
+                </a-form-item>
+                <a-form-item label="充值金额">
+                    <a-input-number :min="0" :precision="2" v-model:model-value="money"
+                                    placeholder="请输入充值金额"></a-input-number>
+                </a-form-item>
+            </a-form>
+        </div>
+        <template v-slot:footer>
+            <div class="flex gap-[24px] justify-end">
+                <a-button @click="visible=false">取消</a-button>
+                <Alipay :money="money">
+                    <a-button type="primary" @click="visible=false">下一步</a-button>
+                </Alipay>
+            </div>
+        </template>
+    </a-modal>
+</template>
+
+<style lang="scss">
+#GoTask-Modal {
+    .arco-modal-body {
+        padding: 0;
+    }
+}
+</style>
+
+<style scoped lang="scss">
+
+</style>

src/components/Pay/PayTask.vue

@@ -1,5 +1,6 @@
 <script setup>
 import {ref} from "vue";
+import GoPay from "./GoPay.vue";
 
 const payInfo = ref(null);
 const visible = ref(false);
@@ -68,10 +69,13 @@ defineExpose({
                     (可用￥{{ payInfo?.user_money?.toFixed(2) }})
                 </a-radio>
             </div>
-            <div class="text-[12px] text-[#86909C] pl-[20px]">
+            <div v-if="payInfo.user_money < payInfo?.total_money" class="text-[12px] text-[#86909C] pl-[20px]">
                 *余额不足本次任务所需，请充值后再进行支付
             </div>
-            <a-button class="mt-[20px]" type="primary">去充值</a-button>
+            <go-pay>
+                <a-button class="mt-[20px]" type="primary">去充值
+                </a-button>
+            </go-pay>
         </div>
     </a-modal>
 </template>