月兑活动修改为红色

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

42
main.js
View File

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

View File

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

53
package-lock.json generated
View File

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

View File

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

View File

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

View File

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

View File

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

View File

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