Commit e0fc27fe authored by zhengzy's avatar zhengzy

Merge branch 'master' of https://git.banshouhui.com/lijundan/self-support

# Conflicts:
#	src/pages.json
#	src/pages/mine/wallet/index.vue
parents 1c64cece 41bb7ebe
<template>
<view class="settlement-view">
<view class="settlement-com-view">
<view class="left-view">
<view class="time-view">{{timeText}}</view>
<view class="order-view">
<text>提现编号:</text>
<text>{{data.payableRecordNumber}}</text>
</view>
</view>
<view class="right-view">
<view :class="['settlement-status-view', settlementTypeClass]">{{data.payableRecordStatusText}}</view>
<view class="settlement-amount-view">-{{data.settlementAmount}}</view>
</view>
</view>
<view class="line-view"></view>
</view>
</template>
<script>
export default {
props: {
data: {
type: Object,
default () {
return {
paymentTime: new Date().getTime(),
payableRecordStatusText: '提现',
payableRecordNumber: 'EE999777',
settlementAmount: 9899
}
}
}
},
data() {
return {
}
},
computed: {
items() {
return {
payableRecordNumber: '工单编号',
businessType: '工单类型'
}
},
settlementTypeClass() {
switch (this.data) {
case '提现':
return 'settlement-type-y'
case '其他':
return 'settlement-type-h'
}
},
timeText() {
return this.$u.timeFormat(this.data.paymentTime, 'mm.dd')
}
}
}
</script>
<style lang="scss" scoped>
.settlement-view {
height: 212rpx;
.settlement-com-view {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 30rpx;
height: 210rpx;
.left-view {
.time-view {
height: 40rpx;
width: 80rpx;
color: #333333;
background-color: #F4F5F7;
border-radius: 8rpx;
font-size: 20rpx;
margin-bottom: 40rpx;
text-align: center;
padding-top: 6rpx;
}
.order-view {
font-size: 26rpx;
color: #999999;
}
}
.right-view {
display: flex;
flex-direction: column;
align-items: flex-end;
.settlement-status-view {
border-radius: 8rpx;
border: 2rpx solid #FF930D;
font-size: 20rpx;
color: #FF930D;
width: 80rpx;
height: 40rpx;
text-align: center;
padding-top: 4rpx;
margin-right: 10rpx;
&.settlement-type-y {
border: 2rpx solid #FF930D;
color: #FF930D;
}
&.settlement-type-h {
border: 2rpx solid #2272FF;
color: #2272FF;
}
}
.settlement-amount-view {
font-size: 40rpx;
font-weight: bold;
color: #FA5A49;
margin-top: 30rpx;
}
}
}
.line-view {
background-color: #F4F5F7;
height: 2rpx;
margin: 0 30rpx;
}
}
</style>
<template>
<view class="statement-view">
<view class="statement-com-view">
<view class="left-view">
<view class="time-view">{{timeText}}</view>
<view class="order-view">
<text>工单编号:</text>
<text>{{data.orderNumber}}</text>
</view>
<view class="order-view">
<text>工单类型:</text>
<text>{{typeText}}</text>
</view>
</view>
<view class="right-view">
<view :class="['statement-status-view', statementTypeClass]">{{data.payableRecordStatusText}}</view>
<view class="statement-amount-view">+{{data.payableAmount}}</view>
</view>
</view>
<view class="line-view"></view>
</view>
</template>
<script>
export default {
props: {
data: {
type: Object,
default () {
return {
paymentTime: new Date().getTime(),
payableRecordStatusText: '预结',
orderNumber: 'EE999777',
orderServiceType: '安装',
inGuaranteePeriod: false, // true 保内;false 保外
payableAmount: 9899
}
}
}
},
data() {
return {
}
},
computed: {
statementTypeClass() {
switch (this.data.payableRecordStatusText) {
case '预结':
return 'statement-type-y'
case '已确认':
return 'statement-type-h'
}
},
typeText() {
return (this.data.inGuaranteePeriod ? '保内' : '保外') + '-' + this.data.orderServiceType
},
timeText() {
return this.$u.timeFormat(this.data.paymentTime, 'mm.dd')
}
}
}
</script>
<style lang="scss" scoped>
.statement-view {
height: 212rpx;
.statement-com-view {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 30rpx;
height: 210rpx;
.left-view {
.time-view {
height: 40rpx;
width: 80rpx;
color: #333333;
background-color: #F4F5F7;
border-radius: 8rpx;
font-size: 20rpx;
margin-bottom: 20rpx;
text-align: center;
padding-top: 6rpx;
}
.order-view {
font-size: 26rpx;
color: #999999;
margin-bottom: 6rpx;
}
}
.right-view {
display: flex;
flex-direction: column;
align-items: flex-end;
.statement-status-view {
border-radius: 8rpx;
border: 2rpx solid #FF930D;
font-size: 20rpx;
color: #FF930D;
width: 80rpx;
height: 40rpx;
text-align: center;
padding-top: 4rpx;
&.statement-type-y {
border: 2rpx solid #FF930D;
color: #FF930D;
}
&.statement-type-h {
border: 2rpx solid #2272FF;
color: #2272FF;
}
}
.statement-amount-view {
font-size: 40rpx;
font-weight: bold;
color: #2272FF;
margin-top: 30rpx;
}
}
}
.line-view {
background-color: #F4F5F7;
height: 2rpx;
margin: 0 30rpx;
}
}
</style>
......@@ -15,7 +15,7 @@
<script>
import qiniup from '@/components/upload/qiniup';
const app = getApp()
export default {
export default {
props: {},
mixins: [qiniup],
data() {
......@@ -28,12 +28,12 @@
files: [],
keys: [],
token: '',
product: '',
product: '',
allImages: []
}
},
created(e) {
// 获取照片选项对象
// 获取照片选项对象
console.log(getApp().globalData.photo.currentItem)
const product = app.globalData.photo.product
this.product = `?brandId=${product.brandId}&brand=${product.brandName}&classifyId=${product.classifyId}&systemId=${product.systemId}`
......@@ -61,8 +61,8 @@
if(!photo.tempPath){
return
}
let path = ''
if(photo.tempPath.origin){
let path = ''
if(photo.tempPath.origin){
// 保存原图到本地
path = photo.tempPath.origin
let result = await this.saveLocal(path)
......@@ -72,10 +72,10 @@
title: '已将照片原图保存到本地相册'
})
}
}
}
// if(photo.currentItem){
// photo.currentItem.imageList.unshift(photo.tempPath.mixWater)
// }
// }
// if(photo.productList && photo.productList[photo.topIndex]){
// const topArr = photo.productList[photo.topIndex]
......@@ -83,8 +83,8 @@
// topArr[photo.itemIndex].imageList.push(photo.tempPath.mixWater)
// }
// }
// photo.
if(photo.tempPath.mixWater){
// photo.
if(photo.tempPath.mixWater){
// 保存水印处理图片到本地
path = photo.tempPath.mixWater
let result1 = await this.saveLocal(path)
......@@ -117,37 +117,37 @@
},
// 重拍图片
remakePhoto() {
remakePhoto() {
this.$emit('changeType', 1)
},
finishPhoto(){
const photo = getApp().globalData.photo
photo.currentItemLength = 10
this.continuePhoto()
// 完成本项
this.continuePhoto()
// 完成本项
//this.$emit('finish')
},
// 确认图片
continuePhoto() {
continuePhoto() {
const photo = getApp().globalData.photo
let self = this
uni.showLoading({
title:'图片保存中…'
})
self.saveTempToLocal()
self.saveTempToLocal()
self.confirmUpload(true)
},
submitFile() {
const photo = getApp().globalData.photo
if (photo.currentItemLength < 10) photo.currentItemLength = photo.currentItemLength + 1
uni.hideLoading()
// 当前项的图片显示
// 拍照项张数目增加 等于10张
photo.allImages.unshift(this.fileMaps[0])
if(photo.currentItemLength<10){
this.$emit('changeType', 1)
}else{
this.$emit('finish')
submitFile() {
const photo = getApp().globalData.photo
if (photo.currentItemLength < 10) photo.currentItemLength = photo.currentItemLength + 1
uni.hideLoading()
// 当前项的图片显示
// 拍照项张数目增加 等于10张
photo.allImages.unshift(this.fileMaps[0])
if(photo.currentItemLength<10){
this.$emit('changeType', 1)
}else{
this.$emit('finish')
}
},
downloadImages() {
......@@ -198,7 +198,7 @@
}
.bottomView {
box-shadow: 0 0 1rpx 6rpx rgba(255,255,255,0.05);
//box-shadow: 0 0 1rpx 6rpx rgba(255,255,255,0.05);
background-color: #333333;
width: 100%;
padding:70rpx 0;
......
......@@ -167,8 +167,38 @@
"navigationBarBackgroundColor":"#F4F5F7"
}
},
{
"path": "wallet/withdraw",
"style": {
"navigationBarTitleText": "提现",
"enablePullDownRefresh": false,
"disableScroll": true,
"navigationStyle": "custom", // 隐藏系统导航栏
"navigationBarBackgroundColor":"#F4F5F7"
}
},
{
"path": "wallet/statement",
"style": {
"navigationBarTitleText": "收入流水",
"enablePullDownRefresh": false,
"disableScroll": true,
"navigationStyle": "custom", // 隐藏系统导航栏
"navigationBarBackgroundColor":"#F4F5F7"
}
},
{
"path": "wallet/settlement",
"style": {
"navigationBarTitleText": "结算账单",
"enablePullDownRefresh": false,
"disableScroll": true,
"navigationStyle": "custom", // 隐藏系统导航栏
"navigationBarBackgroundColor":"#F4F5F7"
}
},
{
"path": "cert/list",
"path": "cert/index",
"style": {
"navigationBarTitleText": "我的证件",
"navigationStyle":"custom"
......@@ -187,8 +217,27 @@
"navigationBarTitleText":"",//我的合同
"navigationStyle":"custom"
}
}
]
},
{
"path": "customer/index",
"style": {
"navigationStyle":"custom",
"navigationBarTitleText": "联系客服",
"enablePullDownRefresh": false
}
},
{
"path": "deposit/index",
"style": {
"navigationStyle":"custom",
"navigationBarTitleText": "配件押金",
"enablePullDownRefresh": false
}
}
]
},
{
"root": "pages/order",
......@@ -418,16 +467,6 @@
"condition": { //模式配置,仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [
{
"name": "自营平台", //模式名称
"path": "pages/index/index", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "订单列表", //模式名称
"path": "pages/index/order", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "拍照小工具", //模式名称
"path": "pages/photo/index", //启动页面,必选
......@@ -439,11 +478,6 @@
"path": "pages/order/feedback",
"query": ""
},
{
"name": "订单详情", //模式名称
"path": "pages/order/detail", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "在线考试", //模式名称
"path": "pages/learn/exam", //启动页面,必选
......@@ -461,31 +495,6 @@
"id":11880091
} //启动参数,在页面的onLoad函数里面得到
},
{
"name": "资料信息", //模式名称
"path": "pages/settle/file", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "缴纳保证金", //模式名称
"path": "pages/settle/pay-ensure", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "签约页面", //模式名称
"path": "pages/settle/sign-contract", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "订单 - 拒单", //模式名称
"path": "pages/order/refuse", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "订单 - 过程反馈", //模式名称
"path": "pages/order/feedback", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
},
{
"name": "学习 - 首页", //模式名称
"path": "pages/index/learn", //启动页面,必选
......@@ -493,7 +502,7 @@
},
{
"name": "我的 - 我的证件 - 列表", //模式名称
"path": "pages/mine/cert/list", //启动页面,必选
"path": "pages/mine/cert/index", //启动页面,必选
"query": "" //启动参数,在页面的onLoad函数里面得到
}
]
......
......@@ -9,10 +9,10 @@
<view class="msg-view">
<view class="msg-title">最新消息</view>
<view class="msg-list-view">
<view class="msg-content" v-for="(item, index) in messageList" :key="index">
<view class="msg-content" v-for="(item, index) in messageList" :key="index" @click="toNewsDetail(item)">
<view class="msg-content-view">
<view class="left-view">
<image class="msg-icon" :src="msgStyleImage[item.content_type]"></image>
<image class="msg-icon" :src="msgStyleImage[item.is_top]"></image>
<text class="msg-text">{{ item.title }}</text>
</view>
<image class="right-icon" :src="shouyeyouImage"></image>
......@@ -123,8 +123,8 @@
msgStyleImage() {
return {
'1': process.uniEnv.qn_base_url + "zhiding.png", // 置顶
'2': process.uniEnv.qn_base_url + "tongzhi.png", // 通知
'3': process.uniEnv.qn_base_url + "xiaoxi.png", // 消息
'0': process.uniEnv.qn_base_url + "tongzhi.png", // 通知
// '3': process.uniEnv.qn_base_url + "xiaoxi.png", // 消息
}
},
bannerImage() {
......@@ -261,7 +261,7 @@
self.orderList = []
}
self.orderList.push(...res.data.list);
self.currentLoadStatus = res.data.total > self.orderList.length ? 'loadmore' : 'nomore'
self.currentLoadStatus = res.data.total > self.orderList.length && res.data.list.length == self.search.pageSize ? 'loadmore' : 'nomore'
}
} else {
......@@ -398,7 +398,15 @@
fail: function(err) {
}
});
},
},
toNewsDetail(item) {
wx.navigateTo({
url: '/pages/learn/news-details',
success: function(res) {
res.eventChannel.emit('acceptDataFromLearn', item)
}
});
}
},
};
</script>
......
......@@ -744,7 +744,7 @@
.notice {
/* border: #808080 solid 2rpx; */
width: 100%;
height: 370rpx;
min-height: 370rpx;
margin-top: 36rpx;
overflow: hidden;
background-color: #ffffff;
......@@ -868,7 +868,7 @@
}
swiper {
height: 920rpx;
height: 65vh;
}
.line-percent {
......
......@@ -123,7 +123,7 @@
return process.uniEnv.qn_base_url
},
pages() {
return ['wallet', '', 'contract', 'cert', 'address', '', '']
return ['wallet', 'deposit', 'contract', 'cert', 'address', '', 'customer']
},
headImageUrl() {
return this.info.headImage || this.placeholderImage
......
......@@ -264,7 +264,7 @@
if (self.list[self.types[res.data.type]]) {
self.list[self.types[res.data.type]].total = res.data.total
}
self.loadStatus = res.data.total > self.orderList.length ? 'loadmore' : 'nomore'
self.loadStatus = res.data.total > self.orderList.length && res.data.list.length == self.pageSize ? 'loadmore' : 'nomore'
}
} else {
console.log(res.message, "获取订单数量失败!");
......
<template>
<view class="cert-page">
<u-navbar
class="navbarHeigth"
back-icon-color="#000000"
:background="background"
title-color="#000"
......@@ -9,9 +10,9 @@
title-bold="true"
></u-navbar>
<view class="content-cody">
<u-cell-group>
<u-cell-group :border="false">
<u-cell-item v-for="item in list" :title="item.name" :value="item.isUploadName" :arrow="true"
:value-style="{'color': item.color}" @click="toDetail(item.keyName)">
:value-style="{'color': item.color}" @click="toDetail(item.keyName)" :title-style="{'padding-left':'20rpx'}">
<u-icon slot="icon" size="32" name="checkmark-circle" :color="item.iconColor"></u-icon>
</u-cell-item>
</u-cell-group>
......@@ -129,16 +130,19 @@
.cert-page {
font-size: 28rpx;
margin: 30rpx;
height: 100vh;
display: flex;
flex-direction: column;
}
.content-cody {
/* padding-left: 30rpx;
padding-right: 30rpx; */
padding-left: 30rpx;
padding-right: 30rpx;
padding: 30rpx;
background-color: #ffffff;
border-radius: 12rpx;
height: 82vh;
}
.rightBlue {
color: #007AFF;
}
</style>
<template>
<view class="cus-wrap">
<w-navbar title="联系客服"></w-navbar>
<view class="content">
<u-image class="qrcode" :src="cusQrcode" width="400" mode="widthFix" @longtap="download">
<u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image>
<text class="desc">长按二维码保存图片添加官方客服微信</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
computed: {
cusQrcode() {
return process.uniEnv.qn_base_url + 'erweima-bg.png'
},
},
methods: {
download() {
let that = this;
uni.downloadFile({ //获得二维码的临时地址
url: that.erweimaImage,
success:(res)=>{
if(res.statusCode == 200){
uni.saveImageToPhotosAlbum({
filePath:res.tempFilePath,//传入临时地址
success() {
that.$u.toast('保存成功!');
},
fail() {
that.$u.toast('保存失败!');
}
})
}
}
})
}
}
}
</script>
<style lang="scss">
.cus-wrap {
background-color: #F4F5F7;
padding: 30rpx;
.content {
width: 690rpx;
height: 800rpx;
background: #FFFFFF;
border-radius: 12rpx;
display: flex;
flex-direction: column;
align-items: center;
.qrcode {
margin-top: 160rpx;
}
.desc {
margin-top: 40rpx;
font-size: 24rpx;
font-weight: 400;
color: #666666;
line-height: 24rpx;
}
}
}
</style>
<template>
<view class="det-wrap">
<w-navbar title="配件押金"></w-navbar>
<view class="content">
<view class="toolbar">
<view class="refund" @tap="refund">退押金</view>
</view>
<view class="deposit">
<view class="title">我的配件押金</view>
<view class="amount"><text class="prefix"></text>{{ amount }}</view>
</view>
<view class="rules">
<view class="title">质保金规则</view>
<view class="item" v-for="(item, index) in rules" :key="index">
<view class="question">
<view class="qa-icon danger-bg">Q</view>
<view class="txt">{{ item.question }}</view>
</view>
<view class="answer">
<view class="qa-icon default-bg">A</view>
<view class="txt">{{ item.answer }}</view>
</view>
<u-divider v-show="rules.length != (index+1)" half-width="315" border-color="#F4F5F7" height="20"></u-divider>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
settled: null,
rules: [
{
question: '为什么缴纳设备押金?',
answer: `设备押金是什么什么什么,应该巴拉巴拉巴拉,所以
要缴纳,巴拉巴拉巴拉。`
},
{
question: '退还设备押金说明',
answer: `设备押金的退还说明是什么什么样的,应该怎么怎么
样,先找客服,然后再怎么怎么样,然后再怎么怎么
样,这样就可以了。`
}
],
};
},
computed: {
amount() {
return this.settled && this.settled.deposit || '0.00';
},
},
onLoad() {
if(this.vuex_token && this.vuex_settled) {
this.settled = this.vuex_settled
} else {
this.getData();
}
},
methods: {
getData() {
let self = this
const callBack = (vm, result) => {
// 后台自动判断入驻流程是否完成,前台通过status确定状态
if (result && result.record) {
self.settled = result.record
}
};
app.getBaseInfo(self, callBack);
},
refund() {
this.$u.route({
type: 'redirect',
url: "pages/mine/customer/index"
})
},
}
}
</script>
<style lang="scss" scoped>
.det-wrap {
background-color: #F4F5F7;
padding: 30rpx;
.content {
padding: 30rpx;
width: 690rpx;
min-height: 1120rpx;
background: #FFFFFF;
border-radius: 12rpx;
display: flex;
flex-direction: column;
align-items: center;
.toolbar {
align-self: flex-end;
.refund {
text-align: center;
width: 88rpx;
height: 40rpx;
background: #F4F5F7;
border-radius: 26rpx;
font-size: 20rpx;
font-weight: 400;
color: #2272FF;
line-height: 40rpx;
}
}
.deposit {
margin-top: 50rpx;
display: flex;
flex-direction: column;
align-items: center;
.title {
font-size: 40rpx;
font-weight: bold;
color: #333333;
line-height: 40rpx;
}
.amount {
margin-top: 60rpx;
font-size: 72rpx;
font-weight: bold;
color: #2272FF;
line-height: 72rpx;
.prefix{
font-size: 40rpx;
}
}
}
.rules {
align-self: flex-start;
margin-top: 160rpx;
.title {
font-size: 32rpx;
font-weight: bold;
color: #333333;
line-height: 32rpx;
margin-bottom: 10rpx;
}
.item {
margin-top: 40rpx;
.question {
display: flex;
margin-bottom: 30rpx;
.txt {
margin-left: 20rpx;
width: 554rpx;
font-size: 28rpx;
font-weight: bold;
color: #333333;
line-height:40rpx;
}
}
.answer {
display: flex;
margin-bottom: 30rpx;
.txt {
margin-left: 20rpx;
width: 554rpx;
font-size: 24rpx;
font-weight: 400;
color: #666666;
line-height: 36rpx;
}
}
}
}
}
}
.qa-icon {
text-align: center;
width: 40rpx;
height: 40rpx;
border-radius: 8rpx;
font-size: 28rpx;
font-weight: 500;
color: #FFFFFF;
line-height: 40rpx;
}
.danger-bg {
background: #FA5A49;
}
.default-bg {
background: #2272FF;
}
</style>
<template>
<view class="settlement-view">
<u-navbar back-icon-color="#333333" background="#F4F5F7" title="结算账单" titleColor="#333333"
:border-bottom="false"></u-navbar>
<view class="settlement-conten">
<view class="settlement-content-view">
<view class="head-view">
<view class="head-top-view">
<picker mode="date" :value="date" fields="month" @change="bindDateChange">
<view class="date-input">
<text class="date-text">{{date}}</text>
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
</view>
<view class="head-bottom-view">
<view class="head-amount-view">
<view><text>已结算金额(元)</text></view>
<view class="head-amount-text"><text>{{info.totalAmount}}</text></view>
</view>
</view>
</view>
<image :src="liushuibeijingImage" class="head-back-image" mode="widthFix"></image>
<view class="list-view">
<view v-for="(item, index) in info.payableRecordExtendDtos" :key="index">
<Settlement :data="item"></Settlement>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import Settlement from "@/components/mine/settlement.vue"
export default {
components: {
Settlement
},
data() {
return {
info: {
totalAmount: 0,
payableRecordExtendDtos: []
},
date: '2021-05'
}
},
computed: {
liushuibeijingImage() {
return this.imageUrl + 'liushuibeijing.png'
},
imageUrl() {
return process.uniEnv.qn_base_url
},
},
created() {
var item = {
paymentTime: new Date().getTime(),
payableRecordStatusText: '提现',
payableRecordNumber: 'EE999777',
settlementAmount: 9899
}
this.info.payableRecordExtendDtos = [item, item, item, item, item]
},
methods: {
bindDateChange: function(e) {
this.date = e.target.value
},
}
}
</script>
<style lang="scss" scoped>
.settlement-view {
display: flex;
flex-direction: column;
height: 100vh;
background-color: #F4F5F7;
.settlement-conten {
overflow: auto;
.settlement-content-view {
margin: 10rpx 30rpx 30rpx 30rpx;
border-radius: 12rpx;
position: relative;
border-radius: 12rpx;
background-color: #FFFFFF;
.head-back-image {
position: relative;
width: 100%;
z-index: 0;
}
.head-view {
z-index: 1;
padding: 30rpx;
color: #FFFFFF;
position: absolute;
width: 100%;
.head-top-view {
margin-top: 10rpx;
margin-bottom: 50rpx;
.date-input {
.date-text {
padding-right: 10rpx;
font-size: 28rpx;
}
}
}
.head-bottom-view {
display: flex;
align-items: flex-start;
justify-content: space-between;
.head-amount-view {
font-size: 24rpx;
.head-amount-text {
font-size: 40rpx;
margin-top: 10rpx;
}
}
}
}
.list-view {
position: relative;
z-index: 1;
padding-bottom: 20rpx;
}
}
}
}
</style>
<template>
<view class="statement-view">
<u-navbar back-icon-color="#333333" background="#F4F5F7" title="收入流水" titleColor="#333333"
:border-bottom="false"></u-navbar>
<view class="statement-conten">
<view class="statement-content-view">
<view class="head-view">
<view class="head-top-view">
<picker mode="date" :value="date" fields="month" @change="bindDateChange">
<view class="date-input">
<text class="date-text">{{date}}</text>
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
</view>
<view class="head-bottom-view">
<view v-for="(value, key) in items" :key="key" class="head-amount-view">
<view><text>{{value}}</text></view>
<view class="head-amount-text"><text>{{info[key]}}</text></view>
</view>
</view>
</view>
<image :src="liushuibeijingImage" class="head-back-image" mode="widthFix"></image>
<view class="list-view">
<view v-for="(item, index) in data.statementList" :key="index">
<Statement :data="item"></Statement>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import Statement from "@/components/mine/statement.vue"
export default {
components: {
Statement
},
data() {
return {
data: {
expectedAmount: 0,
settledAmount: 0,
statementList: []
},
date: '2021-05'
}
},
computed: {
info() {
return {
...this.data,
number: this.data.statementList.length
}
},
items() {
return {
expectedAmount: '预结(元)',
settledAmount: '已确认(元)',
number: '订单数(单)',
}
},
liushuibeijingImage() {
return this.imageUrl + 'liushuibeijing.png'
},
imageUrl() {
return process.uniEnv.qn_base_url
},
},
created() {
var item = {
paymentTime: new Date().getTime(),
payableRecordStatusText: '预结',
orderNumber: 'EE999777',
orderServiceType: '安装',
inGuaranteePeriod: false, // true 保内;false 保外
payableAmount: 9899
}
this.data.statementList = [item, item, item, item, item]
},
methods: {
bindDateChange: function(e) {
this.date = e.target.value
},
}
}
</script>
<style lang="scss" scoped>
.statement-view {
display: flex;
flex-direction: column;
height: 100vh;
background-color: #F4F5F7;
.statement-conten {
overflow: auto;
.statement-content-view {
margin: 10rpx 30rpx 30rpx 30rpx;
border-radius: 12rpx;
position: relative;
border-radius: 12rpx;
background-color: #FFFFFF;
.head-back-image {
position: relative;
width: 100%;
z-index: 0;
}
.head-view {
z-index: 1;
padding: 30rpx;
color: #FFFFFF;
position: absolute;
width: 100%;
.head-top-view {
margin-top: 10rpx;
margin-bottom: 50rpx;
.date-input {
.date-text {
padding-right: 10rpx;
font-size: 28rpx;
}
}
}
.head-bottom-view {
display: flex;
align-items: flex-start;
justify-content: space-between;
.head-amount-view {
font-size: 24rpx;
.head-amount-text {
font-size: 40rpx;
margin-top: 10rpx;
}
}
}
}
.list-view {
position: relative;
z-index: 1;
padding-bottom: 20rpx;
}
}
}
}
</style>
<template>
<view class="withdraw-view">
<u-navbar back-icon-color="#333333" background="#F4F5F7" title="提现" titleColor="#333333" :border-bottom="false">
</u-navbar>
<view class="withdraw-content">
<view class="withdraw-content-main">
<view class="amount-title">可提现金额</view>
<view class="amount-text"><text class="amount-symbol"></text>{{amount}}</view>
<u-button type="primary" shape="circle" :custom-style="buttonStyle" @click="handleClick">提现</u-button>
</view>
<view class="line-view"></view>
<view class="rule-title">提现规则说明</view>
<view class="rule-content">1.提现金额:提现金额是指已完工订单通过平台审核后且达到合同账期的订单费用之总和。</view>
<view class="rule-content">2.提现到账时间为1-3个工作日,最终以银行结果为准</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
amount: 0
}
},
computed: {
buttonStyle() {
return {
width: "400rpx",
height: "104rpx",
"font-size": "32rpx",
"font-weight": "bold",
};
},
},
methods: {
handleClick() {
}
}
}
</script>
<style lang="scss" scoped>
.withdraw-view {
height: 100vh;
background-color: #F4F5F7;
.withdraw-content {
border-radius: 12rpx;
background-color: #FFFFFF;
padding: 100rpx 30rpx;
margin: 10rpx 30rpx 30rpx 30rpx;
.withdraw-content-main {
text-align: center;
margin-bottom: 200rpx;
.amount-title {
font-size: 40rpx;
font-weight: bold;
color: #333333;
}
.amount-text {
font-size: 72rpx;
font-weight: bold;
color: #2272FF;
margin-top: 60rpx;
margin-bottom: 60rpx;
.amount-symbol {
font-size: 36rpx;
}
}
}
.line-view {
padding: 0 30rpx;
background-color: #F4F5F7;
height: 2rpx;
}
.rule-title {
font-size: 32rpx;
font-weight: bold;
color: #333333;
margin-top: 60rpx;
margin-bottom: 30rpx;
}
.rule-content {
font-size: 24rpx;
color: #666666;
margin-bottom: 20rpx;
line-height: 40rpx;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment