更新背景
This commit is contained in:
parent
2e658e0158
commit
60d2ab6380
|
|
@ -1,5 +1,5 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en" class="bg-[#FCEEF3]">
|
<html lang="en" class="bg-[#960C0F]">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||||
|
|
|
||||||
BIN
public/ziti.png
BIN
public/ziti.png
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 59 KiB |
BIN
public/头图.png
BIN
public/头图.png
Binary file not shown.
|
Before Width: | Height: | Size: 452 KiB After Width: | Height: | Size: 433 KiB |
BIN
public/扫描.png
BIN
public/扫描.png
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 46 KiB |
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="h-full bg-[#FCEEF3] overflow-hidden">
|
<div class="h-full overflow-hidden">
|
||||||
<!-- 顶部头图 -->
|
<!-- 顶部头图 -->
|
||||||
<div class="w-full overflow-hidden relative">
|
<div class="w-full overflow-hidden relative">
|
||||||
<img src="/头图.png" alt="活动宣传" class="w-full h-auto" />
|
<img src="/头图.png" alt="活动宣传" class="w-full h-auto" />
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
<div class="flex items-start mb-4">
|
<div class="flex items-start mb-4">
|
||||||
<img src="/logo.png" alt="中国福利彩票" class="h-8 pl-2" />
|
<img src="/logo.png" alt="中国福利彩票" class="h-8 pl-2" />
|
||||||
</div>
|
</div>
|
||||||
<img src="/ziti.png" alt="宁福您彩 新婚送福" class="h-15" />
|
<img src="/ziti.png" alt="宁福您彩 新婚送福" class="h-14" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -31,7 +31,7 @@
|
||||||
<!-- 手机号输入 -->
|
<!-- 手机号输入 -->
|
||||||
<div class="mb-5 flex items-center gap-3 border border-gray-200 rounded-lg px-4">
|
<div class="mb-5 flex items-center gap-3 border border-gray-200 rounded-lg px-4">
|
||||||
<input :disabled="formData.verifyCode" v-model="formData.phone" type="tel" placeholder="请输入手机号码"
|
<input :disabled="formData.verifyCode" v-model="formData.phone" type="tel" placeholder="请输入手机号码"
|
||||||
maxlength="11" class="outline-none focus:border-[#E8424D] transition-colors flex-1 h-11 w-full" />
|
maxlength="11" class="outline-none focus:border-[#E8424D] transition-colors flex-1 h-14 w-full" />
|
||||||
|
|
||||||
<button @click="formData.verifyCode ? clearPhone() : sendVerificationCode()"
|
<button @click="formData.verifyCode ? clearPhone() : sendVerificationCode()"
|
||||||
:disabled="countdown > 0 || formData.phone.length !== 11"
|
:disabled="countdown > 0 || formData.phone.length !== 11"
|
||||||
|
|
@ -43,7 +43,7 @@
|
||||||
<!-- 验证码输入 -->
|
<!-- 验证码输入 -->
|
||||||
<div class="mb-5 flex items-center gap-3 border border-gray-200 rounded-lg px-4">
|
<div class="mb-5 flex items-center gap-3 border border-gray-200 rounded-lg px-4">
|
||||||
<input :disabled="formData.verifyCode" v-model="formData.smsCode" type="text" placeholder="请输入验证码"
|
<input :disabled="formData.verifyCode" v-model="formData.smsCode" type="text" placeholder="请输入验证码"
|
||||||
maxlength="6" class="outline-none focus:border-[#E8424D] transition-colors flex-1 h-11 w-full" />
|
maxlength="6" class="outline-none focus:border-[#E8424D] transition-colors flex-1 h-14 w-full" />
|
||||||
<button v-if="!formData.verifyCode" @click="verifyCode" :disabled="formData.smsCode.length !== 6"
|
<button v-if="!formData.verifyCode" @click="verifyCode" :disabled="formData.smsCode.length !== 6"
|
||||||
class="h-8 px-4 bg-[#E8424D]! text-white! rounded-lg text-sm! transition-all hover:opacity-90 active:scale-98 disabled:bg-[#8a8a8a]!">
|
class="h-8 px-4 bg-[#E8424D]! text-white! rounded-lg text-sm! transition-all hover:opacity-90 active:scale-98 disabled:bg-[#8a8a8a]!">
|
||||||
验证
|
验证
|
||||||
|
|
@ -59,13 +59,9 @@
|
||||||
<div v-if="formData.marriageNo" class="text-xs" @click="resetMarriageInfo">重新扫描</div>
|
<div v-if="formData.marriageNo" class="text-xs" @click="resetMarriageInfo">重新扫描</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!formData.marriageNo"
|
<div v-if="!formData.marriageNo"
|
||||||
class="border border-gray-200 rounded-lg p-5 flex items-center justify-center">
|
class="border border-dashed border-gray-200 rounded-lg p-5 flex items-center justify-center">
|
||||||
<div class="relative inline-block" @click="handleScanClick">
|
<div class="relative inline-block" @click="handleScanClick">
|
||||||
<img src="/扫描.png" alt="" class="h-20">
|
<img src="/扫描.png" alt="" class="h-20">
|
||||||
<div
|
|
||||||
class="h-16 w-26 absolute border border-[#f0f0f0] rounded-md top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 flex justify-center">
|
|
||||||
<span class="text-[#E2E4E9] text-xs pt-1">结婚证</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="formData.marriageNo"
|
<div v-if="formData.marriageNo"
|
||||||
|
|
@ -87,8 +83,8 @@
|
||||||
|
|
||||||
<!-- 提交按钮 -->
|
<!-- 提交按钮 -->
|
||||||
<button @click="submitForm" :disabled="!formData.marriageNo"
|
<button @click="submitForm" :disabled="!formData.marriageNo"
|
||||||
class="w-full h-12 bg-gradient-to-r from-[#E8424D]! to-[#FF7A7A]! text-white! rounded-full text-lg font-bold transition-all hover:opacity-90 active:scale-98 disabled:from-[#8a8a8a]! disabled:to-[#8a8a8a]!">
|
class="w-full h-14 bg-gradient-to-r from-[#E8424D]! to-[#FF7A7A]! text-white! rounded-full text-lg font-bold transition-all hover:opacity-90 active:scale-98 disabled:from-[#8a8a8a]! disabled:to-[#8a8a8a]!">
|
||||||
提交领取喜礼
|
<div class="text-lg">提交领取喜礼</div>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue