<script>
|
import {
|
useUserStore
|
} from '@/stores/user'
|
export default {
|
onLaunch: function() {
|
console.log('App Launch')
|
const userStore = useUserStore()
|
userStore.initUser() // 启动时就初始化
|
},
|
onShow: function() {
|
console.log('App Show')
|
},
|
onHide: function() {
|
console.log('App Hide')
|
}
|
}
|
</script>
|
<style>
|
/*每个页面公共css */
|
.background-page {
|
background-image: url('https://farm.evcc.top/Uploads/yuanboyuan/bg.jpg');
|
/*opacity: 0.5; */
|
background-position: center;
|
background-size: cover;
|
background-repeat: no-repeat;
|
z-index: 0;
|
}
|
|
.full-height {
|
height: 100vh;
|
/* 撑满整个屏幕 */
|
box-sizing: border-box;
|
/* 避免 padding 导致溢出 */
|
}
|
|
.relative {
|
position: relative;
|
}
|
|
.fixed {
|
position: fixed;
|
}
|
|
.absolute {
|
position: absolute;
|
}
|
|
.bottom-0 {
|
bottom: 0;
|
}
|
|
.left-0 {
|
left: 0;
|
}
|
|
.right-2 {
|
right: 0.5rem;
|
}
|
|
/* 8px */
|
.top-2 {
|
top: 0.5rem;
|
}
|
|
/* 8px */
|
.z-10 {
|
z-index: 10;
|
}
|
|
.min-h-screen {
|
min-height: 100vh;
|
}
|
|
.w-full {
|
width: 100%;
|
}
|
|
/* 间距 */
|
.p-4 {
|
padding: 1rem;
|
}
|
|
.py-3 {
|
padding-top: 0.75rem;
|
padding-bottom: 0.75rem;
|
}
|
|
.px-2 {
|
padding-left: 0.5rem;
|
padding-right: 0.5rem;
|
}
|
.map-h-40 {
|
height: 200rpx;
|
}
|
|
.mx-2 {
|
margin-left: 0.5rem;
|
margin-right: 0.5rem;
|
}
|
|
/* 文本 */
|
.text-lg {
|
font-size: 1.125rem;
|
}
|
|
.text-sm {
|
font-size: 0.875rem;
|
}
|
|
.text-xl {
|
font-size: 1.25rem;
|
}
|
|
.text-white {
|
color: #fff;
|
}
|
|
.text-gray-400 {
|
color: #9ca3af;
|
}
|
|
.text-gray-500 {
|
color: #6b7280;
|
}
|
|
/* 字重 */
|
.font-bold {
|
font-weight: 700;
|
}
|
|
/* 颜色和背景 */
|
.bg-gray-100 {
|
background-color: #f3f4f6;
|
}
|
|
.bg-white {
|
background-color: #ffffff;
|
}
|
|
.bg-blue-500 {
|
background-color: #3b82f6;
|
}
|
|
.active-bg-blue-600:active {
|
background-color: #2563eb;
|
}
|
|
/* 边框与阴影 */
|
.border-t {
|
border-top-width: 1px;
|
}
|
|
.border-gray-200 {
|
border-color: #e5e7eb;
|
}
|
|
.rounded-full {
|
border-radius: 9999px;
|
}
|
|
.shadow-lg {
|
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
|
0 4px 6px -4px rgba(0, 0, 0, 0.1);
|
}
|
|
/* Flexbox */
|
.flex {
|
display: flex;
|
}
|
|
.flex-row {
|
flex-direction: row;
|
}
|
|
/* 滚动与溢出 */
|
.overflow-x-auto {
|
overflow-x: auto;
|
}
|
|
.whitespace-nowrap {
|
white-space: nowrap;
|
}
|
|
/* 动画过渡 */
|
.transition {
|
transition: all 0.2s ease-in-out;
|
}
|
|
/* 其他 */
|
.inline-block {
|
display: inline-block;
|
}
|
|
.scroll-view {
|
scroll-behavior: smooth;
|
}
|
</style>
|