| <template> | 
|   <a-card | 
|     class="general-card" | 
|     :title="$t('userSetting.certification.title.record')" | 
|     :header-style="{ border: 'none' }" | 
|   > | 
|     <a-table v-if="renderData.length" :data="renderData"> | 
|       <template #columns> | 
|         <a-table-column | 
|           :title="$t('userSetting.certification.columns.certificationType')" | 
|         > | 
|           <template #cell> | 
|             {{ $t('userSetting.certification.cell.certificationType') }} | 
|           </template> | 
|         </a-table-column> | 
|         <a-table-column | 
|           :title="$t('userSetting.certification.columns.certificationContent')" | 
|           data-index="certificationContent" | 
|         /> | 
|         <a-table-column :title="$t('userSetting.certification.columns.status')"> | 
|           <template #cell="{ record }"> | 
|             <p v-if="record.status === 0"> | 
|               <span class="circle"></span> | 
|               <span>{{ $t('userSetting.certification.cell.auditing') }}</span> | 
|             </p> | 
|             <p v-if="record.status === 1"> | 
|               <span class="circle pass"></span> | 
|               <span>{{ $t('userSetting.certification.cell.pass') }}</span> | 
|             </p> | 
|           </template> | 
|         </a-table-column> | 
|         <a-table-column | 
|           :title="$t('userSetting.certification.columns.time')" | 
|           data-index="time" | 
|         /> | 
|         <a-table-column | 
|           :title="$t('userSetting.certification.columns.operation')" | 
|         > | 
|           <template #cell="{ record }"> | 
|             <a-space> | 
|               <a-button type="text"> | 
|                 {{ $t('userSetting.certification.button.check') }} | 
|               </a-button> | 
|               <a-button v-if="record.status === 0" type="text"> | 
|                 {{ $t('userSetting.certification.button.withdraw') }} | 
|               </a-button> | 
|             </a-space> | 
|           </template> | 
|         </a-table-column> | 
|       </template> | 
|     </a-table> | 
|   </a-card> | 
| </template> | 
|   | 
| <script lang="ts" setup> | 
|   import { PropType } from 'vue'; | 
|   import { CertificationRecord } from '@/api/user-center'; | 
|   | 
|   defineProps({ | 
|     renderData: { | 
|       type: Array as PropType<CertificationRecord>, | 
|       default() { | 
|         return []; | 
|       }, | 
|     }, | 
|   }); | 
| </script> | 
|   | 
| <style scoped lang="less"> | 
|   :deep(.arco-table-th) { | 
|     &:last-child { | 
|       .arco-table-th-item-title { | 
|         margin-left: 16px; | 
|       } | 
|     } | 
|   } | 
| </style> |