提现功能需要添加

pages/my-index/wallet/real-id.vue

@@ -1,44 +1,121 @@
 <script setup>
-  import { reactive } from 'vue'
+  import { onLoad } from '@dcloudio/uni-app'
+  import { ref, reactive } from 'vue'
   import CardInput from '../components/card-input.vue'
+  import { useUI } from '@/utils/use-ui'
+  import { navigateBack } from '@/utils/router'
+  import { getUserIdCard, addUserIdCard } from '@/api/my-index'
+  import { validateIdCard } from '@/utils/validate'
 
+  const { showToast } = useUI()
+
+  const loading = ref(true)
   const formData = reactive({
+    // 修改id
+    id: '',
     // 正面
     front: '',
     // 背面
     back: '',
-    // 手机号
-    phone: '',
+    // 姓名
+    realName: '',
     // 身份证号码
-    idCard: ''
+    idCard: '',
+    frontList: [],
+    backList: []
+  })
+
+  const getData = async () => {
+    loading.value = true
+    const res = await getUserIdCard()
+    if (res?.data) {
+      formData.id = res.data.id
+      formData.front = res.data.idCardFrontUrl
+      formData.back = res.data.idCardBackUrl
+      formData.realName = res.data.realName
+      formData.idCard = res.data.idCardNumber
+
+      formData.frontList = [{ url: res.data.idCardFrontUrl }]
+      formData.backList = [{ url: res.data.idCardBackUrl }]
+    }
+
+    loading.value = false
+  }
+
+  const onAddCode = async () => {
+    if (!formData.front) {
+      showToast('请上传身份证人像面')
+      return
+    }
+    if (!formData.back) {
+      showToast('请上传身份证国徽面')
+      return
+    }
+    if (!formData.realName) {
+      showToast('请输入姓名')
+      return
+    }
+    const codeData = validateIdCard(formData.idCard)
+    if (!codeData.valid) {
+      showToast(codeData.message)
+      return
+    }
+
+    const data = {
+      idCardFrontUrl: formData.front,
+      idCardBackUrl: formData.back,
+      realName: formData.realName,
+      idCardNumber: formData.idCard
+    }
+
+    await addUserIdCard(data)
+    await showToast(`添加成功`, 'success')
+    navigateBack()
+  }
+
+  onLoad(() => {
+    getData()
   })
 </script>
 
 <template>
-  <view class="real-id">
+  <view v-if="!loading" class="real-id">
     <!-- 说明 -->
     <text class="top-text">*为保证您的账户安全,请先完成实名认证</text>
 
     <CardInput :is-input="false" title="收款码">
       <view class="qrcode-box">
-        <cb-file-picker v-model="formData.front" isFront></cb-file-picker>
-        <cb-file-picker v-model="formData.back" isBack></cb-file-picker>
+        <cb-file-picker
+          v-model="formData.front"
+          v-model:list="formData.frontList"
+          isFront
+        ></cb-file-picker>
+        <cb-file-picker
+          v-model="formData.back"
+          v-model:list="formData.backList"
+          isBack
+        ></cb-file-picker>
       </view>
     </CardInput>
 
     <CardInput
-      v-model="formData.phone"
-      title="手机号"
-      type="tel"
-      placeholder="请输入手机号"
+      v-model="formData.realName"
+      title="姓名"
+      placeholder="请输入姓名"
     ></CardInput>
 
     <CardInput
       v-model="formData.idCard"
-      type="text"
       title="身份证号"
       placeholder="请输入身份证号"
     ></CardInput>
+
+    <!-- 底部按钮 -->
+    <bottom-view>
+      <cb-button @click="onAddCode">
+        确认{{ formData.id ? '修改' : '添加' }}
+      </cb-button>
+    </bottom-view>
   </view>
 </template>