修改基础样式
parent
e275e1ca7e
commit
1ed3b84887
386
src/App.vue
386
src/App.vue
|
|
@ -1,288 +1,192 @@
|
|||
<script>
|
||||
import dayjs from 'dayjs';
|
||||
import useAuthUser from '@/utils/hooks/useAuthUser';
|
||||
import { submitCode2Session } from '@/api/xinjiang_guess';
|
||||
import dayjs from 'dayjs'
|
||||
import useAuthUser from '@/utils/hooks/useAuthUser'
|
||||
import { submitCode2Session } from '@/api/xinjiang_guess'
|
||||
|
||||
export default {
|
||||
globalData: {},
|
||||
onLaunch: function () {
|
||||
console.log('App Launch')
|
||||
},
|
||||
onShow: async function () {
|
||||
console.log('App Show')
|
||||
globalData: {},
|
||||
onLaunch: function () {
|
||||
console.log('App Launch')
|
||||
},
|
||||
onShow: async function () {
|
||||
console.log('App Show')
|
||||
|
||||
if (uni.canIUse('getUpdateManager')) {
|
||||
const updateManager = uni.getUpdateManager();
|
||||
updateManager.onCheckForUpdate(function (res) {
|
||||
// 请求完新版本信息的回调
|
||||
if (res.hasUpdate) {
|
||||
updateManager.onUpdateReady(function () {
|
||||
wx.showModal({
|
||||
title: '更新提示',
|
||||
content: '新版本已经准备好，是否重启应用？',
|
||||
success: function (res) {
|
||||
// res: {errMsg: "showModal: ok", cancel: false, confirm: true}
|
||||
if (res.confirm) {
|
||||
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
|
||||
updateManager.applyUpdate()
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
updateManager.onUpdateFailed(function () {
|
||||
// 新的版本下载失败
|
||||
uni.showModal({
|
||||
title: '已经有新版本了哟~',
|
||||
content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~'
|
||||
});
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (uni.canIUse('getUpdateManager')) {
|
||||
const updateManager = uni.getUpdateManager()
|
||||
updateManager.onCheckForUpdate(function (res) {
|
||||
// 请求完新版本信息的回调
|
||||
if (res.hasUpdate) {
|
||||
updateManager.onUpdateReady(function () {
|
||||
wx.showModal({
|
||||
title: '更新提示',
|
||||
content: '新版本已经准备好，是否重启应用？',
|
||||
success: function (res) {
|
||||
// res: {errMsg: "showModal: ok", cancel: false, confirm: true}
|
||||
if (res.confirm) {
|
||||
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
|
||||
updateManager.applyUpdate()
|
||||
}
|
||||
},
|
||||
})
|
||||
})
|
||||
updateManager.onUpdateFailed(function () {
|
||||
// 新的版本下载失败
|
||||
uni.showModal({
|
||||
title: '已经有新版本了哟~',
|
||||
content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~',
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
console.log('checkSession', this.checkSession());
|
||||
if (!this.checkSession()) {
|
||||
await this.login(true);
|
||||
}
|
||||
console.log('checkSession', this.checkSession())
|
||||
if (!this.checkSession()) {
|
||||
await this.login(true)
|
||||
}
|
||||
|
||||
console.log('App globalData', this.globalData);
|
||||
},
|
||||
onHide: function () {
|
||||
console.log('App Hide')
|
||||
},
|
||||
methods: {
|
||||
checkSession() {
|
||||
const expire_in = this.globalData.expire_in;
|
||||
if (!expire_in) {
|
||||
return false;
|
||||
}
|
||||
console.log('App globalData', this.globalData)
|
||||
},
|
||||
onHide: function () {
|
||||
console.log('App Hide')
|
||||
},
|
||||
methods: {
|
||||
checkSession() {
|
||||
const expire_in = this.globalData.expire_in
|
||||
if (!expire_in) {
|
||||
return false
|
||||
}
|
||||
|
||||
if (expire_in) {
|
||||
let isExpired = dayjs().isAfter(dayjs(expire_in))
|
||||
console.log('isExpired', isExpired);
|
||||
if (isExpired) {
|
||||
return false;
|
||||
}
|
||||
if (expire_in) {
|
||||
let isExpired = dayjs().isAfter(dayjs(expire_in))
|
||||
console.log('isExpired', isExpired)
|
||||
if (isExpired) {
|
||||
return false
|
||||
}
|
||||
|
||||
let willExpired = dayjs().add(6, 'hour').isAfter(dayjs(expire_in))
|
||||
console.log('willExpired', willExpired);
|
||||
if (willExpired) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
let willExpired = dayjs().add(6, 'hour').isAfter(dayjs(expire_in))
|
||||
console.log('willExpired', willExpired)
|
||||
if (willExpired) {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
login() {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
try {
|
||||
const codeResp = await wx.login()
|
||||
const wxLoginResp = await submitCode2Session({ code: codeResp.code });
|
||||
const data = wxLoginResp.data;
|
||||
return true
|
||||
},
|
||||
login() {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
try {
|
||||
const codeResp = await wx.login()
|
||||
const wxLoginResp = await submitCode2Session({ code: codeResp.code })
|
||||
const data = wxLoginResp.data
|
||||
|
||||
this.globalData.api_token = data?.api_token;
|
||||
this.globalData.expire_in = data?.expire_in;
|
||||
this.globalData.user = data?.user;
|
||||
this.globalData.isLogin = !!this.globalData.api_token;
|
||||
this.globalData.isNeedBindPhone = !!this.globalData.user?.is_need_bind_phone;
|
||||
this.globalData.api_token = data?.api_token
|
||||
this.globalData.expire_in = data?.expire_in
|
||||
this.globalData.user = data?.user
|
||||
this.globalData.isLogin = !!this.globalData.api_token
|
||||
this.globalData.isNeedBindPhone =
|
||||
!!this.globalData.user?.is_need_bind_phone
|
||||
|
||||
const pages = getCurrentPages();
|
||||
const page = pages[pages.length - 1];
|
||||
const pages = getCurrentPages()
|
||||
const page = pages[pages.length - 1]
|
||||
|
||||
if (page.$page) {
|
||||
console.log('current page: ', page.$page.fullPath);
|
||||
} else {
|
||||
console.log('current page: ', page.route);
|
||||
}
|
||||
if (page.$page) {
|
||||
console.log('current page: ', page.$page.fullPath)
|
||||
} else {
|
||||
console.log('current page: ', page.route)
|
||||
}
|
||||
|
||||
resolve();
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
reject();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
resolve()
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
reject()
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*每个页面公共css */
|
||||
@import "uview-plus/index.scss";
|
||||
@import 'uview-plus/index.scss';
|
||||
|
||||
page {
|
||||
background-color: #f3f3f3;
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
button,
|
||||
button[type=primary],
|
||||
button[type='primary'],
|
||||
button[plain],
|
||||
button[type=primary][plain],
|
||||
button[type='primary'][plain],
|
||||
button::after {
|
||||
border: none;
|
||||
background: transparent;
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
// 页面布局相关 外边距
|
||||
|
||||
|
||||
.pt-24 {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.m-16 {
|
||||
margin: 16px;
|
||||
}
|
||||
|
||||
.text-white {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.text-red {
|
||||
color: #e91f35;
|
||||
}
|
||||
|
||||
.text-4e {
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: #525252;
|
||||
}
|
||||
|
||||
.text-black {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.text-bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mb-10 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.text-base {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text-sm {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.text-xs {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bg-white {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.rounded {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.rounded-lg {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.block-box {
|
||||
padding: 12px;
|
||||
box-shadow: 0.5px 0.5px 1px rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: 16px;
|
||||
padding: 12px;
|
||||
box-shadow: 0.5px 0.5px 1px rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
// 公共样式封装
|
||||
.board {
|
||||
border-radius: 6px;
|
||||
background-color: #fff;
|
||||
padding: 12px 32px;
|
||||
border-radius: 6px;
|
||||
background-color: #fff;
|
||||
padding: 12px 32px;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px 26px 2px;
|
||||
}
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px 26px 2px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #182c5f;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn-primary {
|
||||
background-color: #182c5f;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding: 8px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.line {
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #d3d3d3;
|
||||
}
|
||||
.line {
|
||||
margin-top: 8px;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #d3d3d3;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary-sm {
|
||||
width: 60px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0px !important;
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
border-radius: 20px !important;
|
||||
box-shadow: 1px 0.4px 1px #e91f35;
|
||||
width: 60px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0px !important;
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
border-radius: 20px !important;
|
||||
box-shadow: 1px 0.4px 1px #e91f35;
|
||||
}
|
||||
|
||||
.img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-right: 16px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 多行文本最后一行展示省略号
|
||||
.ellipsis {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-right: 16px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.nodata {
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #999999;
|
||||
margin-top: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.fixed{
|
||||
position: fixed;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<view class="bg-white wrap">
|
||||
<view class="image mb-10" v-if="data.cover">
|
||||
<view class="image mb-2.5" v-if="data.cover">
|
||||
<image class="image" :src="data.cover" mode="aspectFill" />
|
||||
</view>
|
||||
<view class="p-16 title-bar flex-1" v-if="data">
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<view class="page-setting">
|
||||
<view class="setting-box">
|
||||
<view class="block-box bg-white rounded">
|
||||
<view class="block-box bg-white rounded-4px">
|
||||
<view class="flex text-primary items-center cell text-base">
|
||||
<text class="text">头像</text>
|
||||
<button class="menu-item-btn" openType="chooseAvatar" @chooseavatar="handleChooseAvatar">
|
||||
|
|
|
|||
|
|
@ -43,14 +43,14 @@
|
|||
</div>
|
||||
</view>
|
||||
<view v-for="(block, index) in menus" :key="index">
|
||||
<view class="block-box bg-white rounded">
|
||||
<view class="block-box bg-white rounded-4px">
|
||||
<view v-for="(item, index) in block" :key="index">
|
||||
<view
|
||||
class="flex text-primary items-center cell text-base"
|
||||
@click="goToMenuPage(item)"
|
||||
v-if="!item.openType"
|
||||
>
|
||||
<image class="icon mr-12" :src="item.icon" />
|
||||
<image class="icon mr-12px" :src="item.icon" />
|
||||
<view class="menu-item" :openType="item.openType">
|
||||
<text class="text">{{ item.text }}</text>
|
||||
<text class="extra" v-if="item.extra">{{ item.extra }}</text>
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
class="flex text-primary items-center cell text-base"
|
||||
v-if="item.openType"
|
||||
>
|
||||
<image class="icon mr-12" :src="item.icon" />
|
||||
<image class="icon mr-12px" :src="item.icon" />
|
||||
<up-button class="menu-item-btn" :openType="item.openType">
|
||||
<text class="text">{{ item.text }}</text>
|
||||
<text class="extra" v-if="item.extra">{{ item.extra }}</text>
|
||||
|
|
@ -233,9 +233,7 @@ const upCallback = (mescroll) => {
|
|||
align-items: center;
|
||||
}
|
||||
}
|
||||
.mr-12 {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
|
||||
.icon {
|
||||
width: 20px;
|
||||
|
|
|
|||
|
|
@ -105,9 +105,7 @@ const upCallback = (mescroll) => {
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.mt-8 {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
|
||||
.m-title {
|
||||
margin: 8px 0 10px;
|
||||
|
|
|
|||
|
|
@ -30,11 +30,13 @@ export default defineConfig({
|
|||
},
|
||||
theme: {
|
||||
colors: {
|
||||
primary: '#ee2c37',
|
||||
|
||||
'4e': '#4e4e4e',
|
||||
primary: '#525252',
|
||||
black: '#000000',
|
||||
},
|
||||
spacing: {
|
||||
'base': '30rpx'
|
||||
'base': '30rpx',
|
||||
|
||||
}
|
||||
},
|
||||
rules: [
|
||||
|
|
|
|||
Loading…
Reference in New Issue