<template>
    <div class="contact">
        <default-navbar :navbarList="navbarList">
            <template slot="bg-content">
                <br>
                <br>
                <br>
                <br>
                <br>
            </template>
        </default-navbar>
        <div class="contact-content">
            <div class="contact-content-wrapper">
                <div class="text-title">
                    <!-- 關於我們 -->
                    <span class="english">CONTACT US</span>
                </div>
                <div class="contact-message">
                    <div class="message-item-wrapper">
                        <div class="message-item" v-for="item in messageList">
                            <div class="message-content">
                                <div class="line"></div>
                                <h1>{{item.title}}</h1>
                                <h2>{{item.titleSecond}}</h2>
                                <div class="contact-way" >
                                        <div class="contact-way-wrapper first" v-if="item.email && item.email!==''">
                                            <div class="icon">
                                                <i class="iconfont iconyoujian" style="font-size: 12px"></i>
                                            </div>
                                            <div class="contact-way-content">
                                                <a :href="'mailto:'+item.email"
                                                   class="email">{{item.email}}</a>
                                            </div>
                                        </div>
                                        <div class="contact-way-wrapper second" v-if="item.phone && item.phone!==''">
                                            <div class="icon">
                                                <i class="iconfont iconzuoji" style="font-size: 12px"></i>
                                            </div>
                                            <div class="contact-way-content">
                                                {{item.phone}}
                                            </div>
                                        </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
  import PageFooter from '@/components/footer/pageFooter'
  import DefaultNavbar from '@/components/navbar/navbar'
  import { asyncRouterMap,asyncRouterMap_EN } from '@/config/router.config'
 import {lang} from '@/utils/lang'
  export default {
    name: 'contact',
    data() {
      return {
        navbarList: [],
        messageList: [
          { title: '联系方式', email:'ULoiut3366@gmail.com',phone:''},

        ]
      }
    },
    components: {
      DefaultNavbar,
    },
    mounted() {
      this.init()
    },
    methods: {
      init() {
		  if(lang.lg == "en"){
		  	this.navbarList.push(...asyncRouterMap_EN.filter(f => !f.meta.hidden))
		  	this.messageList[0].title = lang.en.ContactWay
		  }else{
		  	this.navbarList.push(...asyncRouterMap.filter(f => !f.meta.hidden))
		  		this.messageList[0].title = lang.hk.ContactWay
		  }
		  

      },
    }
  }
</script>

<style lang="less" scoped>
    @import url('./contact.less');
</style>
