修改样式
This commit is contained in:
zpc
parent
5af976d289
commit
913d604d3e
38
App.vue
38
App.vue
|
|
@ -1,12 +1,19 @@
|
|||
|
||||
<script>
|
||||
import Vue from "vue";
|
||||
// 引入全局预览弹窗方法
|
||||
import '@/components/detail-preview-popup/index.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isFirstLaunch: true, // 添加标志变量，用于标记是否是首次启动
|
||||
}
|
||||
},
|
||||
onLaunch: function () {
|
||||
console.log("App Launch");
|
||||
// 调用登录记录接口
|
||||
this.callLoginRecordApi();
|
||||
|
||||
const updateManager = uni.getUpdateManager();
|
||||
|
||||
updateManager.onCheckForUpdate(function (res) {
|
||||
|
|
@ -55,10 +62,37 @@ export default {
|
|||
},
|
||||
onShow: function () {
|
||||
console.log("App Show");
|
||||
// 如果不是首次启动才调用登录记录接口，避免与onLaunch重复调用
|
||||
if (!this.isFirstLaunch) {
|
||||
this.callLoginRecordApi();
|
||||
} else {
|
||||
this.isFirstLaunch = false; // 重置标志
|
||||
}
|
||||
},
|
||||
onHide: function () {
|
||||
console.log("App Hide");
|
||||
},
|
||||
methods: {
|
||||
// 调用登录记录接口的方法
|
||||
callLoginRecordApi() {
|
||||
// 检查用户是否已登录
|
||||
const token = uni.getStorageSync('token');
|
||||
if (!token) {
|
||||
console.log('用户未登录，不调用登录记录接口');
|
||||
return;
|
||||
}
|
||||
this.req({
|
||||
url: 'login_record',
|
||||
method: 'POST',
|
||||
success: (res) => {
|
||||
console.log('登录记录接口调用成功', res);
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('登录记录接口调用失败', err);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -193,7 +227,7 @@ button.hide {
|
|||
<view>
|
||||
<!-- 全局预览组件 -->
|
||||
<detail-preview-popup></detail-preview-popup>
|
||||
|
||||
|
||||
<!-- 主应用容器 -->
|
||||
<view>
|
||||
<slot></slot>
|
||||
|
|
|
|||
106
components/nav-header/nav-header.vue
Normal file
106
components/nav-header/nav-header.vue
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<template>
|
||||
<view class="nav-header">
|
||||
<uni-nav-bar :color="color" :backgroundColor="backgroundColor" :fixed="fixed" :statusBar="statusBar"
|
||||
:border="border">
|
||||
<template #left>
|
||||
<view v-if="showBack" class="nav-header__back" @click="goBack">
|
||||
<uni-icons :color="color" type="left" size="20" />
|
||||
</view>
|
||||
</template>
|
||||
<view style="font-size: 34rpx; width: 100%; display: flex; justify-content: center; align-items: center;">
|
||||
{{ title }}
|
||||
</view>
|
||||
</uni-nav-bar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'NavHeader',
|
||||
props: {
|
||||
// 标题文字
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否显示返回按钮
|
||||
showBack: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 返回页面路径，不传则返回上一页
|
||||
backUrl: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 文字颜色
|
||||
color: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
// 背景颜色
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: 'transparent'
|
||||
},
|
||||
// 是否固定在顶部
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否包含状态栏
|
||||
statusBar: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否显示底部边框
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 返回页面
|
||||
goBack() {
|
||||
if (this.backUrl) {
|
||||
// 如果指定了返回页面路径，则跳转到指定页面
|
||||
uni.redirectTo({
|
||||
url: this.backUrl,
|
||||
success: () => {
|
||||
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('返回页面失败', err);
|
||||
uni.switchTab({
|
||||
url: this.backUrl,
|
||||
success: () => {
|
||||
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('返回页面失败1', err);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
} else {
|
||||
// 默认返回上一页
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.nav-header {
|
||||
&__back {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 44px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
86
components/page-container/page-container.vue
Normal file
86
components/page-container/page-container.vue
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
<template>
|
||||
<view class="page-container" :style="{ backgroundColor: backgroundColor }">
|
||||
<nav-header :title="title" :showBack="showBack" :backUrl="backUrl" :color="navColor"
|
||||
:backgroundColor="navBackgroundColor" :fixed="fixed" :statusBar="statusBar" :border="border">
|
||||
</nav-header>
|
||||
<view class="page-container__content" :style="{ paddingBottom: paddingBottom }">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import NavHeader from '@/components/nav-header/nav-header.vue'
|
||||
|
||||
export default {
|
||||
name: 'PageContainer',
|
||||
components: {
|
||||
NavHeader
|
||||
},
|
||||
props: {
|
||||
// 标题文字
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否显示返回按钮
|
||||
showBack: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 返回页面路径，不传则返回上一页
|
||||
backUrl: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 导航栏文字颜色
|
||||
navColor: {
|
||||
type: String,
|
||||
default: '#000000'
|
||||
},
|
||||
// 导航栏背景颜色
|
||||
navBackgroundColor: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
// 页面背景颜色
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: '#FFFFFF'
|
||||
},
|
||||
// 是否固定导航栏在顶部
|
||||
fixed: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否包含状态栏
|
||||
statusBar: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否显示底部边框
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 底部内边距
|
||||
paddingBottom: {
|
||||
type: String,
|
||||
default: '0px'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page-container {
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
|
||||
&__content {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,12 +1,6 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="navLeft align-center" :style="{ top: $sys().statusBarHeight + 'px' }" @tap="$c.back(1)">
|
||||
<uni-icons type="left" color="#000000"></uni-icons>
|
||||
</view>
|
||||
<view class="title1">福利屋</view>
|
||||
<view class="header-space"></view>
|
||||
<page-container title="福利屋" :showBack="true">
|
||||
<banner :type-id="8" :height="328"></banner>
|
||||
|
||||
<view class="tab-container">
|
||||
<view class="tab">
|
||||
<view class="tab-item1 center" @click="$refs.rulePop.getRule(20, '规则说明')">
|
||||
|
|
@ -100,11 +94,16 @@
|
|||
</view>
|
||||
</view>
|
||||
<rule-pop ref="rulePop"></rule-pop>
|
||||
</view>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageContainer from '@/components/page-container/page-container.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
PageContainer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabCur: 1,
|
||||
|
|
@ -216,42 +215,6 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.header-space {
|
||||
height: 232rpx;
|
||||
}
|
||||
|
||||
.navLeft {
|
||||
position: fixed;
|
||||
left: 30rpx;
|
||||
height: 44px;
|
||||
z-index: 100;
|
||||
|
||||
>view {
|
||||
font-weight: 400;
|
||||
font-size: 50rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.title1 {
|
||||
width: 100%;
|
||||
top: 108rpx;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 34rpx;
|
||||
justify-content: center;
|
||||
color: black;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.tab-container {
|
||||
width: 100%;
|
||||
margin-top: 30rpx;
|
||||
|
|
|
|||
|
|
@ -1,15 +1,5 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="navLeft align-center" :style="{ top: $sys().statusBarHeight + 'px' }" @tap="$c.back(1)">
|
||||
<uni-icons type="left" color="#000000"></uni-icons>
|
||||
<!-- <view class="">{{$c.detailPageTitle((pageData && pageData.goods) || '')}}</view> -->
|
||||
</view>
|
||||
|
||||
<view class="title1">福利屋详情</view>
|
||||
|
||||
<view style="height: 232rpx;">
|
||||
|
||||
</view>
|
||||
<page-container title="福利屋详情" :showBack="true" >
|
||||
<view class="relative"
|
||||
style="width: 686rpx; height: 152rpx; background-color: #FFFFFF; border-radius: 16rpx; margin: 0 auto;">
|
||||
|
||||
|
|
@ -171,18 +161,18 @@
|
|||
<text style="font-size: 24rpx; color: #333333; font-weight: 600;">去抽赏</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</uni-popup>
|
||||
|
||||
</view>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderConfirmPopupFlw from '@/components/order-confirm-popup/order-confirm-popup-flw.vue';
|
||||
import PageContainer from '@/components/page-container/page-container.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
OrderConfirmPopupFlw
|
||||
OrderConfirmPopupFlw,
|
||||
PageContainer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -632,38 +622,6 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.navLeft {
|
||||
position: fixed;
|
||||
left: 30rpx;
|
||||
height: 44px;
|
||||
z-index: 100;
|
||||
|
||||
>view {
|
||||
font-weight: 400;
|
||||
font-size: 50rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.title1 {
|
||||
width: 100%;
|
||||
top: 108rpx;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 34rpx;
|
||||
justify-content: center;
|
||||
color: black;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.tab {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
|
|||
|
|
@ -1,17 +1,7 @@
|
|||
<!-- 每日签到 -->
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="navLeft align-center" :style="{ top: $sys().statusBarHeight + 'px' }" @tap="$c.back(1)">
|
||||
<uni-icons type="left" color="#000000"></uni-icons>
|
||||
<!-- <view class="">{{$c.detailPageTitle((pageData && pageData.goods) || '')}}</view> -->
|
||||
</view>
|
||||
|
||||
<view class="title1">签到</view>
|
||||
|
||||
<view class="" style="height: 232rpx;"></view>
|
||||
|
||||
<page-container title="签到" :showBack="true" >
|
||||
<banner :type-id="7" :height="328"></banner>
|
||||
|
||||
<view class=""
|
||||
style="width: 686rpx; height: 838rpx; background-color: #fff; margin: 40rpx auto 0; border-radius: 16rpx;">
|
||||
|
||||
|
|
@ -74,13 +64,9 @@
|
|||
</scroll-view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<!-- 签到按钮 -->
|
||||
|
||||
<view class="justify-center" style="width: 100%; height: 198rpx; background-color: #fff; margin-top: -10rpx;">
|
||||
<view class="align-center column">
|
||||
<view class="center" @click="sign"
|
||||
|
|
@ -91,8 +77,6 @@
|
|||
<text style="color: #8A8A8A; font-size: 20rpx; margin-top: 12rpx;">{{ checkinData.Requirement
|
||||
}}</text>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<!-- 气泡提示 -->
|
||||
|
|
@ -102,12 +86,16 @@
|
|||
</view>
|
||||
<view class="tooltip-arrow"></view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PageContainer from '@/components/page-container/page-container.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
PageContainer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tipVisible: false,
|
||||
|
|
@ -128,7 +116,6 @@ export default {
|
|||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
this.load();
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -177,7 +164,7 @@ export default {
|
|||
let t = {
|
||||
isExpired: false,
|
||||
isClaim: item.is_sign === 2 ? true : false,
|
||||
isToday: item.is_sign === 1 ? true : false,
|
||||
isToday: item.is_sign_day === 1 ? true : false,
|
||||
Day: item.day,
|
||||
Reward: item.description,
|
||||
icon:item.icon
|
||||
|
|
@ -237,37 +224,6 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
width: 100vw;
|
||||
box-sizing: border-box;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.navLeft {
|
||||
position: fixed;
|
||||
left: 30rpx;
|
||||
height: 44px;
|
||||
z-index: 100;
|
||||
|
||||
>view {
|
||||
font-weight: 400;
|
||||
font-size: 50rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.title1 {
|
||||
width: 100%;
|
||||
top: 108rpx;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 34rpx;
|
||||
justify-content: center;
|
||||
color: black;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 140rpx);
|
||||
|
|
@ -303,7 +259,6 @@ export default {
|
|||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
|
|
|
|||
|
|
@ -1,12 +1,7 @@
|
|||
<!-- 福利 -->
|
||||
|
||||
<template>
|
||||
<view class="content">
|
||||
<uni-nav-bar color="#000000" backgroundColor="transparent" :fixed="true" :statusBar="true" :border="false">
|
||||
<view style="font-size: 34rpx; width: 100%; display: flex; justify-content: center; align-items: center;">
|
||||
福利
|
||||
</view>
|
||||
</uni-nav-bar>
|
||||
<page-container title="福利">
|
||||
<banner :type-id="6" :height="326"></banner>
|
||||
<view class="grid-container" style="width: 100%; padding: 0 32rpx; margin-top: 40rpx;">
|
||||
<view class="grid-item" v-for="(item) in list" :key="item.id" @click="toPage(item)" style="height: 184rpx;">
|
||||
|
|
@ -14,13 +9,17 @@
|
|||
<text v-if="!item.image">{{ item.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import RequestManager from '@/common/request.js'
|
||||
import PageContainer from '@/components/page-container/page-container.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
PageContainer
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: []
|
||||
|
|
@ -51,8 +50,6 @@
|
|||
|
||||
//跳转页面
|
||||
toPage(item) {
|
||||
|
||||
|
||||
if (item.url) {
|
||||
this.$c.to({
|
||||
url: item.url
|
||||
|
|
@ -76,27 +73,6 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
/* padding-top: 1rpx; */
|
||||
padding-bottom: 100px;
|
||||
box-sizing: border-box;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.title1 {
|
||||
width: 100%;
|
||||
top: 108rpx;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 34rpx;
|
||||
justify-content: center;
|
||||
color: black;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 324rpx);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user