yzy/sweekar-app
1
0 Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
yzy committed 2026-01-12 19:06:24 +08:00
1 parent 85c436551f
commit 63726d8200
1 file changed
+78 -18
Download Patch File Download Diff File Expand all files Collapse all files
pages/index/index.vue
+78 -18
View File
@@ -79,7 +79,7 @@ const handleBook = (productId) => {
</script> </script>
<template> <template>
<view class="h-[100vh] bg-[#fff] flex flex-col mx-[30rpx] items-center"> <view class=" bg-[#fff] flex flex-col mx-[30rpx] items-center">
<!-- title --> <!-- title -->
<view class="bg-[#fff] flex justify-between items-center w-full"> <view class="bg-[#fff] flex justify-between items-center w-full">
@@ -88,26 +88,26 @@ const handleBook = (productId) => {
<text class="text-[#33333] text-[20px] font-bold" >Sweekar Alpha</text> <text class="text-[#33333] text-[20px] font-bold" >Sweekar Alpha</text>
<u-icon name="level" color="#fff" class="bg-theme border-round-theme rounded-full"></u-icon> <u-icon name="level" color="#fff" class="bg-theme border-round-theme rounded-full"></u-icon>
</view> </view>
<view class="w-[80px] border-round-theme border-[2px] rounded-full flex justify-center py-[6px] shadow-[4px_4px_1px_0_rgba(0,0,0,1)]"> <view class="w-[80px] border-round-theme border-[2px] rounded-full flex justify-center py-[3px] shadow-[4px_4px_1px_0_rgba(0,0,0,1)]">
<u-icon name="level"></u-icon> <u-icon name="level"></u-icon>
<text>1205</text> <text class="text-[13px]">1205</text>
</view> </view>
</view> </view>
<!-- row2 --> <!-- row2 -->
<view class="flex justify-between items-center mt-[15px] w-full"> <view class="flex justify-between items-center mt-[15px] w-full">
<!-- 状态 --> <!-- 状态 -->
<view class=" bg-[#fff] border-solid border py-[6px] px-[10px] rounded-full flex items-center gap-[10px] shadow-[4px_4px_1px_0_rgba(0,0,0,1)]"> <view class=" bg-[#fff] border-solid border py-[6px] px-[6px] rounded-full flex items-center gap-[10px] shadow-[4px_4px_1px_0_rgba(0,0,0,1)]">
<view class="border-bottom-theme rounded-full flex justify-center items-center h-[40px] w-[40px] bg-theme"> <view class="border-bottom-theme rounded-full flex justify-center items-center h-[30px] w-[30px] bg-theme">
<text class="text-[#fff]">5</text> <text class="text-[#fff]">5</text>
</view> </view>
<view class="flex flex-col"> <view class="flex flex-col">
<text class="text-[13px]">STAGE</text> <text class="text-[10px]">STAGE</text>
<text class="text-[16px] font-bold">CHILDHOOD</text> <text class="text-[13px] font-bold">CHILDHOOD</text>
</view> </view>
</view> </view>
<!-- 日期 --> <!-- 日期 -->
<view class="border border-solid border-[#cdcdcd] bg-[#fff] py-[2px] px-[4px] gap-[6px] flex"> <view class="border border-solid border-[#cdcdcd] bg-[#fff] py-[2px] px-[4px] gap-[2px] flex items-center text-[10px]">
<u-icon name="clock"></u-icon> <u-icon name="clock" size="10" bold=""></u-icon>
<text>42</text> <text>42</text>
<text>DAYS</text> <text>DAYS</text>
</view> </view>
@@ -115,31 +115,91 @@ const handleBook = (productId) => {
</view> </view>
<!-- EXP --> <!-- EXP -->
<view class="flex gap-[10px] mt-[15px] w-full "> <view class="flex items-center gap-[10px] mt-[20px] w-full ">
<text class="text-[12px]">EXP</text> <text class="text-[8px]">EXP</text>
<view class="w-[150px]"> <view class="w-[100px]">
<uv-line-progress :percentage="60" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress> <uv-line-progress :percentage="30" height="6" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress>
</view> </view>
</view> </view>
<!-- MODEL X --> <!-- MODEL X -->
<view class="border border-solid border-[#cdcdcd] rounded-full h-[280px] w-[280px] mt-[100px] p-[20px] flex justify-center items-center"> <view class="relative border border-solid border-[#cdcdcd] bg-[#FBFAFA] rounded-full h-[220px] w-[220px] mt-[70px] mb-[20px] p-[10px] flex justify-center items-center">
<!-- 中心圆圈 --> <!-- 中心圆圈 -->
<view class="border-[4px] border-solid border-theme rounded-full h-[220px] w-[220px] p-[20px] flex justify-center items-center"> <view class="border-[3px] border-solid border-theme rounded-full h-[160px] bg-[#fff] w-[160px] p-[20px] flex justify-center items-center">
<view class="flex flex-col justify-center items-center"> <view class="flex flex-col justify-center items-center">
<u-icon name="star" size="80"></u-icon> <u-icon name="star" size="80"></u-icon>
<text>MODEL X</text> <text>MODEL X</text>
</view> </view>
</view> </view>
<!-- 交流栏 --> <!-- 交流栏 -->
<!-- <view class="w-[150px] h-[80px] border-[4px]" > <view class="absolute top-[-60px] right-[-30px] w-[120px] flex flex-col justify-center items-center px-[10px] border border-solid border-theme bg-[#fff] rounded-t-lg rounded-br-lg h-[70px] border-[2px] shadow-[4px_4px_1px_0_rgba(0,0,0,1)]" >
<view class="text-[12px]">
</view> --> Master,I missed you! Let's play together!
</view>
</view>
</view>
<uv-divider dashed="true" class="w-full"></uv-divider>
<!-- 四宫格 -->
<view class="w-full p-[20px] flex flex-col gap-[10px]">
<!-- 第一行 -->
<view class="w-full flex justify-between items-center gap-[10px]">
<!-- item -->
<view class="flex flex-col w-1/2 rounded-lg border border-solid border-[2px] border-theme p-[10px] gap-[10px]">
<view class="flex justify-between">
<text class="text-[12px] font-bold">HYNGER</text>
<u-icon name="star"></u-icon>
</view>
<text class="text-[18px] font-bold">72%</text>
<view class="w-full">
<uv-line-progress :percentage="60" :height="8" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress>
</view>
</view> </view>
<view class="flex flex-col w-1/2 rounded-lg border border-solid border-[2px] border-theme p-[10px] gap-[10px]">
<view class="flex justify-between">
<text class="text-[12px] font-bold">HYNGER</text>
<u-icon name="star"></u-icon>
</view>
<text class="text-[18px] font-bold">72%</text>
<view class="w-full">
<uv-line-progress :percentage="60" :height="8" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress>
</view>
</view>
</view>
<!-- 第二行 -->
<view class="w-full flex justify-between items-center gap-[10px]">
<!-- item -->
<view class="flex flex-col w-1/2 rounded-lg border border-solid border-[2px] border-theme p-[10px] gap-[10px]">
<view class="flex justify-between">
<text class="text-[12px] font-bold">HYNGER</text>
<u-icon name="star"></u-icon>
</view>
<text class="text-[18px] font-bold">72%</text>
<view class="w-full">
<uv-line-progress :percentage="60" :height="8" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress>
</view>
</view>
<view class="flex flex-col w-1/2 rounded-lg border border-solid border-[2px] border-theme p-[10px] gap-[10px]">
<view class="flex justify-between">
<text class="text-[12px] font-bold">HYNGER</text>
<u-icon name="star"></u-icon>
</view>
<text class="text-[18px] font-bold">72%</text>
<view class="w-full">
<uv-line-progress :percentage="60" :height="8" activeColor="#333333" :showText="false" class="border-round-theme"></uv-line-progress>
</view>
</view>
</view>
</view>
<CustomTabBar /> <CustomTabBar />
</view> </view>