File: /var/www/dk/wp-content/themes/food/food-app/components/yq-header-bizroadshow.vue
<template>
<div style="background: #333333;">
<div class=" p-[0.2rem] main-footer rounded-[0.2rem] w-100 md:w-[768px] md:mx-auto xl:w-[1280px]">
<pc-header class=" hidden xl:flex fixed top-0 z-40 md:w-[768px] md:mx-auto xl:w-[1280px] items-center">
<a href="/zone_bizroadshow" class=" flex ml-[0.08rem] items-center">
<div class=" w-[2.4rem] h-[0.77rem]">
<!-- flex-shrink-0-->
<img class="h-full" :src="local_url+'img/BizRoadShow/组%201249@2x.png'" alt="logo"/>
</div>
<div class=" text-[0.23rem] leading-[0.35rem] font-bold text-1E2B5C ml-[0.1rem]"></div>
</a>
<div class=" ml-auto flex px-[0.2rem] items-center w-[3rem] h-[0.36rem] bg-f5 rounded-full">
<input v-model="search" @keyup.enter="hdSearch" placeholder="Search"
class=" text-[0.18rem] leading-[0.2rem] outline-none w-full h-full bg-f5" type="text">
<img @click="hdSearch" class=" w-[0.24rem] h-[0.24rem] flex-shrink-0 cursor-pointer"
:src="local_url+'img/search.png'" alt="search">
</div>
</pc-header>
<div class=" hidden xl:flex h-[0.62rem]"></div>
<header class=" w-100 md:w-[768px] md:mx-auto h-[1rem] flex xl:hidden items-center px-[0.3rem]">
<a href="/zone_bizroadshow" class=" flex ml-[0.08rem] items-center flex-1">
<!-- <img class=" w-[0.6rem] h-[0.6rem] flex-shrink-0" :src="local_url+'img/logo.png'" alt="logo"/>h-[0.6rem] -->
<img class="w-[1.87rem] flex-shrink-0" :src="local_url+'img/BizRoadShow/组%201249@2x.png'" alt="logo"/>
<div class=" text-[0.35rem] leading-[0.48rem] font-bold text-1E2B5C ml-[0.1rem]"></div>
<!-- <div class=" mx-[0.15rem]">|</div>
<img class=" w-[1.1rem] h-[0.5rem] flex-shrink-0" :src="local_url+'img/header-logo2.png'" alt="logo2"/> -->
</a>
<a-dropdown :trigger="['click']">
<img class=" w-[0.48rem] h-[0.48rem] ml-[0.2rem] flex-shrink-0" :src="local_url+'img/menu.png'" alt="menu"/>
<a-menu slot="overlay">
<a-menu-item key="0">
<a href="/">主頁</a>
</a-menu-item>
<a-menu-item key="0">
<a href="/zone">專區</a>
<!-- <a href="/food-home/#part1">招牌商品</a>-->
</a-menu-item>
<a-menu-item key="0">
<a href="/member services">會員服務</a>
</a-menu-item>
<a-menu-item key="0">
<a href="/home/#mall_channel">關於Biz Road Show</a>
</a-menu-item>
<a-menu-item key="0">
<a href="/category/infos/" style="color:white">資料查詢</a>
</a-menu-item>
<!-- <a-menu-item key="0">-->
<!-- <a href="/">餐飲主頁</a>-->
<!-- </a-menu-item>-->
</a-menu>
</a-dropdown>
</header>
<nav class=" w-100 md:w-[768px] md:mx-auto h-[1rem] flex xl:hidden items-center px-[0.3rem]">
</nav>
<div class="flex items-center text-white">
<div class="w-auto mx-1">
<div class=" text-[0.2rem]"><a href="/zone">專區</a></div>
</div>
<div class="w-auto mx-1">
<div class=" text-[0.2rem]"><a href="/member services">會員服務</a></div>
</div>
<div class="w-auto mx-1">
<div class=" text-[0.2rem]"><a href="/home/#mall_channel">關於 Biz Road Show</a></div>
</div>
<div class="w-auto mx-1">
<div class=" text-[0.2rem]"><a href="/category/infos/">資料查詢</a></div>
</div>
<div class=" flex ml-auto">
<div v-if="user_info.ID > 0" class="text-center mt-0.5 mr-[0.26rem] relative">
<a href="/food-shop-car"
class=" ml-[0.04rem] text-white text-[0.18rem] leading-[0.2rem]"><img
:src="local_url+'img/MedicalMediaChannel/cart.png'" class="w-[0.46rem] h-[0.46rem]">
<div style="background: #EA6908;"
class=" text-white text-[0.18rem] absolute w-[0.36rem] h-[0.26rem] rounded-[0.13rem] left-[-0.18rem] top-[0.1rem]">
<span class="mb-[0.1rem]">{{ user_info.cart_num }}</span>
</div>
</a>
</div>
<div v-if="user_info.ID > 0" class="text-center mt-0.5 mr-[0.26rem]"><img :src="local_url+'img/MedicalMediaChannel/ring.png'"
class="w-[0.46rem] h-[0.46rem]">
</div>
<div v-if="user_info.ID > 0" class="text-center mt-0.5 mr-[0.26rem]"><img
:src="local_url+'img/MedicalMediaChannel/setting.png'"
class="w-[0.46rem] h-[0.46rem]"></div>
<div v-if="user_info.ID == 0" @click="showLoginModel()"
class=" cursor-pointer text-white text-[0.18rem] leading-[0.2rem] mt-0.5">登入/註冊
</div>
<a-dropdown v-else class=" mt-0.5 " :trigger="['click']">
<div class=" flex items-center cursor-pointer">
<img class="w-[0.46rem] h-[0.46rem]" :src="local_url+'img/MedicalMediaChannel/user.png'" alt="user"/>
<div class=" ml-[0.16rem] text-white text-[0.18rem] leading-[0.2rem]">{{ user_info.user_name }}</div>
</div>
<a-menu slot="overlay">
<a-menu-item key="0">
<a @click="loginOut">退出</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</div>
</div>
</div>
<yq-model ref="login"></yq-model>
</div>
</template>
<script>
module.exports = {
props: {
search_text: {
type: String,
default: ""
}
},
components: {
'yq-model': httpVueLoader(local_url + 'components/yq-modal.vue?v=2'),
},
data() {
return {
search: ""
}
},
created() {
this.search = this.search_text
},
methods: {
toUserInfo(key) {
sessionStorage.user_active_nav = key
window.location.href = "/food-user"
},
hdSearch() {
if (window.location.href.indexOf("food-search") > -1) {
this.$emit('search', this.search)
} else {
sessionStorage.search_text = this.search
window.location.href = "/food-search"
}
},
showLoginModel() {
this.$refs.login.changeShow()
},
loginOut() {
let postForm = document.createElement("form");
postForm.method = "post";
postForm.action = "";
postForm.style = "display:none";
let actionInput = document.createElement("input");
actionInput.setAttribute("name", 'action');
actionInput.setAttribute("value", 'loginout');
postForm.appendChild(actionInput);
document.body.appendChild(postForm);
postForm.submit();
},
}
}
</script>