lihuilin
4 weeks ago
58 changed files with 2675 additions and 19 deletions
-
9main.js
-
246package-lock.json
-
3package.json
-
112pages.json
-
296pages/home/member.vue
-
86pages/setting/about.vue
-
213pages/setting/account.vue
-
85pages/setting/bind.vue
-
142pages/setting/email.vue
-
68pages/setting/font.vue
-
165pages/setting/general.vue
-
76pages/setting/introduce.vue
-
221pages/setting/market.vue
-
62pages/setting/message.vue
-
82pages/setting/newVersion.vue
-
144pages/setting/nextPwd.vue
-
171pages/setting/password.vue
-
143pages/setting/phone.vue
-
108pages/setting/push.vue
-
87pages/setting/server.vue
-
111pages/setting/share.vue
-
64pages/setting/theme.vue
-
BINstatic/my/BlackTheme.png
-
BINstatic/my/QRcode.png
-
BINstatic/my/about.png
-
BINstatic/my/aboutDC.png
-
BINstatic/my/award.png
-
BINstatic/my/bindedEmail.png
-
BINstatic/my/bindedPhone.png
-
BINstatic/my/changeBindPhone.png
-
BINstatic/my/changeEmail.png
-
BINstatic/my/common.png
-
BINstatic/my/connection.png
-
BINstatic/my/editName.png
-
BINstatic/my/greenBackground.png
-
BINstatic/my/greenRise.png
-
BINstatic/my/hideEye.png
-
BINstatic/my/invite.png
-
BINstatic/my/menu.png
-
BINstatic/my/myFriends.png
-
BINstatic/my/openEye.png
-
BINstatic/my/opinion.png
-
BINstatic/my/outline.png
-
BINstatic/my/polylines.png
-
BINstatic/my/redRise.png
-
BINstatic/my/security.png
-
BINstatic/my/setting.png
-
BINstatic/my/share.png
-
BINstatic/my/shareBackground.png
-
BINstatic/my/shareFriends.png
-
BINstatic/my/unlock.png
-
BINstatic/my/update.png
-
BINstatic/my/verification.png
-
BINstatic/my/whiteTheme.png
-
BINstatic/my/签到.png
-
BINstatic/my/行情设置.png
-
BINstatic/my/设置.png
-
BINstatic/my/铃铛2.png
@ -1,5 +1,8 @@ |
|||
{ |
|||
"dependencies": { |
|||
"@dcloudio/uni-ui": "^1.5.11", |
|||
"@element-plus/icons-vue": "^2.3.2", |
|||
"element-plus": "^2.11.5", |
|||
"vue-i18n": "^9.14.5" |
|||
} |
|||
} |
|||
@ -1,28 +1,294 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<!-- 顶部状态栏占位 --> |
|||
<view class="top" :style="{height:iSMT+'px'}"></view> |
|||
<view>我的</view> |
|||
<view class="top"> |
|||
<view class="bell"> |
|||
<image class="image-bell" src="/static/my/铃铛2.png"></image> |
|||
</view> |
|||
<view class="msg"> |
|||
<view class="msg-left"> |
|||
<view class="avatar"></view> |
|||
</view> |
|||
<view class="msg-center"> |
|||
<view style="display: flex;"> |
|||
<view class="userInfo">{{ username }}</view> |
|||
<image class="image-editName" src="/static/my/editName.png"></image> |
|||
</view> |
|||
<view class="userId">ID:{{ dccode }}</view> |
|||
</view> |
|||
<view class="msg-right"> |
|||
<image class="image-attendance" src="/static/my/签到.png" /> |
|||
<span style="font-size:10px;">签到</span> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="settings-buttons"> |
|||
<view class="setting-btn" @click="goToMarket"> |
|||
<image src="/static/my/行情设置.png" class="setting-icon" /> |
|||
<text>行情设置</text> |
|||
</view> |
|||
<view class="setting-btn" @click="goToGeneral"> |
|||
<image src="/static/my/设置.png" class="setting-icon" /> |
|||
<text>通用设置</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="share" @click="goToShare"> |
|||
<image class="img-share" src="/static/my/share.png" mode="widthFix" /> |
|||
</view> |
|||
</view> |
|||
<view class="bottom"> |
|||
<view class="list-item" @click="goToAccount"> |
|||
<image src="/static/my/security.png" class="list-icon" /> |
|||
<text>账号与安全</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="list-item"> |
|||
<image src="/static/my/connection.png" class="list-icon" /> |
|||
<text>联系我们</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="list-item" @click="goToNewVersion"> |
|||
<image src="/static/my/update.png" class="list-icon" /> |
|||
<text>新版本更新</text> |
|||
<view class="update-tip">有新版本可更新 |
|||
<view class="circle"></view> |
|||
</view> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="list-item"> |
|||
<image src="/static/my/opinion.png" class="list-icon" /> |
|||
<text>意见反馈</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="list-item" @click="goToAbout"> |
|||
<image src="/static/my/about.png" class="list-icon" /> |
|||
<text>关于DeepChart</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
<footerBar class="static-footer" :type="type"></footerBar> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref,onMounted } from 'vue' |
|||
import footerBar from '../../components/footerBar.vue' |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
import { |
|||
ArrowRight |
|||
} from '@element-plus/icons-vue' |
|||
import footerBar from '../../components/footerBar.vue' |
|||
|
|||
const type = ref('member') |
|||
const iSMT = ref(0) |
|||
const username = ref('演示机EVA') |
|||
const dccode = ref('90047681') |
|||
const goToGeneral = () => { |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/general' |
|||
}) |
|||
} |
|||
|
|||
const goToMarket = () => { |
|||
uni.navigateTo({ |
|||
url: '../setting/market' |
|||
}) |
|||
} |
|||
|
|||
const type = ref('member') |
|||
const iSMT = ref(0) |
|||
const goToAccount = () => { |
|||
uni.navigateTo({ |
|||
url:'../setting/account' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
}) |
|||
const goToNewVersion = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/newVersion' |
|||
}) |
|||
} |
|||
|
|||
const goToAbout = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/about' |
|||
}) |
|||
} |
|||
|
|||
const goToShare = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/share' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight |
|||
console.log('??????????????', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.static-footer { |
|||
position: fixed; |
|||
bottom: 0; |
|||
} |
|||
.static-footer { |
|||
position: fixed; |
|||
bottom: 0; |
|||
} |
|||
|
|||
.top { |
|||
height: 47vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.bell { |
|||
height: 9.6vh; |
|||
display: flex; |
|||
align-items: flex-end; |
|||
justify-content: flex-end; |
|||
padding-right: 50rpx; |
|||
} |
|||
|
|||
.image-bell { |
|||
width: 13px; |
|||
height: 16px; |
|||
} |
|||
|
|||
.msg { |
|||
height: 10.7vh; |
|||
display: flex; |
|||
margin-top: 3vh; |
|||
margin-bottom: 3vh; |
|||
} |
|||
|
|||
.msg-left { |
|||
width: 33.6vw; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.avatar { |
|||
width: 175rpx; |
|||
height: 175rpx; |
|||
border-radius: 50%; |
|||
background-color: black; |
|||
} |
|||
|
|||
.msg-center { |
|||
width: 51.7vw; |
|||
padding-left: 2.5vh; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.userInfo { |
|||
font-size: 20px; |
|||
} |
|||
|
|||
.userId { |
|||
font-size: 14px; |
|||
margin-top: 1vh; |
|||
} |
|||
|
|||
.image-editName { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin-left: 2vw; |
|||
} |
|||
|
|||
.msg-right { |
|||
width: 14.7vw; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.image-attendance { |
|||
width: 43rpx; |
|||
height: 43rpx; |
|||
} |
|||
|
|||
.settings-buttons { |
|||
display: flex; |
|||
justify-content: space-around; |
|||
} |
|||
|
|||
.setting-btn { |
|||
width: 349rpx; |
|||
height: 135rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
background-color: rgb(243, 243, 243); |
|||
border-radius: 8%; |
|||
} |
|||
|
|||
.setting-icon { |
|||
width: 64.7rpx; |
|||
height: 64.7rpx; |
|||
margin-right: 25rpx; |
|||
} |
|||
|
|||
.setting-btn text { |
|||
font-size: 28rpx; |
|||
font-weight: bold; |
|||
color: #333; |
|||
} |
|||
|
|||
.share { |
|||
height: 12.6vh; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.img-share { |
|||
width: 720rpx; |
|||
height: 160rpx; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 44.5vh; |
|||
margin-top: 1vh; |
|||
background-color: rgb(255, 255, 255); |
|||
} |
|||
|
|||
.list-item { |
|||
width: 670rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0rpx 40rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.list-item:last-child{ |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.list-icon { |
|||
width: 42rpx; |
|||
height: 42rpx; |
|||
margin-right: 18rpx; |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: auto; |
|||
} |
|||
|
|||
.update-tip { |
|||
display: flex; |
|||
color: #999; |
|||
font-size: 24rpx; |
|||
align-items: center; |
|||
margin-left: 200rpx; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.circle { |
|||
width: 10rpx; |
|||
height: 10rpx; |
|||
border-radius: 50%; |
|||
background-color: red; |
|||
margin-left: 10rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,86 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh" /> |
|||
<view class="top"> |
|||
<img src="/static/my/aboutDC.png"></img> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<view class="bottom-list" @click="goToIntroduce"> |
|||
<text class="label">产品介绍</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
<view class="bottom-list"> |
|||
<text class="label">免责声明</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
<view class="bottom-list"> |
|||
<text class="label">隐私政策</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
<view class="bottom-list"> |
|||
<text class="label">服务协议</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
<view class="bottom-list"> |
|||
<text class="label">鼓励一下</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const goToIntroduce = () =>{ |
|||
uni.navigateTo({ |
|||
url: '../setting/introduce' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: 23vh; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
background-color: white; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 35vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.bottom-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.bottom-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.label{ |
|||
flex:1; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,213 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh;"></view> |
|||
|
|||
<view class="setting-list"> |
|||
<view class="setting-item"> |
|||
<text class="item-label">头像</text> |
|||
<view class="item-right"> |
|||
<image src="/static/avatar.png" class="avatar" mode="aspectFill"></image> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
</view> |
|||
<view class="setting-item"> |
|||
<text class="item-label">昵称</text> |
|||
<view class="item-right"> |
|||
<text class="item-text">DeepChart</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
</view> |
|||
<view class="setting-item"> |
|||
<text class="item-label">ID</text> |
|||
<view class="item-right"> |
|||
<text class="item-text">{{ jwcode }}</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
</view> |
|||
<view class="setting-item"> |
|||
<text class="item-label">密码</text> |
|||
<view class="item-right"> |
|||
<text class="item-text">qwertyuiop</text> |
|||
<uni-icons type="eye" size="16" class="eye-icon"></uni-icons> |
|||
</view> |
|||
</view> |
|||
<view class="setting-item" @click="goToPassword"> |
|||
<text class="item-label">修改密码</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
<view class="setting-item"> |
|||
<text class="item-label">注销账号</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
<view class="setting-item" @click="goToBind"> |
|||
<text class="item-label">绑定账号</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="height:1.5vh;"></view> |
|||
|
|||
<view class="logout" @click="showLogout = true"> |
|||
<text>退出登录</text> |
|||
</view> |
|||
|
|||
<view class="logout-confirm" v-if="showLogout"> |
|||
<view class="logoutDialog"> |
|||
<view class="tips">是否退出登录</view> |
|||
<view class="tips-button"> |
|||
<button class="confirm-btn" @click="handleConfirmLogout">确认</button> |
|||
<button class="cancel-btn" @click="showLogout = false">取消</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const jwcode = ref('90047681') |
|||
const showLogout = ref(false) |
|||
|
|||
const handleConfirmLogout = () => { |
|||
showLogout.value = false |
|||
uni.showToast({ |
|||
title: '退出登录成功', |
|||
icon: 'none', |
|||
}) |
|||
} |
|||
|
|||
const goToBind = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/bind' |
|||
}) |
|||
} |
|||
|
|||
const goToPassword = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/password' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.setting-list { |
|||
height: 49vh; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
.setting-item { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 7vh; |
|||
padding: 0 40rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.setting-item:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.item-label { |
|||
font-size: 28rpx; |
|||
flex: 1; |
|||
} |
|||
|
|||
.item-right { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.avatar { |
|||
width: 60rpx; |
|||
height: 60rpx; |
|||
border-radius: 50%; |
|||
margin-right: 20rpx; |
|||
background-color: #999; |
|||
} |
|||
|
|||
.item-text { |
|||
margin-right: 20rpx; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.arrow, |
|||
.eye-icon { |
|||
color: #999; |
|||
} |
|||
|
|||
.logout { |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
height: 7vh; |
|||
font-size: 28rpx; |
|||
color: #f56c6c; |
|||
background-color: white; |
|||
} |
|||
|
|||
.logout-confirm { |
|||
position: fixed; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
background-color: rgba(0, 0, 0, 0.5); |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
z-index: 999; |
|||
} |
|||
|
|||
.logoutDialog { |
|||
width: 500rpx; |
|||
background-color: #fff; |
|||
border-radius: 12rpx; |
|||
padding: 40rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
} |
|||
|
|||
.tips { |
|||
font-size: 32rpx; |
|||
margin-bottom: 40rpx; |
|||
} |
|||
|
|||
.tips-button { |
|||
display: flex; |
|||
width: 100%; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.confirm-btn, |
|||
.cancel-btn { |
|||
width: 180rpx; |
|||
height: 60rpx; |
|||
line-height: 60rpx; |
|||
border-radius: 30rpx; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.confirm-btn { |
|||
background-color: #fff; |
|||
color: #000; |
|||
border: 1rpx solid #ddd; |
|||
} |
|||
|
|||
.cancel-btn { |
|||
background-color: #000; |
|||
color: #fff; |
|||
border: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,85 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh;" /> |
|||
|
|||
<view class="top"> |
|||
<view class="top-list" @click="goToBindPhone"> |
|||
<text class="label">手机号</text> |
|||
<view class="right"> |
|||
<text style="font-size: 28rpx;">未绑定</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list" @click="goToBindEmail"> |
|||
<text class="label">邮箱</text> |
|||
<view class="right"> |
|||
<text style="font-size: 28rpx;">analsak@163.com</text> |
|||
<uni-icons type="arrowright" size="16" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const goToBindPhone = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/phone' |
|||
}) |
|||
} |
|||
|
|||
const goToBindEmail = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/email' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: 14vh; |
|||
background-color: white; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
margin: 0rpx 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.top-list:last-child { |
|||
border: none; |
|||
} |
|||
|
|||
.label { |
|||
font-size: 28rpx; |
|||
flex: 1; |
|||
} |
|||
|
|||
.right{ |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,142 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh;" /> |
|||
|
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/bindedEmail.png" /> |
|||
<text class="label">已绑邮箱：{{ email }}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/changeEmail.png" /> |
|||
<text class="label">+86</text> |
|||
<input type="number" placeholder="请输入您的换绑邮箱" class="input" /> |
|||
</view> |
|||
<view class="right"> |
|||
<button class="verification" :class="{ 'disabled': gettingCode }" @click="getVerification" |
|||
:disabled="gettingCode"> |
|||
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }} |
|||
</button> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/verification.png" /> |
|||
<input type="text" placeholder="请输入验证码" class="input" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<button class="change-btn">换绑</button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const email = ref('analsak@16.com') |
|||
const gettingCode = ref(false) |
|||
const time = ref(60) |
|||
|
|||
const getVerification = () => { |
|||
if (gettingCode.value) return |
|||
gettingCode.value = true |
|||
|
|||
time.value = 60 |
|||
const timer = setInterval(() => { |
|||
time.value-- |
|||
if (time.value <= 0) { |
|||
clearInterval(timer) |
|||
gettingCode.value = false |
|||
} |
|||
}, 1000) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: auto; |
|||
background-color: white; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
margin: 0rpx 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.left { |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.label { |
|||
font-size: 28rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.right { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.input { |
|||
flex: 1; |
|||
height: 70rpx; |
|||
font-size: 29rpx; |
|||
margin-left: 20rpx; |
|||
} |
|||
|
|||
.verification { |
|||
font-size: 24rpx; |
|||
border-radius: 10rpx; |
|||
background-color: rgb(230, 230, 230); |
|||
} |
|||
|
|||
.bottom { |
|||
height: 22vh; |
|||
background-color: white; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.change-btn { |
|||
height: 85rpx; |
|||
width: 610rpx; |
|||
padding:0 20rpx; |
|||
background-color: black; |
|||
color: white; |
|||
border-radius: 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,68 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<text>标准</text> |
|||
<radio value="0" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 0" @click="selectFont(0)" /> |
|||
</view> |
|||
<view class="top-list"> |
|||
<text>中号</text> |
|||
<radio value="1" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 1" @click="selectFont(1)" /> |
|||
</view> |
|||
<view class="top-list"> |
|||
<text>大号</text> |
|||
<radio value="2" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 2" @click="selectFont(2)" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const selectedIndex = ref(0) |
|||
|
|||
const selectFont = (index) => { |
|||
selectedIndex.value = index |
|||
console.log('看看选中状态',selectedIndex.value) |
|||
} |
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
margin-top: 1.5vh; |
|||
height: 21vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0 40rpx; |
|||
padding:0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.top-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.radio-btn { |
|||
margin-left: auto; |
|||
transform: scale(0.6); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,165 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<text>语言</text> |
|||
<text class="language">中文（简体）</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="top-list" @click="goToFont"> |
|||
<text>字体大小</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="top-list" @click="goToTheme"> |
|||
<text>主题切换</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="center"> |
|||
<view class="center-list" @click="goToMessage"> |
|||
<text>消息推送</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<view class="bottom-list" @click="goToServer"> |
|||
<text>切换服务器</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="bottom-list" @click="clearCache"> |
|||
<text>清理缓存</text> |
|||
<text class="cache">{{ cache }}M</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const cache = ref('45.5') |
|||
|
|||
const goToFont = () => { |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/font' |
|||
}) |
|||
} |
|||
|
|||
const goToTheme = () => { |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/theme' |
|||
}) |
|||
} |
|||
|
|||
const goToMessage = () => { |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/message' |
|||
}) |
|||
} |
|||
|
|||
const goToServer = () => { |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/server' |
|||
}) |
|||
} |
|||
|
|||
const clearCache = () => { |
|||
cache.value = 0 |
|||
uni.showToast({ |
|||
title: '清理成功', |
|||
icon: 'success', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
margin-top: 1.5vh; |
|||
height: 21vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.top-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.language { |
|||
margin-left: 55%; |
|||
font-size: 14px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: auto; |
|||
} |
|||
|
|||
.center { |
|||
background-color: white; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-top: 1vh; |
|||
} |
|||
|
|||
.center-list { |
|||
width: 630rpx; |
|||
margin: 0rpx 40rpx; |
|||
display: flex; |
|||
padding: 0 10rpx; |
|||
} |
|||
|
|||
.center-list>.arrow { |
|||
margin-right: 0; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 13.5vh; |
|||
background-color: white; |
|||
margin-top: 1vh; |
|||
} |
|||
|
|||
.bottom-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.cache { |
|||
margin-left: 55%; |
|||
font-size: 14px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.bottom-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,76 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh" /> |
|||
<view class="top"> |
|||
<img src="/static/my/aboutDC.png"></img> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<view class="title">1.产品定位</view> |
|||
<view class="main-text">DeepChart：全球最懂机构行为的AI（你的AI投资伙伴）强化"深度分析" |
|||
的品牌标签（DeepChart=全球最懂机构行为的AI），主打"深度解读机构行为"的APP。</view> |
|||
|
|||
<view class="title">2.产品介绍</view> |
|||
<view class="main-text">DeepChart是一款以"Al智能体”为决策核心的智能投资分析平台， |
|||
专注于深度研究机构行为，专为全球散户投资者量身打造。它重新定义了人与投资工具之间的关系， |
|||
是一个真正懂投资、懂市场、更懂用户的AI投资伙伴。</view> |
|||
|
|||
<view class="title">3.产品理念</view> |
|||
<view class="main-text">从“人找信息”到“AI智能体替你思考和管理”。</view> |
|||
|
|||
<view class="title">4.功能定位——全景AI决策体系</view> |
|||
<view class="main-text">黄其振是大笨蛋</view> |
|||
<view class="main-text">李建霖是大笨蛋</view> |
|||
<view class="main-text">double是大笨蛋</view> |
|||
<view class="main-text">张鲁平是大笨蛋</view> |
|||
<view style="height:1.5vh;background-color: white;" /> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: 26vh; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
background-color: white; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 35vh; |
|||
padding: 0 60rpx; |
|||
background-color: white; |
|||
height: auto; |
|||
} |
|||
|
|||
.title { |
|||
font-size: 30rpx; |
|||
font-weight: bold; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
|
|||
.main-text { |
|||
font-size: 27rpx; |
|||
margin-bottom: 20rpx; |
|||
color: rgb(122, 122, 122); |
|||
text-align: justify; |
|||
text-justify: inter-character;/* 两端对齐哈哈哈哈 */ |
|||
} |
|||
</style> |
|||
@ -0,0 +1,221 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view class="time-share-title"> |
|||
<text>分时设计</text> |
|||
</view> |
|||
<view style="height:57.5vh;background-color: white;"> |
|||
<view class="title">A股竞价</view> |
|||
<view class="top-options"> |
|||
<view class="option-btn" :class="{ 'active': aStockBid === 0 }" @click="aStockBid = 0"> |
|||
<text>智能开启</text> |
|||
<view class="active-dot" v-if="aStockBid === 0"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': aStockBid === 1 }" @click="aStockBid = 1"> |
|||
<text>保持开启</text> |
|||
<view class="active-dot" v-if="aStockBid === 1"></view> |
|||
</view> |
|||
|
|||
<view class="option-btn" :class="{ 'active': aStockBid === 2 }" @click="aStockBid = 2"> |
|||
<text>保持关闭</text> |
|||
<view class="active-dot" v-if="aStockBid === 2"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="title">K线样式</view> |
|||
<view class="top-options"> |
|||
<view class="option-btn" :class="{ 'active': kStyle === 0 }" @click="kStyle = 0"> |
|||
<img src="/static/my/common.png" class="kline-icon" /> |
|||
<text>普通</text> |
|||
<view class="active-dot" v-if="kStyle === 0"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': kStyle === 1 }" @click="kStyle = 1"> |
|||
<img src="/static/my/outline.png" class="kline-icon" /> |
|||
<text>轮廓图</text> |
|||
<view class="active-dot" v-if="kStyle === 1"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': kStyle === 2 }" @click="kStyle = 2"> |
|||
<img src="/static/my/polylines.png" class="kline-icon" /> |
|||
<text>折线图</text> |
|||
<view class="active-dot" v-if="kStyle === 2"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="title">除权类型</view> |
|||
<view class="top-options"> |
|||
<view class="option-btn" :class="{ 'active': exRights === 0 }" @click="exRights = 0"> |
|||
<text>除权</text> |
|||
<view class="active-dot" v-if="exRights === 0"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': exRights === 1 }" @click="exRights = 1"> |
|||
<text>普通</text> |
|||
<view class="active-dot" v-if="exRights === 1"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': exRights === 2 }" @click="exRights = 2"> |
|||
<text>加权</text> |
|||
<view class="active-dot" v-if="exRights === 2"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="title">涨跌颜色</view> |
|||
<view class="top-options"> |
|||
<view class="option-btn" :class="{ 'active': rfColor === 0 }" @click="rfColor = 0"> |
|||
<view class="color-icon"> |
|||
<img src="/static/my/greenRise.png" class="kline-icon" /> |
|||
</view> |
|||
<text>绿涨红跌</text> |
|||
<view class="active-dot" v-if="rfColor === 0"></view> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': rfColor === 1 }" @click="rfColor = 1"> |
|||
<view class="color-icon"> |
|||
<img src="/static/my/redRise.png" class="kline-icon" /> |
|||
</view> |
|||
<text>红涨绿跌</text> |
|||
<view class="active-dot" v-if="rfColor === 1"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="title">副图指标个数</view> |
|||
<view class="top-options"> |
|||
<view class="option-btn" :class="{ 'active': indexCount === 0 }" @click="indexCount = 0"> |
|||
<text>1</text> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': indexCount === 1 }" @click="indexCount = 1"> |
|||
<text>2</text> |
|||
</view> |
|||
<view class="option-btn" :class="{ 'active': indexCount === 2 }" @click="indexCount = 2"> |
|||
<text>3</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="indicator-title"> |
|||
<text>指标设置</text> |
|||
</view> |
|||
<view class="indicator-list"> |
|||
<view class="indicator-item" v-for="(item, index) in indicatorList" :key="index"> |
|||
<text class="indicator-text">{{ item }}</text> |
|||
<view class="indicator-icons"> |
|||
<img src="/static/my/setting.png" class="icon" /> |
|||
<img src="/static/my/menu.png" class="icon" /> |
|||
</view> |
|||
</view> |
|||
<view style="height:10vh;background-color: white;"></view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const aStockBid = ref(0) // 股票竞价：Stock bidding |
|||
const kStyle = ref(0) // k线样式 |
|||
const exRights = ref(0) // 除权类型 除权：Ex-rights |
|||
const rfColor = ref(0) // 涨跌颜色 rise-fall |
|||
const indexCount = ref(0) // 副图指标个数 |
|||
const indicatorList = ref(['K线', '均线', '成交量', 'KDJ', 'MACD', 'RSI']) |
|||
|
|||
onMounted(() => { |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
}) |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.time-share-title { |
|||
height: 4.5vh; |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.title { |
|||
height: 5.5vh; |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 26rpx; |
|||
color: #666; |
|||
} |
|||
|
|||
.top-options { |
|||
height: 5.5vh; |
|||
display: flex; |
|||
padding: 0 40rpx; |
|||
} |
|||
|
|||
.option-btn { |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
border: 1rpx solid #ddd; |
|||
border-radius: 8rpx; |
|||
margin: 0 10rpx; |
|||
padding: 15rpx 0; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.option-btn.active { |
|||
border-color: red; |
|||
} |
|||
|
|||
.active-dot { |
|||
width: 16rpx; |
|||
height: 16rpx; |
|||
background-color: red; |
|||
border-radius: 50%; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.kline-icon { |
|||
margin-right: 10rpx; |
|||
font-size: 32rpx; |
|||
} |
|||
|
|||
.color-icon { |
|||
margin-right: 10rpx; |
|||
display: flex; |
|||
gap: 4rpx; |
|||
} |
|||
|
|||
.indicator-title { |
|||
height: 6vh; |
|||
padding: 0 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.indicator-list { |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
padding: 0 40rpx; |
|||
background-color: white; |
|||
} |
|||
|
|||
.indicator-item { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 7.5vh; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.indicator-text { |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.indicator-icons { |
|||
display: flex; |
|||
gap: 100rpx; |
|||
margin-left: auto; |
|||
} |
|||
|
|||
.icon { |
|||
width: 28rpx; |
|||
height: 28rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,62 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="top"> |
|||
<view class="top-list" @click="goToPush"> |
|||
<text>语言</text> |
|||
<text class="message" v-if="isMessage">通知已开启</text> |
|||
<text class="message" v-if="!isMessage">通知未开启</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const isMessage = ref(true) |
|||
|
|||
const goToPush = () =>{ |
|||
uni.navigateTo({ |
|||
url: '/pages/setting/push' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
margin-top: 1.5vh; |
|||
height: 7vh; |
|||
background-color: white; |
|||
display: flex; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0rpx 40rpx; |
|||
} |
|||
|
|||
.message { |
|||
margin-left: 60%; |
|||
font-size: 14px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: auto; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,82 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view style="height:1.5vh;" /> |
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<text v-if="hasNew === true" class="label">已有新版本</text> |
|||
<text v-if="hasNew === false" class="label">已是最新版本</text> |
|||
<view class="right"> |
|||
<text style="font-size: 28rpx;">{{ version }}</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="height:1vh;" /> |
|||
|
|||
<view class="bottom"> |
|||
<button v-if="hasNew === true" class="bottom-btn">立即更新</button> |
|||
<button v-if="hasNew === false" class="bottom-btn" disabled |
|||
style="background-color: rgb(204,204,204);color:white;">暂无更新</button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const hasNew = ref(true) |
|||
const version = ref('2.0') |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: 7vh; |
|||
background-color: white; |
|||
display: flex; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0rpx 40rpx; |
|||
} |
|||
|
|||
.label { |
|||
font-size: 28rpx; |
|||
flex: 1; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 11vh; |
|||
background-color: white; |
|||
padding: 0 50rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.bottom-btn { |
|||
width: 670rpx; |
|||
height: 84rpx; |
|||
border-radius: 40rpx; |
|||
background-color: #000; |
|||
color: #fff; |
|||
font-size: 28rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,144 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh;" /> |
|||
|
|||
<view class="title"> |
|||
<text class="label">确认新密码</text> |
|||
</view> |
|||
|
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/unlock.png" /> |
|||
<input type="password" :type="pwdType" placeholder="请输入新密码" class="input" /> |
|||
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'" |
|||
@click="changeEye(1)" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/unlock.png" /> |
|||
<input type="password" :type="pwdType2" placeholder="再次确认" class="input" /> |
|||
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'" |
|||
@click="changeEye(2)" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<text class="tips">密码最少8位数</text> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<button class="change-btn">确认</button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
|
|||
const iSMT = ref(0) |
|||
const pwdType = ref('password') |
|||
const pwdType2 = ref('password') |
|||
|
|||
const changeEye = (type) => { |
|||
if (type === 1) { |
|||
pwdType.value = pwdType.value === 'password' ? 'text' : 'password' |
|||
} else { |
|||
pwdType2.value = pwdType2.value === 'password' ? 'text' : 'password' |
|||
} |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.title { |
|||
height: 8.5vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.label { |
|||
height: 8.5vh; |
|||
font-size: 40rpx; |
|||
font-weight: bold; |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 0 60rpx; |
|||
} |
|||
|
|||
.top { |
|||
height: auto; |
|||
background-color: white; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
margin: 0rpx 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.left { |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.input { |
|||
flex: 1; |
|||
height: 70rpx; |
|||
font-size: 29rpx; |
|||
margin-left: 20rpx; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 22vh; |
|||
background-color: white; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.change-btn { |
|||
height: 85rpx; |
|||
width: 610rpx; |
|||
padding: 0 20rpx; |
|||
background-color: black; |
|||
color: white; |
|||
border-radius: 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.img { |
|||
position: absolute; |
|||
right: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
|
|||
.tips { |
|||
font-size: 24rpx; |
|||
color: #999; |
|||
margin-top: 20rpx; |
|||
margin-left: 60rpx; |
|||
align-self: flex-start; |
|||
/* 这是左对齐 */ |
|||
} |
|||
</style> |
|||
@ -0,0 +1,171 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view class="tab"> |
|||
<view class="tab-item" :class="{active: activeTab === 'email'}" @click="activeTab = 'email'">邮箱</view> |
|||
<view class="tab-item" :class="{active: activeTab === 'phone'}" @click="activeTab = 'phone'">手机号</view> |
|||
</view> |
|||
|
|||
<view class="switch-tab"> |
|||
<view class="input-list" v-if="activeTab === 'email'"> |
|||
<image src="/static/my/changeEmail.png" mode="aspectFit"></image> |
|||
<input type="text" placeholder="请输入邮箱" class="input" /> |
|||
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode"> |
|||
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }} |
|||
</button> |
|||
</view> |
|||
|
|||
<view class="input-list" v-else> |
|||
<image src="/static/my/changeBindPhone.png" mode="aspectFit"></image> |
|||
<input type="number" placeholder="请输入手机号" class="input" /> |
|||
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode"> |
|||
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }} |
|||
</button> |
|||
</view> |
|||
|
|||
<view class="input-list"> |
|||
<image src="/static/my/verification.png" mode="aspectFit"></image> |
|||
<input type="text" placeholder="请输入验证码" class="input" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btn-area"> |
|||
<button class="next-btn" @click="goToPwdNext">下一步</button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
|
|||
const iSMT = ref(0) |
|||
const activeTab = ref('email') |
|||
const gettingCode = ref(false) |
|||
const time = ref(60) |
|||
|
|||
const getCode = () => { |
|||
if (gettingCode.value) return |
|||
gettingCode.value = true |
|||
|
|||
time.value = 60 |
|||
|
|||
const timer = setInterval(() => { |
|||
time.value-- |
|||
if (time.value <= 0) { |
|||
clearInterval(timer) |
|||
gettingCode.value = false |
|||
time.value = 60 |
|||
} |
|||
}, 1000) |
|||
} |
|||
|
|||
const goToPwdNext = () =>{ |
|||
uni.navigateTo({ |
|||
url:'../setting/nextPwd' |
|||
}) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 获取状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.tab { |
|||
display: flex; |
|||
height: 8vh; |
|||
background-color: #fff; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.tab-item { |
|||
flex: 1; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
font-size: 32rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.tab-item.active { |
|||
color: #000; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.tab-item.active::after { |
|||
content: ''; |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
width: 40rpx; |
|||
height: 6rpx; |
|||
background-color: #000;/* ????? */ |
|||
} |
|||
|
|||
.switch-tab { |
|||
background-color: #fff; |
|||
padding: 0 60rpx; |
|||
} |
|||
|
|||
.input-list { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
height: 7vh; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.input-list image { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
|
|||
.input { |
|||
flex: 1; |
|||
height: 14vh; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.code-btn { |
|||
width: 200rpx; |
|||
height: 60rpx; |
|||
font-size: 24rpx; |
|||
border-radius: 10rpx; |
|||
background-color: #eee; |
|||
color: #666; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.code-btn.disabled { |
|||
background-color: #ccc; |
|||
color: #999; |
|||
} |
|||
|
|||
.btn-area{ |
|||
height:8vh; |
|||
background-color: white; |
|||
padding-top: 120rpx; |
|||
} |
|||
|
|||
|
|||
.next-btn { |
|||
width: 610rpx; |
|||
height: 85rpx; |
|||
background-color: #000; |
|||
color: #fff; |
|||
font-size: 30rpx; |
|||
border-radius: 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,143 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
|
|||
<view style="height:1.5vh;" /> |
|||
|
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/bindedPhone.png" /> |
|||
<text class="label">已绑手机号：{{ phone }}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/changeBindPhone.png" /> |
|||
<text class="label">+86</text> |
|||
<input type="number" placeholder="请输入您的换绑手机号" class="input" /> |
|||
</view> |
|||
<view class="right"> |
|||
<button class="verification" :class="{ 'disabled': gettingCode }" @click="getVerification" |
|||
:disabled="gettingCode"> |
|||
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }} |
|||
</button> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-list"> |
|||
<view class="left"> |
|||
<img src="/static/my/verification.png" /> |
|||
<input type="text" placeholder="请输入验证码" class="input" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<button class="change-btn">换绑</button> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const phone = ref('15105421566') |
|||
const gettingCode = ref(false) |
|||
const time = ref(60) |
|||
|
|||
const getVerification = () => { |
|||
if (gettingCode.value) return |
|||
gettingCode.value = true |
|||
|
|||
time.value = 60 |
|||
|
|||
const timer = setInterval(() => { |
|||
time.value-- |
|||
if (time.value <= 0) { |
|||
clearInterval(timer) |
|||
gettingCode.value = false |
|||
} |
|||
}, 1000) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
height: auto; |
|||
background-color: white; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
margin: 0rpx 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.left { |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.label { |
|||
font-size: 28rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.right { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.input { |
|||
flex: 1; |
|||
height: 70rpx; |
|||
font-size: 29rpx; |
|||
margin-left: 20rpx; |
|||
} |
|||
|
|||
.verification { |
|||
font-size: 24rpx; |
|||
border-radius: 10rpx; |
|||
background-color: rgb(230, 230, 230); |
|||
} |
|||
|
|||
.bottom { |
|||
height: 22vh; |
|||
background-color: white; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.change-btn { |
|||
height: 85rpx; |
|||
width: 610rpx; |
|||
padding:0 20rpx; |
|||
background-color: black; |
|||
color: white; |
|||
border-radius: 40rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,108 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<text style="width:180rpx;">公共消息</text> |
|||
<text class="public">重大咨询、财经要闻等系统提醒</text> |
|||
<switch class="arrow switch-btn" /> |
|||
</view> |
|||
<view class="top-list"> |
|||
<text>字体大小</text> |
|||
<switch class="arrow switch-btn" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bottom"> |
|||
<view class="bottom-list"> |
|||
<text>盯盘预警</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
<view class="bottom-list"> |
|||
<text>订阅服务</text> |
|||
<text class="cache">45.5M</text> |
|||
<uni-icons type="arrowright" size="16" class="arrow" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
margin-top: 1.5vh; |
|||
height: 14vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.top-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.switch-btn { |
|||
width: 100rpx; |
|||
transform: scale(0.6); |
|||
transform-origin: center right; |
|||
} |
|||
|
|||
.public { |
|||
width: 450rpx; |
|||
margin-left: auto; |
|||
font-size: 10px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: auto; |
|||
} |
|||
|
|||
.bottom { |
|||
height: 13.5vh; |
|||
background-color: white; |
|||
margin-top: 1vh; |
|||
} |
|||
|
|||
.bottom-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.cache { |
|||
margin-left: 55%; |
|||
font-size: 14px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.bottom-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,87 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="top"> |
|||
<view class="top-list"> |
|||
<text>自动选择</text> |
|||
<radio value="0" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 0" @click="selectFont(0)" /> |
|||
</view> |
|||
<view class="top-list"> |
|||
<text>新加坡服务器</text> |
|||
<radio value="1" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 1" @click="selectFont(1)" /> |
|||
</view> |
|||
<view class="top-list"> |
|||
<text>香港服务器</text> |
|||
<radio value="2" class="radio-btn" activeBackgroundColor="red" |
|||
:checked="selectedIndex === 2" @click="selectFont(2)" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const selectedIndex = ref(0) |
|||
|
|||
const selectFont = (index) => { |
|||
selectedIndex.value = index |
|||
console.log('看看选中状态',selectedIndex.value) |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
margin-top: 1.5vh; |
|||
height: 21vh; |
|||
background-color: white; |
|||
} |
|||
|
|||
.top-list { |
|||
width: 630rpx; |
|||
height: 7vh; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin: 0 40rpx; |
|||
padding: 0 10rpx; |
|||
border-bottom: 1rpx solid #eee; |
|||
} |
|||
|
|||
.top-list:last-child { |
|||
border-bottom: none; |
|||
} |
|||
|
|||
.switch-btn { |
|||
width: 100rpx; |
|||
transform: scale(0.6); |
|||
transform-origin: center right; |
|||
} |
|||
|
|||
.public { |
|||
width: 450rpx; |
|||
margin-left: auto; |
|||
font-size: 10px; |
|||
color: rgb(203, 203, 203); |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: auto; |
|||
} |
|||
|
|||
.radio-btn { |
|||
margin-left: auto; |
|||
transform: scale(0.6); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,111 @@ |
|||
<template> |
|||
<view class="all"> |
|||
<img class="img-share" src="/static/my/shareBackground.png" /> |
|||
<img class="img-greenBack" src="/static/my/greenBackground.png" /> |
|||
<img class="img-QRcode" src="/static/my/QRcode.png" /> |
|||
<img class="img-award" src="/static/my/award.png" /> |
|||
<img class="img-myFriends" src="/static/my/myFriends.png" /> |
|||
<img class="img-friends" src="/static/my/shareFriends.png" /> |
|||
<text class="jwcode">{{ jwcode }}</text> |
|||
<button class="invite">立即邀请</button> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref |
|||
} from 'vue' |
|||
|
|||
const jwcode = ref('90047681') |
|||
</script> |
|||
|
|||
<style> |
|||
.all { |
|||
position: relative; |
|||
width: 750rpx; |
|||
height: auto; |
|||
} |
|||
|
|||
.img-share { |
|||
width: 750rpx; |
|||
height: 2118rpx; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
z-index: 1; |
|||
} |
|||
|
|||
.img-QRcode{ |
|||
width:320rpx; |
|||
height:320rpx; |
|||
position:absolute; |
|||
top:26vh; |
|||
left:215rpx; |
|||
z-index: 3; |
|||
} |
|||
|
|||
.img-greenBack { |
|||
width: 670rpx; |
|||
height: 1740rpx; |
|||
position: absolute; |
|||
top: 16vh; |
|||
/* 为什么要用这个替代 margin-top */ |
|||
left: 40rpx; |
|||
/* 还有 padding-left */ |
|||
z-index: 2; |
|||
} |
|||
|
|||
.img-friends { |
|||
width: 602rpx; |
|||
height: 840rpx; |
|||
position: absolute; |
|||
top: 68vh; |
|||
left: 74rpx; |
|||
z-index: 3; |
|||
} |
|||
|
|||
.img-award { |
|||
width: 300rpx; |
|||
height: 120rpx; |
|||
position: absolute; |
|||
top: 61vh; |
|||
left: 75rpx; |
|||
z-index: 3; |
|||
} |
|||
|
|||
.img-myFriends { |
|||
width: 300rpx; |
|||
height: 88rpx; |
|||
position: absolute; |
|||
top: 61vh; |
|||
right: 75rpx; |
|||
z-index: 3; |
|||
} |
|||
|
|||
.jwcode { |
|||
width: 320rpx; |
|||
height: 38rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
position: absolute; |
|||
top: 19vh; |
|||
left: 212rpx; |
|||
z-index: 999; |
|||
} |
|||
|
|||
.invite { |
|||
width: 320rpx; |
|||
height: 80rpx; |
|||
border-radius: 40rpx; |
|||
background-color: black; |
|||
color:white; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
position: absolute; |
|||
top: 50.7vh; |
|||
left: 212rpx; |
|||
z-index: 999; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,64 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view :style="{height:iSMT+'px'}"></view> |
|||
<view class="theme"> |
|||
<view class="left"> |
|||
<image class="img-theme" src="/static/my/whiteTheme.png" mode="widthFix" /> |
|||
<radio value="0" class="radio-btn" activeBackgroundColor="red" :checked="selectedIndex === 0" |
|||
@click="selectFont(0)" /> |
|||
</view> |
|||
<view class="left"> |
|||
<image class="img-theme" src="/static/my/blackTheme.png" mode="widthFix" /> |
|||
<radio value="1" class="radio-btn" activeBackgroundColor="red" :checked="selectedIndex === 1" |
|||
@click="selectFont(1)" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { |
|||
ref, |
|||
onMounted |
|||
} from 'vue' |
|||
const iSMT = ref(0) |
|||
const selectedIndex = ref(0) |
|||
|
|||
const selectFont = (index) => { |
|||
selectedIndex.value = index |
|||
console.log('看看选中状态', selectedIndex.value) |
|||
} |
|||
onMounted(() => { |
|||
// 状态栏高度 |
|||
iSMT.value = uni.getSystemInfoSync().statusBarHeight; |
|||
console.log('看看高度', iSMT.value) |
|||
}) |
|||
</script> |
|||
|
|||
<style> |
|||
.theme { |
|||
margin-top: 1.5vh; |
|||
height: 34vh; |
|||
background-color: white; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
} |
|||
|
|||
.img-theme { |
|||
width: 316rpx; |
|||
height: 362rpx; |
|||
} |
|||
|
|||
.left { |
|||
width: 350rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.radio-btn { |
|||
margin-top: 36rpx; |
|||
transform: scale(0.8); |
|||
} |
|||
</style> |
|||
|
After Width: 158 | Height: 181 | Size: 3.4 KiB |
|
After Width: 160 | Height: 160 | Size: 17 KiB |
|
After Width: 21 | Height: 19 | Size: 636 B |
|
After Width: 167 | Height: 155 | Size: 8.7 KiB |
|
After Width: 150 | Height: 60 | Size: 2.8 KiB |
|
After Width: 20 | Height: 20 | Size: 380 B |
|
After Width: 20 | Height: 20 | Size: 337 B |
|
After Width: 20 | Height: 20 | Size: 351 B |
|
After Width: 20 | Height: 20 | Size: 413 B |
|
After Width: 31 | Height: 23 | Size: 237 B |
|
After Width: 20 | Height: 20 | Size: 748 B |
|
After Width: 15 | Height: 15 | Size: 424 B |
|
After Width: 335 | Height: 870 | Size: 11 KiB |
|
After Width: 26 | Height: 25 | Size: 993 B |
|
After Width: 20 | Height: 9 | Size: 429 B |
|
After Width: 375 | Height: 1059 | Size: 454 KiB |
|
After Width: 14 | Height: 14 | Size: 228 B |
|
After Width: 150 | Height: 44 | Size: 2.1 KiB |
|
After Width: 20 | Height: 12 | Size: 660 B |
|
After Width: 21 | Height: 20 | Size: 551 B |
|
After Width: 31 | Height: 25 | Size: 1.3 KiB |
|
After Width: 31 | Height: 23 | Size: 1.3 KiB |
|
After Width: 26 | Height: 25 | Size: 966 B |
|
After Width: 23 | Height: 23 | Size: 669 B |
|
After Width: 28 | Height: 28 | Size: 1.4 KiB |
|
After Width: 360 | Height: 80 | Size: 28 KiB |
|
After Width: 375 | Height: 1059 | Size: 456 KiB |
|
After Width: 301 | Height: 397 | Size: 50 KiB |
|
After Width: 20 | Height: 20 | Size: 488 B |
|
After Width: 21 | Height: 17 | Size: 488 B |
|
After Width: 20 | Height: 20 | Size: 526 B |
|
After Width: 158 | Height: 181 | Size: 3.4 KiB |
|
After Width: 22 | Height: 22 | Size: 614 B |
|
After Width: 33 | Height: 33 | Size: 687 B |
|
After Width: 27 | Height: 27 | Size: 1.2 KiB |
|
After Width: 13 | Height: 16 | Size: 358 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue