<!DOCTYPE html>
<html lang="zh">
<head>
    <meta
            name="viewport"
            content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta charset="utf-8"/>
    <title>首页</title>
    <meta name="keywords"/>
    <meta name="description"/>
    <meta name="format-detection" content="telephone=no"/>
    <link rel="stylesheet" href="./css/animate.min.css"/>
    <link rel="stylesheet" href="./css/aos.css"/>
    <link rel="stylesheet" href="./css/common.css"/>
    <link rel="stylesheet" href="./css/swiper.css"/>
    <link rel="stylesheet" href="./css/index.css"/>
</head>

<body id="index">
<div class="home">
    <div class="cursor">
        <div class="scale">
            <svg
                    xmlns="http://www.w3.org/2000/svg"
                    width="119"
                    height="119"
                    viewBox="0 0 119 119"
                    fill="none"
            >
                <g filter="url(#filter0_b_3414_13507)">
                    <circle
                            cx="59.5"
                            cy="59.5"
                            r="59.5"
                            fill="white"
                            fill-opacity="0.19"
                    />
                    <circle cx="59.5" cy="59.5" r="59" stroke="white"/>
                </g>
                <defs>
                    <filter
                            id="filter0_b_3414_13507"
                            x="-8"
                            y="-8"
                            width="135"
                            height="135"
                            filterUnits="userSpaceOnUse"
                            color-interpolation-filters="sRGB"
                    >
                        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
                        <feGaussianBlur in="BackgroundImageFix" stdDeviation="4"/>
                        <feComposite
                                in2="SourceAlpha"
                                operator="in"
                                result="effect1_backgroundBlur_3414_13507"
                        />
                        <feBlend
                                mode="normal"
                                in="SourceGraphic"
                                in2="effect1_backgroundBlur_3414_13507"
                                result="shape"
                        />
                    </filter>
                </defs>
            </svg>
            <div class="text">查看更多</div>
        </div>
    </div>
    <div id="commonHead"></div>
    <div class="loading">
        <video
                src="./images/loading.mp4"
                id="myVideo"
                loop
                muted
                autoplay
                playsinline
                webkit-playsinline
        ></video>
    </div>
    <div id="apps">
        <div class="banner">
            <div class="swiper-container swiper">
                <div class="swiper-wrapper">
                    <template v-for="item in bannerList">
                        <div class="swiper-slide">
                            <div class="slide-inner">
                                <div class="item">
                                    <video
                                            v-if="item.category==1"
                                            :src="item.videoUrl"
                                            autoplay
                                            loop
                                            muted
                                            playsinline
                                            webkit-playsinline
                                    ></video>
                                    <img
                                            class="lazy"
                                            v-if="item.category==0"
                                            :src="item.picUrl"
                                            alt=""
                                    />

                                    <div class="text">
                                        <p class="p1">{{item.name}}</p>
                                        <p class="p2" v-if="item.content">{{item.content}}</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </template>
                </div>
            </div>
            <div class="prev">
                <svg
                        xmlns="http://www.w3.org/2000/svg"
                        width="68"
                        height="68"
                        viewBox="0 0 68 68"
                        fill="none"
                >
                    <path
                            d="M41.0833 17L24.0833 34L41.0833 51"
                            stroke="white"
                            stroke-width="3"
                    />
                </svg>
            </div>
            <div class="next">
                <svg
                        xmlns="http://www.w3.org/2000/svg"
                        width="68"
                        height="68"
                        viewBox="0 0 68 68"
                        fill="none"
                >
                    <path
                            d="M26.9166 17L43.9166 34L26.9166 51"
                            stroke="white"
                            stroke-width="3"
                    />
                </svg>
            </div>
            <div class="swiper-pagination"></div>
            <!-- <div class="scroll">
                      <div class="line"></div>
                  </div> -->
        </div>
    </div>
    <div class="section_new">
        <div class="lb">
            <div class="box1">
                 <img src="./images/new1.png" alt="">
                 <div class="text">
                    <p class="p1">INDUSTRIES</p>
                    <p class="p2">行业应用</p>
                 </div>
            </div>
            <div class="box2">
                 <a href="./electricity.html">
                    <img src="./images/new2.png" alt="">
                    <div class="text">
                        <p class="p1">用电产业</p>
                        <p class="p2">
                            领先的智能用电整体解决方案提供商，<br>
                            稳居行业龙头
                        </p>
                    </div>
                </a>
            </div>
        </div>
        <div class="rb">
            <div class="box_top">
                <div class="rb_left">
                    <a href="./air.html">
                        <img src="./images/new3.png" alt="">
                        <div class="text">
                            <p class="p1">空调</p>
                            <p class="p2">
                                致力成为基于互联网、智能化的家电产业集团
                            </p>
                        </div>
                    </a>
                    <a href="./direction.html">
                        <img src="./images/new4.png" alt="">
                        <div class="text">
                            <p class="p1">配电产品</p>
                            <p class="p2">
                                致力于成为全球配电客户价值链一体化合作商
                            </p>
                        </div>
                    </a>
                </div>
                <div class="rb_right">
                    <a href="./new_energy.html">
                        <img src="./images/new5.png" alt="">
                        <div class="text">
                            <p class="p1">新能源</p>
                            <p class="p2">
                                创新驱动发展，绿能引领未来
                            </p>
                        </div>
                    </a>
                </div>
            </div>
            <div class="box_bottom">
                <div class="rb_left">
                    <img src="./images/new6.png" alt="">
                    <div class="text">
                        <div class="p1">
                            创业<span class="count-item" data-to="38">0</span>年
                        </div>
                        <div class="des">
                            塑造“稳重、平和、诚信、可靠”企业形象
                        </div>
                    </div>
                </div>
                <div class="rb_right">
                    <a href="./medical.html">
                        <img src="./images/new7.png" alt="">
                        <div class="text">
                            <p class="p1">医疗</p>
                            <p class="p2">
                                致力成为中国领先的医疗服务投资管理集团
                            </p>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <div class="section1" style="display: none;">
        <div class="fix">
            <div class="bg">
                <img src="./images/bg1.png" alt=""/>
            </div>
            <div class="content">
                <div class="y">
                    <div class="t1">Five Major Business Segments</div>
                    <div class="t2">
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="51"
                                height="40"
                                viewBox="0 0 51 40"
                                fill="none"
                        >
                            <path
                                    d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                    fill="url(#paint0_linear_3414_13513)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_13513"
                                        x1="25.5"
                                        y1="0"
                                        x2="25.5"
                                        y2="40"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="white" stop-opacity="0"/>
                                    <stop offset="1" stop-color="white"/>
                                </linearGradient>
                            </defs>
                        </svg>
                        <p>五大业务板块</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="51"
                                height="40"
                                viewBox="0 0 51 40"
                                fill="none"
                        >
                            <path
                                    d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                    fill="url(#paint0_linear_3414_13512)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_13512"
                                        x1="25.5"
                                        y1="0"
                                        x2="25.5"
                                        y2="40"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="white" stop-opacity="0"/>
                                    <stop offset="1" stop-color="white"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </div>
                    <div class="pics">
                        <a href="./air.html">
                            <div class="pic">
                                <img src="./images/pic1.png" alt=""/>
                                <img src="./images/svg.png" class="svg" alt=""/>
                            </div>
                            <div class="text">
                                <p class="p1">空调</p>
                                <div class="des">
                                    致力成为基于互联网、智能化的家电产业集团
                                </div>
                            </div>
                        </a>
                        <a href="./direction.html">
                            <div class="pic">
                                <img src="./images/pd.png" alt=""/>
                                <img src="./images/svg.png" class="svg" alt=""/>
                            </div>
                            <div class="text">
                                <p class="p1">配电产品</p>
                                <div class="des">
                                    致力于成为全球配电客户价值链一体化合作商
                                </div>
                            </div>
                        </a>
                        <a href="./electricity.html">
                            <div class="pic">
                                <img src="./images/pic3.png" alt=""/>
                                <img src="./images/svg.png" class="svg" alt=""/>
                            </div>
                            <div class="text">
                                <p class="p1">用电产业</p>
                                <div class="des">
                                    领先的智能用电整体解决方案提供商，稳居行业龙头
                                </div>
                            </div>
                        </a>
                        <a href="./medical.html">
                            <div class="pic">
                                <img src="./images/meban.png" alt=""/>
                                <img src="./images/svg.png" class="svg" alt=""/>
                            </div>
                            <div class="text">
                                <p class="p1">医疗</p>
                                <div class="des">
                                    致力成为中国领先的医疗服务投资管理集团
                                </div>
                            </div>
                        </a>
                        <a href="./new_energy.html">
                            <div class="pic">
                                <img src="./images/xny.png" alt=""/>
                                <img src="./images/svg.png" class="svg" alt=""/>
                            </div>
                            <div class="text">
                                <p class="p1">新能源</p>
                                <div class="des">创新驱动发展，绿能引领未来</div>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="section2">
        <div class="bg-mask"></div>
        <div class="about-label">
            <div class="jm-fade-show autoHeight">
                <div class="fix">
                    <p class="p1">About</p>
                    <p class="p2">AUX</p>
                </div>
            </div>
        </div>
        <div class="about-content autoHeight">
            <div class="fix">
                <div class="des">
                    <p>
                        始创于1986年的奥克斯集团，产业涵盖<br>
                        空调、用电、配电、新能源、医疗等领域，<br>
                        连续多年位列中国企业500强。
                    </p>
                </div>
                <div class="scale">
                    <h3>智慧健康生活</h3>
                    <a href="./about.html" class="more">
                        <p>查看更多</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="53"
                                height="42"
                                viewBox="0 0 53 42"
                                fill="none"
                        >
                            <path
                                    d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                    fill="url(#paint0_linear_3414_14078)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_14078"
                                        x1="26.5"
                                        y1="0"
                                        x2="26.5"
                                        y2="42"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="white" stop-opacity="0"/>
                                    <stop offset="1" stop-color="white"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </a>
                </div>
            </div>
        </div>
        <div class="nums">
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="5">0</p>
                    <span>大</span>
                </div>
                <div class="tag">产业板块</div>
            </div>
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="510">0</p>
                    <span>亿</span>
                </div>
                <div class="tag">品牌价值</div>
            </div>
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="726">0</p>
                    <span>亿</span>
                </div>
                <div class="tag">总资产</div>
            </div>
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="2">0</p>
                    <span>家</span>
                </div>
                <div class="tag">上市公司</div>
            </div>
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="860">0</p>
                    <span>亿</span>
                </div>
                <div class="tag">营收</div>
            </div>
            <div class="item">
                <div class="p1">
                    <p class="num count-item" data-to="14">0</p>
                    <span>大</span>
                </div>
                <div class="tag">制造基地</div>
            </div>
        </div>
        <div class="product-label" aos="fade-up">
            <h2 class="en_num_light">AUX</h2>
        </div>
    </div>
    <div class="section3">
        <div class="fix">
            <div class="mask">
                <!-- <img src="./images/mask.gif" alt=""> -->
                <video
                        src="https://qiniu.mfdemo.cn/aux/video6.mp4"
                        autoplay
                        muted
                        loop
                ></video>
            </div>
            <div class="tc">
                <img class="lazy" data-src="./images/txb.png" alt=""/>
            </div>
            <div class="lc1">
                <img class="lazy" data-src="./images/lc1.png" alt=""/>
            </div>
            <div class="lc2">
                <img class="lazy" data-src="./images/lc2.png" alt=""/>
            </div>
            <div class="box_right box">
                <div class="t" style="margin-bottom: 1.5vw;">
                    <p>全球十四大制造基地</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="51"
                            height="40"
                            viewBox="0 0 51 40"
                            fill="none"
                    >
                        <path
                                d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                fill="url(#paint0_linear_3670_249)"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3670_249"
                                    x1="25.5"
                                    y1="0"
                                    x2="25.5"
                                    y2="40"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="#003B83" stop-opacity="0"/>
                                <stop offset="1" stop-color="#003B83"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </div>
                <div class="t2" style="line-height: 2.5">
                    宁波(3家)、南昌、天津、马鞍山、芜湖、郑州、波兰、泰国、印尼、巴西、德国、墨西哥
                </div>
                <div class="t" style="margin-bottom: 1.5vw;">
                    <p>六大研发中心</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="51"
                            height="40"
                            viewBox="0 0 51 40"
                            fill="none"
                    >
                        <path
                                d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                fill="url(#paint0_linear_3670_249)"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3670_249"
                                    x1="25.5"
                                    y1="0"
                                    x2="25.5"
                                    y2="40"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="#003B83" stop-opacity="0"/>
                                <stop offset="1" stop-color="#003B83"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </div>
                <div class="t2">
                    宁波、杭州、南京、珠海、深圳、日本
                </div>
            </div>
            <div class="box_left box">
                <div class="t">
                    <p>科研智造</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="51"
                            height="40"
                            viewBox="0 0 51 40"
                            fill="none"
                    >
                        <path
                                d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                fill="url(#paint0_linear_3670_249)"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3670_249"
                                    x1="25.5"
                                    y1="0"
                                    x2="25.5"
                                    y2="40"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="#003B83" stop-opacity="0"/>
                                <stop offset="1" stop-color="#003B83"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </div>
                <!-- <div class="t2">规划年产能</div> -->
                <div class="nums">
                    <div class="item">
                        <div class="p1">
                            <p class="num">6.7</p>
                            <span>%</span>
                        </div>
                        <div class="tag">年研发投入占销售额</div>
                    </div>
                    <div class="item">
                        <div class="p1">
                            <p class="num count-item" data-to="20117">0</p>
                            <span>项</span>
                        </div>
                        <div class="tag">拥有专利数</div>
                    </div>
                    <div class="item">
                        <div class="p1">
                            <p class="num count-item" data-to="4">0</p>
                            <span>家</span>
                        </div>
                        <div class="tag">高新技术企业</div>
                    </div>
                    <div class="item">
                        <div class="p1">
                            <p class="num count-item" data-to="20">0</p>
                            <span>个</span>
                        </div>
                        <div class="tag">国家级科技项目</div>
                    </div>
                    <div class="item">
                        <div class="p1">
                            <p class="num count-item" data-to="209">0</p>
                            <span>项</span>
                        </div>
                        <div class="tag">国家及行业标准制定</div>
                    </div>
                    <div class="item">
                        <div class="p1">
                            <p class="num count-item" data-to="3">0</p>
                            <span>个</span>
                        </div>
                        <div class="tag">CNAS国家级实验室</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="section4" style="display: none;">
        <div class="box on">
            <div class="map">
                <div class="map_f">
                    <div class="map_list on">
                        <img class="lazy" data-src="./images/map1.png" alt=""/>
                    </div>
                    <div class="map_list">
                        <img src="./images/map2.png" alt=""/>
                    </div>
                    <div class="map_list">
                        <img src="./images/map3.png" alt=""/>
                    </div>
                </div>
            </div>
            <div class="sit">
                <div class="sit_list on">
                    <div class="title" aos="fade-up">
                        <div class="t1">Medical ＆ health strategy</div>
                        <div class="t2">
                            <p>医疗健康战略</p>
                            <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    width="51"
                                    height="40"
                                    viewBox="0 0 51 40"
                                    fill="none"
                            >
                                <path
                                        d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                        fill="url(#paint0_linear_3414_13703)"
                                />
                                <defs>
                                    <linearGradient
                                            id="paint0_linear_3414_13703"
                                            x1="25.5"
                                            y1="0"
                                            x2="25.5"
                                            y2="40"
                                            gradientUnits="userSpaceOnUse"
                                    >
                                        <stop stop-color="#003B83" stop-opacity="0"/>
                                        <stop offset="1" stop-color="#003B83"/>
                                    </linearGradient>
                                </defs>
                            </svg>
                        </div>
                    </div>
                    <div class="content" aos="fade-up" aos-delay="200">
                        <div class="pic1">
                            <!--                    <img class="lazy" data-src="./images/three1.png" alt=""/>-->
                        </div>
                        <div class="map">
                            <!--                    <img class="lazy" data-src="./images/map1.png" alt=""/>-->
                        </div>
                        <div class="t1">致力成为中国领先的医疗服务投资管理集团</div>
                        <div class="t2">
                            Devoted to be a leading medical service investment and
                            management group in China
                        </div>
                    </div>
                </div>
                <div class="sit_list">
                    <div class="title">
                        <div class="t1">Internet and intelligence strategy</div>
                        <div class="t2">
                            <p>互联网、智能化战略</p>
                            <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    width="51"
                                    height="40"
                                    viewBox="0 0 51 40"
                                    fill="none"
                            >
                                <path
                                        d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                        fill="url(#paint0_linear_3414_13703)"
                                />
                                <defs>
                                    <linearGradient
                                            id="paint0_linear_3414_13703"
                                            x1="25.5"
                                            y1="0"
                                            x2="25.5"
                                            y2="40"
                                            gradientUnits="userSpaceOnUse"
                                    >
                                        <stop stop-color="#003B83" stop-opacity="0"/>
                                        <stop offset="1" stop-color="#003B83"/>
                                    </linearGradient>
                                </defs>
                            </svg>
                        </div>
                    </div>
                    <div class="content">
                        <div class="pic1">
                            <!--                    <img src="./images/three2.png" alt=""/>-->
                        </div>
                        <div class="map map2">
                            <!--                    <img src="./images/map2.png" alt=""/>-->
                        </div>
                        <div class="t1">在电商平台、智能化领域布局</div>
                        <div class="t2">
                            Deploy in e-commerce platforms and intelligent fields
                        </div>
                    </div>
                </div>
                <div class="sit_list">
                    <div class="title">
                        <div class="t1">Globalization strategy</div>
                        <div class="t2">
                            <p>国际化战略</p>
                            <svg
                                    xmlns="http://www.w3.org/2000/svg"
                                    width="51"
                                    height="40"
                                    viewBox="0 0 51 40"
                                    fill="none"
                            >
                                <path
                                        d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                        fill="url(#paint0_linear_3414_13703)"
                                />
                                <defs>
                                    <linearGradient
                                            id="paint0_linear_3414_13703"
                                            x1="25.5"
                                            y1="0"
                                            x2="25.5"
                                            y2="40"
                                            gradientUnits="userSpaceOnUse"
                                    >
                                        <stop stop-color="#003B83" stop-opacity="0"/>
                                        <stop offset="1" stop-color="#003B83"/>
                                    </linearGradient>
                                </defs>
                            </svg>
                        </div>
                    </div>
                    <div class="content">
                        <div class="pic1">
                            <!--                    <img src="./images/three3.png" alt=""/>-->
                        </div>
                        <div class="map map3">
                            <!--                    <img src="./images/map3.png" alt=""/>-->
                        </div>
                        <div class="t1">
                            海外并购、海外拓展、海外研发、海外制造、海外销售
                        </div>
                        <div class="t2">
                            Overseas M&A, overseas expansion,overseas R&D, overseas
                            manufacturing,overseas sales
                        </div>
                    </div>
                </div>
            </div>

            <div class="pics">
                <div class="flex">
                    <div class="pic">
                        <img class="lazy" data-src="./images/three1.png" alt=""/>
                    </div>
                    <div class="pic">
                        <img class="lazy" data-src="./images/three1-2.png" alt=""/>
                    </div>
                    <div class="pic" style="opacity: 0;">
                        <img class="lazy" data-src="./images/three1-1.png" alt=""/>
                    </div>
                    <div class="pic">
                        <img class="lazy" data-src="./images/three1-1.png" alt=""/>
                    </div>
                </div>

                <div class="flex">
                    <div class="pic">
                        <img src="./images/three2.png" alt=""/>
                    </div>
                    <div class="pic">
                        <img src="./images/three2-1.jpg" alt=""/>
                    </div>
                    <div class="pic" style="opacity: 0;">
                        <img src="./images/three2-2.jpg" alt=""/>
                    </div>
                    <div class="pic">
                        <img src="./images/three2-2.jpg" alt=""/>
                    </div>
                </div>

                <div class="flex">
                    <div class="pic">
                        <img src="./images/three3.png" alt=""/>
                    </div>
                    <div class="pic">
                        <img src="./images/three3-1.jpg" alt=""/>
                    </div>
                    <div class="pic" style="opacity: 0;">
                        <img src="./images/three3-2.jpg" alt=""/>
                    </div>
                    <div class="pic">
                        <img src="./images/three3-2.jpg" alt=""/>
                    </div>
                </div>
            </div>
        </div>
        <div class="box" style="display: none;">
            <div class="sit">
                <div class="title">
                    <div class="t1">Internet and intelligence strategy</div>
                    <div class="t2">
                        <p>互联网、智能化战略</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="51"
                                height="40"
                                viewBox="0 0 51 40"
                                fill="none"
                        >
                            <path
                                    d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                    fill="url(#paint0_linear_3414_13703)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_13703"
                                        x1="25.5"
                                        y1="0"
                                        x2="25.5"
                                        y2="40"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="#003B83" stop-opacity="0"/>
                                    <stop offset="1" stop-color="#003B83"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </div>
                </div>
                <div class="content">
                    <div class="pic1">
                        <img src="./images/three2.png" alt=""/>
                    </div>
                    <div class="map map2">
                        <img src="./images/map2.png" alt=""/>
                    </div>
                    <div class="t1">在电商平台、智能化领域布局</div>
                    <div class="t2">
                        Deploy in e-commerce platforms and intelligent fields
                    </div>
                </div>
            </div>

            <div class="pics">
                <div class="pic">
                    <img src="./images/three2-1.jpg" alt=""/>
                </div>
                <div class="pic">
                    <img src="./images/three2-2.jpg" alt=""/>
                </div>
            </div>
        </div>
        <div class="box" style="display: none;">
            <div class="sit">
                <div class="title">
                    <div class="t1">Globalization strategy</div>
                    <div class="t2">
                        <p>国际化战略</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="51"
                                height="40"
                                viewBox="0 0 51 40"
                                fill="none"
                        >
                            <path
                                    d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                    fill="url(#paint0_linear_3414_13703)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_13703"
                                        x1="25.5"
                                        y1="0"
                                        x2="25.5"
                                        y2="40"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="#003B83" stop-opacity="0"/>
                                    <stop offset="1" stop-color="#003B83"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </div>
                </div>
                <div class="content">
                    <div class="pic1">
                        <img src="./images/three3.png" alt=""/>
                    </div>
                    <div class="map map3">
                        <img src="./images/map3.png" alt=""/>
                    </div>
                    <div class="t1">
                        海外并购、海外拓展、海外研发、海外制造、海外销售
                    </div>
                    <div class="t2">
                        Overseas M&A, overseas expansion,overseas R&D, overseas
                        manufacturing,overseas sales
                    </div>
                </div>
            </div>

            <div class="pics">
                <div class="pic">
                    <img src="./images/three3-1.jpg" alt=""/>
                </div>
                <div class="pic">
                    <img src="./images/three3-2.jpg" alt=""/>
                </div>
            </div>
        </div>
    </div>
    <div id="homeNews">
        <div class="section5">
            <div class="box">
                <div class="title" aos="fade-up">
                    <div class="t1">latest news</div>
                    <div class="t2">
                        <p>新闻资讯</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="51"
                                height="40"
                                viewBox="0 0 51 40"
                                fill="none"
                        >
                            <path
                                    d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                                    fill="url(#paint0_linear_3414_13703)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_13703"
                                        x1="25.5"
                                        y1="0"
                                        x2="25.5"
                                        y2="40"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="#003B83" stop-opacity="0"/>
                                    <stop offset="1" stop-color="#003B83"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </div>
                </div>
                <div class="r" aos="fade-up" aos-delay="200">
                    <!--                    <div class="types">-->
                    <!--                        <div class="item on">最新新闻</div>-->
                    <!--                        <span></span>-->
                    <!--                        <div class="item">集团新闻</div>-->
                    <!--                    </div>-->
                    <a href="./news.html" class="more">
                        <p>查看更多</p>
                        <svg
                                xmlns="http://www.w3.org/2000/svg"
                                width="53"
                                height="42"
                                viewBox="0 0 53 42"
                                fill="none"
                        >
                            <path
                                    d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                    fill="url(#paint0_linear_3414_14078)"
                            />
                            <defs>
                                <linearGradient
                                        id="paint0_linear_3414_14078"
                                        x1="26.5"
                                        y1="0"
                                        x2="26.5"
                                        y2="42"
                                        gradientUnits="userSpaceOnUse"
                                >
                                    <stop stop-color="white" stop-opacity="0"/>
                                    <stop offset="1" stop-color="white"/>
                                </linearGradient>
                            </defs>
                        </svg>
                    </a>
                </div>
            </div>
            <div aos="fade-up" aos-delay="300">
                <div class="allNews">
                    <div class="box1 on animated fadeInUp">
                        <div class="swiper-container">
                            <div class="swiper-wrapper">
                                <template v-for="item in newsList">
                                    <div class="swiper-slide">
                                        <a :href="`./newsInfocopy.html?id=${item.newsInfo.id}`">
                                            <div class="pic">
                                                <img
                                                        class="lazy"
                                                        :src="item.newsInfo.picUrl"
                                                        alt=""
                                                />
                                                <div class="icon">
                                                    <img src="./images/add.svg" alt=""/>
                                                </div>
                                            </div>
                                            <div class="text">
                                                <p class="p1">
                                                    {{item.newsInfo.name}}
                                                </p>
                                                <div class="des">
                                                    {{item.newsInfo.content}}
                                                </div>
                                                <p class="time">{{item.newsInfo.publishTime}}</p>
                                                <div class="shadow">
                                                    <img src="./images/nbg.svg" alt=""/>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                </template>
                            </div>
                        </div>
                    </div>
                    <div class="box1 animated fadeInUp">
                        <div class="swiper-container">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news1.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news2.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news3.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news1.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news2.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <div class="swiper-slide">
                                    <a href="">
                                        <div class="pic">
                                            <img
                                                    class="lazy"
                                                    data-src="./images/news3.png"
                                                    alt=""
                                            />
                                            <div class="icon">
                                                <img src="./images/add.svg" alt=""/>
                                            </div>
                                        </div>
                                        <div class="text">
                                            <p class="p1">
                                                服务革命 火箭助力 | 奥克斯空调X中国火箭公司品牌...
                                            </p>
                                            <div class="des">
                                                服务革命 火箭助力用航天精神点亮探索之路
                                                以科技力量赋能空调服务 发布会现场举行了授权仪式
                                                双方正式成为官方合作伙伴
                                            </div>
                                            <p class="time">2024-06-06</p>
                                            <div class="shadow">
                                                <img src="./images/nbg.svg" alt=""/>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="section6">
        <div class="title wow fadeInUp">
            <div class="t1">Brand branch</div>
            <div class="t2">
                <p>品牌分支</p>
                <svg
                        xmlns="http://www.w3.org/2000/svg"
                        width="51"
                        height="40"
                        viewBox="0 0 51 40"
                        fill="none"
                >
                    <path
                            d="M17.8831 0H0L32.4545 40H51L17.8831 0Z"
                            fill="url(#paint0_linear_3414_13703)"
                    />
                    <defs>
                        <linearGradient
                                id="paint0_linear_3414_13703"
                                x1="25.5"
                                y1="0"
                                x2="25.5"
                                y2="40"
                                gradientUnits="userSpaceOnUse"
                        >
                            <stop stop-color="#003B83" stop-opacity="0"/>
                            <stop offset="1" stop-color="#003B83"/>
                        </linearGradient>
                    </defs>
                </svg>
            </div>
        </div>

        <div class="swiper_go swiper-container wow fadeInUp">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <a href="https://www.auxshop.com/" target="_blank">
                        <img src="./images/par1.png" alt=""/>
                    </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.nbmzyl.com/" target="_blank">
                    <img src="./images/par2.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsol.com/cn" target="_blank">
                    <img src="./images/par3.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsolar.com.cn/" target="_blank">
                    <img src="./images/par4.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxwy.com/" target="_blank">
                    <img src="./images/par5.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="ttp://www.nbmzyy.com/" target="_blank">
                    <img src="./images/par6.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                    <a href="https://www.auxshop.com/" target="_blank">
                        <img src="./images/par1.png" alt=""/>
                    </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.nbmzyl.com/" target="_blank">
                    <img src="./images/par2.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsol.com/cn" target="_blank">
                    <img src="./images/par3.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsolar.com.cn/" target="_blank">
                    <img src="./images/par4.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxwy.com/" target="_blank">
                    <img src="./images/par5.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="ttp://www.nbmzyy.com/" target="_blank">
                    <img src="./images/par6.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                    <a href="https://www.auxshop.com/" target="_blank">
                        <img src="./images/par1.png" alt=""/>
                    </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.nbmzyl.com/" target="_blank">
                    <img src="./images/par2.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsol.com/cn" target="_blank">
                    <img src="./images/par3.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxsolar.com.cn/" target="_blank">
                    <img src="./images/par4.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="https://www.auxwy.com/" target="_blank">
                    <img src="./images/par5.png" alt=""/>
                   </a>
                </div>
                <div class="swiper-slide">
                   <a href="ttp://www.nbmzyy.com/" target="_blank">
                    <img src="./images/par6.png" alt=""/>
                   </a>
                </div>
            </div>
        </div>
    </div>
    <div class="section7">
        <div class="allItems wow fadeInUp">
            <div class="item">
                <div class="icon">
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="48"
                            height="48"
                            viewBox="0 0 48 48"
                            fill="none"
                    >
                        <rect
                                x="24"
                                y="10"
                                width="28"
                                height="0.999999"
                                transform="rotate(90 24 10)"
                                fill="white"
                        />
                        <rect
                                x="38"
                                y="24"
                                width="28"
                                height="0.999998"
                                transform="rotate(-180 38 24)"
                                fill="white"
                        />
                        <circle cx="24" cy="24" r="23.5" stroke="white"/>
                    </svg>
                </div>
                <div class="t1">售后服务</div>
                <a href="./service.html" class="more">
                    <p>查看更多</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="53"
                            height="42"
                            viewBox="0 0 53 42"
                            fill="none"
                    >
                        <path
                                d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                fill="url(#paint0_linear_3414_14121)"
                                fill-opacity="0.3"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3414_14121"
                                    x1="26.5"
                                    y1="0"
                                    x2="26.5"
                                    y2="42"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="white" stop-opacity="0"/>
                                <stop offset="1" stop-color="white"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </a>
            </div>
            <div class="item">
                <div class="icon">
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="48"
                            height="48"
                            viewBox="0 0 48 48"
                            fill="none"
                    >
                        <rect
                                x="24"
                                y="10"
                                width="28"
                                height="0.999999"
                                transform="rotate(90 24 10)"
                                fill="white"
                        />
                        <rect
                                x="38"
                                y="24"
                                width="28"
                                height="0.999998"
                                transform="rotate(-180 38 24)"
                                fill="white"
                        />
                        <circle cx="24" cy="24" r="23.5" stroke="white"/>
                    </svg>
                </div>
                <div class="t1">电能寻源</div>
                <a href="http://dlsrm.sanxing.com/modules/fnd/FND9100/ven_sourcing_release_list.screen" target="_blank" class="more">
                    <p>查看更多</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="53"
                            height="42"
                            viewBox="0 0 53 42"
                            fill="none"
                    >
                        <path
                                d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                fill="url(#paint0_linear_3414_14121)"
                                fill-opacity="0.3"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3414_14121"
                                    x1="26.5"
                                    y1="0"
                                    x2="26.5"
                                    y2="42"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="white" stop-opacity="0"/>
                                <stop offset="1" stop-color="white"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </a>
            </div>
            <div class="item">
                <div class="icon">
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="48"
                            height="48"
                            viewBox="0 0 48 48"
                            fill="none"
                    >
                        <rect
                                x="24"
                                y="10"
                                width="28"
                                height="0.999999"
                                transform="rotate(90 24 10)"
                                fill="white"
                        />
                        <rect
                                x="38"
                                y="24"
                                width="28"
                                height="0.999998"
                                transform="rotate(-180 38 24)"
                                fill="white"
                        />
                        <circle cx="24" cy="24" r="23.5" stroke="white"/>
                    </svg>
                </div>
                <div class="t1">家电寻源</div>
                <a href="https://srm.aux-home.com/modules/fnd/FND9100/rfx_source_list.screen" target="_blank" class="more">
                    <p>查看更多</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="53"
                            height="42"
                            viewBox="0 0 53 42"
                            fill="none"
                    >
                        <path
                                d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                fill="url(#paint0_linear_3414_14121)"
                                fill-opacity="0.3"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3414_14121"
                                    x1="26.5"
                                    y1="0"
                                    x2="26.5"
                                    y2="42"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="white" stop-opacity="0"/>
                                <stop offset="1" stop-color="white"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </a>
            </div>
            <div class="item">
                <div class="icon">
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="48"
                            height="48"
                            viewBox="0 0 48 48"
                            fill="none"
                    >
                        <rect
                                x="24"
                                y="10"
                                width="28"
                                height="0.999999"
                                transform="rotate(90 24 10)"
                                fill="white"
                        />
                        <rect
                                x="38"
                                y="24"
                                width="28"
                                height="0.999998"
                                transform="rotate(-180 38 24)"
                                fill="white"
                        />
                        <circle cx="24" cy="24" r="23.5" stroke="white"/>
                    </svg>
                </div>
                <div class="t1">经销商加盟</div>
                <a href="./dealers.html" class="more">
                    <p>查看更多</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="53"
                            height="42"
                            viewBox="0 0 53 42"
                            fill="none"
                    >
                        <path
                                d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                fill="url(#paint0_linear_3414_14121)"
                                fill-opacity="0.3"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3414_14121"
                                    x1="26.5"
                                    y1="0"
                                    x2="26.5"
                                    y2="42"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="white" stop-opacity="0"/>
                                <stop offset="1" stop-color="white"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </a>
            </div>
            <div class="item">
                <div class="icon">
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="48"
                            height="48"
                            viewBox="0 0 48 48"
                            fill="none"
                    >
                        <rect
                                x="24"
                                y="10"
                                width="28"
                                height="0.999999"
                                transform="rotate(90 24 10)"
                                fill="white"
                        />
                        <rect
                                x="38"
                                y="24"
                                width="28"
                                height="0.999998"
                                transform="rotate(-180 38 24)"
                                fill="white"
                        />
                        <circle cx="24" cy="24" r="23.5" stroke="white"/>
                    </svg>
                </div>
                <div class="t1">联系我们</div>
                <a href="./contact.html" class="more">
                    <p>查看更多</p>
                    <svg
                            xmlns="http://www.w3.org/2000/svg"
                            width="53"
                            height="42"
                            viewBox="0 0 53 42"
                            fill="none"
                    >
                        <path
                                d="M18.5844 0H0L33.7273 42H53L18.5844 0Z"
                                fill="url(#paint0_linear_3414_14121)"
                                fill-opacity="0.3"
                        />
                        <defs>
                            <linearGradient
                                    id="paint0_linear_3414_14121"
                                    x1="26.5"
                                    y1="0"
                                    x2="26.5"
                                    y2="42"
                                    gradientUnits="userSpaceOnUse"
                            >
                                <stop stop-color="white" stop-opacity="0"/>
                                <stop offset="1" stop-color="white"/>
                            </linearGradient>
                        </defs>
                    </svg>
                </a>
            </div>
        </div>
        <div class="bgs">
            <div class="bg on">
                <img src="./images/7-0.png" alt="" class="animated fadeIn"/>
            </div>
            <div class="bg">
                <img src="./images/7-1.png" alt="" class="animated fadeIn"/>
            </div>
            <div class="bg">
                <img src="./images/7-2.png" alt="" class="animated fadeIn"/>
            </div>
            <div class="bg">
                <img src="./images/7-3.png" alt="" class="animated fadeIn"/>
            </div>
            <div class="bg">
                <img src="./images/7-4.png" alt="" class="animated fadeIn"/>
            </div>
        </div>
    </div>
    <div id="commonFoot"></div>
