Browse Source

页面样式

feature-1.0
helming 3 years ago
parent
commit
acd6e7ac10
  1. 89
      pages-userInfo/creatorAccount/createAccount.vue
  2. 29
      pages-userInfo/creatorAccount/creatorAccount.vue
  3. 2
      pages-userInfo/setting/setting.vue
  4. 17
      pages-userInfo/withdraw/withdraw.vue
  5. 49
      pages-userInfo/withdraw/withdrawIndex.vue
  6. 1
      pages/login/login.vue
  7. 41
      pages/profit/profit.vue
  8. 4
      pages/register/register.vue
  9. 52
      pages/userInfo/userInfo.vue
  10. 2
      utils/request.js

89
pages-userInfo/creatorAccount/createAccount.vue

@ -3,7 +3,7 @@
<view class="head">
<view>
<uni-group mode="card">
<uni-icons custom-prefix="iconfont" type="icon-dengpao" :color="iconColor" size="20"></uni-icons><text class="textstyle text-white"></text><br/>
<uni-icons custom-prefix="iconfont" type="icon-dengpao" :color="primaryColor" size="20"></uni-icons><text class="textstyle text-white"></text><br/>
<text class="textstyle">1. 为了您的资金安全及合规体现将通过第三方支付提供安全通道实现</text><br/>
<text class="textstyle">2. 应银行监管要求每人每月限额10万元最多绑定4个收款账户</text><br/>
<text class="textstyle">3. 一旦提现成功,设置的收款账户不可更改</text>
@ -22,19 +22,33 @@
:clearable="false"
:inputBorder="false" />
</uni-forms-item>
<uni-forms-item label="支付宝账号" required name="accountNo">
<uni-forms-item label="请选择" required>
<uni-data-checkbox v-model="type"
:localdata="typeList"
:selectedColor="primaryColor"
:selectedTextColor="'#FFFFFF'">
</uni-data-checkbox>
</uni-forms-item>
<uni-forms-item v-if="type === 2" label="支付宝账号" required name="accountNo">
<uni-easyinput v-model="accountInfo.accountNo" placeholder="请输入支付宝账号"
:clearable="false"
:inputBorder="false" />
</uni-forms-item>
<uni-forms-item v-if="type === 0" label="微信账号" required name="accountNo">
<uni-easyinput v-model="accountInfo.accountNo" placeholder="请输入微信账号"
:clearable="false"
:inputBorder="false" />
</uni-forms-item>
<uni-forms-item label="微信收款码" required name="imgUrl">
<uni-file-picker limit="1" file-mediatype="image" title="请上传微信收款码!" file-extname="png,jpg,jpeg"
@select="selectImage" @delete="deleteImg">
</uni-file-picker>
</uni-forms-item>
<uni-forms-item label="预留电话" required name="phone">
<uni-easyinput v-model="accountInfo.phone" placeholder="请输入预留电话"
:clearable="false"
:inputBorder="false" />
</uni-forms-item>
<!-- <uni-forms-item label="请选择" required>
</uni-forms-item> -->
</uni-forms>
</uni-group>
</view>
@ -57,20 +71,31 @@
getAccount,addCreatorAccount,
checkAccountExist,checkAccountUpToFour
} from '@/api/userInfo.js'
import {type} from "../../uni_modules/uni-forms/components/uni-forms/utils";
export default {
data() {
return {
iconColor: '#0b6375',
primaryColor: '#0b6375',
userInfo: {},
existFlag: false,
upToFourFlag: false,
noClick:true, //
fileList: [],
accountInfo:{
name:'',
idNo:'',
accountNo:'',
phone:''
phone:'',
imgUrl: ''
},
type: 0,
typeList: [{
text: '微信',
value: 0
}, {
text: '支付宝',
value: 2
}],
rules: {
name: {
rules: [{
@ -204,7 +229,42 @@
});
});
},
selectImage(e) {
if (!e.tempFiles) {
return;
}
let that = this;
that.fileList = [...that.fileList, ...e.tempFilePaths];
that.accountInfo.imgUrl = e.tempFilePaths[0];
},//
deleteImg(e) {
let that = this
that.fileList = [];
that.accountInfo.imgUrl = ''
},
//
uploadImg: async function (e) {
let that = this;
uni.showLoading({
title: "上传中"
});
const tempFilePaths = e;
for (let i = 0; i < tempFilePaths.length; i++) {
const [error, res] = await uni.uploadFile({
url: `${that.$baseURL}${that.$uploadURL}`,
filePath: tempFilePaths[i],
name: `${that.$uploadType}`,
header:{
"Content-Type": "multipart/form-data"
},
})
const back = JSON.parse(res.data);
if (back.code == 200) {
that.accountInfo.imgUrl = back.data;
}
}
uni.hideLoading()
},
//
submitAccount(){
let that = this;
@ -231,8 +291,11 @@
idNo: that.accountInfo.idNo,
phone:that.accountInfo.phone,
accountNo:that.accountInfo.accountNo,
type: '2' //
type: that.type //
}
if (param.type === 0) { //
that.uploadImg(that.fileList);
}
//
addCreatorAccount(param).then(res => {
if (res.data.code === 200) {
@ -267,6 +330,14 @@
// })
},
},
watch: {
type(newVal) {
if (newVal !== 0) {
this.fileList = [];
this.accountInfo.imgUrl = '';
}
}
}
}
</script>

29
pages-userInfo/creatorAccount/creatorAccount.vue

@ -2,6 +2,7 @@
<view class="container">
<view class="head">
<uni-group mode="card" v-for="(item,index) in creatorAccountList" :key="index">
<uni-icons class="type-icon" custom-prefix="iconfont" :type="payType[item.type].icon" size="30" :color="payType[item.type].color" ></uni-icons>
<view class="slot-box">真实姓名{{item.name}}</view>
<view class="slot-box">身份证号{{item.idNo}}</view>
<view class="slot-box" v-if="item.type == '0'">微信账号{{item.accountNo}}</view>
@ -34,6 +35,23 @@
userInfo: {},
type: 0,
noClick:true, //
payType: [
{
icon: 'icon-weixin',
title: '微信',
color: '#909399'
},
{
icon: 'icon-yinhangka',
title: '银行卡',
color: '#909399'
},
{
icon: 'icon-zhifubao',
title: '支付宝',
color: '#909399'
}
],
}
},
@ -173,6 +191,17 @@
border-width: 2rpx !important;
}
::v-deep .uni-group__content {
position: relative;
}
.type-icon {
position: absolute;
right: 20rpx;
top: 20rpx;
opacity: .5;
}
}
.foot {

2
pages-userInfo/setting/setting.vue

@ -73,7 +73,7 @@
logout().then(res => {
if (res.data.code === 200) {
uni.reLaunch({
url: '/pages/index/index',
url: '/pages/login/login',
success() {
uni.clearStorage();
uni.showToast({

17
pages-userInfo/withdraw/withdraw.vue

@ -7,7 +7,10 @@
¥ <input type="text" placeholder="输入金额" placeholder-class="pch"
class="input-value" @blur="checkAmt()" value="" v-model="amt"/>
</view>
<view class="withdraw-amount">当前余额为{{userInfo.amt}} </view>
<view class="withdraw-amount">
<span>当前余额为{{userInfo.amt}}</span>
<span class="all-withdraw" v-if="userInfo.amt > 0" @click="allWithdraw">全部提现</span>
</view>
<view class="withdraw-amount-tip">小贴士提现金额不少于1元 </view>
</view>
@ -151,7 +154,11 @@
that.checkFlag = false;
}
},
allWithdraw() {
let that = this;
if (that.userInfo.amt > 0)
that.amt = that.userInfo.amt;
},
//
async withdraw(){
let that = this;
@ -311,6 +318,12 @@
font-weight: 400;
color: $uni-secondary-color;
margin-top: 18rpx;
display: flex;
justify-content: space-between;
.all-withdraw {
color: $uni-primary;
}
}
.withdraw-amount-tip{
font-size: 28rpx;

49
pages-userInfo/withdraw/withdrawIndex.vue

@ -3,10 +3,17 @@
<view class="head">
<uni-icons custom-prefix="iconfont" :type="'icon-tixian'" size="50" :color="iconColor" ></uni-icons>
<view class="account-balance-title-box">
<text>钱包余额</text>
钱包余额
<span class="income-hidden-but" @click="clickHidden">
<uni-icons v-if="hidden" type="eye" :size="18" :color="'#fff'" />
<uni-icons v-else type="eye-slash" :size="18" :color="'#fff'" />
</span>
</view>
<view class="account-balance-box"> <!-- userInfo.amt -->
<MoneyView :character="'¥'" :value="userInfo.amt || 0" :size="60"/>
<view class="account-balance-box">
<MoneyView :character="'¥'" :value="userInfo.amt || 0" :size="60" :hidden="hidden"/>
<span class="income-refresh-but" v-if="!hidden" @click="clickRefresh">
<uni-icons type="loop" :size="20" :color="'#fff'" />
</span>
</view>
<button class="withdrawBtn" size="default" :loading="loadingFlag" @click="withdraw('/pages-userInfo/withdraw/withdraw')" :disabled="checkUpload">发起提现</button>
</view>
@ -23,6 +30,9 @@
</template>
<script>
import {
getCreatorInfo
} from '@/api/userInfo.js'
import MoneyView from "@/components/money-view/money-view.vue";
export default {
components: {
@ -32,6 +42,7 @@ export default {
return {
iconColor: '#0b6375',
userInfo: {},
hidden: true,
list: [{
url: '/pages-userInfo/creatorAccount/creatorAccount',
title: '管理收款账户',
@ -91,8 +102,24 @@ export default {
} else if (item.click === 'click') {
this[item.url]();
}
},
clickHidden() {
this.hidden = !this.hidden;
},
clickRefresh() {
let that = this
uni.showLoading({
title: "加载中"
});
getCreatorInfo(that.userInfo.id).then(res => {
if (res.data.code === 200) {
that.userInfo = res.data.data;
}
uni.hideLoading()
}).catch(error => {
uni.hideLoading()
})
}
}
}
</script>
@ -110,10 +137,24 @@ export default {
color: $uni-white;
font-size: 28rpx;
margin-top: 40rpx;
.income-hidden-but {
margin-left: 30rpx;
}
}
.account-balance-box {
display: flex;
justify-content: center;
margin-bottom: 40rpx;
line-height: 80rpx;
height: 80rpx;
.income-refresh-but {
margin-left: 30rpx;
}
}
.withdrawBtn{

1
pages/login/login.vue

@ -149,6 +149,7 @@
}
});
} else {
uni.hideLoading();
uni.showToast({
title: response.data.msg,
icon: 'none'

41
pages/profit/profit.vue

@ -5,13 +5,18 @@
<image class="top-background-img" :src="incomeBackground" />
<view class="accumulate-income">
<view>
<div class="accumulate-income-title">累计收益</div>
<div class="accumulate-income-title">
累计收益
<span class="income-hidden-but" @click="clickHidden">
<uni-icons v-if="hidden" type="eye" :size="18" :color="'#909399'" />
<uni-icons v-else type="eye-slash" :size="18" :color="'#909399'" />
</span>
</div>
<div class="income-num">
<MoneyView :character="'¥'" :value="profitInfo.totalProfit" :size="60" :hidden="hidden"/>
<div class="income-hidden-but" @click="clickHidden">
<uni-icons v-if="hidden" type="eye" :size="24" :color="'#909399'" />
<uni-icons v-else type="eye-slash" :size="24" :color="'#909399'" />
</div>
<span class="income-refresh-but" v-if="!hidden" @click="clickRefresh">
<uni-icons type="loop" :size="20" :color="'#909399'" />
</span>
</div>
<div class="income-history">
<view>上月收入</view><MoneyView :value="profitInfo.lastMonthProfit" :hidden="hidden"/>
@ -183,10 +188,10 @@ export default {
endProfitInfo: {},
userInfo: {},
noticeList: [],
pageSize: 10,
pageSize: 5,
pageNum: 1,
active: 0,
hidden: false,
hidden: true,
incomeBackground: '/static/income-background.png',
advertIcon: "/static/advertIcon.png",
inviteIcon: "/static/inviteIcon.png",
@ -367,6 +372,18 @@ export default {
},
clickHidden() {
this.hidden = !this.hidden;
},
clickRefresh() {
uni.showLoading({
title: "加载中"
});
this.queryFrontProfitInfo();
this.queryFrontPreDownloadAndInviteCount();
this.queryFrontInAmt();
this.queryFrontEndAmt();
setTimeout(() => {
uni.hideLoading()
}, 500)
}
},
};
@ -417,17 +434,25 @@ export default {
align-items: flex-end;
.accumulate-income-title {
line-height: 48rpx;
font-size: 28rpx;
display: flex;
align-items: center;
.income-hidden-but {
margin-left: 30rpx;
}
}
.income-num {
width: 100%;
height: 96rpx;
line-height: 90rpx;
display: flex;
//justify-content: space-between;
.income-hidden-but {
.income-refresh-but {
margin-left: 30rpx;
}

4
pages/register/register.vue

@ -344,6 +344,10 @@
});
} else {
uni.hideLoading()
uni.showToast({
title: response.data.msg,
icon: 'none'
})
}
}).catch(error => {
uni.hideLoading()

52
pages/userInfo/userInfo.vue

@ -23,25 +23,27 @@
</view>
</view>
</view>
<view class="middle">
<view class="middle-item-box" v-for="(item, index) in middleList" :index="index" :key="index" :class="item.class">
<view class="middle-btn-item" @click="change(item)" >
<div class="text uni-white">{{item.title}}</div>
<!-- <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />-->
<uni-icons class="listIconImage" custom-prefix="iconfont" :type="item.icon" size="70" :color="iconColor" ></uni-icons>
<view class="content-box">
<view class="middle">
<view class="middle-item-box" v-for="(item, index) in middleList" :index="index" :key="index" :class="item.class">
<view class="middle-btn-item" @click="change(item)" >
<div class="text uni-white">{{item.title}}</div>
<!-- <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />-->
<uni-icons class="listIconImage" custom-prefix="iconfont" :type="item.icon" size="70" :color="iconColor" ></uni-icons>
</view>
</view>
</view>
</view>
<view class="foot">
<view class="foot-item-box" v-for="(item, index) in list" :index="index" :key="index" >
<view class="list-click-item" @click="change(item)">
<uni-icons class="listIconImage" custom-prefix="iconfont" :type="item.icon" size="20" :color="iconColor" ></uni-icons>
<!-- <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />-->
<div class="text uni-white">{{item.title}}</div>
<uni-icons type="right" size="12" color="#ffffff" />
<view class="foot">
<view class="foot-item-box" v-for="(item, index) in list" :index="index" :key="index" >
<view class="list-click-item" @click="change(item)">
<uni-icons class="listIconImage" custom-prefix="iconfont" :type="item.icon" size="20" :color="iconColor" ></uni-icons>
<!-- <image :src="item.img" class="listIconImage" :mode="'aspectFill'" />-->
<div class="text uni-white">{{item.title}}</div>
<uni-icons type="right" size="12" color="#ffffff" />
</view>
</view>
</view>
</view>
</view>
</view>
</template>
@ -163,12 +165,12 @@ page {
font-family: Franklin Gothic Medium, Arial Narrow, Arial, sans-serif;
min-height: 100vh;
background: $uni-bg-color;
position: relative;
}
.top {
width: 100vw;
height: 30vh;
height: calc(30vh + 40rpx);
position: relative;
.background-image-dim {
@ -196,7 +198,7 @@ page {
.my-message {
width: calc(100% - 80rpx);
height: calc(100% - 80rpx);
height: calc(100% - 120rpx);
position: absolute;
top: 0;
left: 0;
@ -209,7 +211,7 @@ page {
display: flex;
justify-content: flex-start;
align-items: flex-end;
padding: 40rpx;
padding: 40rpx 40rpx 80rpx;
.left {
width: 150rpx;
@ -258,6 +260,18 @@ page {
}
}
.content-box {
width: 100vw;
min-height: calc(100vh - 30vh);
background: $uni-bg-color;
border-radius: 40rpx 40rpx 0 0;
border: 2rpx solid $uni-bg-color;
position: absolute;
top: calc(30vh);
left: 0;
right: 0;
}
.middle {
width: 670rpx;
margin: 40rpx auto;

2
utils/request.js

@ -49,7 +49,7 @@ service.interceptors.response.use(res => {
}
});
} else {
return Promise.reject(res.data.msg);
return res;
}
}, error => {
return Promise.reject(error)

Loading…
Cancel
Save