更新背景

This commit is contained in:
weichengwu 2025-11-22 10:27:45 +08:00
parent 2e658e0158
commit 60d2ab6380
5 changed files with 10 additions and 14 deletions

View File

@ -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" />

Binary file not shown.

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 452 KiB

After

Width:  |  Height:  |  Size: 433 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 46 KiB

View File

@ -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]!">
验证 验证
@ -58,16 +58,12 @@
<span>结婚证信息:</span> <span>结婚证信息:</span>
<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"
class="w-full flex flex-col items-start border border-gray-200 rounded-lg p-5 bg-[#FAFAFA]"> class="w-full flex flex-col items-start border border-gray-200 rounded-lg p-5 bg-[#FAFAFA]">
<div> <div>
@ -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>