You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
839 lines
27 KiB
839 lines
27 KiB
<template>
|
|
|
|
<view class="index_warp">
|
|
<!-- 轮播图 -->
|
|
<view class="inx_lbt">
|
|
<swiper :autoplay="autoplay" class="lh-swiper" :duration="duration" :interval="interval" :current="swiperCurrent"
|
|
@change="changeSwiper">
|
|
<swiper-item v-for="(picObj,index) in pic_list" :key="index">
|
|
<image class="slide-image" height="200" :src="picObj" width="100%"></image>
|
|
</swiper-item>
|
|
|
|
</swiper>
|
|
<!-- 头部 -->
|
|
<view class="inx_1 dly_flex">
|
|
<view class="inx_wz">邯郸</view>
|
|
<view class="inx_sch"><input placeholder-style="color:rgba(255,255,255,.7)" placeholder="搜索景区/酒店/美食/攻略" class="sch_ipt" /></view>
|
|
<view class="inx_user">
|
|
<image class="usr_img" src="../../static/images/icn_user.png"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 轮播指示点样式修改 -->
|
|
<view class="dots">
|
|
<block v-for="(picObj,index) in pic_list.length" :key="picObj">
|
|
<view class="dot" :class="index==swiperCurrent ? ' active' : ''"></view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
<!-- 工具-->
|
|
<view class="inx_toool">
|
|
<swiper class="swiper_tol" :indicator-dots="indicatorDots" :autoplay="autoplay_tol" :interval="interval_tol">
|
|
<swiper-item>
|
|
<view class="inx_tol_box dly_flex">
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_jq.png" class="tol_img"></image>
|
|
<view class="tol_txt">旅游景区</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_dl.png" class="tol_img"></image>
|
|
<view class="tol_txt">导览</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_zb.png" class="tol_img"></image>
|
|
<view class="tol_txt">实时直播</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_xl.png" class="tol_img"></image>
|
|
<view class="tol_txt">线路</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_cs.png" class="tol_img"></image>
|
|
<view class="tol_txt">找厕所</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_hel.png" class="tol_img"></image>
|
|
<view class="tol_txt">住酒店</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_ms.png" class="tol_img"></image>
|
|
<view class="tol_txt">吃美食</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_tc.png" class="tol_img"></image>
|
|
<view class="tol_txt">特产</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_gl.png" class="tol_img"></image>
|
|
<view class="tol_txt">攻略指南</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_hui.png" class="tol_img"></image>
|
|
<view class="tol_txt">生态走廊</view>
|
|
</view>
|
|
</view>
|
|
|
|
</swiper-item>
|
|
<swiper-item>
|
|
|
|
<view class="inx_tol_box dly_flex">
|
|
<!-- <view class="tol_unit">
|
|
<image src="../../static/images/icn_tq.png" class="tol_img"></image>
|
|
<view class="tol_txt">景区天气</view>
|
|
</view> -->
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_hd.png" class="tol_img"></image>
|
|
<view class="tol_txt">热门活动</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_zx.png" class="tol_img"></image>
|
|
<view class="tol_txt">看资讯</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_lxs.png" class="tol_img"></image>
|
|
<view class="tol_txt">旅行社</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_jy.png" class="tol_img"></image>
|
|
<view class="tol_txt">应急救援</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_zbian.png" class="tol_img"></image>
|
|
<view class="tol_txt">逛周边</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_gz.png" class="tol_img"></image>
|
|
<view class="tol_txt">名村古镇</view>
|
|
</view>
|
|
<view class="tol_unit">
|
|
<image src="../../static/images/icn_ts.png" class="tol_img"></image>
|
|
<view class="tol_txt">投诉</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
</swiper-item>
|
|
|
|
</swiper>
|
|
</view>
|
|
<!--热点话题 -->
|
|
<view class="mode_com mt_1">
|
|
<!-- <text class="tit_com">热点话题</text> -->
|
|
<view class="inx_ht_warp">
|
|
|
|
<!-- <scroll-view class="scol_ht_box" scroll-x="true" @scroll="scroll" scroll-left="0">
|
|
<view class="scol_unit">
|
|
<image class="ht_pic" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1569152926211&di=8f455c62088de3ab57c6e77a6084c860&imgtype=0&src=http%3A%2F%2Fpic1.hebei.com.cn%2F003%2F022%2F655%2F00302265500_bca5e51e.jpg"
|
|
mode="aspectFill"></image>
|
|
<view class="ht_text">话题标题话题标题话题标题话题标题话题标题话题标题</view>
|
|
</view>
|
|
<view class="scol_unit">
|
|
<image class="ht_pic" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1569152926211&di=8f455c62088de3ab57c6e77a6084c860&imgtype=0&src=http%3A%2F%2Fpic1.hebei.com.cn%2F003%2F022%2F655%2F00302265500_bca5e51e.jpg"
|
|
mode="aspectFill"></image>
|
|
<view class="ht_text">话题标题话题标题话题标题话题标题话题标题话题标题</view>
|
|
</view>
|
|
|
|
</scroll-view> -->
|
|
|
|
|
|
|
|
<image class="ad-image" src="http://img2.imgtn.bdimg.com/it/u=472646803,2935683793&fm=26&gp=0.jpg" mode="aspectFill"></image>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 国际“智”庄 -->
|
|
<view class="mode_com mt_1">
|
|
<view class="tit_com_2">国际<text>智</text>庄</view>
|
|
<!-- <view class="inx_ht_warp dly_flex tol_2_warp">
|
|
<view class="tol_2_unit">
|
|
<view class="gjz_box" style="position: relative;">
|
|
<view class="jqr_1">
|
|
<text class="ht_text">智能机器人</text>
|
|
<text class="jqr_p">AI人工智能专属为您服务</text>
|
|
|
|
</view>
|
|
<image class="jqr_pic" src="../../static/images/jqr_3.png" mode="scaleToFill"></image>
|
|
</view>
|
|
</view>
|
|
<view class="tol_2_unit">
|
|
<view class="gjz_box">
|
|
<image class="gjz_pic" src="../../static/images/icn_zhdl.png"></image>
|
|
<text class="ht_text">智慧导览</text>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="tol_2_unit">
|
|
<view class="gjz_box">
|
|
<image class="gjz_pic" src="../../static/images/icn_zhzb.png"></image>
|
|
<text class="ht_text">美景直播</text>
|
|
</view>
|
|
</view>
|
|
<view class="tol_2_unit">
|
|
<view class="gjz_box">
|
|
<image class="gjz_pic" src="../../static/images/icn_xnty.png"></image>
|
|
<text class="ht_text">虚拟体验</text>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view> -->
|
|
|
|
|
|
<view class="inx_ht_warp dly_flex tol_2_warp">
|
|
<view class="tol_2_unit">
|
|
<view class="gjz_box" style="position: relative;">
|
|
<view class="jqr_1">
|
|
<text class="ht_text">智能机器人</text>
|
|
<text class="jqr_p">AI人工智能专属为您服务</text>
|
|
|
|
</view>
|
|
<image class="jqr_pic " src="../../static/images/jqr_3.png" mode="scaleToFill"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="half_unit">
|
|
<view class="dly_flex_c aliem_c">
|
|
<view class="gjz_box">
|
|
<image class="gjz_pic" src="../../static/images/icn_zhdl.png"></image>
|
|
</view>
|
|
<view>
|
|
<text class="ht_text">智慧导览</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="half_unit">
|
|
<view class="dly_flex_c aliem_c">
|
|
<view class="gjz_box">
|
|
<image class="gjz_pic" src="../../static/images/icn_xnty.png"></image>
|
|
</view>
|
|
<view>
|
|
<text class="ht_text">虚拟体验</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- tab 切换 -->
|
|
|
|
<view class="mode_com mt_1">
|
|
<view class="inx_tab"><text class="onc">去哪儿玩 </text><text>/</text><text>吃什么</text><text>/</text><text>住哪儿</text><text>/</text></view>
|
|
</view>
|
|
<view class="pd_scl_new">
|
|
<view class="tab_warp">
|
|
<scroll-view class="scol_ht_box" scroll-x="true" @scroll="scroll_tab" scroll-left="0">
|
|
<view class="scol_unit">
|
|
<image class="ht_pic" src="" mode="aspectFill"></image>
|
|
<view class="tab_txt">
|
|
<view class="control_2 tab_txt6">
|
|
<text class="ht_text">话题标题话题标题话题标题话题标题话题标题话题标题</text>
|
|
<text class="mssj_adr">AAAAA</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <text class="level_tab">AAAAA</text> -->
|
|
</view>
|
|
<view class="scol_unit">
|
|
<image class="ht_pic" src="" mode="aspectFill"></image>
|
|
<view class="tab_txt">
|
|
<view class="control_2 tab_txt6">
|
|
<text class="ht_text">话题标题题标题话题标题</text>
|
|
<text class="mssj_adr">AAAAA话题标题话题标题话题标题话话题标题话题标题话题标题话</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="scol_unit">
|
|
<image class="ht_pic" src="" mode="aspectFill"></image>
|
|
<view class="tab_txt">
|
|
<view class="control_2 tab_txt6">
|
|
<text class="ht_text">话题标题话题标题</text>
|
|
<text class="mssj_adr">AAAAA</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 印象邯郸-->
|
|
<view class="mode_com mt_1">
|
|
<text class="tit_com">印象邯郸</text>
|
|
</view>
|
|
<view class="">
|
|
<!-- <view class="inx_ht_warp">
|
|
<view class="dly_flex yin_warp">
|
|
<view class="unit_city">
|
|
<image class="city_img" src=""
|
|
mode="aspectFill"></image>
|
|
<view class="city_zhe">
|
|
<text>自在正定</text>
|
|
</view>
|
|
</view>
|
|
<view class="unit_city">
|
|
<image class="city_img" src=""
|
|
mode="aspectFill"></image>
|
|
<view class="city_zhe">
|
|
<text>正定</text>
|
|
</view>
|
|
</view>
|
|
<view class="unit_city">
|
|
<image class="city_img" src=""
|
|
mode="aspectFill"></image>
|
|
<view class="city_zhe">
|
|
<text>正定</text>
|
|
</view>
|
|
</view>
|
|
<view class="unit_city">
|
|
<image class="city_img" src=""
|
|
mode="aspectFill"></image>
|
|
<view class="city_zhe">
|
|
<text>正定</text>
|
|
</view>
|
|
</view>
|
|
<view class="unit_city">
|
|
<image class="city_img" src=""
|
|
mode="aspectFill"></image>
|
|
<view class="city_zhe">
|
|
<text>正定</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view> -->
|
|
|
|
<view class="mt_1 gaik_pic">
|
|
<view class="jianj_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="sjz_main">
|
|
<!-- 红色西柏坡 多彩邯郸 -->
|
|
<view class="mode_com sjz_summary">
|
|
<text class="tit_com">红色西柏坡 多彩邯郸</text>
|
|
<view class="inx_gaik"><text class="gaik_link">查看详细</text></view>
|
|
<view class="shij_inf ">
|
|
<text class="mssj_adr">邯郸市经济总体回升向好。2009年地区生产总值跃上3000亿元台阶，达到3114.9亿元，同比增长11.1%。第一产业实现增加值305.3亿元，增长0.2%；第二产业实现增加值1558.5亿元，增长11.6%；第三产业实现增加值1251.1亿元，增长13.0
|
|
%。年末全市城镇单位从业人员83.5万人，比上年同期减少1.5％，其中在岗职工80.2万人，比上年同期减少2.1％；全市在岗职工平均工资27372元，比上年增长16.7％。年末市区单位从业人员为52.8万人，其中在岗职工50.0万人，在岗职工平均工资30649元，比上年同期增长16.4％。</text>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="mode_com">
|
|
<scroll-view class="scol_ht_box" scroll-x="true" @scroll="scroll_tab" scroll-left="0">
|
|
<view class="yx_warp_3" style="width: 144%;">
|
|
<!-- 基数为48% -->
|
|
<view class="dly_flex inx_yxs">
|
|
<!-- 此处循环 -->
|
|
<view class="b_tol_ipt">
|
|
<view class="unit_city6">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
<view class="city_name">
|
|
<text class="ht_text">自在正定</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="b_tol_ipt">
|
|
|
|
<view class="unit_city6">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
<view class="city_name">
|
|
<text class="ht_text">自11在正定</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="b_tol_ipt">
|
|
|
|
<view class="unit_city6">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
<view class="city_name">
|
|
<text class="ht_text">自在正定</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
<!-- 视觉邯郸 -->
|
|
<view class="mode_com">
|
|
<text class="tit_com">视觉邯郸</text>
|
|
<view class="inx_ht_warp">
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="shij_bq">直播</text>
|
|
<text class="shij_num">No.1</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">视频名称视频名称视频名称视频名称视频名称视频名称</text>
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
</view>
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="shij_bq">直播</text>
|
|
<text class="shij_num">No.2</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">视频名称视频名称视频名称视频名称视频名称视频名称</text>
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
</view>
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="shij_bq">直播</text>
|
|
<text class="shij_num">No.3</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">视频名称视频名称视频名称视频名称视频名称视频名称</text>
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
</view>
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="shij_bq">直播</text>
|
|
<text class="shij_num">No.4</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">视频名称视频名称视频名称视频名称视频名称视频名称</text>
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
</view>
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="shij_bq">直播</text>
|
|
<text class="shij_num">No.5</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">视频名称视频名称视频名称视频名称视频名称视频名称</text>
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 最新热门活动 -->
|
|
<view class="mode_com mt_1">
|
|
<text class="tit_com">最新热门活动</text>
|
|
<view class="inx_ht_warp hd_warp">
|
|
<view class="shij_list">
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<text class="hd_bqa">热门</text>
|
|
</view>
|
|
<view class="shij_inf">
|
|
<text class="ht_text">活动名活动名称活动名称活动名称活动名称称活动名称</text>
|
|
<text class="mssj_adr">活动内容，活动内容活动内容活动内，容活内容，活动内容活动内容活动内，容活动内容活。动内容活动内容活动，内容活。动内容</text>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<scroll-view class="" scroll-x="true" @scroll="scroll_hd" scroll-left="0">
|
|
<view class="hd_lst">
|
|
<view class="half_unit hd_box">
|
|
<view class="fod_sp_box">
|
|
<view class="msimg_wrp">
|
|
<image src="" class="pic_shop" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="mssj_box">
|
|
<text class="mssj_tit">文字文字文字文字文字文字文字文字文字文字文字文字</text>
|
|
<text class="mssj_adr">容，活动内容活动内容活动内，容活内容，活动内容活动容，活动内容活动内容活动内，容活内容，活动内容活动容，活动内容活动内容活动内，容活内容，活动内容活动</text>
|
|
</view>
|
|
</view>
|
|
<view class="fod_sp_box">
|
|
<view class="msimg_wrp">
|
|
<image src="" class="pic_shop" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="mssj_box">
|
|
<text class="mssj_tit">文字文字文字文字文字文字文字文字文字文字文字文字</text>
|
|
<text class="mssj_adr">容，活动内容活动内容活动内，容活内容，活动内容活动容，活动内容活动内容活动内，容活内容，活动内容活动</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="half_unit hd_box">
|
|
<view class="fod_sp_box">
|
|
<view class="msimg_wrp">
|
|
<image src="" class="pic_shop" mode="aspectFill"></image>
|
|
|
|
</view>
|
|
<view class="mssj_box">
|
|
<text class="mssj_tit">文字文字文字文字文字文字文字文字文字文字文字文字</text>
|
|
<text class="mssj_adr">容，活动内容活动内容活动内，容活内容，活动内容活动</text>
|
|
</view>
|
|
</view>
|
|
<view class="fod_sp_box">
|
|
<view class="msimg_wrp">
|
|
<image src="" class="pic_shop" mode="aspectFill"></image>
|
|
|
|
</view>
|
|
<view class="mssj_box">
|
|
<text class="mssj_tit">文字文字文字文字文字文字文字文字文字文字文字文字</text>
|
|
<text class="mssj_adr">容，活动内容活动内容活动内，容活内容，活动内容活动容，活动内容活动内容活动内，容活内容，活动内容活动</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 精品路线 -->
|
|
<view class="mode_com mt_1">
|
|
<text class="tit_com">精品旅游路线</text>
|
|
<view class="inx_ht_warp lux_new">
|
|
|
|
<scroll-view class="scol_ht_box" scroll-x="true" @scroll="scroll_line" scroll-left="0">
|
|
|
|
<view class="yx_warp_3" style="width: 360%;">
|
|
<!--width: 360%; 应改为动态计算得出 基数为90% -->
|
|
|
|
<view class="dly_flex">
|
|
<!-- 此处循环 -->
|
|
<view class="b_tol_ipt">
|
|
<view class="line_list">
|
|
|
|
<text class="ht_text">111路线路线名称路线名称路线名称路线名称路线名称路线名称名称路线名称</text>
|
|
<image src="" class="line_pic" mode="aspectFill"></image>
|
|
<text class="mssj_adr">路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路</text>
|
|
<view class="line_bq"><text>官方推荐</text></view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="b_tol_ipt">
|
|
<view class="line_list">
|
|
|
|
<text class="ht_text">222线名称名称路线名称</text>
|
|
<image src="" class="line_pic" mode="aspectFill"></image>
|
|
<text class="mssj_adr">路线路线名称路线名称路</text>
|
|
<view class="line_bq"><text>官方推荐</text></view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="b_tol_ipt">
|
|
<view class="line_list">
|
|
|
|
<text class="ht_text"></text>
|
|
<image src="" class="line_pic" mode="aspectFill"></image>
|
|
<text class="mssj_adr"></text>
|
|
<view class="line_bq"><text>官方推荐</text></view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="b_tol_ipt">
|
|
<view class="line_list">
|
|
|
|
<text class="ht_text">444路线路线名称路线名称路线名称路线名称路线名称路线名称名称路线名称</text>
|
|
<image src="" class="line_pic" mode="aspectFill"></image>
|
|
<text class="mssj_adr">路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路路线名称路线名称路线名称路</text>
|
|
<view class="line_bq"><text>官方推荐</text></view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</scroll-view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 旅游攻略指南 -->
|
|
<view class="mode_com mt_1">
|
|
<text class="tit_com">旅游攻略指南</text>
|
|
<view class="inx_ht_warp glue_warp">
|
|
<view class="fod_sp_box">
|
|
<view class="msimg_wrp">
|
|
<image src="" class="pic_shop" mode="aspectFill"></image>
|
|
|
|
</view>
|
|
<view class="mssj_box">
|
|
<text class="mssj_tit">攻略名称攻略名称攻略名称攻略名称</text>
|
|
<text class="mssj_adr">攻攻略简，介攻略简介，攻略简介攻略简介攻。略简介攻略，简介攻略。简介略简介</text>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
<view class="dly_flex yin_warp book_warp">
|
|
|
|
<view class="unit_book">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
|
|
<text class="ht_text">自在正定</text>
|
|
|
|
</view>
|
|
|
|
<view class="unit_book">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
|
|
<text class="ht_text">自在正定</text>
|
|
|
|
</view>
|
|
<view class="unit_book">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
|
|
<text class="ht_text">自在正定</text>
|
|
|
|
</view>
|
|
<view class="unit_book">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
|
|
<text class="ht_text">自在正定</text>
|
|
|
|
</view>
|
|
<view class="unit_book">
|
|
<image class="city_img" src="" mode="aspectFill"></image>
|
|
|
|
<text class="ht_text">自在正定</text>
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 有声邯郸 -->
|
|
<view class="mode_com mt_1">
|
|
<text class="tit_com">有声邯郸</text>
|
|
<view class="inx_ht_warp voice_warp">
|
|
<view class="shij_list">
|
|
<view class="voe_bt">
|
|
<text class="ht_text">活动名活动名称活动名称活动名称活动名称称活动名称</text>
|
|
<text class="voe_time">06:23</text>
|
|
</view>
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<view class="shij_inf">
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
<image src="../../static/images/icn_voice.png" class="voe_btn"></image>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="shij_list">
|
|
<view class="voe_bt">
|
|
<text class="ht_text">活动名活动名称活动名称活动名称活动名称称活动名称</text>
|
|
<text class="voe_time">06:23</text>
|
|
</view>
|
|
<view class="shij_img">
|
|
<image src="" class="shij_pic" mode="aspectFill"></image>
|
|
<view class="shij_inf">
|
|
<text class="sp_num">15431</text>
|
|
<text class="sp_like">1531</text>
|
|
</view>
|
|
<image src="../../static/images/icn_voice.png" class="voe_btn"></image>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
/* 轮播图 swiper */
|
|
autoplay: true,
|
|
duration: 1000,
|
|
interval: 3000,
|
|
indicatorDots: true,
|
|
pic_list: [],
|
|
/* 工具栏 swiper*/
|
|
autoplay_tol: false,
|
|
interval_tol: 2000,
|
|
duration_tol: 500,
|
|
// swiper
|
|
current: 0,
|
|
swiperCurrent: 0,
|
|
}
|
|
},
|
|
/* onLoad(options) {
|
|
console.log("接受的值为：" + options.guid)
|
|
}, */
|
|
methods: {
|
|
/* 话题 scroll-view*/
|
|
/* scroll: function(e) {
|
|
console.log(e)
|
|
this.old.scrollTop = e.detail.scrollTop
|
|
}, */
|
|
scroll_tab: function(e) {
|
|
console.log(e)
|
|
this.old.scrollTop = e.detail.scrollTop
|
|
},
|
|
/* 活动 scroll-view*/
|
|
scroll_hd: function(e) {
|
|
console.log(e)
|
|
this.old.scrollTop = e.detail.scrollTop
|
|
},
|
|
/* 路线 */
|
|
scroll_line: function(e) {
|
|
console.log(e)
|
|
this.old.scrollTop = e.detail.scrollTop
|
|
},
|
|
// 样式修改
|
|
changeSwiper(e) {
|
|
this.swiperCurrent = e.detail.current;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import url("../../static/css/common.css");
|
|
@import url("../hotel/hoteldetail/hoteldetail.css");
|
|
@import url("../food/fooddetial/fooddetial.css");
|
|
@import url("index.css");
|
|
|
|
/* 城市定位 */
|
|
.inx_wz:before {
|
|
content: '';
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
display: inline-block;
|
|
background: url(../../static/images/icn_mi_2.png) no-repeat;
|
|
background-size: 100%;
|
|
margin-right: 5rpx;
|
|
position: relative;
|
|
top: 5rpx
|
|
}
|
|
|
|
/* 搜索放大镜 */
|
|
.sch_ipt:after {
|
|
content: '';
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
display: inline-block;
|
|
background: url(../../static/images/icon-search_2.png) no-repeat;
|
|
background-size: 100%;
|
|
margin-right: 5rpx;
|
|
position: absolute;
|
|
right: 10rpx;
|
|
top: 14rpx
|
|
}
|
|
|
|
/* 智能机器人 */
|
|
.jqr_1:before {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
top: -6rpx;
|
|
left: -20rpx;
|
|
z-index: 1;
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
background: url(../../static/images/jqr_1.png) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
.jqr_1:after {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
top: -30rpx;
|
|
right: 0;
|
|
z-index: 1;
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
background: url(../../static/images/jqr_2.png) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
/*视频 图标 */
|
|
.sp_num:before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: url(../../static/images/icn_bf_num.png) no-repeat;
|
|
background-size: 100%;
|
|
margin-right: 10rpx;
|
|
position: relative;
|
|
top: 12rpx
|
|
}
|
|
|
|
.sp_like:before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: url(../../static/images/icn_like.png) no-repeat;
|
|
background-size: 100%;
|
|
margin-right: 10rpx;
|
|
position: relative;
|
|
top: 12rpx
|
|
}
|
|
|
|
/* 音频图标 */
|
|
.voice_warp .sp_num:before {
|
|
background: url(../../static/images/icn_bf_num2.png) no-repeat;
|
|
background-size: 100%;
|
|
|
|
}
|
|
|
|
.voice_warp .sp_like:before {
|
|
background: url(../../static/images/icn_like2.png) no-repeat;
|
|
background-size: 100%;
|
|
}
|
|
|
|
/* tab 切换图标 */
|
|
.onc:after {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
left: 50%;
|
|
margin-left: -20rpx;
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: url(../../static/images/icn_tab_bg.png);
|
|
background-size: 100%;
|
|
top: 40rpx;
|
|
z-index: 5;
|
|
}
|
|
</style>
|
|
|