</div>
<script src="./js/vue.js"></script>
<script src="./js/axios.js"></script>
<script src="./js/jquery-1.11.0.min.js"></script>
<script src="./js/wow.min.js"></script>
<script src="./js/swiper2.js"></script>
<script src="./js/gsap.min.js"></script>
<script src="./js/ScrollTrigger.min.js"></script>
<script src="./js/lenis.min.js"></script>
<script src="./js/aos.js"></script>
<script src="./js/common.js"></script>
<script src="./js/countUp.js"></script>
<script>
    $("#commonHead").load("./common/header.html");
    $("#commonFoot").load("./common/foot.html");
  </script>
<script type="module">
    import {httpUrl} from "./js/http.js";

    new Vue({
        el: "#apps",
        data() {
            return {
                bannerList: [],
            };
        },
        mounted() {
            this.fetchData();
        },
        methods: {
            //获取空调分类
            fetchData() {
                axios.get(httpUrl + "/api/homebanner/list").then((response) => {
                    // 假设response.data是一个数组
                    this.bannerList = response.data.rows;
                    this.$nextTick(async () => {
                    });
                });
            },
        },
    });
</script>

<script type="module">
    import {httpUrl} from "./js/http.js";

    new Vue({
        el: "#homeNews",
        data() {
            return {
                newsList: [],
            };
        },
        mounted() {
            AOS.init();
            this.fetchData();
        },
        methods: {
            //获取空调分类
            fetchData() {
                axios.get(httpUrl + "/api/homenews/list").then((response) => {
                    // 假设response.data是一个数组
                    this.newsList = response.data.rows;
                    this.$nextTick(async () => {
                        AOS.refresh();
                        var left = 0;
        var timer;
        // 适配调整
        if (document.documentElement.clientWidth > 1024) {
            new Swiper(".allNews .swiper-container", {
                speed: 1000,
                init: true,
                loop: true,
                slidesPerView: 3.2,
                spaceBetween: "3%",
                autoplay: {
                    delay: 3000,
                    stopOnLastSlide: false,
                    disableOnInteraction: false,
                },
                on: {
                    init() {
                        timer = setInterval(function () {
                            left += 1;
                            $(
                                ".home .section5 .allNews .swiper-container .swiper-slide"
                            ).css("transform", "translateX(-" + left + "px)");
                        }, 100);
                    },
                    slideChangeTransitionStart: function () {
                        setTimeout(function () {
                            $(
                                ".home .section5 .allNews .swiper-container .swiper-slide"
                            ).css("transform", "translateX(0)");
                        }, 10);
                        left = 0;
                        clearInterval(timer);
                    },
                    slideChangeTransitionEnd: function () {
                        timer = setInterval(function () {
                            left += 1;
                            $(
                                ".home .section5 .allNews .swiper-container .swiper-slide"
                            ).css("transform", "translateX(-" + left + "px)");
                        }, 100);
                    },
                },
            });
        } else {
            new Swiper(".allNews .swiper-container", {
                speed: 1000,
                init: true,
                loop: true,
                slidesPerView: 1,
                spaceBetween: 20,
                autoplay: {
                    delay: 3000,
                    stopOnLastSlide: false,
                    disableOnInteraction: false,
                },
            });
        }
                    });
                });
            },
        },
    });
