<template>
|
<div class="app-container">
|
<h1 style="font-size: 21px;">{{ greeting +',' + user.userName }}</h1>
|
<div class="image-container">
|
<img class="top-image" src="../../assets/images/zhang.png" alt="Top Image">
|
<img class="bottom-image" src="../../assets/images/bkg.png" alt="Bottom Image">
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { getUserProfile } from "@/api/system/user";
|
import { listRootAll } from "@/api/root/index";
|
export default {
|
name: "index",
|
data() {
|
return {
|
user: {},
|
greeting: "",
|
rootList:[]
|
};
|
},
|
mounted() {
|
this.setGreeting();
|
this.getUser();
|
},
|
methods: {
|
setGreeting() {
|
const currentTime = new Date();
|
const currentHour = currentTime.getHours();
|
|
if (currentHour < 12) {
|
this.greeting = "早上好";
|
} else if (currentHour < 14) {
|
this.greeting = "中午好";
|
} else if (currentHour < 18) {
|
this.greeting = "下午好";
|
} else {
|
this.greeting = "晚上好";
|
}
|
},
|
|
getUser() {
|
getUserProfile().then(response => {
|
this.user = response.data;
|
});
|
listRootAll().then(response =>{
|
this.rootList =response.data;
|
console.log(this.rootList)
|
})
|
|
}
|
}
|
|
}
|
</script>
|
|
<style scoped>
|
.app-container{
|
background-color: #FEF7FC;
|
}
|
|
.image-container {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
}
|
|
|
.top-image {
|
width: 50%;
|
/*height: 100%;*/
|
object-fit: cover;
|
position: absolute;
|
top: 0;
|
right: 0;
|
opacity: 1;
|
}
|
|
.bottom-image {
|
z-index: 1; /* 设置底层图片的层级为1 */
|
width: 100%;
|
height: 100%;
|
/*position: absolute;*/
|
top: 0;
|
}
|
|
|
</style>
|