Commit a599d577 authored by jyx's avatar jyx

代码优化

parent b0e411d0
......@@ -125,7 +125,7 @@
&.active {
.tabs-title {
color: red;
color: black;
font-weight: bold;
font-size: 40rpx;
// background-color: aqua;
......
<!-- 底部弹窗(分享) -->
<template>
<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear">
<uni-transition :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
<view class="uni-popup__wrapper-box" @click.stop="clear">
<slot />
</view>
</uni-transition>
</view>
</template>
<script>
import uniTransition from '@/components/uni-transition/uni-transition.vue'
/**
* PopUp 弹出层
* @description 弹出层组件,为了解决遮罩弹层的问题
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
* @property {String} type = [top|center|bottom] 弹出方式
* @value top 顶部弹出
* @value center 中间弹出
* @value bottom 底部弹出
* @property {Boolean} animation = [ture|false] 是否开启动画
* @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
* @event {Function} change 打开关闭弹窗触发,e={show: false}
*/
export default {
name: 'UniPopup',
components: {
uniTransition
},
props: {
// 开启动画
animation: {
type: Boolean,
default: true
},
// 弹出层类型,可选值,top: 顶部弹出层;bottom:底部弹出层;center:全屏弹出层
type: {
type: String,
default: 'center'
},
// maskClick
maskClick: {
type: Boolean,
default: true
}
},
data() {
return {
duration: 300,
ani: [],
showPopup: false,
showTrans: false,
maskClass: {
'position': 'fixed',
'bottom': 0,
'top': 0,
'left': 0,
'right': 0,
'backgroundColor': 'rgba(0, 0, 0, 0.4)'
},
transClass: {
'position': 'fixed',
'left': 0,
'right': 0,
}
}
},
watch: {
type: {
handler: function(newVal) {
switch (this.type) {
case 'top':
this.ani = ['slide-top']
this.transClass = {
'position': 'fixed',
'left': 0,
'right': 0,
}
break
case 'bottom':
this.ani = ['slide-bottom']
this.transClass = {
'position': 'fixed',
'left': 0,
'right': 0,
'bottom': 0
}
break
case 'center':
this.ani = ['zoom-out', 'fade']
this.transClass = {
'position': 'fixed',
/* #ifndef APP-NVUE */
'display': 'flex',
'flexDirection': 'column',
/* #endif */
'bottom': 0,
'left': 0,
'right': 0,
'top': 0,
'justifyContent': 'center',
'alignItems': 'center'
}
break
}
},
immediate: true
}
},
created() {
if (this.animation) {
this.duration = 300
} else {
this.duration = 0
}
},
methods: {
clear(e) {
// TODO nvue 取消冒泡
e.stopPropagation()
},
open() {
this.showPopup = true
this.$nextTick(() => {
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.showTrans = true
}, 50);
})
this.$emit('change', {
show: true
})
},
close(type) {
this.showTrans = false
this.$nextTick(() => {
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.$emit('change', {
show: false
})
this.showPopup = false
}, 300)
})
},
onTap() {
if (!this.maskClick) return
this.close()
}
}
}
</script>
<style lang="scss" scoped>
.uni-popup {
position: fixed;
/* #ifdef H5 */
top: var(--window-top);
/* #endif */
/* #ifndef H5 */
top: 0;
/* #endif */
bottom: 0;
left: 0;
right: 0;
/* #ifndef APP-NVUE */
z-index: 99999999999;
/* #endif */
}
.uni-popup__mask {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: $uni-bg-color-mask;
opacity: 0;
}
.mask-ani {
transition-property: opacity;
transition-duration: 0.2s;
}
.uni-top-mask {
opacity: 1;
}
.uni-bottom-mask {
opacity: 1;
}
.uni-center-mask {
opacity: 1;
}
.uni-popup__wrapper {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
position: absolute;
}
.top {
top: 0;
left: 0;
right: 0;
transform: translateY(-500px);
}
.bottom {
bottom: 0;
left: 0;
right: 0;
transform: translateY(500px);
}
.center {
/* #ifndef APP-NVUE */
display: flex;
flex-direction: column;
/* #endif */
bottom: 0;
left: 0;
right: 0;
top: 0;
justify-content: center;
align-items: center;
transform: scale(1.2);
opacity: 0;
}
.uni-popup__wrapper-box {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
position: relative;
}
.content-ani {
// transition: transform 0.3s;
transition-property: transform, opacity;
transition-duration: 0.2s;
}
.uni-top-content {
transform: translateY(0);
}
.uni-bottom-content {
transform: translateY(0);
}
.uni-center-content {
transform: scale(1);
opacity: 1;
}
</style>
<!-- 底部弹窗需要组件(分享) -->
<template>
<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
@click="change">
<slot></slot>
</view>
</template>
<script>
// #ifdef APP-NVUE
const animation = uni.requireNativePlugin('animation');
// #endif
/**
* Transition 过渡动画
* @description 简单过渡动画组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=985
* @property {Boolean} show = [false|true] 控制组件显示或隐藏
* @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
* @value fade 渐隐渐出过渡
* @value slide-top 由上至下过渡
* @value slide-right 由右至左过渡
* @value slide-bottom 由下至上过渡
* @value slide-left 由左至右过渡
* @value zoom-in 由小到大过渡
* @value zoom-out 由大到小过渡
* @property {Number} duration 过渡动画持续时间
* @property {Object} styles 组件样式,同 css 样式,注意带’-‘连接符的属性需要使用小驼峰写法如:`backgroundColor:red`
*/
export default {
name: 'uniTransition',
props: {
show: {
type: Boolean,
default: false
},
modeClass: {
type: Array,
default () {
return []
}
},
duration: {
type: Number,
default: 300
},
styles: {
type: Object,
default () {
return {}
}
}
},
data() {
return {
isShow: false,
transform: '',
ani: { in: '',
active: ''
}
};
},
watch: {
show: {
handler(newVal) {
if (newVal) {
this.open()
} else {
this.close()
}
},
immediate: true
}
},
computed: {
stylesObject() {
let styles = {
...this.styles,
'transition-duration': this.duration / 1000 + 's'
}
let transfrom = ''
for (let i in styles) {
let line = this.toLine(i)
transfrom += line + ':' + styles[i] + ';'
}
return transfrom
}
},
created() {
// this.timer = null
// this.nextTick = (time = 50) => new Promise(resolve => {
// clearTimeout(this.timer)
// this.timer = setTimeout(resolve, time)
// return this.timer
// });
},
methods: {
change() {
this.$emit('click', {
detail: this.isShow
})
},
open() {
clearTimeout(this.timer)
this.isShow = true
this.transform = ''
this.ani.in = ''
for (let i in this.getTranfrom(false)) {
if (i === 'opacity') {
this.ani.in = 'fade-in'
} else {
this.transform += `${this.getTranfrom(false)[i]} `
}
}
this.$nextTick(() => {
setTimeout(() => {
this._animation(true)
}, 50)
})
},
close(type) {
clearTimeout(this.timer)
this._animation(false)
},
_animation(type) {
let styles = this.getTranfrom(type)
// #ifdef APP-NVUE
if(!this.$refs['ani']) return
animation.transition(this.$refs['ani'].ref, {
styles,
duration: this.duration, //ms
timingFunction: 'ease',
needLayout: false,
delay: 0 //ms
}, () => {
if (!type) {
this.isShow = false
}
this.$emit('change', {
detail: this.isShow
})
})
// #endif
// #ifndef APP-NVUE
this.transform = ''
for (let i in styles) {
if (i === 'opacity') {
this.ani.in = `fade-${type?'out':'in'}`
} else {
this.transform += `${styles[i]} `
}
}
this.timer = setTimeout(() => {
if (!type) {
this.isShow = false
}
this.$emit('change', {
detail: this.isShow
})
}, this.duration)
// #endif
},
getTranfrom(type) {
let styles = {
transform: ''
}
this.modeClass.forEach((mode) => {
switch (mode) {
case 'fade':
styles.opacity = type ? 1 : 0
break;
case 'slide-top':
styles.transform += `translateY(${type?'0':'-100%'}) `
break;
case 'slide-right':
styles.transform += `translateX(${type?'0':'100%'}) `
break;
case 'slide-bottom':
styles.transform += `translateY(${type?'0':'100%'}) `
break;
case 'slide-left':
styles.transform += `translateX(${type?'0':'-100%'}) `
break;
case 'zoom-in':
styles.transform += `scale(${type?1:0.8}) `
break;
case 'zoom-out':
styles.transform += `scale(${type?1:1.2}) `
break;
}
})
return styles
},
_modeClassArr(type) {
let mode = this.modeClass
if (typeof(mode) !== "string") {
let modestr = ''
mode.forEach((item) => {
modestr += (item + '-' + type + ',')
})
return modestr.substr(0, modestr.length - 1)
} else {
return mode + '-' + type
}
},
// getEl(el) {
// console.log(el || el.ref || null);
// return el || el.ref || null
// },
toLine(name) {
return name.replace(/([A-Z])/g, "-$1").toLowerCase();
}
}
}
</script>
<style>
.uni-transition {
transition-timing-function: ease;
transition-duration: 0.3s;
transition-property: transform, opacity;
}
.fade-in {
opacity: 0;
}
.fade-active {
opacity: 1;
}
.slide-top-in {
/* transition-property: transform, opacity; */
transform: translateY(-100%);
}
.slide-top-active {
transform: translateY(0);
/* opacity: 1; */
}
.slide-right-in {
transform: translateX(100%);
}
.slide-right-active {
transform: translateX(0);
}
.slide-bottom-in {
transform: translateY(100%);
}
.slide-bottom-active {
transform: translateY(0);
}
.slide-left-in {
transform: translateX(-100%);
}
.slide-left-active {
transform: translateX(0);
opacity: 1;
}
.zoom-in-in {
transform: scale(0.8);
}
.zoom-out-active {
transform: scale(1);
}
.zoom-out-in {
transform: scale(1.2);
}
</style>
......@@ -32,7 +32,7 @@
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
},
},
{
"path": "pages/my/my",
"style": {
......@@ -48,7 +48,21 @@
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/spread/spread",
"path": "pages/recommend/recommend",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/recommend/follow",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}, {
"path": "pages/recommend/recommendVideo",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
......@@ -70,20 +84,12 @@
}, {
"root": "pagesC",
"pages": [{
"path": "sign/sign",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}, {
"path": "spreadDetail/spreadDetail",
"path": "video/videoDetail",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#2196f3",
"navigationBarTextStyle": "black"
}
}]
}, {
"root": "pagesD",
......@@ -128,4 +134,4 @@
"scrollIndicator": "none"
}
}
}
}
\ No newline at end of file
......@@ -2,7 +2,7 @@
<view class="body">
<view style="height: 100%;">
<indexPage v-show="currentPage==0" ref="index" />
<spreadPage v-show="currentPage==1" ref="spread" />
<recommendPage v-on:showEditBarH="showEditBarH" v-show="currentPage==1" ref="recommend" />
<userPage v-show="currentPage==2" ref="user" />
</view>
<view class="tabs-bar">
......@@ -16,8 +16,8 @@
</view>
剧场
</view>
<view :class="currentPage == 1?'tab active': 'tab'"
:style="'padding-bottom:' + bottomSafePadding + 'px;'" @click="tabChange(1)">
<view :class="currentPage == 1?'tab active': 'tab'" :style="'padding-bottom:' + bottomSafePadding + 'px;'"
@click="tabChange(1)">
<view style="margin: 16rpx 0 11rpx;">
<image v-if="currentPage==1" class="tabs-image" src="/static/tab/promote_selected.png"
mode="heightFix"></image>
......@@ -35,9 +35,16 @@
我的
</view>
</view>
<view v-if="showEditBar" class="editBar">
<view class="editItem" @click="!isFullChoice?fullChoice():noChoice()"
:style="'padding-bottom:' + bottomSafePadding + 'px;'">
{{!isFullChoice?'全选':'全不选'}}
</view>
<view class="editItem" @click="deleteCollect" :style="'padding-bottom:' + bottomSafePadding + 'px;'">
删除
</view>
</view>
</view>
</template>
<script>
......@@ -50,7 +57,7 @@
// 首页
import indexPage from "@/pages/index/index.vue";
import spreadPage from "@/pages/spread/spread.vue";
import recommendPage from "@/pages/recommend/recommend.vue";
import userPage from "@/pages/my/my.vue";
export default {
......@@ -58,18 +65,20 @@
mixins: [common],
components: {
indexPage,
spreadPage,
recommendPage,
userPage
},
data() {
return {
isFirstLoad: true,
currentPage: 0
currentPage: 0,
showEditBar: false,
isFullChoice: false
}
},
onLoad(options) {
let index = options.index ?? ''
if (index != '' && index != undefined && this.buyerShowEnable == '1') {
if (index != '' && index != undefined) {
this.currentPage = index
}
},
......@@ -84,7 +93,7 @@
if (this.currentPage == 0) {
this.$refs.index.show();
} else if (this.currentPage == 1) {
this.$refs.spread.show();
this.$refs.recommend.show();
} else if (this.currentPage == 2) {
this.$refs.user.show();
}
......@@ -109,15 +118,14 @@
loadComponentData() {
if (this.currentPage == 0) {
this.$refs.index.show();
this.$refs.recommend.hide();
} else if (this.currentPage == 1) {
this.$refs.spread.show();
this.$refs.recommend.show();
} else if (this.currentPage == 2) {
this.$refs.user.show();
this.$refs.recommend.hide();
}
},
confirm(val) {
this.showCoupon = false
},
wxLogin() {
let that = this
uni.login({
......@@ -139,34 +147,29 @@
key: 'token',
data: data.session
});
// 0 展示商品 1 展示换脸
uni.setStorage({
key: 'fromType',
data: '' + data.fromType
});
//买家秀开关,1开,其它关
uni.setStorage({
key: 'buyerShowEnable',
data: data.buyerShowEnable
});
//推广开关,1开,其它关
uni.setStorage({
key: 'promotionEnable',
data: data.promotionEnable
});
app.globalData.token = data.session;
app.globalData.userId = data.userId;
app.globalData.userInfo = data;
that.fromType = data.fromType
that.buyerShowEnable = data.buyerShowEnable
that.promotionEnable = data.promotionEnable
}
});
}
});
},
showEditBarH(b) {
this.showEditBar = b
this.isFullChoice = false
},
fullChoice() {
this.isFullChoice = !this.isFullChoice
this.$refs.recommend.fullChoice();
},
noChoice() {
this.isFullChoice = !this.isFullChoice
this.$refs.recommend.noChoice();
},
deleteCollect() {
this.$refs.recommend.deleteCollect();
}
}
}
......@@ -176,4 +179,20 @@
.body {
height: 100%;
}
</style>
.editBar {
position: absolute;
bottom: 0;
width: 100%;
height: 120rpx;
background: white;
display: flex;
.editItem {
height: 120rpx;
line-height: 120rpx;
text-align: center;
width: 50%;
}
}
</style>
\ No newline at end of file
<template>
<view style="background: white;">
<view style="position: absolute;right: 20rpx;top: 26rpx;" @click="isEditStyle = !isEditStyle">
<image style="width: 60rpx;height: 60rpx;" mode="widthFix"
:src="isEditStyle?'/static/video/scRed.png':'/static/video/aixinRed.png'" />
</view>
<scroll-view scroll-y="true" :style="'height: '+(windowHeight -120)+'px;margin-top:50px;'">
<view class="flex space" style="display:flex; flex-wrap:wrap;">
<block v-for="(value,key) in dataList" :key="key">
<view class="mt-10"
style="width:31%; position: relative; border-radius:20rpx;margin-bottom: 10rpx;margin-left: 14rpx;"
@click="click(value.id,key)" @longpress="longClick(key)">
<image class="integral-mall-goods" mode="aspectFill" :src="value.img"></image>
<view class="text" style="font-size: 26rpx;color: black;">{{value.name}}</view>
<view class="text" style="font-size: 22rpx;color: gray;">{{value.name}}</view>
<view v-if="isEditStyle" @click="cbClick(key)"
style="position: absolute;background: #000000; opacity: 0.6;;width: 100%;height: 100%;top: 0;border-radius:20rpx;">
<u-checkbox-group class="cb" @change="onChange(key)">
<u-checkbox active-color="red" shape="circle" :checked="value.isChecked" />
</u-checkbox-group>
</view>
</view>
</block>
</view>
</scroll-view>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
navigateTo,
} from '@/utils/fun.js';
export default {
name: "follow",
mixins: [common],
data() {
return {
windowHeight: 0,
dataList: [],
isEditStyle: false
}
},
watch: {
isEditStyle: {
handler(newValue, oldValue) {
this.$emit("showEditBarR", newValue)
}
},
},
onLoad(e) {},
methods: {
show() {
this.windowHeight = uni.getSystemInfoSync().windowHeight
this.queryList()
},
queryList() {
let this_ = this
let data = {};
uni.request({
url: 'https://xjc.demo.hongcd.com/api/video/indexdata',
data: data,
success: data => {
let _data = data.data.new
for (let i = 0; i < _data.length; i++) {
_data[i].isChecked = false
}
this.dataList = _data
},
fail: (data, code) => {}
});
},
click(id, key) {
// this.isEditStyle = true
// this.dataList[key].isChecked = true
},
longClick(key) {
this.isEditStyle = true
this.dataList[key].isChecked = true
},
onChange(key) {
this.dataList[key].isChecked = !this.dataList[key].isChecked
},
cbClick(key) {
this.dataList[key].isChecked = !this.dataList[key].isChecked
},
fullChoice() {
for (let i = 0; i < this.dataList.length; i++) {
this.dataList[i].isChecked = true
}
},
noChoice() {
for (let i = 0; i < this.dataList.length; i++) {
this.dataList[i].isChecked = false
}
},
deleteCollect() {
console.log("deleteCollect")
},
}
}
</script>
<style lang="scss" scoped>
.integral-mall-goods {
width: 100%;
height: 320rpx;
background: #F2F2F2;
border-radius: 16upx;
}
.text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.cb {
left: 10rpx;
top: 10rpx;
position: absolute;
}
</style>
\ No newline at end of file
<template>
<view class="body">
<view class="tabContainer">
<tabs-center class="center" :tabs="tabs" v-model="current" @change="handleChange" />
</view>
<view v-if="showEditBar"
style="position: absolute;top:0;left:50%;width: 300rpx;margin-left:-150rpx;background: white;z-index: 999;">
<view style="font-size: 36rpx;text-align: center;align-items: center;height:100rpx;line-height: 100rpx;">追剧
</view>
</view>
<swiper class="swiper" @change="swiperChange" :current="current">
<swiper-item class="swiper-item">
<followPage v-on:showEditBarR="showEditBarR" ref="follow" />
</swiper-item>
<swiper-item class="swiper-item">
<recommendVideoPage ref="recommendVideo" />
</swiper-item>
</swiper>
</view>
</template>
<script>
import common from '@/mixins/common';
import followPage from "@/pages/recommend/follow.vue"
import recommendVideoPage from "@/pages/recommend/recommendVideo.vue";
import {
navigateTo,
} from '@/utils/fun.js';
export default {
name: "recommend",
mixins: [common],
components: {
followPage,
recommendVideoPage
},
data() {
return {
current: 0,
tabIndex: 0,
tabs: [{
title: '追剧',
value: 0
}, {
title: '推荐',
value: 1
}],
showEditBar: false,
}
},
onLoad(e) {
},
methods: {
hide() {
this.$refs.recommendVideo.stop();
},
show() {
if (this.current == 0) {
this.$refs.follow.show();
this.$refs.recommendVideo.stop();
} else if (this.current == 1) {
this.$refs.recommendVideo.show();
}
},
handleChange(event) {
this.current = event.value;
this.show()
},
swiperChange(event) {
this.current = event.detail.current
this.show()
},
showEditBarR(b) {
this.showEditBar = b
this.$emit("showEditBarH", b);
},
fullChoice() {
this.$refs.follow.fullChoice()
},
noChoice() {
this.$refs.follow.noChoice()
},
deleteCollect() {
this.$refs.follow.deleteCollect()
}
}
}
</script>
<style lang="scss" scoped>
.body {
background: white;
width: 100%;
height: 100%;
}
.tabContainer {
position: absolute;
margin-top: 30rpx;
width: 400rpx;
left: 50%;
margin-left: -200rpx;
.v-tabs {
height: 70rpx;
}
}
.swiper {
height: 100%;
}
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<view class="body">
推荐
</view>
</template>
<script>
import common from '@/mixins/common';
import {
base64Compress,
imageCompress,
getToLocal
} from "@/utils/utils.js"
import {
navigateTo,
message,
alert,
loading
} from '@/utils/fun.js';
import {
openUrl
} from '@/utils/app+.js';
const app = getApp();
export default {
name: 'index',
mixins: [common],
data() {
return {
showlip: false
};
},
methods: {
show() {
// if (this.$refs.paging != null) {
// this.$refs.paging.refresh();
// }
},
loadData() {
this.post({
url: '/app/getVideoConfig',
data: {
session: app.globalData.token
},
showLoading: false,
success: ({
data
}) => {
// this.$refs.paging.complete(data.color);
// this.videoConfig = data
// this.dataList = data.color
// this.currentIndex = 0
// this.videoUrl = data.topVideo
// this.runingVideo = data.runingVideo
// this.currentImageUrl =
// 'https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg_companionx/ic_main_none_icon.png'
// this.jobId = ''
// this.isUpImg = false
// if (this.videoContext == '') {
// this.videoContext = uni.createVideoContext('homeVideo', this)
// }
// this.playVideo()
}
});
},
downloadApp() {
if (app.globalData.userInfo) {
openUrl(app.globalData.downUrl);
} else {
// navigateTo('user/login', {
// redirect: "index"
// });
}
}
}
};
</script>
<style lang="scss" scoped>
.body {
background-color: white;
}
</style>
<template>
<view class="body">
<status-title :showBack="true">每日签到</status-title>
<z-paging class="mt-30" ref="paging" v-model="dataList" @query="queryList" :loading-more-enabled="false">
<view class="sign-top flex">
<view class="flex1">
<u-text text="签到领大礼" size="22" bold></u-text>
<u-gap height="6"></u-gap>
<u-text text="连续签到365天免费拿全身玩偶~" size="16"></u-text>
</view>
<image mode="widthFix" src="../../static/sign/ic_sign_top.png"></image>
</view>
<view class="sign-wrap flex1">
<view class="flex">
<image mode="widthFix" style="width: 30rpx;margin-right: 10rpx;"
src="../../static/sign/ic_sign_prefix.png"></image>
<u-text text="达成以下任务即可完成签到:" color="#2D2D2D"></u-text>
</view>
<view class="item flex" v-for="(item, i) in dataList" :key="i">
<view class="flex1">
<view>杀戮空间的</view>
<u-line-progress class="mt-10" percentage="30" activeColor="#77CF8B" :showText="false">
</u-line-progress>
</view>
<view class="btn">去参与</view>
</view>
</view>
<view class="sign-wrap">
<u-text size="22" bold :text="signDay" align="center"></u-text>
</view>
</z-paging>
</view>
</template>
<script>
import common from '@/mixins/common';
import {
navigateTo,
} from '@/utils/fun.js';
export default {
mixins: [common],
data() {
return {
signDay: "已连续签到-天",
dataList: [0, 1],
dataList2: []
}
},
methods: {
queryList(page, size) {
}
}
}
</script>
<style lang="scss">
.body {
background-color: #FFF6E4;
}
.sign-top {
width: 90%;
margin: 20rpx auto;
image {
margin-left: 30rpx;
width: 200rpx;
}
}
.sign-wrap {
padding: 20rpx;
margin: 20rpx auto;
width: 90%;
border-radius: 20rpx;
background-color: #fff;
.item {
justify-content: space-between;
align-items: center;
.btn {
background-color: #FFF6E4;
border-radius: 50rpx;
}
}
}
</style>
<template>
<view class="body">
<status-title :showBack="true"></status-title>
<image class="bgImage" :src="bgImgUrl"></image>
<view class="btn-wrap">
<button v-show="id==0" class="btn" @click="myShare" open-type="share">立即分享</button>
<u-gap :customStyle="id==0?'width:60rpx;':'width:0;'"></u-gap>
<button class="btn" @click="contact">咨询客服</button>
</view>
</view>
</template>
<script>
import {
redirectTo
} from '@/utils/fun.js';
import common from '@/mixins/common';
const app = getApp();
export default {
name: 'loading',
mixins: [common],
data() {
return {
id: '',
bgImgUrl: ''
}
},
onLoad(options) {
this.id = options.id;
if (this.id == 0) {
// 个人推广
this.bgImgUrl = 'https://mints-sh.oss-cn-shanghai.aliyuncs.com/system/ww/1671448082782.jpeg'
} else if (this.id == 1) {
// 成为代理
this.bgImgUrl = 'https://mints-sh.oss-cn-shanghai.aliyuncs.com/system/ww/1671620564204.jpeg'
} else if (this.id == 2) {
// 体验馆合作
this.bgImgUrl = 'https://mints-sh.oss-cn-shanghai.aliyuncs.com/system/ww/1671617578957.jpeg'
}
},
methods: {
myShare() {
// wx.downloadFile({
// url: this.bgImgUrl,
// success: (res) => {
// wx.showShareImageMenu({
// path: res.tempFilePath
// })
// }
// })
},
contact() {
// 联系我们
this.post({
url: '/app/customerServiceNumbers',
showLoading: false,
success: ({
data
}) => {
let datas = data.customerServiceNumbers.split(',')
let corpid = datas[0]
let curl = datas[1]
wx.openCustomerServiceChat({
extInfo: {
url: curl
},
corpId: corpid,
success(res) {},
fail(e) {
console.log(e)
}
})
}
});
},
}
};
</script>
<style lang="scss">
.body {
background-color: white;
position: relative;
}
.bgImage {
position: absolute;
width: 100%;
height: 100%;
}
.btn-wrap {
left: 50%;
margin-left: -250rpx;
width: 500rpx;
position: absolute;
bottom: 50rpx;
display: flex;
flex-direction: row;
}
.btn {
width: 220rpx;
height: 80rpx;
line-height: 72rpx;
text-align: center;
font-size: 34rpx;
font-weight: 700;
border: solid 4rpx #191919;
background-color: #fff;
color: #191919;
border-radius: 100rpx;
}
</style>
This diff is collapsed.
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