Commit e3bd38c7 authored by tyyin lan's avatar tyyin lan

feat: 首页部分内容布局

parent aaa10213
<script setup lang="ts"> <script setup lang="ts">
import { ref, watchEffect } from 'vue'
import Sidebar from './components/sidebar/sidebar.vue' import Sidebar from './components/sidebar/sidebar.vue'
import { useRoute } from 'vue-router'
const route = useRoute()
const layoutSideWidth = 243 const layoutSideWidth = 243
const isShowMainContentContainerPadding = ref(true)
watchEffect(() => {
if (route.name === 'Home') {
isShowMainContentContainerPadding.value = false
} else if (!isShowMainContentContainerPadding.value) {
isShowMainContentContainerPadding.value = true
}
})
</script> </script>
<template> <template>
...@@ -16,7 +30,10 @@ const layoutSideWidth = 243 ...@@ -16,7 +30,10 @@ const layoutSideWidth = 243
</NLayoutSider> </NLayoutSider>
<NLayoutContent class="bg-[#f3f6f9]! flex-1"> <NLayoutContent class="bg-[#f3f6f9]! flex-1">
<main class="box-border h-full px-6 py-4"> <main
class="main-content-container box-border h-full transition-[padding] duration-300 ease-in-out"
:class="{ 'px-6': isShowMainContentContainerPadding, 'py-4': isShowMainContentContainerPadding }"
>
<RouterView v-slot="{ Component }"> <RouterView v-slot="{ Component }">
<Transition appear name="fade-slide" mode="out-in"> <Transition appear name="fade-slide" mode="out-in">
<Component :is="Component" /> <Component :is="Component" />
......
buttons: home_module:
btnLogin: '登录' agent_welcome_message: 'Hi, 歡迎使用SuperLink'
agent_description: '在这里,你可以体验多个平台的模型和专属的智能体'
buttons: home_module:
btnLogin: '登錄' agent_welcome_message: 'Hi, 歡迎使用SuperLink'
agent_description: '在這裏,你可以體驗多個平臺的模型和專屬的智'
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
</script>
<template>
<div class="flex items-center">
<img class="h-[70px] w-[70px] rounded-full" src="@/assets/images/agent-avatar.png" alt="代理人頭像" />
<div class="ml-[20px]">
<h2 class="font-600 mb-[14px] text-[26px]">{{ t('home_module.agent_welcome_message') }}</h2>
<div class="text-theme-color text-[18px]">{{ t('home_module.agent_description') }}</div>
</div>
</div>
</template>
<script setup lang="ts"></script>
<template>
<div class="h-full py-[24px]">
<div class="w-[249px] rounded-[10px] bg-[#ECEFFF]"></div>
</div>
</template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted } from 'vue' import AgentAbout from './components/agent-about.vue'
onMounted(() => {
console.log('----加载----')
console.log()
})
</script> </script>
<template> <template>
<h1 class="text-2xl">Home Page</h1> <div class="bg-px-home-bg-png h-full w-full bg-contain bg-center bg-no-repeat">
<div class="mx-auto w-[740px] px-[5px] pt-[71px]">
<AgentAbout />
</div>
</div>
</template> </template>
<style lang="scss" scoped>
.main-content-container {
background-color: skyblue;
}
</style>
...@@ -338,6 +338,7 @@ function handleEmailCodeGain() { ...@@ -338,6 +338,7 @@ function handleEmailCodeGain() {
<n-form-item path="password"> <n-form-item path="password">
<n-input <n-input
v-model:value="passwordLoginForm.password" v-model:value="passwordLoginForm.password"
class="font-sans"
:allow-input="noSideSpace" :allow-input="noSideSpace"
type="password" type="password"
show-password-on="click" show-password-on="click"
......
...@@ -2,8 +2,9 @@ declare namespace I18n { ...@@ -2,8 +2,9 @@ declare namespace I18n {
type LangType = 'zh-HK' | 'zh-CN' type LangType = 'zh-HK' | 'zh-CN'
type Schema = { type Schema = {
buttons: { home_module: {
btnLogin: string agent_welcome_message: string
agent_description: string
} }
} }
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment