Blame view

src/views/about/index.vue 3.51 KB
4d0a73c0   liuqimichale   项目初始化
1
  <template>
8c48fe84   liuqimichale   关于我们 页面建立
2
3
4
5
6
7
8
9
10
    <div>
      <commonBanner mainTitle="中兴智能交通" subTitle="构建绿色交通 享受安全便利出行"></commonBanner>
      <div class="tab-wrapper">
        <ul class="tab-main widthCommon">
          <li
            v-for="(item, index) in tabData"
            :key="item"
            @click="changeTab(index,item)"
            :class="{tabActive:currentIndex==index}"
7098afd2   liuqimichale   关于我们 页面建立
11
12
          >{{item}}
          </li>
8c48fe84   liuqimichale   关于我们 页面建立
13
14
15
16
17
18
19
20
21
        </ul>
      </div>
      <div class="bread">
        <div class=" widthCommon">
          您所在位置: <span class="pointer" @click="$router.push({name:'home'})">首页</span> -> 产品中心 -> {{name}}
        </div>
      </div>
  
  
7fa18952   liuqimichale   关于我们 页面建立
22
23
24
25
26
27
28
      <div class="widthCommon anchor" style="text-align: center;margin-bottom: 53px">
        <p style="font-size: 18px">公司简介</p>
        <p style="font-size: 18px;padding: 22px 0 41px">COMPANY INTRODUCTION</p>
        <p style="font-size: 14px;line-height: 24px;">
  
          中兴智能交通股份有限公司成立于2000年4月,是致力于智能交通领域的专业公司,是中国首批从事智能交通(
          公司的主营业务面向城市交通(公安交通、公共交通、智慧停车),城际交通(高速公路和铁路)和综合交通信息服务领域,为城市公安交通、公共交通、智慧停车、高速公路和轨道交通五大综合交通运输领域提供交通规划、方案设计、系统建设、运营和服务,构建以智能交通核心技术的产品研发、生产、系统建设和维护为一体的动静态交通业务生态服务体系。为客户提供个性化的智能交通解决方案和技术服务。同时公司在以智慧停车产品的研发、生产、销售和服务为基础的静态交通服务的基础上,为用户提供
cec912a4   liuqimichale   关于我们 页面建立
29
30
31
32
33
34
35
36
37
38
39
40
41
  
          "
          互联网+智慧停车
          "的"O2O"运营服务。公司着力于整合动态交通和静态交通的信息数据资源,通过云计算技术和物联网技术,为客户提供全方位的交通管理与综合交通信息服务。
  
          公司秉承
  
          构建绿色交通,享受安全便利出行
  
          的使命,致力于为客户创造更大价值,矢志成为
  
          智能交通领域的领跑者
  
7fa18952   liuqimichale   关于我们 页面建立
42
43
        </p>
      </div>
7098afd2   liuqimichale   关于我们 页面建立
44
45
46
47
48
49
      <div class="widthCommon anchor" style="height: 400px;">2</div>
      <div class="bgCommon">
        <div class="widthCommon anchor" style="height: 400px;">3</div>
      </div>
      <div class="widthCommon anchor" style="height: 300px;">4</div>
      <div class="widthCommon anchor" style="height: 300px;">5</div>
8c48fe84   liuqimichale   关于我们 页面建立
50
51
  
    </div>
4d0a73c0   liuqimichale   项目初始化
52
53
54
  </template>
  
  <script>
8c48fe84   liuqimichale   关于我们 页面建立
55
  import commonBanner from '@/components/commonBanner'
7098afd2   liuqimichale   关于我们 页面建立
56
  
4d0a73c0   liuqimichale   项目初始化
57
  export default {
8c48fe84   liuqimichale   关于我们 页面建立
58
    name: 'index',
7098afd2   liuqimichale   关于我们 页面建立
59
    components: {
8c48fe84   liuqimichale   关于我们 页面建立
60
61
      commonBanner
    },
7098afd2   liuqimichale   关于我们 页面建立
62
63
64
65
    data() {
      return {
        tabData: [
          '公司简介', '发展历程', '企业文化', '资质认证', '荣誉证书'
8c48fe84   liuqimichale   关于我们 页面建立
66
        ],
7098afd2   liuqimichale   关于我们 页面建立
67
68
69
70
        currentIndex: 0,
        tabView: 'selectTab0',
        name: '',
        scroll: ''
8c48fe84   liuqimichale   关于我们 页面建立
71
72
      }
    },
7098afd2   liuqimichale   关于我们 页面建立
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
    mounted() {
      this.name = this.tabData[0]
    },
    methods: {
      dataScroll: function () {
        this.scroll =  document.documentElement.scrollTop || document.body.scrollTop
      },
      changeTab: function (index, item) {
        console.log(index)
        this.currentIndex = index
        this.tabView = 'selectTab' + index
        this.name = item
  
        // 对应锚点
        let jump = document.getElementsByClassName('anchor')
        let total = jump[index].offsetTop
        document.documentElement.scrollTop = total //firefox
        document.body.scrollTop = total //chrome
        window.pageYOffset = total
  
      },
8c48fe84   liuqimichale   关于我们 页面建立
94
95
96
  
    }
  
4d0a73c0   liuqimichale   项目初始化
97
98
99
  }
  </script>
  
8c48fe84   liuqimichale   关于我们 页面建立
100
101
102
  <style scoped lang="scss">
  
  
4d0a73c0   liuqimichale   项目初始化
103
  </style>