File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<header>
<div :class="className === 'side' ? 'flex-between' : ''">
<div class="logo" :style="logoStyle">
<a href="/">
<img src="../../resources/img/logo.png" alt="BI MANAGER LOGO">
</a>
</div>
<div class="user-info flex-end">
<div class="sms">
<svg-icon type="mdi" :path="mdiEmail" color="#213f99"></svg-icon>
</div>
<div class="user flex">
<div class="user-img">
<svg-icon type="mdi" :path="mdiAccountCircle" color="#213f99"></svg-icon>
</div>
<span class="user-name">000님</span>
</div>
<Button :className="'logout-btn'" :btnName="'로그아웃'" />
</div>
</div>
</header>
</template>
<script>
import Button from '../component/Button.vue';
import SvgIcon from '@jamescoyle/vue-icon'
import { mdiEmail, mdiAccountCircle } from '@mdi/js'
export default {
props: {
className: String
},
data() {
return {
mdiEmail: mdiEmail,
mdiAccountCircle: mdiAccountCircle
}
},
methods: {
},
watch: {
},
computed: {
logoStyle() {
if (this.className === 'top') {
return {
position: 'absolute',
top:'50%',
left:'50%',
transform: 'translate(-50%,-50%)'
}
} else {
return {}
}
}
},
components: {
'Button': Button,
'SvgIcon': SvgIcon
},
mounted() {
console.log('Header mounted');
}
}
</script>