<template>
  <page-layout class="bg-white">
    <div class="bg-orange-1 text-orange-8 text-center q-py-sm q-px-md">
      <q-icon class="q-mr-xs" name="error_outline"></q-icon
      >身份认证是提现的重要凭证，绑定后不可更改！
    </div>
    <q-form ref="formRef" @submit="submit">
      <q-input
        v-model="realname"
        placeholder="真实姓名"
        class="bg-white q-px-md"
        :rules="[Rules.required]"
        :disable="store.user.real_identity?true:false"
      />
      <q-input
        v-model="idCardNo"
        placeholder="身份证号码"
        class="bg-white q-px-md"
        :rules="[Rules.required,Rules.cardNo]"
        :disable="store.user.real_identity?true:false"
      />
      <div class="q-ma-md" v-if="!store.user.real_identity"><q-btn unelevated color="primary" class="fit" type="submit">确认</q-btn></div>
    </q-form>
  </page-layout>
</template>
<script setup>
import { ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useSelfStore } from "stores/self";
import {Rules} from 'src/utils/tools'
import { api } from "boot/axios";
import { useQuasar } from "quasar";
const $q = useQuasar()
// const route = useRoute();
const router = useRouter();
const store = useSelfStore();
// const field = route.query.field;

const realname = ref(store.user.real_name);
const idCardNo = ref(store.user.real_identity);

const formRef = ref(null);
function submit() {
  $q.loading.show()
  api.realVerify({
    real_identity: idCardNo.value,
    real_name: realname.value
  }).then(res => {
      $q.notify({type: 'positive',message: res.message || '修改成功'})
      store.refresh().then(res => {
        router.back()
      })
    }).catch(e=>{
      $q.notify({type: 'negative',message: e.message})
    }).finally(()=>{
      $q.loading.hide()
    })
}
</script>
