<route lang="yaml">
style:
  navigationBarTitleText: 积分明细
  navigationBarBackgroundColor: '#fff'
</route>

<script setup lang="ts">
import { desinTopBg } from '@designer-hub/assets/src/svgs'
const tab = ref(0)
const tabs = ref([
  { label: '案例', value: 'integral' },
  { label: '动态', value: 'system' },
  { label: '视频', value: 'interact' },
])
</script>

<template>
  <view>
    <div class="aspect-[1.575/1] absolute left-0 right-0 top-0">
      <wd-img width="100%" height="100%" :src="desinTopBg" custom-class="vertical-top"></wd-img>
    </div>
    <div class="flex flex-col relative mt-[27px] p-[16px]">
      <div class="flex items-center justify-between">
        <div class="flex items-center">
          <div class="text-white text-sm font-['PingFang_SC'] leading-relaxed mr-[10px]">
            当前积分
          </div>
          <div>
            <span
              class="text-white text-4xl font-normal font-['D-DIN Exp'] leading-relaxed tracking-[3.60px]"
            >
              32
            </span>
          </div>
        </div>
        <div class="text-white text-sm font-normal font-['PingFang_SC'] leading-relaxed">2024</div>
      </div>
      <div class="bg-white rounded-lg backdrop-blur-[60px] p-[16px] mt-[29px]">
        <div class="flex items-center justify-between flex-row mb-[16px]">
          <div>
            <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed">
              Imola材料商
            </div>
            <div
              class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-relaxed mt-[5px]"
            >
              2024/08/10 14:21:54
            </div>
          </div>
          <div class="text-[#ef4343] text-lg font-normal font-['D-DIN Exp'] leading-relaxed">
            +8200
          </div>
        </div>
      </div>
    </div>
  </view>
</template>

<style scoped lang="scss">
:deep(.wd-tabs) {
  background: transparent;
}
</style>
