update

src/pages/paymentAccount/index.vue

@@ -9,13 +9,36 @@ import ICON5 from "../../static/icons/icon-radio.png";
 import ICON6 from "../../static/icons/icon-radio-s.png";
 import XLink from "../../components/XLink.vue";
 import XConfirmModal from "../../components/XConfirmModal.vue";
+import {onShow} from "@dcloudio/uni-app";
+import Api from "../../api/index.js";
+import {reactive} from "vue";
 
-const deletePayment = async () => {
+const list = reactive([]);
+
+const getData = async () => {
+    const {data} = await Api.system.getWithdrawal();
+    list.length = 0;
+    list.push(...data);
+}
+
+const deletePayment = async (id) => {
+    const {msg} = await Api.system.delWithdrawal(id);
     showToast({
         icon: 'success',
-        title: '删除成功'
+        title: msg
     });
+    await getData();
 }
+
+const setDefaultWithdrawal = async (id) => {
+    const {msg} = await Api.system.setDefaultWithdrawal(id);
+    showToast(msg);
+    await getData();
+}
+
+onShow(() => {
+    getData();
+});
 </script>
 
 <template>
@@ -25,24 +48,25 @@ const deletePayment = async () => {
         <view class="py-[20rpx] pl-[30rpx] pr-[24rpx] rounded-[12rpx] bg-[#fff] w-full !flex gap-[22rpx] items-center"
               @click="toPage('/pages/addPaymentAccount/index')">
             <image class="!size-[72rpx]" mode="aspectFill" :src="ICON1"></image>
-            <view class="text-[#86909C] test-28r">您还没有添加收款信息~</view>
+            <view class="text-[#86909C] test-28r">添加新的收款信息~</view>
             <x-link class="test-28r !ml-auto">去添加</x-link>
             <image class="!w-[12rpx]" mode="widthFix" :src="ICON2"></image>
         </view>
 
-        <view class="bg-[#3878F6] p-[32rpx] rounded-[12rpx]" v-for="i in 10">
+        <view :class="['p-[32rpx] rounded-[12rpx]', v.type === 1 ? 'ZFB' : 'YHK']" v-for="v in list" :key="v.id">
             <view class="!flex items-center">
-                <view class="text-[#fff]">支付宝</view>
-                <image class="!size-[35rpx] !ml-auto" mode="aspectFill" :src="ICON3"></image>
-                <x-confirm-modal title="确定删除银行卡" info="135 7777 9865" @success="deletePayment">
+                <view class="text-[#fff]">{{ v.type_text }}</view>
+                <image @click="toPage(`/pages/addPaymentAccount/index?id=${v.id}`)" class="!size-[35rpx] !ml-auto"
+                       mode="aspectFill" :src="ICON3"></image>
+                <x-confirm-modal title="确定删除银行卡" :info="v.account" @success="deletePayment(v.id)">
                     <image class="!size-[30rpx] !ml-[20rpx]" mode="aspectFill" :src="ICON4"></image>
                 </x-confirm-modal>
             </view>
             <view class="HarmonyOS account">
-                135 7777 9865
+                {{ v.account }}
             </view>
-            <view class="radio-info">
-                <image v-if="false" class="!size-[30rpx]" mode="aspectFill" :src="ICON5"></image>
+            <view class="radio-info" @click="setDefaultWithdrawal(v.id)">
+                <image v-if="v.is_default !== 1" class="!size-[30rpx]" mode="aspectFill" :src="ICON5"></image>
                 <image v-else class="!size-[30rpx]" mode="aspectFill" :src="ICON6"></image>
                 设为默认打款信息
             </view>
@@ -51,6 +75,14 @@ const deletePayment = async () => {
 </template>
 
 <style scoped lang="scss">
+.YHK {
+    background: linear-gradient(90.00deg, rgb(96, 137, 255), rgb(68, 81, 255) 100%);
+}
+
+.ZFB {
+    background: linear-gradient(90.00deg, rgb(0, 141, 255), rgb(22, 119, 255) 100%);
+}
+
 .radio-info {
     color: rgb(255, 255, 255);
     font-size: 12px;