<template>
    <div>
        <!-- 头部 -->
        <page-header></page-header>

        <!--轮播图  -->
        <div id="myCarousel" class="carousel slide">
                <!-- 轮播（Carousel）指标 -->
                <ol class="carousel-indicators">
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                    <li data-target="#myCarousel" data-slide-to="1"></li>
                    <li data-target="#myCarousel" data-slide-to="2"></li>
                </ol>   
                <!-- 轮播（Carousel）项目 -->
                <div class="carousel-inner">
                    <div class="item active">
                        <img :src="banner1.image" alt="First slide">
                        
                        <div class="carousel-caption">{{banner1.title}}</div>
                    </div>
                    <div class="item">
                        <img :src="banner1.image" alt="Second slide">
                        <div class="carousel-caption">{{banner1.title}}</div>
                    </div>
                    <div class="item">
                        <img :src="banner1.image" alt="Third slide">
                        <div class="carousel-caption">{{banner1.title}}</div>
                    </div>
                </div>
            ​
            </div> 
        <!--关于我们  -->
        <div class="about container">
            <div class="top">
                <div class="top-top">
                    <h1>关于我们</h1>
                    <p>About us</p>
                </div>
                <div class="top-mid">
                    <router-link to="/xmsig/about/company" tag="div">
                            <img src="../assets/images/01.jpg" alt="">
                            <h2>公司文化</h2>
                            <p>从集成电路产业战略布局层面，践行国际化、</p>
                            <p>市场化、创新化管理概念</p>
                    </router-link>
                    <router-link to="/xmsig/investment" tag="div">
                        <img src="../assets/images/02.jpg" alt="">
                        <h2>投资业务</h2>
                        <p>公司坚持走科技兴业之路，积极开展科研攻关</p>
                        <p>努力提高综合实力和市场竞争力</p>
                    </router-link>
                    <router-link to="/xmsig/talents" tag="div">
                        <img src="../assets/images/03.jpg" alt="">
                        <h2>人才招聘</h2>
                        <p>推动集成电路产业投资发展，成为符合创新价值链</p>
                        <p>建设的核心中坚力量</p>
                    </router-link>
                </div>
            </div>
        </div>

        <!--公司简介  -->
        <div class="main">
            <div class="mid container">
                <div class="mid-mid">
                    <div class="mid-left">
                        <h1>公司简介</h1>
                        <p class="company">Company Profile</p>
                        <h1 class="xmbd">厦门半导体投资集团有限公司</h1>
                        <p class="dic">厦门半导体投资集团有限公司(简称：厦门半导体集团)是一家专注于半导体行业，以投资、并购和资本运营为主要业务，并坚持按市场机制独立运营的半导体投资公司。作为全球最大的集成电路市场，中国迎来了发展集成电路产业的历史机遇期，我国确定将集成电路产业作为战略性、基础性和先导性产业发展</p>
                        <div class="gengduo" @click='gomore'>MORE</div>
                    </div>
                    <div class="mid-right">
                        <img src="../assets/images/04.jpg" alt="">
                    </div>
                </div>
            </div>
        </div>

        <!--投资业务  -->

        <div class="investment">
            <div class="container">
                <div class="investment-left">
                    <h1>投资业务</h1>
                    <p>Investment Business</p>
                </div>
                <div class="investment-right">
                    <p>为客户提供最有竞争力的产品和专业的技术支持，实现双赢</p>
                    <router-link to="/xmsig/investment" tag="div">
                        查看详情
                    </router-link>
                </div>
            </div>
        </div>

        <!--联系我们  -->
        <div class="comtact">
            <div class="container">
                <div class="investment-left">
                    <h1>联系我们</h1>
                    <p>Comact Us</p>
                </div>
                <div class="comtact-mid">
                    <h1>厦门半导体投资集团有限公司</h1>
                    <p>地址：厦门市海沧区海沧大道555号，厦门中心E座30层</p>
                    <p>电话：+86-592-6899367</p>
                </div>
                <div class="comtact-right">
                    <p>邮编：361026</p>
                    <p>邮箱：info@xmsig.com</p>
                </div>
            </div>
        </div>
        <page-footer></page-footer>

    </div>

