root/uniapp-im-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善添加银行卡功能

Browse Source
This commit is contained in:
cbb
2025-12-27 17:52:08 +08:00
parent 20455490f8
commit 3b9b142c21
44 changed files with 3434 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
pages/discover/company.vue Normal file
View File

@@ -0,0 +1,55 @@
<script setup></script>
<template>
<view class="company">
<view class="top-log">
<image
src="https://qcloud.dpfile.com/pc/TrdZpLN1zkXDV4oN2FH98LdVnvHj694NKQu0_KA3ul4eYxZWRPQ7CJuw-PqyZBS4.jpg"
mode="aspectFill"
class="img"
></image>
<text>名字</text>
</view>
<view class="consten">
<view class="item">富文本</view>
</view>
</view>
</template>
<style lang="scss" scoped>
page {
background: #f9f9f9;
}
.top-log {
margin: 114rpx 0 96rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.img {
width: 192rpx;
height: 192rpx;
}
text {
margin-top: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 32rpx;
color: #333333;
text-align: left;
font-style: normal;
text-transform: none;
}
}
.consten {
padding: 0 24rpx;
.item {
background: #ffffff;
padding: 48rpx 32rpx;
border-radius: 16rpx;
}
}
</style>

8
pages/discover/discover.vue
View File

@@ -20,6 +20,14 @@
navigateTo('/pages/discover/punch')
return
}
if (item === 'company') {
navigateTo('/pages/discover/company')
return
}
if (item === 'circle') {
navigateTo('/pages/discover/dynamic/dynamic')
return
}
if (item === 'mall') {
navigateTo('/pages/mall/list')
return

115
pages/discover/dynamic/dynamic.vue Normal file
View File

@@ -0,0 +1,115 @@
<script setup>
import { reactive, ref } from 'vue'
import { onPageScroll } from '@dcloudio/uni-app'
const MAX_SCROLL = 446
const cbNavBar = ref({})
const topIcon = reactive({
leftColor: '#ffffff',
rightColor: '#ffffff'
})
onPageScroll(e => {
cbNavBar.value?.updateScroll(e.scrollTop)
if (e.scrollTop > MAX_SCROLL - 220) {
topIcon.leftColor = '#000'
topIcon.rightColor = '#000'
} else {
topIcon.leftColor = '#ffffff'
topIcon.rightColor = '#ffffff'
}
})
</script>
<template>
<view class="dynamic">
<nav-bar
ref="cbNavBar"
isTopBg
target-color="#f9f9f9"
:max-scroll="MAX_SCROLL"
>
<template #back>
<uni-icons
:color="topIcon.leftColor"
type="left"
size="24"
></uni-icons>
</template>
<template #right>
<uni-icons
:color="topIcon.rightColor"
type="camera"
size="24"
></uni-icons>
</template>
</nav-bar>
<view class="top-bg-img">
<image
src="https://wx4.sinaimg.cn/mw690/006i0nC8ly1hqugav3k6yj31o01o0aod.jpg"
mode="aspectFill"
class="img"
></image>
<!-- 用户信息 -->
<view class="user-info">
<text>名字</text>
<image
src="https://img2.baidu.com/it/u=3408192385,656358498&fm=253&app=138&f=JPEG?w=760&h=760"
mode="aspectFill"
class="avatar"
></image>
</view>
</view>
<!-- 动态列表 -->
<view class="dynamic-list">
<view v-for="item in 4" class="list">
<image
src="https://img1.baidu.com/it/u=2645961124,1296922095&fm=253&app=138&f=JPEG?w=800&h=1530"
mode="aspectFill"
class="avatar"
></image>
<view class="content">
<text class="name">名字</text>
<text class="text">这是一条朋友圈的标题</text>
<view class="img-list">
<image
src="https://p4.itc.cn/images01/20220619/46660ed163164c14be90e605a73ee5e8.jpeg"
mode="aspectFill"
class="item-img"
></image>
</view>
<!-- 地址 -->
<view class="address">
<text>19分钟前</text>
<text>重庆市渝北xxx寄街道</text>
</view>
<!-- 点赞评论 -->
<view class="like-box">
<view class="like">
<uni-icons
type="hand-up"
size="20"
color="#747474"
></uni-icons>
<text>22</text>
</view>
<uni-icons type="chat" size="20" color="#747474"></uni-icons>
</view>
<!-- 评论内容 -->
<view class="comment">
<view v-for="item in 3" :key="item" class="comment-item">
<text>Admin:</text>
<text>确实的很好，值得推荐的很好</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
@import '../styles/dynamic.scss';
</style>

137
pages/discover/punch.vue
View File

@@ -1,4 +1,15 @@
<script setup></script>
<script setup>
import { ref } from 'vue'
const indexData = ref([1, 2, 3, 4])
const onItem = item => {
if (indexData.value.includes(item)) {
return
}
indexData.value.push(item)
}
</script>
<template>
<view class="punch">
@@ -12,20 +23,130 @@
</template>
</nav-bar>
<view class="public-header—box">
<!-- <image
src="/static/images/ranking-list/title-icon.png"
mode="aspectFit"
class="left-icon"
></image>
<view class="integral-box">
<text>我的积分</text>
<text>410</text>
</view>
<image
src="/static/images/ranking-list/hat.png"
src="/static/images/discover/calendar.png"
mode="aspectFit"
class="right-icon"
></image> -->
></image>
</view>
<view class="punch-box">
<view class="top-title">
<text class="title">每日签到领积分</text>
<view class="right-box">
<text>已连续签到</text>
<text>05</text>
<text>天</text>
</view>
</view>
<!-- 签到列表 -->
<view class="list-box">
<view
v-for="item in 30"
:key="item"
:class="{ active: indexData.includes(item) }"
class="item"
@click="onItem(item)"
>
<view class="bg-box">
<image
src="/static/images/discover/bean.png"
mode="heightFix"
class="icon"
></image>
<text>+10</text>
</view>
<text class="bottom-name">今天</text>
</view>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
@import './styles/index.scss';
.punch-box {
padding: 0 24rpx;
.top-title {
font-family: PingFang SC, PingFang SC;
font-style: normal;
text-transform: none;
display: flex;
align-items: center;
.title {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.right-box {
margin-left: 32rpx;
display: flex;
align-items: center;
text {
font-weight: 500;
font-size: 28rpx;
color: #666666;
&:nth-child(2) {
margin: 0 4rpx;
color: #00d993;
}
}
}
}
.list-box {
margin-top: 38rpx;
font-family: PingFang SC, PingFang SC;
font-style: normal;
text-transform: none;
display: grid;
grid-template-columns: repeat(7, 1fr);
grid-gap: 22rpx;
.item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.bg-box {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 80rpx;
height: 100rpx;
background: #f4f4f4;
border-radius: 8rpx;
.icon {
height: 48rpx;
}
text {
font-weight: bold;
font-size: 24rpx;
color: #999999;
}
}
.bottom-name {
margin-top: 8rpx;
font-size: 24rpx;
color: #999999;
}
}
.active {
.bg-box {
background: linear-gradient(0deg, #00d993 0%, #00d9c5 100%);
text {
color: #ffffff;
}
}
.bottom-name {
color: #00d993;
}
}
}
}
</style>

40
pages/discover/ranking-list.vue
View File

@@ -1,8 +1,36 @@
<script setup></script>
<script setup>
import { ref } from 'vue'
import { onLoad, onPageScroll } from '@dcloudio/uni-app'
import { getUserIntegralRank } from '@/api'
const cbNavBar = ref({})
const listData = ref([])
const getData = async () => {
const res = await getUserIntegralRank({
pageNum: 1,
pageSize: 100
})
listData.value = res.rows
}
onPageScroll(e => {
cbNavBar.value?.updateScroll(e.scrollTop)
})
onLoad(() => {
getData()
})
</script>
<template>
<view class="ranking-list">
<nav-bar>
<nav-bar
ref="cbNavBar"
isTopBg
target-color="#f9f9f9"
:max-scroll="446"
>
<template #back>
<image
src="/static/images/public/return-icon.png"
@@ -46,8 +74,8 @@
</uni-row>
<!-- 列表内容 -->
<uni-row
v-for="(item, index) in 19"
:key="index"
v-for="(item, index) in listData"
:key="item.id"
class="table-content"
>
<uni-col :span="6">
@@ -69,14 +97,14 @@
class="left-icon"
></image>
<view class="name">
<text>张三</text>
<text>名字</text>
<text>158****98874</text>
</view>
</view>
</uni-col>
<uni-col :span="6">
<view class="table-right">
<text class="item-text">100</text>
<text class="item-text">{{ item.totalPoints }}</text>
</view>
</uni-col>
</uni-row>

126
pages/discover/styles/dynamic.scss Normal file
View File

@@ -0,0 +1,126 @@
.top-bg-img {
width: 100%;
height: 544rpx;
position: relative;
.img {
width: 100%;
height: 100%;
}
.user-info {
position: absolute;
right: 24rpx;
bottom: -60rpx;
display: flex;
align-items: flex-start;
text {
margin-top: 30rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 600;
font-size: 32rpx;
color: #ffffff;
font-style: normal;
text-transform: none;
}
.avatar {
width: 160rpx;
height: 160rpx;
border-radius: 16rpx;
margin-left: 30rpx;
}
}
}
.dynamic-list {
padding: 86rpx 26rpx 0 26rpx;
.list + .list {
margin-top: 32rpx;
}
.list {
display: flex;
.avatar {
width: 96rpx;
height: 96rpx;
border-radius: 96rpx;
flex-shrink: 0;
margin-right: 32rpx;
}
.content {
width: 100%;
font-family: PingFang SC, PingFang SC;
text-align: left;
font-style: normal;
text-transform: none;
display: flex;
flex-direction: column;
.name {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin: 16rpx 0;
}
.img-list {
.item-img {
width: 410rpx;
height: 250rpx;
border-radius: 8rpx;
}
}
.address {
display: flex;
align-items: center;
margin: 16rpx 0 14rpx;
text {
font-weight: 500;
font-size: 24rpx;
color: #999999;
margin-right: 16rpx;
&:last-child {
font-size: 24rpx;
color: #0c587e;
}
}
}
.like-box {
display: flex;
align-items: center;
.like {
display: flex;
align-items: center;
margin-right: 86rpx;
text {
font-weight: 400;
font-size: 22rpx;
color: #747474;
}
}
}
.comment {
margin-top: 16rpx;
padding: 16rpx 18rpx;
background: #f9f9f9;
border-radius: 8rpx;
.comment-item + .comment-item {
margin-top: 16rpx;
}
.comment-item {
text {
font-weight: 400;
font-size: 28rpx;
color: #333333;
margin-right: 8rpx;
&:last-child {
font-weight: 500;
font-size: 28rpx;
color: #999999;
}
}
}
}
}
}
}

21
pages/discover/styles/index.scss
View File

@@ -13,6 +13,27 @@
background: #ffffff;
border-radius: 32rpx 32rpx 0rpx 0rpx;
}
.integral-box {
width: 354rpx;
height: 166rpx;
position: absolute;
bottom: 82rpx;
left: 48rpx;
font-family: PingFang SC, PingFang SC;
color: #ffffff;
font-weight: bold;
font-style: normal;
text-transform: none;
display: flex;
flex-direction: column;
align-items: flex-start;
text {
font-size: 32rpx;
&:last-child {
font-size: 100rpx;
}
}
}
.left-icon {
width: 354rpx;
height: 166rpx;