96 lines
2.1 KiB
Vue
96 lines
2.1 KiB
Vue
<script setup>
|
|
import BGICON from "../../static/icons/bg.png";
|
|
import XNav from "../../components/XNav.vue";
|
|
import BulletChat from "./BulletChat.vue";
|
|
import { ref } from "vue";
|
|
import AccountLogin from "./AccountLogin.vue";
|
|
import PhoneLogin from "./PhoneLogin.vue";
|
|
import WXOfficialAccount from "../../components/WXOfficialAccount.vue";
|
|
import { onLoad } from "@dcloudio/uni-app";
|
|
|
|
const currentTab = ref(0);
|
|
const showWX = ref(false);
|
|
const tabs = [
|
|
{
|
|
name: '手机号登录',
|
|
},
|
|
{
|
|
name: '账号密码登录',
|
|
},
|
|
];
|
|
|
|
onLoad((options) => {
|
|
const { showWX: _showWX } = options;
|
|
showWX.value = _showWX === '1';
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<!--登陆-->
|
|
<XNav :showBack="false"></XNav>
|
|
|
|
<view class="box">
|
|
<image class="boximg" :src="BGICON">
|
|
</image>
|
|
|
|
<view class="hi-box">
|
|
<image class="hi" src="/static/icons/hi.png"></image>
|
|
<view class="title">欢迎登录系统</view>
|
|
</view>
|
|
|
|
<BulletChat></BulletChat>
|
|
</view>
|
|
|
|
<view class="form">
|
|
<tui-tabs class="tabs" :tabs="tabs" :currentTab="currentTab" itemWidth="50%"
|
|
@change="({ index }) => currentTab = index" :width="300" :sliderWidth="130"></tui-tabs>
|
|
|
|
<PhoneLogin v-if="currentTab === 0"></PhoneLogin>
|
|
<AccountLogin v-else></AccountLogin>
|
|
</view>
|
|
|
|
<w-x-official-account v-model:show="showWX"></w-x-official-account>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.tabs {
|
|
@apply mx-auto mb-[40rpx];
|
|
}
|
|
|
|
.form {
|
|
@apply h-full -mt-[20rpx] rounded-t-[20rpx] relative z-10;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.boximg {
|
|
@apply absolute left-1/2 top-1/2 -translate-1/2 w-[1198rpx] h-[806rpx] pb-[40rpx];
|
|
}
|
|
|
|
.box {
|
|
@apply h-[390rpx] relative overflow-hidden;
|
|
}
|
|
|
|
.hi-box {
|
|
@apply flex gap-[16rpx] items-center mt-[56rpx] ml-[16rpx] relative z-10;
|
|
}
|
|
|
|
.hi {
|
|
@apply w-[68rpx] h-[68rpx];
|
|
}
|
|
|
|
.title {
|
|
color: rgb(29, 33, 41);
|
|
font-size: 26px;
|
|
font-weight: 700;
|
|
line-height: 28px;
|
|
letter-spacing: 0;
|
|
text-align: left;
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #fff;
|
|
}
|
|
</style>
|