Browse Source

Merge remote-tracking branch 'origin/master'

master
前端-胡立永 1 year ago
parent
commit
bc5719f013
10 changed files with 547 additions and 85 deletions
  1. +10
    -0
      common.css
  2. +2
    -1
      pages/index/center.vue
  3. +89
    -28
      pages/mine/addBankCard.vue
  4. +71
    -10
      pages/mine/incomeRecord.vue
  5. +218
    -10
      pages/mine/purse.vue
  6. +12
    -25
      pages/mine/sonPage/promotion/promotionDetail.vue
  7. +143
    -11
      pages/mine/withdraw.vue
  8. +1
    -0
      static/image/addBankCard/1.svg
  9. BIN
      static/image/incomeRecord/1.png
  10. +1
    -0
      static/image/purse/1.svg

+ 10
- 0
common.css View File

@ -0,0 +1,10 @@
.bottomBtn {
position: fixed;
bottom: 5%;
left: 25%;
width: 50%;
height: 80rpx;
text-align: center;
color: #ffffff;
background: linear-gradient(to right, #3c69f1, #5f3bf5);
}

+ 2
- 1
pages/index/center.vue View File

@ -106,7 +106,8 @@ export default {
{name: 'star', imageUrl: '/static/image/center/1.png', title: '我的银行卡', {name: 'star', imageUrl: '/static/image/center/1.png', title: '我的银行卡',
gotoPageUrl: '/mine/addBankCard' gotoPageUrl: '/mine/addBankCard'
}, },
{name: 'star', imageUrl: '/static/image/center/1.png', title: '我的钱包'},
{name: 'star', imageUrl: '/static/image/center/1.png', title: '我的钱包',
gotoPageUrl: '/mine/purse'},
], ],
// //
otherList: [ otherList: [


+ 89
- 28
pages/mine/addBankCard.vue View File

@ -1,26 +1,67 @@
<template> <template>
<view class="addBankCard"> <view class="addBankCard">
<!--顶部导航栏--> <!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="推广详情"/>
<navbar leftClick @leftClick="$utils.navigateBack" title="添加银行卡"/>
<!--添加银行卡页面--> <!--添加银行卡页面-->
<view class="addBankCard-container">
<view class="addBankCard-title">为保证您的资金安全请绑定账户本人的银行卡</view>
<view class="cardNumberTitle">
<view >卡号</view>
<view>
<uv-icon name="camera" color="#2979ff" size="28"></uv-icon>
<view class="container">
<view class="header">
<text>为保证您的资金安全请绑定账户本人的银行卡</text>
</view>
<view class="form-item">
<text class="label">卡号</text>
<view class="card-info">
<radio-group>
<label>
<radio value="建行" checked="true"></radio>
<text>中国建设银行</text>
</label>
</radio-group>
<view class="camera-icon" @click="onCameraClick">
<image src="/static/image/addBankCard/1.svg"></image>
</view>
</view> </view>
</view>
<view class="form-item">
<text class="label">姓名</text>
<input class="input" placeholder="请输入姓名" v-model="name" />
</view> </view>
<view class="form-item">
<text class="label">身份证号</text>
<input class="input" placeholder="请输入身份证号" v-model="idCard" />
</view>
<!--<button class="next-button" @click="onNextClick">下一步</button>-->
</view> </view>
<!--下一步按钮-->
<button @click="onNextClick" class="bottomBtn">
下一步
</button>
</view> </view>
</template> </template>
<script> <script>
import '../../common.css'; // CSS
export default { export default {
data() { data() {
return {};
return {
name: 'xiaohua',
idCard: '2101472154874512'
};
},
methods: {
onCameraClick() {
//
},
onNextClick() {
this.$utils.navigateTo("/mine/purse");
}
} }
} }
</script> </script>
@ -31,30 +72,50 @@ export default {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.container {
padding: 16px;
.addBankCard {
padding: 20rpx;
.addBankCard-title{
color:#C6C7CB;
.header {
margin-bottom: 20px;
font-size: 14px;
color: #666;
} }
.addBankCard-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 100%;
}
.form-item {
margin-bottom: 20px;
.label {
font-size: 16px;
margin-bottom: 10px;
display: block;
}
.card-info {
display: flex;
justify-content: space-between;
align-items: center;
.camera-icon {
width: 24px;
height: 24px;
.cardNumberTitle {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10rpx;
width: 100%;
height: 20%;
box-sizing: border-box;
image {
width: 100%;
height: 100%;
}
}
}
.input {
width: 100%;
padding: 10px;
font-size: 16px;
border: 1px solid #e5e5e5;
border-radius: 4px;
}
} }
} }
</style> </style>

+ 71
- 10
pages/mine/incomeRecord.vue View File

@ -1,19 +1,80 @@
<template> <template>
<view>
收益记录
</view>
<view class="incomeRecord">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="收益记录"/>
<!--内容区域-->
<view class="content">
<view class="title">收益记录</view>
<view class="list">
<view class="item" v-for="(item,index) in 20" :key="index">
<view class="left">
<image src="/static/image/incomeRecord/1.png" style="width: 70%;height: 70%;"></image>
</view>
<view class="center">
<view>小李</view>
<view>2024.02.02</view>
</view>
<view class="right">
<view>收益金额</view>
<view>¥10000</view>
</view>
</view>
</view>
</view>
</view>
</template> </template>
<script> <script>
export default {
data() {
return {
};
}
}
export default {
data() {
return {};
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.incomeRecord {
.content {
padding: 0 40rpx;
height: calc(100vh - 240rpx);
.title {
font-weight: bold;
margin-top: 5%;
}
.list {
padding-top: 50rpx;
.item {
display: flex;
gap: 20rpx;
//height: 80rpx;
margin-bottom: 40rpx;
.left {
display: flex;
justify-content: center;
align-items: flex-start;
width: 15%;
}
.center {
width: 60%;
}
.right {
width: 30%;
text-align: center;
}
}
}
}
}
</style> </style>

+ 218
- 10
pages/mine/purse.vue View File

@ -1,19 +1,227 @@
<template> <template>
<view>
我的钱包
</view>
<view class="purse">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="我的钱包"/>
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">1240,045</view>
<view class="bottom">可提现金额</view>
</view>
<view class="b">
<view class="bb">
<view class="top">今日收益</view>
<view class="bottom">1234</view>
</view>
<view class="bb">
<view class="top">累计收益</view>
<view class="bottom">1234</view>
</view>
<view class="bb">
<view class="top">已提现</view>
<view class="bottom">1234</view>
</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="card-record">卡片记录</view>
<!--具体银行卡-->
<view class="cards" >
<view class="cardItem" v-for="(item, index) in 5" :key="index">
<view class="cardImage">
<image src="/static/image/addBankCard/1.svg" style="width: 100%;height: 100%;"></image>
</view>
<view class="cardInfo">
<view class="cardNum">
6222021000000000018
</view>
<view class="cardName">
工商银行
</view>
</view>
<view class="cardIcon">
<image src="/static/image/purse/1.svg" style="width: 70%;height: 70%;"></image>
</view>
</view>
</view>
</view>
</view>
<!--收益记录和去提现-->
<span class="income-record" @click="gotoIncomeRecordPage">收益记录</span>
<!--去提现按钮-->
<button @click="gotoWithdrawPage" class="bottomBtn">
去提现
</button>
</view>
</template> </template>
<script> <script>
export default {
data() {
return {
};
}
}
import '../../common.css'; // CSS
export default {
data() {
return {};
},
methods: {
//
gotoIncomeRecordPage() {
this.$utils.navigateTo('/mine/incomeRecord');
},
//
gotoWithdrawPage() {
this.$utils.navigateTo('/mine/withdraw');
}
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.purse {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
background-color: #f8faff;
height: 18vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
}
.b {
display: flex;
justify-content: center;
align-items: center;
gap: 100rpx;
width: 100%;
margin: 30rpx 40rpx 0 40rpx;
color: #4b4b4d;
.bb {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2); /* 仅上边的阴影效果 */
background-color: #fff;
height: calc(82vh - 240rpx);
width: 100vw;
.card-record {
font-size: 34rpx;
padding: 40rpx 0 0 40rpx;
}
.cards {
display: flex;
flex-direction: column;
gap: 20rpx;
//width: 100vw;
padding: 40rpx;
.cardItem {
display: flex;
gap: 20rpx;
height: 100rpx;
//border: 1px solid red;
//width: 100vw;
.cardImage {
width: 30%;
//height: 100%;
}
.cardInfo {
display: flex;
flex-direction: column;
justify-content: space-evenly;
gap: 6rpx;
width: 60%;
.cardName {
font-size: 28rpx;
color: #8f92a1;
}
.cardNum {
font-size: 24rpx;
color: #000000;
}
}
.cardIcon {
width: 10%;
}
}
}
}
}
.withdraw-button {
position: fixed;
bottom: 80rpx;
left: 16px; //
right: 16px; //
background: $uni-linear-gradient-btn-color; //
color: white; //
text-align: center; //
padding: 10px 0; //
font-size: 18px; //
z-index: 1000; //
display: flex;
justify-content: center;
align-items: center;
width: 50%;
height: 80rpx;
border-radius: 10rpx;
}
.income-record {
position: fixed;
bottom: 160rpx;
right: 40%;
margin-bottom: 40rpx;
background: $uni-linear-gradient-color;
-webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/
}
}
</style> </style>

+ 12
- 25
pages/mine/sonPage/promotion/promotionDetail.vue View File

@ -35,16 +35,8 @@
</view> </view>
<!-- 继续发布按钮-->
<view class="bottom">
<button @click="continueToPublish" class="continueBtn">
继续发布
</button>
</view>
<!--确认发布弹框--> <!--确认发布弹框-->
<uv-popup ref="popup" mode="center" custom-style="height: 400rpx;" :closeOnClickOverlay="false" >
<uv-popup ref="popup" mode="center" custom-style="height: 400rpx;" :closeOnClickOverlay="false">
<view class="content"> <view class="content">
<view class="title"> <view class="title">
推广选项 推广选项
@ -81,10 +73,16 @@
</view> </view>
<!--继续推广按钮-->
<button @click="continueToPromotion" class="bottomBtn">
继续推广
</button>
</view> </view>
</template> </template>
<script> <script>
import '../../../../common.css'; // CSS
export default { export default {
onLoad: function (options) { onLoad: function (options) {
// id // id
@ -112,8 +110,8 @@ export default {
console.log('confirm', e); console.log('confirm', e);
this.form.cycle = e.value[0] this.form.cycle = e.value[0]
}, },
// 广
continueToPublish() {
// 广
continueToPromotion() {
this.$refs.popup.open(); this.$refs.popup.open();
}, },
// //
@ -178,8 +176,6 @@ export default {
} }
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -204,22 +200,13 @@ export default {
} }
.confirmBottom {
position: fixed;
bottom: 38%;
left: 30%;
width: 38%;
height: 100rpx;
.confirmPromotionBtn {
color: #ffffff;
background: $uni-linear-gradient-btn-color;
}
}
} }
} }
/deep/.uv-popup .uv-popup__content{
/deep/ .uv-popup .uv-popup__content {
border-radius: 20rpx; border-radius: 20rpx;
} }
</style> </style>

+ 143
- 11
pages/mine/withdraw.vue View File

@ -1,19 +1,151 @@
<template> <template>
<view>
提现
</view>
<view class="withdraw">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="提现"/>
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">1240,045</view>
<view class="bottom">可提现金额</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="inputComponent">
<view class="left">填写提现金额</view>
<view class="centerAndRight">
<view class="center">
<uv-input placeholder="输入金额" v-model="withdrawMoney"
border="none" @change="moneyChange"></uv-input>
</view>
<view class="right">全部提现</view>
</view>
</view>
</view>
</view>
<!--提现按钮-->
<button @click="withdrawPage" class="bottomBtn">
提现
</button>
</view>
</template> </template>
<script> <script>
export default {
data() {
return {
};
}
}
import '../../common.css'; // CSS
export default {
data() {
return {
withdrawMoney: "",
};
},
methods: {
//
moneyChange(e) {
console.log(e)
this.withdrawMoney = e
},
//
withdrawPage() {
// this.$utils.navigateTo('/mine/withdraw');
}
}
}
</script> </script>
<style lang="scss">
<style lang="scss" scoped>
.withdraw {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
background-color: #f8faff;
height: 10vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2); /* 仅上边的阴影效果 */
background-color: #fff;
height: calc(90vh - 240rpx);
//width: 100vw;
padding: 40rpx;
.inputComponent {
display: flex;
//gap: 20rpx;
//border: 1px solid red;
.left {
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 30rpx;
width: 50%;
margin-right: 20rpx;
}
.centerAndRight {
display: flex;
width: 50%;
.center {
width: 60%;
}
.right {
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 32rpx;
margin-left: 20rpx;
width: 40%;
background: $uni-linear-gradient-color;
-webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/
}
}
}
}
}
}
</style> </style>

+ 1
- 0
static/image/addBankCard/1.svg View File

@ -0,0 +1 @@
<svg t="1724591123974" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4291" width="32" height="32"><path d="M512 341.333333c-117.845333 0-213.333333 95.488-213.333333 213.333334s95.488 213.333333 213.333333 213.333333 213.333333-95.488 213.333333-213.333333-95.488-213.333333-213.333333-213.333334z m0-42.666666c141.397333 0 256 114.581333 256 256s-114.602667 256-256 256c-141.418667 0-256-114.581333-256-256s114.581333-256 256-256z m279.616-42.325334h104.448a85.674667 85.674667 0 0 1 85.568 85.269334l1.706667 469.12a84.650667 84.650667 0 0 1-85.077334 85.056l-767.936-1.813334a85.973333 85.973333 0 0 1-85.674666-85.504l-1.685334-466.816a84.928 84.928 0 0 1 84.992-85.312h130.410667c11.861333 0 25.792-8.618667 31.125333-19.221333l34.858667-69.376c10.496-20.906667 38.144-38.08 61.674667-38.186667l276.928-1.344c23.637333-0.128 51.2 16.853333 61.824 37.952l35.904 71.253334c5.290667 10.496 19.114667 18.922667 30.933333 18.922666z m0 42.666667c-27.882667 0-56.469333-17.472-69.034667-42.410667l-35.904-71.253333c-3.349333-6.656-16.128-14.506667-23.509333-14.464l-276.906667 1.344c-7.466667 0.021333-20.48 8.106667-23.786666 14.677333l-34.858667 69.376c-12.586667 25.024-41.237333 42.730667-69.248 42.730667H127.957333c-23.466667 0-42.410667 18.986667-42.325333 42.474667l1.706667 466.837333a43.306667 43.306667 0 0 0 43.093333 42.986667l767.914667 1.813333a41.984 41.984 0 0 0 42.304-42.24l-1.685334-469.12a43.008 43.008 0 0 0-42.88-42.752h-104.469333zM506.666667 714.666667a21.333333 21.333333 0 1 1 0-42.666667c61.866667 0 112-50.133333 112-112a21.333333 21.333333 0 0 1 42.666666 0 154.666667 154.666667 0 0 1-154.666666 154.666667z" fill="#3D3D3D" p-id="4292"></path></svg>

BIN
static/image/incomeRecord/1.png View File

Before After
Width: 19  |  Height: 14  |  Size: 310 B

+ 1
- 0
static/image/purse/1.svg View File

@ -0,0 +1 @@
<svg t="1724594245531" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5457" width="32" height="32"><path d="M512 0a113.778 113.778 0 0 0-113.778 113.778A113.778 113.778 0 0 0 512 227.556a113.778 113.778 0 0 0 113.778-113.778A113.778 113.778 0 0 0 512 0zM398.222 910.222A113.778 113.778 0 0 0 512 1024a113.778 113.778 0 0 0 113.778-113.778A113.778 113.778 0 0 0 512 796.444a113.778 113.778 0 0 0-113.778 113.778z m0-398.222A113.778 113.778 0 0 0 512 625.778 113.778 113.778 0 0 0 625.778 512 113.778 113.778 0 0 0 512 398.222 113.778 113.778 0 0 0 398.222 512z" p-id="5458" fill="#bfbfbf"></path></svg>

Loading…
Cancel
Save