zzak/x-forend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: x5初始化

Browse Source
This commit is contained in:
anonymous
2025-01-14 12:10:43 +08:00
parent c3ff2e3f4f
commit 2b43b95fdb
60 changed files with 433 additions and 551 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/index/index.vue
+63 -43
View File
@@ -10,34 +10,49 @@
<template>
<view class="home-page">
<NavBar />
<template v-if="userStore.userInfo?.banknum">
<view class="main-container w-345 h-185 mx-auto rounded-14 px-20 pt-70 text-12">
<Avatar class="absolute right-45 top-100 w-70 h-70" />
<view>姓名：{{ userStore.userInfo?.realname }}</view>
<view class="mt-10">社会保障号码：{{ userStore.userInfo?.banknum.substring(0, 4) }}</view>
<view class="mt-15">中国工商银行卡号</view>
<view class="mt-5 text-14 text-#333">
<!-- 每四位数字插入空格 -->
{{ userStore.userInfo?.banknum.replace(/(\d{4})(?=\d)/g, '$1 ') }}
</view>
<swiper
indicator-active-color="#EFB85A"
indicator-color="rgba(0,0,0,0.1)"
indicator-dots
autoplay
circular
class="w-345 h-170 mx-auto mt-10"
>
<swiper-item v-for="item in bannerList" :key="item.id">
<image
class="block w-345 h-170 rounded-10 overflow-hidden"
:src="getImageUrl(item.image)"
mode="aspectFill"
/>
</swiper-item>
</swiper>
<view class="flex bg-white py-15 rounded-10 m-15 border-2 border-white border-solid">
<view class="flex-1 flex flex-col items-center" @click="handleIntroduction">
<image class="w-30 h-30" src="@/static/images/home/nav-1.png" mode="aspectFill" />
<text class="mt-8 text-14 text-#333">简介</text>
</view>
</template>
<template v-else>
<view class="main-container w-345 h-185 mx-auto rounded-14 px-20 pt-70 text-12">
<view>姓名：***</view>
<view class="mt-15">社会保障号码：***</view>
<view class="mt-15">中国工商银行卡号：**************</view>
<!-- <view class="flex-1 flex flex-col items-center" @click="handleInvite">
<image class="w-30 h-30" src="@/static/images/home/nav-2.png" mode="aspectFill" />
<text class="mt-8 text-14 text-#333">抽奖转盘</text>
</view> -->
<view class="flex-1 flex flex-col items-center" @click="handleOfficialCommunity">
<image class="w-30 h-30" src="@/static/images/home/nav-2.png" mode="aspectFill" />
<text class="mt-8 text-14 text-#333">官方社群</text>
</view>
<view
class="mt-15 btn-gradient w-345 h-45 leading-45 mx-auto text-white rounded-full text-center"
@click="handleOpenAccount"
>
开通个人养老账号
<view class="flex-1 flex flex-col items-center" @click="handleOfficialCommunity">
<image class="w-30 h-30" src="@/static/images/home/nav-3.png" mode="aspectFill" />
<text class="mt-8 text-14 text-#333">在线客服</text>
</view>
</template>
<view class="flex-1 flex flex-col items-center" @click="handleDownload">
<image class="w-30 h-30" src="@/static/images/home/nav-4.png" mode="aspectFill" />
<text class="mt-8 text-14 text-#333">下载APP</text>
</view>
</view>
<view class="bg-white pt-15 px-15 rounded-10 m-15">
<view class="flex justify-between items-center">
<view class="flex justify-center items-center">
<view class="text-14 text-#333">最新时讯</view>
<!-- <view class="text-12 text-#999" @click="handleNews">查看全部</view> -->
</view>
@@ -47,7 +62,7 @@
indicator-dots
autoplay
circular
class="h-240 mt-10"
class="h-200 mt-10"
>
<swiper-item v-for="item in newsList" :key="item.id">
<video class="w-full h-160" :src="item.image" mode="aspectFill" />
@@ -66,26 +81,30 @@
:key="item.id"
@click="handleNewsDetail(item.id)"
>
<image class="w-85 h-85 rounded-10" :src="item.image" mode="aspectFill" />
<image
class="w-85 h-85 rounded-10 bg-gray-100"
:src="getImageUrl(item.image)"
mode="aspectFill"
/>
<view class="ml-15 flex-1 flex flex-col justify-between">
<view text-14>{{ item.name }}</view>
<view class="text-12 text-#999">{{ item.source }}</view>
<view class="text-12 text-#999">{{ item.createtime }}</view>
</view>
</view>
</view>
<wd-popup :lockScroll="false" v-model="showNotice" custom-style="border-radius:40rpx;">
<view class="px-30 py-30 w-330 h-457 notice-container rounded-20 flex flex-col">
<view class="text-18 font-bold py-15 text-center">系统公告</view>
<view class="py-15 flex-1">
<view class="text-18 font-bold pb-15 text-center">系统公告</view>
<view class="py-15 flex-1 overflow-y-auto">
<view
v-for="(item, index) in announcementList"
:key="item.id"
class="flex border-b-1 border-b-gray-300 border-b-solid py-15"
class="border-b-1 border-b-gray-300 border-b-solid py-15"
>
<text class="whitespace-nowrap text-14 font-bold text-gradient">
公告{{ ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'][index] }}：
</text>
<text class="text-14 text-#333 flex-1" v-html="item.content"></text>
<view class="whitespace-nowrap text-14 font-bold text-gradient text-center">
公告{{ ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'][index] }}
</view>
<view class="mt-12 text-14 text-#333 flex-1" v-html="item.content"></view>
</view>
</view>
<view
@@ -104,12 +123,12 @@ import Avatar from '@/components/Avatar.vue'
import NavBar from '@/components/NavBar.vue'
import {
downloadAppAPI,
getBannerAPI,
getIntroductionAPI,
getOpenPersonalAccountAPI,
getRealNameAuthAPI,
} from '@/service'
import { useUserStore } from '@/store'
import { showModal } from '@/utils'
import { getImageUrl, showModal } from '@/utils'
defineOptions({
name: 'Home',
@@ -186,20 +205,21 @@ const handleOpenAccount = async () => {
userStore.loadUserInfo()
// showModal('开通个人养老账户时，需邀请一名用户')
}
// 获取轮播图
const bannerList = ref([])
const getBanner = async () => {
const res = await getBannerAPI()
bannerList.value = res.data
}
onLoad(getBanner)
</script>
<style scoped>
.home-page {
min-height: 100vh;
padding-bottom: 100rpx;
background-image: url('@/static/images/home/bg.jpg');
background-position: top;
background-size: cover;
}
.main-container {
background-image: url('@/static/images/home/main-bg.jpg');
background-position: top;
background-size: cover;
background: linear-gradient(180deg, #fff3da 0%, #f8f8f8 100%);
}
.notice-container {
background-image: url('@/static/images/home/notice-bg.jpg');