</script>

<script>
    new WOW().init();

    // $('.loading').remove()

    var swiper_go = new Swiper(".swiper_go", {
        loop: true,
        slidesPerView: "auto",
        speed: 2000,
        allowTouchMove: false,
        centeredSlides: true,
        autoplay: {
            delay: 0,
            stopOnLastSlide: false,
            disableOnInteraction: false,
        },
    });

    // 首页效果

    // 图片放大
    gsap.registerPlugin(ScrollTrigger);

    var clientWidth = document.documentElement.clientWidth;
    var clientHeight = document.documentElement.clientHeight;

    function section1Update() {
        // 放大距离
        var value = 500;
        var section1 = $(".section1");
        var yHeight = $(".home .section1 .content .y").height();
        // y走的距离
        var yScrollValue = yHeight - clientHeight + 200;
        // 总高度
        var height = clientHeight + value + yScrollValue + 1000;

        section1.css("height", height + "px");

        ScrollTrigger.create({
            trigger: ".section1",
            start: "top top",
            end: "+=" + value + "",
            scrub: 1,
            marker: true,
            onUpdate: (self) => {
                var initScale = 0.62;
                var scale = initScale + self.progress * (1 - initScale);
                gsap.to(".home .section1 .bg img", {
                    scale: scale,
                    ease: "power2.out",
                    duration: 0.1,
                });
                if (self.progress >= 1) {
                    $(".home .section1 .bg").addClass("on");
                    $(".home .section1 .content").addClass("on");
                } else {
                    $(".home .section1 .bg").removeClass("on");
                    $(".home .section1 .content").removeClass("on");
                }
            },
        });

        // 开始
        var yStart = section1.position().top + value + 200;
        // 结束
        var yEnd = section1.position().top + value + yScrollValue;

        ScrollTrigger.create({
            trigger: ".section1",
            start: yStart,
            end: yEnd,
            scrub: 1,
            marker: true,
            onUpdate: (self) => {
                var y = self.progress * yScrollValue;
                $(".home .section1 .content .y").css(
                    "transform",
                    "translateY(-" + y + "px)"
                );
            },
        });
    }

    section1Update();

    // About AUX
    function section2Update() {
        ScrollTrigger.create({
            trigger: ".section2",
            start: "top top",
            end: "+=500",
            scrub: 1,
            marker: true,
            onUpdate: (self) => {
                if (self.progress > 0.3) {
                    gsap.to(".home .section2 .about-content .des p:nth-child(1)", {
                        scale: 0.9,
                        ease: "power2.out",
                        duration: 4,
                    });
                } else {
                    gsap.to(".home .section2 .about-content .des p:nth-child(1)", {
                        scale: 1,
                        ease: "power2.out",
                        duration: 4,
                    });
                }
                if (self.progress > 0.6) {
                    gsap.to(".home .section2 .about-content .des p:nth-child(2)", {
                        scale: 0.9,
                        ease: "power2.out",
                        duration: 4,
                    });
                } else {
                    gsap.to(".home .section2 .about-content .des p:nth-child(2)", {
                        scale: 1,
                        ease: "power2.out",
                        duration: 4,
                    });
                }
                if (self.progress > 0.9) {
                    gsap.to(".home .section2 .about-content .scale", {
                        scale: 0.9,
                        ease: "power2.out",
                        duration: 4,
                    });
                    gsap.to(".home .section2 .nums", {
                        scale: 0.9,
                        ease: "power2.out",
                        duration: 4,
                    });
                } else {
                    gsap.to(".home .section2 .about-content .scale", {
                        scale: 1,
                        ease: "power2.out",
                        duration: 4,
                    });
                    gsap.to(".home .section2 .nums", {
                        scale: 1,
                        ease: "power2.out",
                        duration: 4,
                    });
                }

                if (self.progress > 0.5) {
                    // $('.autoHeight').addClass('on')
                    $('.bg-mask').addClass('on')
                } else {
                    // $('.autoHeight').removeClass('on')
                    $('.bg-mask').removeClass('on')
                }
            },
        });

        $(".autoHeight").each(function (i, e) {
            var value = 500;
            var h = $(e)[0].clientHeight + value;
            $(e).css("height", h + "px");
        });
    }

    section2Update();

    $(".home .section1 .content .pics a .pic").mouseenter(function () {
        $(".cursor").addClass("on");
    });

    $(".home .section1 .content .pics a .pic").mouseleave(function () {
        $(".cursor").removeClass("on");
    });

    let d = document.querySelector(".cursor");
    if (d) {
        let speed = document
            .querySelector(".cursor")
            .getAttribute("data-speed");
        if (speed === null) {
            speed = 0.9;
        } else {
            speed = speed / 10;
        }

        function S() {
            d &&
            (function (e) {
                gsap.set(e, {
                    xPercent: -50,
                    yPercent: -50,
                });
                let t = e,
                    r = {
                        x: window.innerWidth / 2,
                        y: window.innerHeight / 2,
                    },
                    o = {
                        x: r.x,
                        y: r.y,
                    },
                    a = gsap.quickSetter(t, "x", "px"),
                    n = gsap.quickSetter(t, "y", "px");
                document.body.addEventListener("mousemove", (e) => {
                    (o.x = e.x), (o.y = e.y);
                }),
                    gsap.ticker.add(() => {
                        const e = 1 - Math.pow(speed, gsap.ticker.deltaRatio());
                        (r.x += (o.x - r.x) * e),
                            (r.y += (o.y - r.y) * e),
                            a(r.x),
                            n(r.y);
                    });
            })(d);
        }

        window.addEventListener("DOMContentLoaded", () => {
            S();
        });
    }
    ScrollTrigger.create({
        trigger: ".section3",
        start: "top center",
        end: "+=250",
        scrub: 1,
        marker: true,
        onUpdate: (self) => {
            if (self.progress > 0) {
                $(".home .section3 .fix .mask video").addClass("on");
            } else {
                $(".home .section3 .fix .mask video").removeClass("on");
            }
        },
    });


    //
    ScrollTrigger.create({
        trigger: ".section3",
        start: "top top",
        end: "+=250",
        scrub: 1,
        marker: true,
        onUpdate: (self) => {
            // if (self.progress > 0) {
            //     $(".home .section3 .fix .mask video").addClass("on");
            // } else {
            //     $(".home .section3 .fix .mask video").removeClass("on");
            // }
            if (self.progress >= 1) {
                $(".home .section3 .fix .mask").addClass("on");
                $(".section3 .fix").addClass("on");
            } else {
                $(".home .section3 .fix .mask").removeClass("on");
                $(".section3 .fix").removeClass("on");
            }
        },
    });

    function loadImgs() {
        const lazyImages = document.querySelectorAll("img.lazy[data-src]");
        lazyImages.forEach(function (img) {
            if (
                img.getBoundingClientRect().top < window.innerHeight &&
                img.getAttribute("data-src")
            ) {
                img.setAttribute("src", img.getAttribute("data-src"));
                img.removeAttribute("data-src");
            }
        });
    }

    window.addEventListener("scroll", function () {
        loadImgs();
    });

    $(function () {
        loadImgs();
        var interleaveOffset = 0.5;
        var mySwiper = new Swiper(".banner .swiper-container", {
            speed: 1000,
            init: false,
            loop: true,
            slidesPerView: 1,
            grabCursor: true,
            // autoplay: false,
            watchSlidesProgress: true,
            mousewheelControl: true,
            keyboardControl: true,
            navigation: {
                nextEl: ".banner .next",
                prevEl: ".banner .prev",
            },
            pagination: {
                el: ".banner .swiper-pagination",
                clickable: true,
            },
            autoplay: {
                delay: 4000,
                stopOnLastSlide: false,
                disableOnInteraction: false,
            },
            on: {
                slideChange() {
                    //
                    setTimeout(function () {
                        if (
                            $(
                                ".banner .swiper-container .swiper-slide-active .item video"
                            ).length > 0
                        ) {
                            $(".home .banner .swiper-container .item video").trigger(
                                "play"
                            );
                        } else {
                            $(".home .banner .swiper-container .item video").trigger(
                                "pause"
                            );
                        }
                    }, 100);
                },
                progress: function (swiper) {
                    for (var i = 0; i < swiper.slides.length; i++) {
                        var slideProgress = swiper.slides[i].progress;
                        var innerOffset = swiper.width * interleaveOffset;
                        var innerTranslate = slideProgress * innerOffset;
                        swiper.slides[i].querySelector(".slide-inner").style.transform =
                            "translate3d(" + innerTranslate + "px, 0, 0)";
                    }
                },
                touchStart: function (swiper) {
                    for (var i = 0; i < swiper.slides.length; i++) {
                        swiper.slides[i].style.transition = "";
                    }
                },
                setTransition: function (swiper, speed) {
                    for (var i = 0; i < swiper.slides.length; i++) {
                        swiper.slides[i].style.transition = speed + "ms";
                        swiper.slides[i].querySelector(
                            ".slide-inner"
                        ).style.transition = speed + "ms";
                    }
                },
            },
        });

        $(".section7 .allItems .item").mouseenter(function () {
            let index = $(this).index();
            $(this).addClass("on").siblings(".item").removeClass("on");
            $(".section7 .bgs .bg")
                .eq(index)
                .addClass("on")
                .siblings(".bg")
                .removeClass("on");
        });

        $(".section5 .box .types .item").click(function () {
            let index = 0;
            if ($(this).index() == 2) {
                index = 1;
            }
            $(this).addClass("on").siblings(".item").removeClass("on");
            $(".section5 .allNews .box1")
                .eq(index)
                .addClass("on")
                .siblings(".box1")
                .removeClass("on");
        });



        if(document.body.clientWidth<1024){
            mySwiper.init();
        }else{
            setTimeout(() => {
            $(".loading").addClass("hideVideo");
            $(".banner").addClass("showBanner");
            mySwiper.init();
            localStorage.setItem("isLoaded", "1");
        }, 2800);
        }
        // if (localStorage.getItem('isLoaded') == null) {
        //     setTimeout(() => {
        //         $('.loading').addClass('hideVideo')
        //         $('.banner').addClass('showBanner')
        //         mySwiper.init()
        //         localStorage.setItem('isLoaded', '1')
        //     }, 2800)
        // }else{
        //     $('.loading').css({'display':'none'})
        //     $('.banner').addClass('showBanner')
        //     mySwiper.init()
        // }

        const countItems = document.querySelectorAll(".count-item");

        function onIntersection(entries, observer) {
            entries.forEach((entry) => {
                if (entry.isIntersecting) {
                    const e = entry.target;
                    animateCount(e);
                    // observer.unobserve(e);
                }
            });
        }

        const observer = new IntersectionObserver(onIntersection);
        countItems.forEach((item) => observer.observe(item));

        function animateCount(e) {
            var demo = {score: 0},
                scoreDisplay = e,
                to = e.getAttribute("data-to"),
                speed = e.getAttribute("data-speed") * 1,
                separator = e.getAttribute("data-separator"),
                to_fixed = e.getAttribute("data-fixed");

            if (to !== null) {
                if (to.indexOf(".") !== -1) {
                    var automatic = to.length - 1 - to.indexOf(".");
                }
            }
            if (speed === 0) {
                speed = 1;
            }
            TweenLite.to(demo, speed, {
                score: to,
                onUpdate: showScore,
            });

            function showScore() {
                if (separator !== null) {
                    scoreDisplay.innerHTML = formatNumberWithCommasAndDecimal(
                        demo.score,
                        to_fixed,
                        separator
                    );
                } else if (to_fixed !== null) {
                    scoreDisplay.innerHTML = demo.score.toFixed(automatic);
                } else {
                    scoreDisplay.innerHTML = demo.score.toFixed(0);
                }
            }
        }

        function formatNumberWithCommasAndDecimal(
            number,
            decimalPlaces,
            separator
        ) {
            var formattedNumber = number.toFixed(decimalPlaces);
            formattedNumber = formattedNumber.replace(
                /\B(?=(\d{3})+(?!\d))/g,
                separator
            );
            return formattedNumber;
        }
    });
</script>
</body>
</html>
