hfysite/pages/index.vue

<template>
  <div class="w-screen pad:w-full relative">
<!--    header 部分布局-->
    <lucency-header :lang="lang" page-key="index" :is-phone="isPhone" />
    <banner :banners="carousel" :wait-time="2500"/>
    <new-center  :lang="lang"/>
    <product-center  :lang="lang"/>
<!--    优势项目部分展示,参考海康-->
    <showing-stand :show-blocks="showBlocks" :lang="lang"/>
<!--    产品中心,参考大华,动态加载这部分内容-->
    <product-center v-if="!isPhone" :lang="lang"/>
<!--    页脚 -->
    <default-footer :lang="lang"/>

    <site-bar></site-bar>
  </div>
</template>

<script>
import lucencyHeader from "~/components/header/lucencyHeader";
import banner from "@/components/banner/banner";
import productCenter from "~/components/productCenter";
import showingStand from "~/components/showingStand";
import newCenter from "@/components/newCenter";
import defaultFooter from "~/components/footer/defaultFooter";
import langMap from "~/map/langMap";
import {handle} from "~/until/handle";
import {isMediaView} from "@/until/mediaView";
export default {
  components: { lucencyHeader,banner,showingStand,defaultFooter,productCenter,newCenter },
  props:['uLang'],
  data(){
    return {
      lang: this.uLang?this.uLang:langMap.lang.cn,
      isPhone: false,
    }
  },
  mounted() {
    this.$root.$on('changeLang',this.switchLang)
    this.isPhone = isMediaView(0,1024);
  },
  computed:{
    carousel(){
      // url转换
      return this.$store.state.index.carousel;
    },
    showBlocks(){
      return this.$store.state.index.showBlocks;
    },
  },
  methods:{
    switchLang(nextLang){
      // console.log("11111111111111111")
      if(nextLang){
        this.lang = nextLang;
      }else{
        if(this.lang === langMap.lang.cn){
          this.lang = langMap.lang.en
        }else{
          this.lang = langMap.lang.cn
        }
      }
    },

  }
}
</script>

<style>
body{
  background-color: #FDEEB7;
}
</style>