</template>
<script>
    // 公用
    import share from "./share.js";
    export default {
        name: "index",
        // 混入
        mixins: [share],
        data() {
            return {
                msg: "index",
                
                // divs: [
                //     { src: '../../static/images/01.jpg', h2: '公司文化', p1: '从集成电路产业战略布局层面，践行国际化、', p2: '市场化、创新化管理概念' },
                //     { src: '../../static/images/02.jpg', h2: '投资业务', p1: '公司坚持走科技兴业之路，积极开展科研攻关', p2: '努力提高综合实力和市场竞争力' },
                //     { src: '../../static/images/03.jpg', h2: '人才招聘', p1: '推动集成电路产业投资发展，成为符合创新价值链', p2: '建设的核心中坚力量' },
                // ],
                time: null,
                banner1:{},
                banner2:{},
                banner3:{}
            };
        },
        methods: {
            getLiveList() {
                this.$http.get('/api/slide?slide_id=1')
                    .then((res) => {
                        this.banner1=res.body.data[1]
                        this.banner2=res.body.data[2]
                        this.banner3=res.body.data[3]
                        console.log(this.banner1)
                        console.log(res.body.data[2])
                        // console.log(res.body.data[3])
                    })
                    .catch((err) => {
                        console.log(err)
                    })
                
            },
            gomore(){
                this.$router.push('/xmsig/about')
            },
            gomore1(){
                this.$router.push('/xmsig/about')
            },
            gomore2(){
                this.$router.push('/xmsig/about')
            },
            gomore2(){
                this.$router.push('/xmsig/about')
            }
        
           
        },
        created() {
            this.getLiveList()
        }
    };

</script>
<style scoped>
    .container{
        width: 1200px;
    }
    /* 轮播图 */

    .carousel {
        /* width: 100%; */
        min-width: 1200px;
        margin: 0 auto;
        /* height: auto; */
    }
    .active {
        background-color: #B59F4D !important;
    }

    .carousel-caption {
        font-size: 90px;
        font-weight: normal;
    }
    .carousel-indicators{
        margin-bottom: 30px;
        margin-top: 35px;
    }
    /*关于我们  */
    .about{
        padding-bottom: 140px;
    }
    .top-top {
        margin-top: 93px;
        margin-bottom: 110px;
    }
    .top-top p{
       margin-top: 20px; 
    }
    .top-mid {
        display: flex;
        justify-content: space-between;
    }

    /*公司简介  */

    .top-mid img {
        width: 352px;
    }

    .mid-mid {
        display: flex;
        justify-content: space-between;
        margin-top: 95px;
    }

    .mid .mid-left .xmbd{
        font-size: 18px;
    }

    .mid .mid-right img {
        width: 490px;
    }

    h1 {
        font-size: 24px;
        font-weight: bold;
    }

    p {
        /* font-size: 14px; */
        color: #aaa;
        
    }

    h2 {
        margin-top: 18px;
        margin-left: 17px;
    }

    .company {
        margin-top: 13px;
        margin-bottom: 82px;
    }

    .dic {
        width: 603px;
        margin-top: 28px;
    }

    .top-mid p {
        margin-top: 11px;
        margin-left: 17px;
        margin-bottom: 12px;
    }

    .top-mid div:hover {
        box-shadow: 15px 15px 30px 0px rgba(0, 0, 0, 0.1);
        transform: translate(0, 0px);
        transition: all 0.5s;
    }

    .main {
        /* width: 100%; */
        height: 600px;
        min-width: 1200px;
        background-color: #F7F7F7;
        background-position: center center;
        background-attachment: fixed;
    }

    .gengduo {
        /* display: inline-block; */
        width: 150px;
        height: 40px;
        margin-top: 30px;
        border: 1px solid #aaa;
        text-align: center;
        line-height: 40px;
        color: #aaa;
    }
    /*投资业务  */
    .investment {
        height: 220px;
        min-width: 1200px;
        background-image: url("../assets/images/05.jpg");

    }

    .investment .container {
        display: flex;
        width: 1200px;
    }

    .investment-right {
        width: 78%;
        text-align: center;
    }

    .investment-left h1 {
        margin-top: 81px;
        margin-bottom: 13px;
        font-size: 24px;
        color: #fff;
        font-weight: normal;
    }

    .investment-left P {
        color: #fff;
    }

    .investment-right p {
        margin-top: 70px;
        margin-bottom: 35px;
        color: #A69249;
        font-size: 20px;
    }

    .investment-right div {
        display: inline-block;
        width: 120px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        color: #fff;
        border: 1px solid #fff;
    }
    /*联系我们  */

    .comtact {
        min-width: 1200px;
        padding-bottom: 107px;
        background-color: #F7F7F7;
    }
    .comtact .investment-left{
        margin-top: 88px;
    }
    .comtact .investment-left h1 {
        margin-top:0;
        color: #000;
    }

    .comtact .investment-left p {
        color: #aaa;
    }

    .comtact .container {
        display: flex;
        width: 1200px;
        /* justify-content: space-between;  */
    }

    .comtact-mid {
        /* width: 65%;   */
        margin-left: 364px;
        margin-top: 88px;
    }

    .comtact-mid h1 {
        color: #aaa;
        font-size: 22px;
    }

    .comtact-mid p {
        margin-top: 55px;
        margin-bottom: -28px;
        color: #aaa;
    }

    .comtact-right {
        margin-top: 163px;
        margin-left: 137px;
    }

    .comtact-right p {
        margin-bottom: 27px;
    }
</style>