月兑活动修改为红色

This commit is contained in:
2023-07-14 16:42:17 +08:00
parent ebb9575bd0
commit f74b177f6d
24 changed files with 2969 additions and 2130 deletions

237
App.vue
View File

@@ -1,123 +1,116 @@
<script>
var QQMapWX = require("./utils/qqmap-wx-jssdk.min.js");
var qqmapsdk;
import { config } from '@/apis/interfaces/wxJSDK'
export default {
onLaunch() {
// config({
// list : ["requestPayment", "updateAppMessageShareData"],
// url : location.href.split('#')[0]
// }).then(res=>{
// this.$wx.config(res)
// })
this.qqmapsdk = new QQMapWX({
key: '4KYBZ-LCAKF-QWOJN-NIDNZ-FZHLZ-2XFW7'
}); // 版本更新提示
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
},
globalData:{
envType : '',
shareObj : {
type : '',
goodsId : '',
userId : ''
}
}
}
</script>
<style>
/*每个页面公共css */
page {
background-color: #f3f3f3;
}
/* 文字截取 */
.nowrap {
max-width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.nowrap-multi {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* 水平居中 */
.pack-center {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-pack: center;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
}
/* 页面信息提醒 */
.pages-hint {
text-align: center;
color: #747788;
font-size: 28rpx;
background: white;
}
.pages-hint image {
width: 188rpx;
height: 188rpx;
}
/* 上拉加载 */
.pagesLoding{
text-align: center;
line-height: 90rpx;
color: gray;
}
.pagesLoding-icon{
width: 28rpx;
height: 28rpx;
vertical-align: middle;
margin-right: 10rpx;
margin-bottom: 3rpx;
}
/* 下边框 */
.uni-border-top,
.uni-border-bottom {
position: relative;
}
.uni-border-top::after,
.uni-border-bottom::after {
position: absolute;
content: '';
left: 0;
width: 100%;
height: 2rpx;
background: #f3f3f3;
}
.uni-border-top::after {
top: 0;
}
.uni-border-bottom::after {
bottom: 0;
}
<script>
var QQMapWX = require("./utils/qqmap-wx-jssdk.min.js");
var qqmapsdk;
import { config } from '@/apis/interfaces/wxJSDK'
export default {
onLaunch() {
this.qqmapsdk = new QQMapWX({
key: '4KYBZ-LCAKF-QWOJN-NIDNZ-FZHLZ-2XFW7'
}); // 版本更新提示
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
},
globalData:{
envType : '',
shareObj : {
type : '',
goodsId : '',
userId : ''
}
}
}
</script>
<style>
/*每个页面公共css */
page {
background-color: #f3f3f3;
}
/* 文字截取 */
.nowrap {
max-width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.nowrap-multi {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* 水平居中 */
.pack-center {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-pack: center;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
}
/* 页面信息提醒 */
.pages-hint {
text-align: center;
color: #747788;
font-size: 28rpx;
background: white;
}
.pages-hint image {
width: 188rpx;
height: 188rpx;
}
/* 上拉加载 */
.pagesLoding{
text-align: center;
line-height: 90rpx;
color: gray;
}
.pagesLoding-icon{
width: 28rpx;
height: 28rpx;
vertical-align: middle;
margin-right: 10rpx;
margin-bottom: 3rpx;
}
/* 下边框 */
.uni-border-top,
.uni-border-bottom {
position: relative;
}
.uni-border-top::after,
.uni-border-bottom::after {
position: absolute;
content: '';
left: 0;
width: 100%;
height: 2rpx;
background: #f3f3f3;
}
.uni-border-top::after {
top: 0;
}
.uni-border-bottom::after {
bottom: 0;
}
</style>

42
main.js
View File

@@ -1,22 +1,24 @@
import Vue from 'vue'
import App from './App'
import store from './store'
import { VueJsonp } from 'vue-jsonp'
Vue.config.productionTip = false
// Vue.config.ignoredElements = ['wx-open-subscribe']
Vue.prototype.$store = store
import Vue from 'vue'
import App from './App'
import store from './store'
import { VueJsonp } from 'vue-jsonp'
Vue.config.productionTip = false
// Vue.config.ignoredElements = ['wx-open-subscribe']
Vue.config.ignoredElements = [ ...Vue.config.ignoredElements, 'wx-open-launch-weapp' ]
Vue.prototype.$store = store
Vue.prototype.$wx = require('jweixin-module')
App.mpType = 'app'
// jsonp
Vue.use(VueJsonp)
const app = new Vue({
...App
})
App.mpType = 'app'
// jsonp
Vue.use(VueJsonp)
const app = new Vue({
...App
})
app.$mount()

View File

@@ -1,5 +1,5 @@
{
"name" : "本时生活H5",
"name" : " ",
"appid" : "__UNI__8D6D53E",
"description" : "",
"versionName" : "1.0.0",
@@ -101,6 +101,6 @@
}
}
},
"title" : "本时生活"
"title" : ""
}
}

53
package-lock.json generated
View File

@@ -2,15 +2,68 @@
"requires": true,
"lockfileVersion": 1,
"dependencies": {
"encoding": {
"version": "0.1.13",
"resolved": "https://registry.npmmirror.com/encoding/-/encoding-0.1.13.tgz",
"integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
"requires": {
"iconv-lite": "^0.6.2"
}
},
"iconv-lite": {
"version": "0.6.3",
"resolved": "https://registry.npmmirror.com/iconv-lite/-/iconv-lite-0.6.3.tgz",
"integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
"requires": {
"safer-buffer": ">= 2.1.2 < 3.0.0"
}
},
"is-stream": {
"version": "1.1.0",
"resolved": "https://registry.npmmirror.com/is-stream/-/is-stream-1.1.0.tgz",
"integrity": "sha512-uQPm8kcs47jx38atAcWTVxyltQYoPT68y9aWYdV6yWXSyW8mzSat0TL6CiWdZeCdF3KrAvpVtnHbTv4RN+rqdQ=="
},
"jweixin-module": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/jweixin-module/-/jweixin-module-1.6.0.tgz",
"integrity": "sha512-dGk9cf+ipipHmtzYmKZs5B2toX+p4hLyllGLF6xuC8t+B05oYxd8fYoaRz0T30U2n3RUv8a4iwvjhA+OcYz52w=="
},
"node-fetch": {
"version": "1.7.3",
"resolved": "https://registry.npmmirror.com/node-fetch/-/node-fetch-1.7.3.tgz",
"integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==",
"requires": {
"encoding": "^0.1.11",
"is-stream": "^1.0.1"
}
},
"safer-buffer": {
"version": "2.1.2",
"resolved": "https://registry.npmmirror.com/safer-buffer/-/safer-buffer-2.1.2.tgz",
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"vue-jsonp": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/vue-jsonp/-/vue-jsonp-2.0.0.tgz",
"integrity": "sha512-Mzd9GNeuKP5hHFDWZNMWOsCuMILSkA6jo2l4A02wheFz3qqBzH7aSEFTey1BRCZCLizlaf1EqJ5YUtF392KspA=="
},
"weixin-js-sdk": {
"version": "1.6.0",
"resolved": "https://registry.npmmirror.com/weixin-js-sdk/-/weixin-js-sdk-1.6.0.tgz",
"integrity": "sha512-3IYQH7aalJGFJrwdT3epvTdR1MboMiH7vIZ5BRL2eYOJ12BNah7csoMkmSZzkq1+l92sSq29XdTCVjCJoK2sBQ=="
},
"wxjssdk": {
"version": "1.0.1",
"resolved": "https://registry.npmmirror.com/wxjssdk/-/wxjssdk-1.0.1.tgz",
"integrity": "sha512-tY69YisKIiG6jT0cnTIwTvK4I6ivF8iWXyq5tmgVULiyKPRAWRDEIwhWUdHi7NljN9PQeLOZudUaiIq4gGfefA==",
"requires": {
"node-fetch": "^1.6.3"
}
},
"wxjssdk-copy": {
"version": "1.4.1",
"resolved": "https://registry.npmmirror.com/wxjssdk-copy/-/wxjssdk-copy-1.4.1.tgz",
"integrity": "sha512-wTLfNrT7vIzsO4/YdalRCvErq/wD7pST1TOvWnOf00LvGHwqPcrm4ka3pYP0sI6sXDgfJh4HbjIcPgQTb20Gcg=="
}
}
}

1448
pages.json

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,751 @@
<template>
<view class="content">
<view class="content-border">
<view v-for="(item, idx) in adverts" :key="item.cover">
<image class="campusBanner" :src="item.cover" mode="widthFix"></image>
</view>
<view class="recommend"></view>
<!-- tab -->
<view class="indexTab">
<view class="indexTab-item" :class="{active : tabType == item.used}" @tap="orderTab" v-for="(item, index) in tabList" :key="index" :data-state="(item.used)">
<view class="indexTab-title">
{{ item.title }}
</view>
<view class="indexTab-number">
<block v-if="isUser">({{item.used == 0 ? '剩余' + numbers + '' : count + ''}})</block>
</view>
</view>
</view>
<!-- 可兑换 -->
<block v-if="tabType == 0">
<view v-if="isUser">
<block v-if="giftPackArr.length > 0">
<view class="film" v-for="(item, index) in giftPackArr" :key="index">
<view class="filMargin">
<view class="filmTitle">
{{item.title}}
</view>
<view class="filmList">
<view class="filmList-top">
<view class="filmList-top-name">
{{ item.two_title || '-' }}<text>{{ item.description || '-'}}</text>
</view>
<view class="filmList-top-price" @click="judgeGeneral(item.activity_month_category_id, item.is_choose)">
<text>立即</text>
<text>兑换</text>
</view>
</view>
<view class="filmList-text">
<text>{{ item.name }}</text>
</view>
<view class="filmList-tips">兑换前请仔细阅读详细信息</view>
<view class="filmList-more" @click="moreClick(index)">详细信息<image src="/static/icon/giftPack-icon-yellow.png" class="filmList-more-icon" :class="{active: item.schemesShow }" mode="aspectFill"></image></view>
<view class="filmList-show" v-if="item.schemesShow">
<rich-text :nodes="item.content"></rich-text>
</view>
</view>
</view>
</view>
</block>
<!-- 列表为空 -->
<view class="campusTips" v-else>
<view class="campusTips-cont">
<image src="/static/img/giftPack-null.png" mode="aspectFill"></image>
<view>暂无权益</view>
</view>
</view>
</view>
<view class="campusTips" v-else>
<view class="campusTips-cont">
<image src="/static/img/giftPack-null.png"></image>
<view>请您先登录进行权益查看~</view>
<navigator hover-class="none" url="/pages/giftPack/signin" class="campusTips-cont-go">立即登录</navigator>
</view>
</view>
</block>
<!-- 已兑换 -->
<block v-if="tabType == 1">
<view v-if="isUser">
<block v-if="couponArr.length > 0">
<view class="coupon" v-for="(item, index) in couponArr" :key="index">
<view class="couponItem">
<view class="couponItem-cont">
<view class="couponItem-top">
<view class="couponItem-cont-number">
<text>{{item.price}}</text>
</view>
<view class="couponItem-cont-name">
<view class="nowrap couponItem-cont-title">
{{item.name}}
</view>
<view class="couponItem-cont-show" @click="moreCoupon(index)">
详细信息<image src="/static/icon/giftPack-icon.png" class="couponItem-cont-icon" :class="{active: item.couponShow }" mode="aspectFill"></image>
</view>
</view>
</view>
<navigator class="couponItem-btn" hover-class="none" :url="'/pages/giftPack/details?id=' + item.id">
立即使用
</navigator>
</view>
<view class="couponItem-cont-text" v-if="item.couponShow">
<rich-text :nodes="item.remark"></rich-text>
</view>
</view>
</view>
</block>
<!-- 列表为空 -->
<view class="campusTips" v-else>
<view class="campusTips-cont">
<image src="/static/img/giftPack-null.png"></image>
<view>可使用的权益暂时没有啦~</view>
<navigator hover-class="none" url="/pages/giftPack/myCoupon" class="campusTips-cont-go">我的优惠券</navigator>
</view>
</view>
</view>
<view class="campusTips" v-else>
<view class="campusTips-cont">
<image src="/static/img/giftPack-null.png"></image>
<view>请您先登录进行优惠券查看~</view>
<navigator hover-class="none" url="/pages/giftPack/signin" class="campusTips-cont-go">立即登录</navigator>
</view>
</view>
</block>
</view>
<!-- 按钮 -->
<view class="campusBtn">
<navigator url="/pages/giftPack/index" hover-class="none" class="campusBtn-go active">
<image class="campusBtn-iocn" src="/static/img/giftPack-user00_active.png" mode="widthFix"></image>
<view class="campusBtn-name">
活动首页
</view>
</navigator>
<navigator url="/pages/giftPack/user" hover-class="none" class="campusBtn-go">
<image class="campusBtn-iocn" src="/static/img/giftPack-user01.png" mode="widthFix"></image>
<view class="campusBtn-name">
个人中心
</view>
</navigator>
</view>
<!-- 是否兑换弹出 -->
<view class="tipsBack" v-if="generalShow"></view>
<view class="tipsCont" v-if="generalShow">
<view class="tipsWhite">
<image class="tipsCont-img" src="/static/img/dhImg.png" mode="widthFix"></image>
<view class="tipsWhite-top">
<view class="tipsWhite-name">
兑换权益提示
</view>
<view class="tipsWhite-text">
<text>兑换权益前请仔细阅读本权益项下的</text>
<text>详细信息确认兑换后您本月将不能</text>
<text>换取其他权益如确定请点击立即兑换</text>
</view>
</view>
<view class="tipsWhite-btn">
<view class="tipsWhite-btn-go" @click="generalShow = false">
暂不兑换
</view>
<view class="tipsWhite-btn-go" @click="payment">
立即兑换
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { index, coupon, monthsChoose } from '@/apis/interfaces/giftPack'
export default {
data() {
return {
isUser : false, // 用户是否登录
giftPackArr : [],
adverts : [],
couponArr : [],
numbers : '',
count : '',
//Tab列表
tabList : [
{ title : "可兑换", used: 0 },
{ title : "已兑换", used: 1 }
],
tabType : 0, //卡券状态
generalId : '', //卡券id
generalShow : false //卡券兑换提示
}
},
// 生命周期函数--监听页面加载
onLoad(options) {},
// 生命周期函数--监听页面显示
onShow() {
// 存储环境-月兑活动
getApp().globalData.envType = 'giftPEnv'
if(uni.getStorageSync("token")) {
this.isUser = true
}
// 获取首页数据
this.indexInfo()
},
methods: {
// 首页数据
indexInfo() {
if(this.tabType == 0) {
// 获取首页数据
index().then(res=>{
var listData = res.categories
for(let val in listData){
listData[val].schemesShow = false
}
console.log(listData)
this.giftPackArr = listData
this.numbers = res.numbers
this.count = res.coupons_count
this.adverts = res.adverts
}).catch(err=>{})
} else {
if(uni.getStorageSync("token")) {
// 获取优惠券数据
coupon().then(res=>{
var listData = res.data
for(let val in listData){
listData[val].couponShow = false
}
this.couponArr = listData
}).catch(err=>{})
}
}
},
// 处理未登录时的转跳
userNav(url){
let pageUrl = url
if(uni.getStorageSync("token")) {
uni.navigateTo({
url: pageUrl
})
return
}
// 去登录
uni.navigateTo({
url: '/pages/giftPack/signin'
})
},
// tabs 选项卡
orderTab(e){
let state = e.currentTarget.dataset.state
this.tabType = state
// 获取首页数据
this.indexInfo();
},
// 可兑换信息展开
moreClick(index) {
this.giftPackArr[index].schemesShow = !this.giftPackArr[index].schemesShow
},
// 已兑换细信息展开
moreCoupon(index) {
this.couponArr[index].couponShow = !this.couponArr[index].couponShow
},
// 兑换按钮
judgeGeneral(id, can) {
this.generalId = id
if(!can) {
this.generalShow = !this.generalShow
return
}
uni.navigateTo({
url: '/pages/giftPack/list?id=' + id
})
},
// 兑换跳转
payment(){
monthsChoose(this.generalId).then(res=>{
this.generalShow = false
uni.navigateTo({
url: '/pages/giftPack/list?id=' + this.generalId
})
}).catch(err=>{})
}
}
}
</script>
<style lang="scss" scoped>
.content {
background: linear-gradient(to bottom, #fdf5cc, #cbaf7f);
padding-bottom: 40rpx;
height: 100vh;
overflow-y: scroll;
box-sizing: border-box
}
.content-border {
border-bottom: 130rpx transparent solid;
}
// banner
.campusBanner {
width: 100%;
}
// 推荐
.recommend {
overflow: hidden;
margin-top: -60rpx;
padding: 0 30rpx;
box-sizing: border-box;
.recommend-label {
text-align: center;
width: calc(50% - 20rpx);
float: left;
margin: 0 10rpx 30rpx;
.recommend-label-img {
width: 150rpx;
height: 150rpx;
margin: 0 auto 10rpx;
background: linear-gradient(to bottom, #293350, #484e74);
box-shadow: 0px 8px 6px rgba(249,228,129,.5);
border-radius: 50%;
box-sizing: border-box;
image {
width: 80rpx;
height: 80rpx;
margin: 35rpx;
}
}
.recommend-label-text {
text {
display: block;
font-size: 30rpx;
}
}
}
}
// 列表
.film {
width: 100%;
padding: 0 30rpx;
box-sizing: border-box;
}
.filMargin {
padding: 0 0 30rpx;
}
.filmTitle {
background: linear-gradient(to right, #feefce, #fbe9c0, #e8d19b);
line-height: 80rpx;
box-shadow: -4px 0 10px rgba(134,97,33,.2);
text-align: center;
border-radius: 10rpx 10rpx 0 0;
color: #a47d53;
margin: 0 20rpx;
}
.filmList {
position: relative;
background: linear-gradient(to right, #494e75, #27314d);
box-shadow: 0px 6px 10px rgba(134,97,33,.5);
border-radius: 10rpx;
padding: 50rpx 30rpx 30rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
overflow: hidden;
&:last-child {
margin-bottom: 0;
}
.filmList-tag {
transform: rotate(45deg);
position: absolute;
padding: 10px 0;
right: -33px;
top: -10px;
width: 150px;
background: red;
.filmList-tag-text {
position: absolute;
color: #FFFFFF;
right: 20px;
text-align: center;
top: 2px;
font-size: 12px;;
transform:rotate(-360deg);
}
}
.filmList-more {
font-size: 26rpx;
text-align: left;
color: #fce2ae;
margin-top: 15rpx;
line-height: 40rpx;
.filmList-more-icon {
width: 34rpx;
height: 34rpx;
vertical-align: -6rpx;
margin-left: 5rpx;
transition: .2s;
&.active {
transform:rotate(-180deg);
}
}
}
.filmList-show {
font-size: 24rpx;
border-radius: 10rpx;
background-color: rgba(255,255,255,.1);
padding: 20rpx;
box-sizing: border-box;
margin-top: 20rpx;
opacity: .9;
color: #fce2ae;
text-align: justify;
line-height: 42rpx;
text {
display: block;
}
}
.filmList-top {
display: flex;
margin-bottom: 10rpx;
.filmList-top-name {
width: calc(100% - 140rpx);
margin-right: 20rpx;
color: #fce2ae;
font-size: 32rpx;
margin-top: 10rpx;
text {
display: block;
font-size: 25rpx;
margin-top: 15rpx;
}
}
.filmList-top-price {
position: relative;
background: linear-gradient(to right, #d3ad68, #cda65f);
box-shadow: 0px 2px 10px rgba(249,228,129,.5);
width: 120rpx;
height: 120rpx;
border-radius: 50%;
color: #FFFFFF;
text-align: center;
padding-top: 20rpx;
font-size: 30rpx;
box-sizing: border-box;
&.active {
background: linear-gradient(to right, #a1a1a1, #a1a1a1);
}
text {
display: block;
text-shadow: 0px 6px 10px rgba(134,97,33,.5);
}
.filmList-tag{
position: absolute;
background: #ff0000;
color: white;
font-size: 20rpx;
top: -10%;
left: 20%;
width: 120rpx;
padding: 0 10rpx;
line-height: 40rpx;
border-radius: 15rpx;
transform: scale(0.58)
}
}
}
.filmList-text {
font-size: 20rpx;
color: #c1c1c1;
// margin-left: -70rpx;
text {
display: block;
// transform: scale(0.8)
}
}
.filmList-tips {
font-size: 24rpx;
color: #c1c1c1;
margin-top: 30rpx;
}
}
// 已兑换
.coupon {
padding: 0 30rpx 10rpx;
box-sizing: border-box;
.couponItem {
margin-bottom: 30rpx;
.couponItem-cont {
background-color: #caa668;
border-radius: 10rpx;
position: relative;
height: 140rpx;
overflow: hidden;
.couponItem-top {
padding: 30rpx 20rpx;
box-sizing: border-box;
position: absolute;
left: 0;
top: 0;
height: 100%;
background-image: linear-gradient(to right, #fffbf5, #f2e2cc);
width: calc(100% - 160rpx);
display: flex;
border-radius: 0 15rpx 15rpx 0;
.couponItem-cont-number {
width: 100rpx;
line-height: 84rpx;
color: #a85920;
text {
font-size: 54rpx;
}
}
.couponItem-cont-name {
color: #72411f;
padding-left: 40rpx;
box-sizing: border-box;
width: calc(100% - 100rpx);
position: relative;
&::after {
position: absolute;
content: '';
left: 13rpx;
top: 10%;
background-color: #ecd5c1;
width: 2rpx;
height: 80%;
}
.couponItem-cont-title {
font-size: 30rpx;
}
.couponItem-cont-show {
display: flex;
font-size: 26rpx;
padding-top: 13rpx;
.couponItem-cont-icon {
width: 34rpx;
height: 34rpx;
vertical-align: -6rpx;
margin-left: 5rpx;
transition: .2s;
&.active {
transform:rotate(-180deg);
}
}
}
}
}
.couponItem-btn {
line-height: 140rpx;
position: absolute;
right: 0;
top: 0;
width: 160rpx;
height: 100%;
text-align: center;
color: #FFFFFF;
font-size: 30rpx;
}
}
.couponItem-cont-text {
background-image: linear-gradient(-20deg, #fffbf5, #fbefdf);
padding: 30rpx;
box-sizing: border-box;
color: #bc8863;
line-height: 48rpx;
font-size: 24rpx;
margin-top: -4rpx;
text-align: justify;
border-radius: 0 0 15rpx 15rpx;
}
}
}
// 按钮
.campusBtn {
text-align: center;
color: #FFFFFF;
background-color: #fff;
display: flex;
position: fixed;
width: 100%;
height: 130rpx;
z-index: 999;
left: 0;
bottom: 0;
font-size: 28rpx;
.campusBtn-go {
flex: 2;
padding-top: 20rpx;
.campusBtn-iocn {
width: 44rpx;
}
.campusBtn-name {
color: #abaeb2;
}
&.active .campusBtn-name {
color: #2b3452;
}
}
}
// tab
.indexTab {
display: flex;
margin-bottom: 30rpx;
.indexTab-item {
text-align: center;
font-size: 34rpx;
flex: 2;
padding-bottom: 20rpx;
position: relative;
color: #8c919f;
&::after {
position: absolute;
content: '';
left: calc(50% - 20rpx);
bottom: 0;
width: 40rpx;
height: 8rpx;
background-color: transparent;
border-radius: 40rpx;
}
&.active::after {
background-color: #27314d;
}
&.active {
color: #27314d;
font-weight: 600;
}
.indexTab-title,
.indexTab-number {
display: inline-block;
}
}
}
.campusTips {
padding: 30rpx;
box-sizing: border-box;
.campusTips-cont {
background-color: #fff;
border-radius: 20rpx;
text-align: center;
padding: 80rpx;
box-sizing: border-box;
color: #9c7557;
image {
width: 340rpx;
height: 280rpx;
margin-bottom: 30rpx;
}
.campusTips-cont-go {
display: inline-block;
border: #9c7557 2rpx solid;
line-height: 66rpx;
padding: 0 40rpx;
margin-top: 30rpx;
font-size: 28rpx;
border-radius: 90rpx;
}
}
}
// 是否兑换弹出
.tipsBack {
position: fixed;
width: 100vw;
height: 100vh;
left: 0;
top: 0;
z-index: 9;
background-color: rgba(0, 0, 0, .8);
}
.tipsCont {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-pack: center;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 10;
padding: 0 10%;
box-sizing: border-box;
text-align: center;
}
.tipsWhite {
background-color: #ffffff;
border-radius: 20rpx;
overflow: hidden;
}
.tipsWhite-top {
padding: 30rpx;
box-sizing: border-box;
text-align: center;
}
.tipsCont-img {
width: 40%;
margin-top: 30rpx;
}
.tipsWhite-name {
text-align: center;
color: #111111;
font-size: 34rpx;
font-weight: 600;
margin-bottom: 15rpx;
}
.tipsWhite-text {
font-size: 26rpx;
color: #666666;
line-height: 48rpx;
text {
display: block;
}
}
.tipsWhite-btn {
display: flex;
padding: 20rpx 10rpx 30rpx;
box-sizing: border-box;
.tipsWhite-btn-go {
flex: 2;
color: #fff;
margin: 0 15rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border: 2rpx solid #F6F6F6;
background-color: #27314d;
border-radius: 10rpx;
&:first-child {
color: #333333;
background-color: #ffffff;
border: 2rpx solid #cccccc;
}
}
}

View File

@@ -22,7 +22,7 @@
<view v-if="isUser">
<block v-if="giftPackArr.length > 0">
<view class="film" v-for="(item, index) in giftPackArr" :key="index">
<view v-if="item.can.buy" class="filMargin">
<view class="filMargin">
<view class="filmTitle">
{{item.title}}
</view>
@@ -31,7 +31,7 @@
<view class="filmList-top-name">
{{ item.two_title || '-' }}<text>{{ item.description || '-'}}</text>
</view>
<view class="filmList-top-price" :class="{active : !item.can.buy}" @click="judgeGeneral(item.activity_month_category_id)">
<view class="filmList-top-price" @click="judgeGeneral(item.activity_month_category_id, item.is_choose)">
<text>立即</text>
<text>兑换</text>
</view>
@@ -210,6 +210,8 @@
for(let val in listData){
listData[val].schemesShow = false
}
console.log(listData)
this.giftPackArr = listData
this.numbers = res.numbers
this.count = res.coupons_count
@@ -265,9 +267,9 @@
},
// 兑换按钮
judgeGeneral(id) {
judgeGeneral(id, can) {
this.generalId = id
if(this.numbers != 0) {
if(!can) {
this.generalShow = !this.generalShow
return
}
@@ -291,7 +293,7 @@
<style lang="scss" scoped>
.content {
background: linear-gradient(to bottom, #fdf5cc, #cbaf7f);
background: linear-gradient(to bottom, #fff9f9, #fff9f9);
padding-bottom: 40rpx;
height: 100vh;
overflow-y: scroll;
@@ -349,18 +351,18 @@
.filMargin {
padding: 0 0 30rpx;
}
.filmTitle {
.filmTitle {
background: linear-gradient(to right, #fce1d6, #fce1d6);
line-height: 80rpx;
box-shadow: -4px 0 10px rgba(134,97,33,.2);
text-align: center;
border-radius: 10rpx 10rpx 0 0;
border-radius: 10rpx 10rpx 0 0;
color: #ea7e4d;
margin: 0 20rpx;
}
.filmList {
position: relative;
background: linear-gradient(to right, #494e75, #27314d);
position: relative;
background: linear-gradient(to right, #f1824a, #fdbe71);
box-shadow: 0px 6px 10px rgba(134,97,33,.1);
border-radius: 10rpx;
padding: 50rpx 30rpx 30rpx;
@@ -390,7 +392,7 @@
}
.filmList-more {
font-size: 26rpx;
text-align: left;
text-align: left;
color: #ffedc8;
margin-top: 15rpx;
line-height: 40rpx;
@@ -412,7 +414,7 @@
padding: 20rpx;
box-sizing: border-box;
margin-top: 20rpx;
opacity: .9;
opacity: .9;
color: #ffedc8;
text-align: justify;
line-height: 42rpx;
@@ -425,7 +427,7 @@
margin-bottom: 10rpx;
.filmList-top-name {
width: calc(100% - 140rpx);
margin-right: 20rpx;
margin-right: 20rpx;
color: #fff6f6;
font-size: 32rpx;
margin-top: 10rpx;
@@ -436,12 +438,11 @@
}
}
.filmList-top-price {
position: relative;
background: linear-gradient(to right, #d3ad68, #cda65f);
position: relative;
background: linear-gradient(to right, #fff9f9, #fff9f9);
width: 120rpx;
height: 120rpx;
border-radius: 50%;
border-radius: 50%;
color: #fa803f;
text-align: center;
padding-top: 20rpx;
@@ -451,7 +452,6 @@
background: linear-gradient(to right, #a1a1a1, #a1a1a1);
}
text {
display: block;
display: block;
}
.filmList-tag{
@@ -479,7 +479,7 @@
}
}
.filmList-tips {
font-size: 24rpx;
font-size: 24rpx;
color: #ffedc8;
margin-top: 30rpx;
}
@@ -599,7 +599,7 @@
.campusBtn-name {
color: #abaeb2;
}
&.active .campusBtn-name {
&.active .campusBtn-name {
color: #f55249;
}
}
@@ -626,10 +626,10 @@
background-color: transparent;
border-radius: 40rpx;
}
&.active::after {
&.active::after {
background-color: #f55249;
}
&.active {
&.active {
color: #f55249;
font-weight: 600;
}
@@ -710,7 +710,7 @@
}
.tipsWhite-name {
text-align: center;
text-align: center;
color: #f55249;
font-size: 34rpx;
font-weight: 600;
@@ -737,7 +737,7 @@
height: 80rpx;
line-height: 80rpx;
text-align: center;
border: 2rpx solid #F6F6F6;
border: 2rpx solid #F6F6F6;
background-color: #f55249;
border-radius: 10rpx;
&:first-child {

View File

@@ -1,13 +1,13 @@
<template>
<template>
<view class="content">
<view class="campus-header">
<view class="logo">
<image src="/static/img/campus_logo.jpg" mode="aspectFill"></image>
<image src="/static/img/campusLogin_logo.png" mode="aspectFill"></image>
<view class="title">身份验证</view>
</view>
<image class="cover" src="/static/img/campusLogin_back_01.png" mode="aspectFill"></image>
<image class="cover" src="/static/img/campusLogin_back_red.png" mode="aspectFill"></image>
</view>
<view class="campus-cont">
<view class="campus-cont">
<form @submit="forgetlogin">
<view class="campus-inputs">
<input class="campus-form-input" type="number" placeholder="请输入手机号" @input="getNameValue" name="mobile"></input>
@@ -16,86 +16,86 @@
<input class="campus-form-input" type="number" placeholder="请输入验证码" @input="getCodeValue" maxlength="4"></input>
<button class="campus-form-code" @tap="getCode" :disabled="disabled" hover-class="none">{{ codename }}</button>
</view>
<button class="campus-form-btn" form-type="submit">设置新密码</button>
<button class="campus-form-btn" form-type="submit">设置新密码</button>
</form>
</view>
</view>
</view>
</template>
<script>
import { send, auth } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
code : '', // 验证码
disabled : false,
}
<script>
import { send, auth } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
code : '', // 验证码
disabled : false,
}
},
methods: {
// 切换登录方式
onCutLogin(){
this.passwordLogin = !this.passwordLogin
},
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo,
myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9]||16[0-9])\d{8}$$/
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else if (!myreg.test(mobileNo)) {
uni.showToast({
title : '请输入正确的手机号',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
},
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo,
myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9]||16[0-9])\d{8}$$/
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else if (!myreg.test(mobileNo)) {
uni.showToast({
title : '请输入正确的手机号',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
forgetlogin(e){
let mobileNo = e.detail.value.mobile || '',
let mobileNo = e.detail.value.mobile || '',
code = this.code || ''
auth({
@@ -113,23 +113,25 @@
icon : 'none'
})
})
}
}
}
}
}
</script>
<style lang="scss">
.content{
min-height: 100vh;
background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
// background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
background-image: linear-gradient(to top right, #fff9f9, #fff9f9);
}
.campus-cont{
padding: 40rpx 60rpx;
.campus-inputs{
position: relative;
padding-left: 30rpx;
padding-right: 30rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
padding-right: 30rpx;
background-image: linear-gradient(to right, #f4eeee, #f4eeee);
// background-image: linear-gradient(to right, #575a85, #252f4b);
height: 90rpx;
line-height: 90rpx;
border-radius: 45rpx;
@@ -147,7 +149,7 @@
font-size: 30rpx;
height: 90rpx;
line-height: 90rpx;
color: white;
color: #f25448;
&::after{
border: none;
}
@@ -166,7 +168,7 @@
}
.campus-form-input{
height: 90rpx;
color: white;
color: #000000;
font-size: 32rpx;
}
@@ -181,8 +183,9 @@
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: 45rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
border-radius: 45rpx;
background-image: linear-gradient(to right, #f25448, #fe786d);
// background-image: linear-gradient(to right, #575a85, #252f4b);
font-size: 32rpx;
color: white;
}
@@ -219,7 +222,7 @@
width: 160rpx;
height: 160rpx;
vertical-align: top;
margin-bottom: 30rpx;
margin-bottom: 30rpx;
border-radius: 50%;
}
.title{

View File

@@ -2,10 +2,10 @@
<view class="content">
<view class="campus-header">
<view class="logo">
<image src="@/static/img/campus_logo.jpg" mode="aspectFill"></image>
<image src="@/static/img/campusLogin_logo.png" mode="aspectFill"></image>
<view class="title">超级红包活动用户注册</view>
</view>
<image class="cover" src="@/static/img/campusLogin_back_01.png" mode="aspectFill"></image>
<image class="cover" src="@/static/img/campusLogin_back_red.png" mode="aspectFill"></image>
</view>
<view class="campus-cont">
<form @submit="submitRegister">
@@ -29,71 +29,71 @@
</view>
</template>
<script>
import { send, register } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
<script>
import { send, register } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
code : '', // 验证码
disabled : false,
}
},
disabled : false,
}
},
methods: {
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{
uni.showToast({
title : err.message,
icon :'none',
duration: 2000
})
})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{
uni.showToast({
title : err.message,
icon :'none',
duration: 2000
})
})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
submitRegister(e){
let formValue = e.detail.value
@@ -124,15 +124,16 @@
icon : 'none'
})
})
}
}
}
}
}
</script>
<style lang="scss">
.content{
min-height: 100vh;
background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
// background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
background-image: linear-gradient(to top right, #fff9f9, #fff9f9);
}
.campus-cont{
padding: 40rpx 60rpx;
@@ -140,8 +141,9 @@
.campus-inputs{
position: relative;
padding-left: 30rpx;
padding-right: 30rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
padding-right: 30rpx;
background-image: linear-gradient(to right, #f4eeee, #f4eeee);
// background-image: linear-gradient(to right, #575a85, #252f4b);
height: 90rpx;
line-height: 90rpx;
border-radius: 45rpx;
@@ -159,7 +161,7 @@
font-size: 30rpx;
height: 90rpx;
line-height: 90rpx;
color: white;
color: #f25448;
&::after{
border: none;
}
@@ -178,7 +180,7 @@
}
.campus-form-input{
height: 90rpx;
color: white;
color: #000000;
font-size: 32rpx;
}
@@ -188,8 +190,9 @@
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: 45rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
border-radius: 45rpx;
background-image: linear-gradient(to right, #f25448, #fe786d);
// background-image: linear-gradient(to right, #575a85, #252f4b);
font-size: 32rpx;
color: white;
}
@@ -226,7 +229,7 @@
width: 160rpx;
height: 160rpx;
vertical-align: top;
margin-bottom: 30rpx;
margin-bottom: 30rpx;
border-radius: 50%;
}
.title{

View File

@@ -1,13 +1,13 @@
<template>
<template>
<view class="content">
<view class="campus-header">
<view class="logo">
<image src="@/static/img/campus_logo.jpg" mode="aspectFill"></image>
<image src="@/static/img/campusLogin_logo.png" mode="aspectFill"></image>
<view class="title">设置新密码</view>
</view>
<image class="cover" src="@/static/img/campusLogin_back_01.png" mode="aspectFill"></image>
<image class="cover" src="@/static/img/campusLogin_back_red.png" mode="aspectFill"></image>
</view>
<view class="campus-cont">
<view class="campus-cont">
<form @submit="forgetlogin">
<view class="campus-inputs">
<input class="campus-form-input" type="password" placeholder="设置新的登录密码" name="password"></input>
@@ -15,23 +15,23 @@
<view class="campus-inputs">
<input class="campus-form-input" type="password" placeholder="确认新的登录密码" name="newpassword"></input>
</view>
<button class="campus-form-btn" form-type="submit">确定</button>
<button class="campus-form-btn" form-type="submit">确定</button>
</form>
</view>
</view>
</view>
</template>
<script>
import { passSetup } from '@/apis/interfaces/auth'
export default {
data() {
return {
}
},
<script>
import { passSetup } from '@/apis/interfaces/auth'
export default {
data() {
return {
}
},
methods: {
// 立即登录
// 立即登录
forgetlogin(e){
let newPass = e.detail.value.newpassword || '',
let newPass = e.detail.value.newpassword || '',
password = e.detail.value.password || ''
passSetup({
@@ -51,15 +51,16 @@
icon : 'none'
})
})
}
}
}
}
}
</script>
<style lang="scss">
.content{
min-height: 100vh;
background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
// background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
background-image: linear-gradient(to top right, #fff9f9, #fff9f9);
}
.campus-cont{
padding: 40rpx 60rpx;
@@ -67,7 +68,8 @@
position: relative;
padding-left: 30rpx;
padding-right: 30rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
// background-image: linear-gradient(to right, #575a85, #252f4b);
background-image: linear-gradient(to right, #f4eeee, #f4eeee);
height: 90rpx;
line-height: 90rpx;
border-radius: 45rpx;
@@ -85,7 +87,7 @@
font-size: 30rpx;
height: 90rpx;
line-height: 90rpx;
color: white;
color: #f25448;
&::after{
border: none;
}
@@ -104,7 +106,7 @@
}
.campus-form-input{
height: 90rpx;
color: white;
color: #000000;
font-size: 32rpx;
}
@@ -119,8 +121,9 @@
height: 90rpx;
line-height: 90rpx;
padding: 0;
border-radius: 45rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
border-radius: 45rpx;
background-image: linear-gradient(to right, #f25448, #fe786d);
// background-image: linear-gradient(to right, #575a85, #252f4b);
font-size: 32rpx;
color: white;
}
@@ -157,7 +160,7 @@
width: 160rpx;
height: 160rpx;
vertical-align: top;
margin-bottom: 30rpx;
margin-bottom: 30rpx;
border-radius: 50%;
}
.title{

View File

@@ -1,115 +1,115 @@
<template>
<template>
<view class="content">
<view class="campus-header">
<view class="logo">
<image src="@/static/img/campus_logo.jpg" mode="aspectFill"></image>
<image src="@/static/img/campusLogin_logo.png" mode="aspectFill"></image>
<view class="title">超级红包活动登录</view>
</view>
<image class="cover" src="@/static/img/campusLogin_back_01.png" mode="aspectFill"></image>
<image class="cover" src="@/static/img/campusLogin_back_red.png" mode="aspectFill"></image>
</view>
<view class="campus-cont">
<view class="campus-cont">
<form @submit="forgetlogin">
<view class="campus-inputs">
<image class="campus-form-icon" src="/static/img/campus_login_02.png" mode="aspectFill"></image>
<!-- <image class="campus-form-icon" src="/static/img/campus_login_02.png" mode="aspectFill"></image> -->
<input class="campus-form-input" type="number" placeholder="请输入手机号" @input="getNameValue" name="mobile"></input>
</view>
<view class="campus-inputs inputs-code" v-if="!passwordLogin">
<image class="campus-form-icon" src="/static/img/campus_login_03.png" mode="aspectFill"></image>
<!-- <image class="campus-form-icon" src="/static/img/campus_login_03.png" mode="aspectFill"></image> -->
<input class="campus-form-input" type="number" placeholder="请输入验证码" @input="getCodeValue" maxlength="4"></input>
<button class="campus-form-code" @tap="getCode" :disabled="disabled" hover-class="none">{{ codename }}</button>
</view>
<view class="campus-inputs" v-else>
<image class="campus-form-icon" src="/static/img/campus_login_03.png" mode="aspectFill"></image>
<!-- <image class="campus-form-icon" src="/static/img/campus_login_03.png" mode="aspectFill"></image> -->
<input class="campus-form-input" type="password" placeholder="请输入登录密码" name="password"></input>
</view>
<view class="resPassword">
<navigator url="password">忘记密码</navigator>
</view>
<button class="campus-form-btn" form-type="submit">登录</button>
<button class="campus-form-btn" form-type="submit">登录</button>
</form>
<view class="login-box">
<view @click="onCutLogin">{{passwordLogin ? '验证码登录': '密码登录'}}</view>
<navigator url="register">快速注册</navigator>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { send, auth, passlogin } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
<script>
import { send, auth, passlogin } from '@/apis/interfaces/auth'
export default {
data() {
return {
codename : '获取验证码',
mobileNo : '', // 手机号
code : '', // 验证码
passwordLogin: true, // 登录方式
disabled : false,
}
},
passwordLogin: true, // 登录方式
disabled : false,
}
},
methods: {
// 切换登录方式
onCutLogin(){
this.passwordLogin = !this.passwordLogin
},
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo,
myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9]|16[0-9])\d{8}$$/
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else if (!myreg.test(mobileNo)) {
uni.showToast({
title : '请输入正确的手机号',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
},
// mobileNo
getNameValue(e) {
this.mobileNo = e.detail.value
},
// 获取code
getCode(){
let mobileNo = this.mobileNo,
myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9]|16[0-9])\d{8}$$/
var _this = this
if (mobileNo == "") {
uni.showToast({
title : '手机号不能为空',
icon : 'none',
duration : 1000
})
return false;
}else if (!myreg.test(mobileNo)) {
uni.showToast({
title : '请输入正确的手机号',
icon : 'none',
duration : 1000
})
return false;
}else{
send({mobile: mobileNo, channel: 'LOGIN'}).then(res=>{
uni.showToast({
title : '发送成功',
icon : 'success',
duration: 2000
})
var num = 61;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.codename = '重新发送'
_this.disabled = false
} else {
_this.codename = num + "s后重新获取"
_this.disabled = true
}
}, 1000)
}).catch(err=>{})
}
},
// 获取后输入code
getCodeValue (e) {
this.code = e.detail.value
},
// 立即登录
forgetlogin(e){
let mobileNo = e.detail.value.mobile || '',
let mobileNo = e.detail.value.mobile || '',
code = this.code || '',
password = e.detail.value.password || '',
loginFunction
@@ -138,23 +138,26 @@
icon : 'none'
})
})
}
}
}
}
}
</script>
<style lang="scss" scoped>
.content{
min-height: 100vh;
background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
min-height: 100vh;
background-image: linear-gradient(to top right, #fff9f9, #fff9f9);
// background-image: linear-gradient(to top right, #cbaf7f, #fcf4cb);
}
.campus-cont{
padding: 40rpx 60rpx;
.campus-inputs{
position: relative;
padding-left: 90rpx;
padding-left: 30rpx;
// padding-left: 90rpx;
padding-right: 30rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
background-image: linear-gradient(to right, #f4eeee, #f4eeee);
// background-image: linear-gradient(to right, #575a85, #252f4b);
height: 90rpx;
line-height: 90rpx;
border-radius: 45rpx;
@@ -172,7 +175,7 @@
font-size: 30rpx;
height: 90rpx;
line-height: 90rpx;
color: white;
color: #f25448;
&::after{
border: none;
}
@@ -191,7 +194,7 @@
}
.campus-form-input{
height: 90rpx;
color: white;
color: #000000;
font-size: 32rpx;
}
@@ -210,9 +213,10 @@
line-height: 90rpx;
padding: 0;
border-radius: 45rpx;
background-image: linear-gradient(to right, #575a85, #252f4b);
background-image: linear-gradient(to right, #f25448, #fe786d);
// background-image: linear-gradient(to right, #575a85, #252f4b);
font-size: 32rpx;
color: white;
color: #ffffff;
}
.login-box{
display: flex;
@@ -247,7 +251,7 @@
width: 160rpx;
height: 160rpx;
vertical-align: top;
margin-bottom: 30rpx;
margin-bottom: 30rpx;
border-radius: 50%;
}
.title{

View File

@@ -1,380 +1,381 @@
<template>
<view class="content">
<view class="content-border">
<view class="user">
<view class="userTop">
<view class="userTop-name" v-if="isUser">
<block v-if="userData.info"><text>用户</text>{{userData.info.username}}</block>
</view>
<navigator hover-class="none" url="/pages/giftPack/signin" class="userTop-name" v-else>请先登录</navigator>
<!-- <view class="userTop-text">感谢您参加本事礼包活动</view> -->
</view>
<view class="userItem">
<!-- <view class="userItem-label">
<view class="userItem-label-number">
<image class="userItem-label-img" src="@/static/img/giftPack-img02.png" mode="widthFix"></image><text>23</text>
</view>
<view class="userItem-label-text">总余额</view>
</view> -->
<view class="userItem-label">
<view class="userItem-label-number">
<block v-if="isUser">
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<block v-if="userData.gold"><text>{{userData.gold.balance ? userData.gold.balance : '0'}}</text></block>
</block>
<block v-else>
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<text>0</text>
</block>
</view>
<view class="userItem-label-text">可用余额</view>
</view>
<view class="userItem-label">
<view class="userItem-label-number">
<block v-if="isUser">
<image class="userItem-label-img" src="@/static/img/giftPack-img04.png" mode="widthFix"></image>
<block v-if="userData.gold"><text>{{userData.gold.overdue ? userData.gold.overdue : '0'}}</text></block>
</block>
<block v-else>
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<text>0</text>
</block>
</view>
<view class="userItem-label-text">已过期</view>
</view>
</view>
<view class="userList" @click="userNav('/pages/giftPack/logs')">
<image class="userList-img" src="@/static/img/giftPack-img05.png" mode="widthFix"></image>
<view class="userList-text">查看余额详细记录</view>
</view>
<view class="userTips">
<view class="userTips-left">
余额账户
</view>
<!-- <view class="userTips-right">
本时生活<text>·</text>礼包活动
</view> -->
</view>
<image class="userBack" src="@/static/img/giftPack-img01.png" mode="widthFix"></image>
</view>
<view class="userCoupon" @click="userNav('/pages/giftPack/myCoupon')">
<image class="userCoupon-img" src="@/static/img/giftPack-img06.png" mode="widthFix"></image>
<view class="userCoupon-cont">
<view class="userCoupon-name">我的优惠券</view>
<image class="userCoupon-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
<view class="userTool">
<view class="userTool-title">
其他功能
</view>
<view class="userTool-item" @click="userNav('/pages/giftPack/setPassword')">
<image class="userTool-img" src="@/static/img/giftPack-img08.png" mode="widthFix"></image>
<view class="userTool-cont">
<view class="userTool-name">修改密码</view>
<image class="userTool-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
<view class="userTool-item" @click="delStorage">
<image class="userTool-img" src="@/static/img/giftPack-img07.png" mode="widthFix"></image>
<view class="userTool-cont">
<view class="userTool-name">退出登录</view>
<image class="userTool-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
</view>
</view>
<!-- 按钮 -->
<view class="campusBtn">
<navigator url="/pages/giftPack/index" hover-class="none" class="campusBtn-go">
<image class="campusBtn-iocn" src="/static/img/giftPack-user00.png" mode="widthFix"></image>
<view class="campusBtn-name">
活动首页
</view>
</navigator>
<navigator url="/pages/giftPack/user" hover-class="none" class="campusBtn-go active">
<image class="campusBtn-iocn" src="/static/img/giftPack-user01_active.png" mode="widthFix"></image>
<view class="campusBtn-name">
个人中心
</view>
</navigator>
</view>
<template>
<view class="content">
<view class="content-border">
<view class="user">
<view class="userTop">
<view class="userTop-name" v-if="isUser">
<block v-if="userData.info"><text>用户</text>{{userData.info.username}}</block>
</view>
<navigator hover-class="none" url="/pages/giftPack/signin" class="userTop-name" v-else>请先登录</navigator>
<!-- <view class="userTop-text">感谢您参加本事礼包活动</view> -->
</view>
<view class="userItem">
<!-- <view class="userItem-label">
<view class="userItem-label-number">
<image class="userItem-label-img" src="@/static/img/giftPack-img02.png" mode="widthFix"></image><text>23</text>
</view>
<view class="userItem-label-text">总余额</view>
</view> -->
<view class="userItem-label">
<view class="userItem-label-number">
<block v-if="isUser">
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<block v-if="userData.gold"><text>{{userData.gold.balance ? userData.gold.balance : '0'}}</text></block>
</block>
<block v-else>
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<text>0</text>
</block>
</view>
<view class="userItem-label-text">可用余额</view>
</view>
<view class="userItem-label">
<view class="userItem-label-number">
<block v-if="isUser">
<image class="userItem-label-img" src="@/static/img/giftPack-img04.png" mode="widthFix"></image>
<block v-if="userData.gold"><text>{{userData.gold.overdue ? userData.gold.overdue : '0'}}</text></block>
</block>
<block v-else>
<image class="userItem-label-img" src="@/static/img/giftPack-img03.png" mode="widthFix"></image>
<text>0</text>
</block>
</view>
<view class="userItem-label-text">已过期</view>
</view>
</view>
<view class="userList" @click="userNav('/pages/giftPack/logs')">
<image class="userList-img" src="@/static/img/giftPack-img05.png" mode="widthFix"></image>
<view class="userList-text">查看余额详细记录</view>
</view>
<view class="userTips">
<view class="userTips-left">
余额账户
</view>
<!-- <view class="userTips-right">
本时生活<text>·</text>礼包活动
</view> -->
</view>
<image class="userBack" src="@/static/img/giftPack-img01.png" mode="widthFix"></image>
</view>
<view class="userCoupon" @click="userNav('/pages/giftPack/myCoupon')">
<image class="userCoupon-img" src="@/static/img/giftPack-img06.png" mode="widthFix"></image>
<view class="userCoupon-cont">
<view class="userCoupon-name">我的优惠券</view>
<image class="userCoupon-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
<view class="userTool">
<view class="userTool-title">
其他功能
</view>
<view class="userTool-item" @click="userNav('/pages/giftPack/setPassword')">
<image class="userTool-img" src="@/static/img/giftPack-img08.png" mode="widthFix"></image>
<view class="userTool-cont">
<view class="userTool-name">修改密码</view>
<image class="userTool-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
<view class="userTool-item" @click="delStorage">
<image class="userTool-img" src="@/static/img/giftPack-img07.png" mode="widthFix"></image>
<view class="userTool-cont">
<view class="userTool-name">退出登录</view>
<image class="userTool-arrow" src="@/static/icon/rightsArrow.png" mode="widthFix"></image>
</view>
</view>
</view>
</view>
<!-- 按钮 -->
<view class="campusBtn">
<navigator url="/pages/giftPack/index" hover-class="none" class="campusBtn-go">
<image class="campusBtn-iocn" src="/static/img/giftPack-user00.png" mode="widthFix"></image>
<view class="campusBtn-name">
活动首页
</view>
</navigator>
<navigator url="/pages/giftPack/user" hover-class="none" class="campusBtn-go active">
<image class="campusBtn-iocn" src="/static/img/giftPack-user01_active.png" mode="widthFix"></image>
<view class="campusBtn-name">
个人中心
</view>
</navigator>
</view>
</view>
</template>
<script>
import { index } from '@/apis/interfaces/user'
export default {
data() {
return {
isUser : false, // 用户是否登录
userData: '', //用户
}
},
// 生命周期函数--监听页面加载
onLoad(options) {},
// 生命周期函数--监听页面显示
onShow() {
// 存储环境-月兑活动
getApp().globalData.envType = 'giftPEnv'
if(uni.getStorageSync("token")) {
this.isUser = true
// 获取用户接口
this.userInfo();
}
},
methods: {
// 用户接口
userInfo() {
// 获取用户信息
index().then(res => {
this.userData = res
}).catch(err => {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/giftPack/signin'
});
}
}
});
}
});
},
// 处理未登录时的转跳
userNav(url){
let pageUrl = url
if(uni.getStorageSync("token")) {
uni.navigateTo({
url: pageUrl
})
return
}
// 去登录
uni.navigateTo({
url: '/pages/giftPack/signin'
})
},
// 退出登录
delStorage() {
uni.clearStorage()
uni.navigateTo({
url:'/pages/giftPack/signin'
})
}
}
<script>
import { index } from '@/apis/interfaces/user'
export default {
data() {
return {
isUser : false, // 用户是否登录
userData: '', //用户
}
},
// 生命周期函数--监听页面加载
onLoad(options) {},
// 生命周期函数--监听页面显示
onShow() {
// 存储环境-月兑活动
getApp().globalData.envType = 'giftPEnv'
if(uni.getStorageSync("token")) {
this.isUser = true
// 获取用户接口
this.userInfo();
}
},
methods: {
// 用户接口
userInfo() {
// 获取用户信息
index().then(res => {
this.userData = res
}).catch(err => {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/giftPack/signin'
});
}
}
});
}
});
},
// 处理未登录时的转跳
userNav(url){
let pageUrl = url
if(uni.getStorageSync("token")) {
uni.navigateTo({
url: pageUrl
})
return
}
// 去登录
uni.navigateTo({
url: '/pages/giftPack/signin'
})
},
// 退出登录
delStorage() {
uni.clearStorage()
uni.navigateTo({
url:'/pages/giftPack/signin'
})
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 80rpx 30rpx 30rpx;
box-sizing: border-box;
}
.content-border {
border-bottom: 130rpx transparent solid;
}
.user {
background-image: linear-gradient(110deg, #ecdec4, #f6efe2);
border-radius: 10rpx;
padding: 30rpx;
box-sizing: border-box;
position: relative;
.userBack {
position: absolute;
right: 20rpx;
top: -60rpx;
width: 190rpx;
}
.userTop {
color: #80622a;
.userTop-name {
display: flex;
font-size: 46rpx;
line-height: 54rpx;
font-weight: 600;
text {
font-size: 28rpx;
padding-right: 20rpx;
padding-top: 6rpx;
}
}
.userTop-text {
font-size: 26rpx;
color: #bc903d;
}
}
.userItem {
margin: 30rpx 0;
background-color: #f7f1e5;
border-radius: 10rpx;
display: flex;
padding: 30rpx 0;
.userItem-label {
flex: 2;
text-align: center;
.userItem-label-number {
.userItem-label-img {
width: 40rpx;
margin-right: 15rpx;
display: inline-block;
vertical-align: -4rpx;
}
text {
font-weight: 600;
font-size: 40rpx;
}
}
.userItem-label-text {
color: #8f6d2f;
font-size: 26rpx;
padding-top: 10rpx;
}
}
}
.userList {
background-color: #f7f1e5;
border-radius: 10rpx;
display: flex;
padding: 30rpx 20rpx;
line-height: 60rpx;
box-sizing: border-box;
font-size: 32rpx;
.userList-img {
width: 60rpx;
margin-right: 20rpx;
color: #000000;
}
}
.userTips {
width: 100%;
color: #cca762;
display: flex;
font-size: 28rpx;
margin-top: 30rpx;
line-height: 30rpx;
.userTips-left {
flex: 1;
}
.userTips-right {
text {
font-size: 32rpx;
font-weight: 600;
padding: 0 8rpx;
}
}
}
}
.userCoupon {
background-color: #fff;
border-radius: 10rpx;
padding: 30rpx 15rpx 30rpx 30rpx;
margin: 30rpx 0;
box-sizing: border-box;
display: flex;
.userCoupon-img {
width: 60rpx;
margin-right: 20rpx;
}
.userCoupon-cont {
width: calc(100% - 80rpx);
line-height: 58rpx;
display: flex;
.userCoupon-name {
flex: 1;
font-size: 32rpx;
font-weight: 600;
}
.userCoupon-arrow {
width: 44rpx;
margin-top: 8rpx;
}
}
}
.userTool {
background-color: #fff;
border-radius: 10rpx;
padding: 30rpx 15rpx 30rpx 30rpx;
margin: 30rpx 0;
box-sizing: border-box;
.userTool-title {
font-size: 32rpx;
font-weight: 600;
margin-bottom: 40rpx;
}
.userTool-item {
display: flex;
border-bottom: 2rpx solid #f8f8f8;
padding-bottom: 40rpx;
margin-bottom: 40rpx;
&:last-child {
padding-bottom: 10rpx;
margin-bottom: 0;
border: none;
}
.userTool-img {
width: 40rpx;
margin-right: 20rpx;
margin-top: 6rpx;
}
.userTool-cont {
width: calc(100% - 60rpx);
line-height: 50rpx;
display: flex;
.userTool-name {
flex: 1;
font-size: 32rpx;
}
.userTool-arrow {
width: 44rpx;
margin-top: 8rpx;
}
}
}
}
// 按钮
.campusBtn {
text-align: center;
color: #FFFFFF;
background-color: #fff;
display: flex;
position: fixed;
width: 100%;
height: 130rpx;
z-index: 999;
left: 0;
bottom: 0;
font-size: 28rpx;
.campusBtn-go {
flex: 2;
padding-top: 20rpx;
.campusBtn-iocn {
width: 44rpx;
}
.campusBtn-name {
color: #abaeb2;
}
&.active .campusBtn-name {
color: #2b3452;
}
}
<style lang="scss" scoped>
.content {
padding: 80rpx 30rpx 30rpx;
box-sizing: border-box;
}
.content-border {
border-bottom: 130rpx transparent solid;
}
.user {
background-image: linear-gradient(to right, #f25448, #fe786d);
border-radius: 10rpx;
padding: 30rpx;
box-sizing: border-box;
position: relative;
.userBack {
position: absolute;
right: 20rpx;
top: -60rpx;
width: 190rpx;
}
.userTop {
color: #ffffff;
.userTop-name {
display: flex;
font-size: 46rpx;
line-height: 54rpx;
font-weight: 600;
text {
font-size: 28rpx;
padding-right: 20rpx;
padding-top: 6rpx;
}
}
.userTop-text {
font-size: 26rpx;
color: #bc903d;
}
}
.userItem {
margin: 30rpx 0;
background-image: linear-gradient(to right, #fce1d6, #fce1d6);
border-radius: 10rpx;
display: flex;
padding: 30rpx 0;
.userItem-label {
flex: 2;
text-align: center;
.userItem-label-number {
.userItem-label-img {
width: 40rpx;
margin-right: 15rpx;
display: inline-block;
vertical-align: -4rpx;
}
text {
font-weight: 600;
font-size: 40rpx;
}
}
.userItem-label-text {
color: #ea7e4d;
font-size: 26rpx;
padding-top: 10rpx;
}
}
}
.userList {
background: linear-gradient(to right, #fce1d6, #fce1d6);
border-radius: 10rpx;
display: flex;
padding: 30rpx 20rpx;
line-height: 60rpx;
box-sizing: border-box;
font-size: 32rpx;
color: #ea7e4d;
.userList-img {
width: 60rpx;
margin-right: 20rpx;
color: #000000;
}
}
.userTips {
width: 100%;
color: #ffffff;
display: flex;
font-size: 28rpx;
margin-top: 30rpx;
line-height: 30rpx;
.userTips-left {
flex: 1;
}
.userTips-right {
text {
font-size: 32rpx;
font-weight: 600;
padding: 0 8rpx;
}
}
}
}
.userCoupon {
background-color: #fff;
border-radius: 10rpx;
padding: 30rpx 15rpx 30rpx 30rpx;
margin: 30rpx 0;
box-sizing: border-box;
display: flex;
.userCoupon-img {
width: 60rpx;
margin-right: 20rpx;
}
.userCoupon-cont {
width: calc(100% - 80rpx);
line-height: 58rpx;
display: flex;
.userCoupon-name {
flex: 1;
font-size: 32rpx;
font-weight: 600;
}
.userCoupon-arrow {
width: 44rpx;
margin-top: 8rpx;
}
}
}
.userTool {
background-color: #fff;
border-radius: 10rpx;
padding: 30rpx 15rpx 30rpx 30rpx;
margin: 30rpx 0;
box-sizing: border-box;
.userTool-title {
font-size: 32rpx;
font-weight: 600;
margin-bottom: 40rpx;
}
.userTool-item {
display: flex;
border-bottom: 2rpx solid #f8f8f8;
padding-bottom: 40rpx;
margin-bottom: 40rpx;
&:last-child {
padding-bottom: 10rpx;
margin-bottom: 0;
border: none;
}
.userTool-img {
width: 40rpx;
margin-right: 20rpx;
margin-top: 6rpx;
}
.userTool-cont {
width: calc(100% - 60rpx);
line-height: 50rpx;
display: flex;
.userTool-name {
flex: 1;
font-size: 32rpx;
}
.userTool-arrow {
width: 44rpx;
margin-top: 8rpx;
}
}
}
}
// 按钮
.campusBtn {
text-align: center;
color: #FFFFFF;
background-color: #fff;
display: flex;
position: fixed;
width: 100%;
height: 130rpx;
z-index: 999;
left: 0;
bottom: 0;
font-size: 28rpx;
.campusBtn-go {
flex: 2;
padding-top: 20rpx;
.campusBtn-iocn {
width: 44rpx;
}
.campusBtn-name {
color: #abaeb2;
}
&.active .campusBtn-name {
color: #f55249;
}
}
}
</style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 47 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 3.5 KiB