yqym/src/components/promotionalPageComponents/header.vue
2024-02-26 11:01:08 +08:00

60 lines
1.5 KiB
Vue

<template>
<div>
<div class="header">
<div class="left">
<!-- 目录和搜索 -->
<!-- <el-icon color="#fee7aa"><Menu /></el-icon>
<div class="icon" @click="about">目录</div> -->
<el-page-header
@click="home()"
:icon="ArrowLeft"
title="返回"
style="color: rgb(255, 255, 255);"
>
<template #content></template>
</el-page-header>
</div>
<div style="position: fixed; top: 6%; left: 50%; transform: translate(-50%, -50%);">
<img src="../../assets/logo.png" style="width: 80px; height: 80px;" :style="{'margin-left': leftWidth}" />
</div>
<div class="right">
<!-- 注册和登录 -->
<el-icon color="white"><Coin /></el-icon>
<div class="icon" @click="register">注册</div>
<el-icon color="white"><Check /></el-icon>
<div class="icon" @click="login">登录</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
methods: {
//路由方法
pickingDetails() {
this.$router.push({ name: "pickingDetails" });
},
login() {
this.$router.push({ name: "login" });
},
register() {
this.$router.push({ name: "register" });
},
about() {
this.$router.push({ name: "about" });
},
home() {
this.$router.push({ name: "home" });
}
},
};
</script>
<style scoped>
@import "../../assets/css/header.css";
</style>