Skip to content

S
self-support
Commit 7f8f7c59 authored by Facius's avatar Facius
Browse files
Options

feat: 蒙层提示

parent c6dc0333
Hide whitespace changes
Inline Side-by-side
Showing with 216 additions and 40 deletions
src/components/mask-tip/index.vue 0 → 100644
View file @ 7f8f7c59
<template>
<u-mask :show="visible" @click="handleClick" :zoom="false">
<view class="tip-view" :style="'margin-top:' + statusBarHeight + 'px'">
<image
class="tip-image"
:src="imageUrl"
:style="imageStyle"
mode="widthFix"
></image>
</view>
</u-mask>
</template>
<script>
/**
* @description 创建一个遮罩层，提示图片
* @property {Boolean} show 是否显示遮罩（默认false）
* @property {Object} imageName 图片地址名
* @property {Object} imageStyle 自定义样式对象
* @example <mask-tip :show.sync="show"></mask-tip>
*/
export default {
props: {
show: {
type: Boolean,
default: false,
},
imageName: {
type: String,
default: ''
},
imageStyle: {
type: String,
default: ''
},
name: {
type: String,
default: ''
},
timeout: {
type: Boolean,
default: true
}
},
data() {
return {
statusBarHeight: 20,
visible: false
}
},
watch: {
show(val) {
if (!val) return
let value = this.vuex_not_first
if (!value[this.name]) {
uni.getSystemInfo({
success: (res) => {
this.statusBarHeight = res.statusBarHeight
setTimeout(() => {
this.visible = true
}, this.time)
},
})
value[this.name] = true
this.$u.vuex('vuex_not_first', value)
}
}
},
computed: {
imageUrl() {
return process.uniEnv.qn_base_url + this.imageName
},
time() {
return this.timeout ? 1500 : 0
}
},
methods: {
handleClick() {
this.visible = false
this.$emit('click')
},
},
}
</script>
<style lang="scss" scoped>
.tip-view {
}
</style>
src/pages/index/index.vue
View file @ 7f8f7c59
......@@ -110,12 +110,19 @@
<!-- <EusingList /> -->
</view>
<upload-progress />
<MaskTip
:show="showMask"
imageName="mengceng2.png"
:imageStyle="imageStyle"
name="upload_tip"
/>
</TabBarPage>
</template>
<script>
import TabBarPage from '@/components/tabBarList/index.vue'
import NoOrder from '@/components/order/noOrder.vue'
import MaskTip from '@/components/mask-tip/index.vue'
const app = getApp()
import OrderCell from '@/components/order/index.vue'
// import EusingList from '@/components/order/eusingList.vue'
......@@ -125,6 +132,7 @@ export default {
OrderCell,
TabBarPage,
NoOrder,
MaskTip,
// EusingList,
},
data() {
......@@ -151,6 +159,7 @@ export default {
old: {
scrollTop: 0,
},
showMask: false,
}
},
watch: {
......@@ -193,6 +202,9 @@ export default {
weiruzhuImage() {
return process.uniEnv.qn_base_url + 'weiruzhu.png'
},
imageStyle() {
return 'width:628rpx; margin-top:816rpx; margin-left:122rpx'
}
},
onLoad(e) {
app.trackPage('自营平台首页')
......@@ -202,6 +214,7 @@ export default {
} else {
this.waitInit = true
}
this.showMaskTip()
},
onShow() {
// 每次进入页面都刷新入驻状态
......@@ -444,6 +457,10 @@ export default {
url: '/pages/mine/customer/index' + '?type=exclusive',
})
},
// 显示提示蒙版
showMaskTip() {
this.showMask = true
},
},
}
</script>
......
src/pages/index/mine.vue
View file @ 7f8f7c59
......@@ -57,13 +57,32 @@
<view>
<u-toast ref="uToast" />
</view>
<MaskTip
:show="showMask"
imageName="mengceng4.png"
:imageStyle="imageStyle"
name="order_tip"
@click="showMask1 = true"
/>
<MaskTip
:show="showMask1"
imageName="mengceng3.png"
:imageStyle="imageStyle1"
name="history_tip"
:timeout="false"
/>
</view>
</template>
<script>
import login from "@/utils/login.js";
import MaskTip from '@/components/mask-tip/index.vue'
const app = getApp();
export default {
components: {
MaskTip
},
data() {
return {
serviceTel: '18124099271',
......@@ -73,6 +92,8 @@
wodebeijingImage: '',
placeholderImage: '',
needSettled: true, // 需要入驻
showMask: false,
showMask1: false,
}
},
computed: {
......@@ -190,6 +211,12 @@
},
isSuperuser() {
return this.vuex_superuser
},
imageStyle() {
return 'width:602rpx; margin-top:560rpx; margin-left:28rpx'
},
imageStyle1() {
return 'width:596rpx; margin-top:736rpx; margin-left:28rpx'
}
},
watch: {
......@@ -212,6 +239,7 @@
}
this.wodebeijingImage = this.qnFile('wodebeijing-jb.png')
this.placeholderImage = this.qnFile('touxiang.png')
this.showMaskTip()
},
onShow() {
// 更新是否需要入住
......@@ -279,7 +307,11 @@
} else {
this.$u.route({url: "pages/login/index"})
}
}
},
// 显示提示蒙版
showMaskTip() {
this.showMask = true
},
}
}
</script>
......
src/pages/index/order.vue
View file @ 7f8f7c59
......@@ -93,6 +93,12 @@
</view>
<!-- 悬浮按钮 -->
<!-- <EusingList type="collapse" /> -->
<MaskTip
:show="showMask"
imageName="mengceng1.png"
:imageStyle="imageStyle"
name="today_tip"
/>
</TabBarPage>
</template>
......@@ -101,6 +107,8 @@ import TabBarPage from '@/components/tabBarList/index.vue'
import OrderCell from '@/components/order/index.vue'
import NoOrder from '@/components/order/noOrder.vue'
import upload from '@/components/upload/task.js'
import MaskTip from '@/components/mask-tip/index.vue'
// import EusingList from '@/components/order/eusingList.vue'
export default {
......@@ -108,6 +116,7 @@ export default {
TabBarPage,
OrderCell,
NoOrder,
MaskTip,
// EusingList,
},
data() {
......@@ -171,6 +180,7 @@ export default {
old: {
scrollTop: 0,
},
showMask: false,
}
},
computed: {
......@@ -281,6 +291,9 @@ export default {
noOrderCustomStyle() {
return 'margin-top: 100rpx;background-color: #F4F5F7'
},
imageStyle() {
return 'width:546rpx; margin-top:80rpx; margin-left:100rpx'
}
},
onLoad(e) {
getApp().trackPage('订单首页')
......@@ -292,6 +305,7 @@ export default {
this.indexStatus[this.curNow].indexOf(e.type)
)
}
this.showMaskTip()
},
onShow() {
if (this.uploadTask.length > 0) {
......@@ -488,6 +502,10 @@ export default {
this.scrollTop = 0
})
},
// 显示提示蒙版
showMaskTip() {
this.showMask = true
},
},
}
</script>
......
src/pages/mine/wallet/index.vue
View file @ 7f8f7c59
......@@ -2,9 +2,9 @@
<view class="wallet-view">
<u-navbar back-icon-color="#333333" background="#F4F5F7" title="我的钱包" titleColor="#333333"
:border-bottom="false" title-bold></u-navbar>
<view class="wallet-content-view">
<view class="wallet-content-view">
<view class="header-view">
<image class="header-image" :src="qnFile('qianbaobeijing.png')"></image>
<image class="header-image" :src="qnFile('qianbaobeijing.png')"></image>
</view>
<view class="survey-view">
<view class="survey-top-view">
......@@ -51,6 +51,12 @@
</view>
</view>
</view>
<MaskTip
:show="showMask"
imageName="mengceng5.png"
:imageStyle="imageStyle"
name="settlement_tip"
/>
</view>
</template>
......@@ -58,9 +64,12 @@
let now = new Date(new Date().toLocaleDateString()).getTime();
import util from '@/utils/util.js'
import Statement from "@/components/mine/statement.vue"
import MaskTip from '@/components/mask-tip/index.vue'
export default {
components: {
Statement
Statement,
MaskTip
},
data() {
return {
......@@ -74,6 +83,7 @@
loading: true,
statementList: [],
settledAmount: 0,
showMask: false,
}
},
computed: {
......@@ -119,21 +129,25 @@
'color': '#2272FF',
'margin-bottom': '20rpx'
};
},
pages() {
return ['settlement','statement']
},
pages() {
return ['settlement','statement']
},
imageStyle() {
return 'width:690rpx; margin-top:542rpx; margin-left:30rpx'
}
},
onLoad() {
getApp().trackPage('我的钱包页')
this.showMaskTip()
},
onShow() {
// 未登录，先跳转登录
if(!this.vuex_token) {
this.$u.route({url: 'pages/login/index'})
}
this.loadAssets()
this.loadStatement()
onShow() {
// 未登录，先跳转登录
if(!this.vuex_token) {
this.$u.route({url: 'pages/login/index'})
}
this.loadAssets()
this.loadStatement()
},
methods: {
qnFile(src) {
......@@ -142,21 +156,21 @@
// 提现
handleClickWithdraw() {
this.$u.route({
url: 'pages/mine/wallet/withdraw'
url: 'pages/mine/wallet/withdraw'
})
},
handleClick(index) {
this.$u.route({
url: 'pages/mine/wallet/' + this.pages[index]
this.$u.route({
url: 'pages/mine/wallet/' + this.pages[index]
})
},
handleClickCell(orderId) {
this.$u.route({
},
handleClickCell(orderId) {
this.$u.route({
url: 'pages/order/detail?&type=other',
params: {
id: orderId
}
})
}
})
},
async loadAssets() {
let self = this
......@@ -168,9 +182,9 @@
async loadStatement() {
let self = this
self.loading = true
let res = await self.$u.api.listStatement({
starDate: this.moment(new Date()).startOf('month').format('YYYY-MM-DD'),
endDate:this.moment(new Date()).endOf('month').format('YYYY-MM-DD')
let res = await self.$u.api.listStatement({
starDate: this.moment(new Date()).startOf('month').format('YYYY-MM-DD'),
endDate:this.moment(new Date()).endOf('month').format('YYYY-MM-DD')
})
self.loading = false
if(res && res.code == 200) {
......@@ -183,28 +197,32 @@
}
}
},
// 显示提示蒙版
showMaskTip() {
this.showMask = true
},
}
}
</script>
<style lang="scss" scoped>
.wallet-view {
display: flex;
flex-direction: column;
.wallet-view {
display: flex;
flex-direction: column;
height: 100vh;
.wallet-content-view {
position: relative;
overflow: auto;
background-color: #F4F5F7;
.header-view {
position: absolute;
width: 100%;
padding-top: 10rpx;
padding-left: 14rpx;
.header-image {
background-color: #F4F5F7;
.header-view {
position: absolute;
width: 100%;
padding-top: 10rpx;
padding-left: 14rpx;
.header-image {
width: 730rpx;
height: 420rpx;
}
height: 420rpx;
}
}
......@@ -310,5 +328,5 @@
border-radius: 0 0 12rpx 12rpx;
}
}
}
</style>
}
</style>
src/store/index.js
View file @ 7f8f7c59
......@@ -12,7 +12,7 @@ try {
}
// 需要永久存储，且下次APP启动需要取出的，在state中的变量名
let saveStateKeys = ['vuex_user', 'vuex_wx_uid', 'vuex_token', 'vuex_cache', 'uploadTask', 'uploadTotal', 'uploadSuccess', 'vuex_superuser'];
let saveStateKeys = ['vuex_user', 'vuex_wx_uid', 'vuex_token', 'vuex_cache', 'uploadTask', 'uploadTotal', 'uploadSuccess', 'vuex_superuser', 'vuex_not_first'];
// 保存变量到本地存储中
const saveLifeData = function(key, value) {
......@@ -50,6 +50,8 @@ const store = new Vuex.Store({
uploadTotal: lifeData.uploadTotal ? lifeData.uploadTotal : 0,
// 已上传数量
uploadSuccess: lifeData.uploadSuccess ? lifeData.uploadSuccess : 0,
// 初次登录
vuex_not_first: lifeData.vuex_not_first ? lifeData.vuex_not_first : {},
},
mutations: {
$uStore(state, payload) {
......
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