81 lines
2.0 KiB
Vue
81 lines
2.0 KiB
Vue
<template>
|
|
<view class="welcome-content border-box p-12">
|
|
<view class="wrap rounded-20">
|
|
<view
|
|
class="flex flex-items-center flex-justify-between border-box pl-12 pr-12"
|
|
>
|
|
<image
|
|
class="ip relative"
|
|
:src="initPageImages?.logoImageUrl"
|
|
mode="aspectFit"
|
|
/>
|
|
<view
|
|
class="welcome-text font-size-14 font-500 font-family-misans-vf color-171717 line-height-24"
|
|
>
|
|
{{ welcomeContent }}
|
|
</view>
|
|
</view>
|
|
|
|
<ChatMoreTips :guideWords="guideWords" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { defineProps, computed, getCurrentInstance, defineExpose } from "vue";
|
|
import ChatMoreTips from "../ChatMoreTips/index.vue";
|
|
|
|
const props = defineProps({
|
|
mainPageDataModel: {
|
|
type: Object,
|
|
default: () => {
|
|
return {
|
|
initPageImages: {
|
|
backgroundImageUrl: "",
|
|
logoImageUrl: "",
|
|
welcomeImageUrl: "",
|
|
},
|
|
welcomeContent:
|
|
"查信息、预定下单、探索玩法、呼叫服务、我通通可以满足，快试试问我问题吧!",
|
|
guideWords: [
|
|
"定温泉票",
|
|
"定酒店",
|
|
"优惠套餐",
|
|
"亲子玩法",
|
|
"了解交通",
|
|
"看看酒店",
|
|
"看看美食",
|
|
],
|
|
};
|
|
},
|
|
},
|
|
});
|
|
|
|
const initPageImages = computed(() => props.mainPageDataModel.initPageImages);
|
|
const welcomeContent = computed(() => props.mainPageDataModel.welcomeContent);
|
|
const guideWords = computed(() => props.mainPageDataModel.guideWords);
|
|
|
|
// Welcome 可视状态与高度
|
|
const instance = getCurrentInstance();
|
|
|
|
// 测量欢迎区域高度
|
|
const measureWelcomeHeight = (callback) => {
|
|
uni
|
|
.createSelectorQuery()
|
|
.in(instance)
|
|
.select(".welcome-content")
|
|
.boundingClientRect((res) => {
|
|
if (res && res.height) {
|
|
callback(res);
|
|
}
|
|
})
|
|
.exec();
|
|
};
|
|
|
|
defineExpose({ measureWelcomeHeight });
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "./styles/index.scss";
|
|
</style>
|