beelink/src/components/login/LoginTab.vue
2020-12-10 18:15:44 +08:00

51 lines
1.0 KiB
Vue

<template>
<div class="logintab">
<div :class="selected==1?'tab tab1':'tab'" @mouseover="tabchange(1)">{{lan.$t("shoujidenglu")}}</div>
<div :class="selected==2?'tab tab1':'tab'" @mouseover="tabchange(2)">{{lan.$t("mimadenglu")}}</div>
</div>
</template>
<script lang="ts">
import { useI18n } from '@/utils/i18n';
import { defineComponent , ref} from "vue";
export default defineComponent({
name: "LoginTab",
components: {},
setup(prop,context) {
const lan: any = useI18n();
const selected=ref(1)
function tabchange(e: number): void{
selected.value=e
context.emit("sel",e)
}
return {
selected,
tabchange,
lan
};
},
});
</script>
<style lang="scss" scoped>
.logintab{
display: flex;
.tab{
width: 130px;
height: 29px;
border-radius: 14px;
cursor: pointer;
font-weight: bold;
text-align: center;
font-size: 11px;
line-height: 28px;
}
.tab1{
background: #08AE98;
color: white;
}
}
</style>