<route lang="json">
{ "style": { "navigationBarTitleText": "积分结账", "navigationBarBackgroundColor": "#fff" } }
</route>
<script lang="ts" setup>
// import QRCode from 'qrcode'
import { ref } from 'vue'
const codeImageSrc = ref('')

const generateQR = async (text) => {
  // try {
  //   codeImageSrc.value = await QRCode.toDataURL(text)
  // } catch (err) {
  //   console.error(err)
  // }
}
generateQR('121')
</script>

<template>
  <view>
    <div class="bg-white pb-[17px]">
      <div class="flex items-center justify-center py-[30px]">
        <img class="w-[199px] h-[199px]" :src="codeImageSrc" />
      </div>
      <div class="flex items-center justify-between px-[16px] mb-[15px]">
        <div class="text-black/60 text-base font-normal font-['PingFang SC'] leading-normal">
          订单金额
        </div>
        <div class="text-black/90 text-base font-normal font-['PingFang SC'] leading-normal">
          ￥326
        </div>
      </div>
      <div class="flex items-center justify-between px-[16px]">
        <div class="text-black/60 text-base font-normal font-['PingFang SC'] leading-normal">
          积分
        </div>
        <div class="text-black/90 text-base font-normal font-['PingFang SC'] leading-normal">
          1250
        </div>
      </div>
    </div>
    <div class="bg-white mt-[15px]">
      <div class="flex items-center justify-between px-[16px] py-[15px]">
        <div class="flex items-center">
          <img class="w-[29px] h-[29px] rounded-full" src="https://via.placeholder.com/29x29" />
          <div
            class="text-black/90 text-sm font-normal font-['PingFang SC'] leading-normal ml-[10px]"
          >
            李梦诗
          </div>
        </div>
        <div
          class="text-center text-black/60 text-sm font-normal font-['PingFang SC'] leading-normal"
        >
          扫码支付中...
        </div>
      </div>
    </div>
  </view>
</template>

<style lang="scss" scoped></style>
