<template>
    <div class="contact">
        <default-navbar :navbarList="navbarList">
            <template slot="bg-content">
                <div class="bg-content">
                </div>
            </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>
        <page-footer></page-footer>
    </div>
</template>

<script>
  import PageFooter from '@/components/footer/pageFooter'
  import DefaultNavbar from '@/components/navbar/navbar'
  import { asyncRouterMap } from '@/config/router.config'

  export default {
    name: 'contact',
    data() {
      return {
        navbarList: [],
        messageList: [
          { title: '商务联系',titleSecond:'市场部', email:'business@funqueue.com',phone:'0755-23590084'},
          { title: '媒介联系',titleSecond:'市场部', email:' zhonghanlong@funqueue.com'},
          { title: '人力资源',titleSecond:'人力资源部', email:'hr@funqueue.com',phone:'0755-23590084'},
          { title: '客服电话',titleSecond:'客服部', phone:'0755-27083935'},

        ]
      }
    },
    components: {
      DefaultNavbar,
      PageFooter
    },
    mounted() {
      this.init()
    },
    methods: {
      init() {
        this.navbarList.push(...asyncRouterMap.filter(f => !f.meta.hidden))
      },
    }
  }
</script>

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