1、功能介绍
淘宝返佣、拼多多返佣、京东返佣、抖音返佣、唯品会返佣、更多权益、热销榜、聚划算、天猫超市、母婴精选、大牌餐券、生活特权、会员充值、话费充值、打车优惠、福利线报、宣传素材、短视频带货、9.9包邮、免单中心、超值大牌、新人攻略 、每日上新、抖音一分购、抖音一元购、热门抖货、商品推荐、商品详情、商品海报、APP检测升级、配置动态化、多分享海报、会员授权、获取剪切板、商品分类 、分类详情、多平台比较、热门搜索、搜索历史、搜索、精选单品、好货专场、提现、提现明细、会员、订单明细、浏览历史、我的收藏、推广中心、推广订单、团队分红、区域代理、分销订单、游戏专区、广告联盟、商学院、账号安全、设置、提现设置、换绑手机号、修改密码、邀请成员、多推广海报、会员升级、登录注册、忘记密码等功能提供学习使用
2、下载地址
https://download.csdn.net/download/asd417asd/48930252
目前只提供学习研究使用！不可商用！
<!-- 开源版本仅提供学习研究使用，商业版本可以咨询v qingxiwangluo 全套源码交付支持二次开发 -->
<template>
<view class="new-home">
<view class="header-home" :style="{ backgroundColor:bgColor, paddingTop: statusBarHeight + '' }" ref="app_bar"
elevation="2px">
<view class="index_header" ref="app_bar_bg">
<view class="wap_center_search" @click="wap_search"><text
class="hhs-iconfont wap_search_icon">粘贴宝贝标题，先领券再购买</text></view>
<view class="wap_right_icon" @click="wap_sigin">
<image v-if="getHomeTopIcon.rightIcon" :src="getHomeTopIcon.rightIcon" class="wap_right_icon-image">
</image>
</view>
</view>
<view class="new-home-top-nav">
<scroll-view class="category-scroll" :scroll-left="navScorllLeft" scroll-direction="horizontal"
:show-scrollbar="false" :scroll-x="true">
<view class="category-tab-item" :ref="'navItem' + index" v-for="(item, index) in tabItems"
:key="index" :id="item.id" @click="ontabtap(index)">
<text class="category-tab-item-title"
:class="currentTab == index ? 'category-tab-item-title-active' : ''">{{ item.title }}</text>
</view>
</scroll-view>
<view class="new-home-top-nav-move" @click="navigatorTo('/pages/cate/index')">
<text class="hhs-iconfont new-home-top-nav-move-text"></text>
</view>
</view>
</view>
<swiper :current="currentTab" class="swiper-box" :duration="300" @change="ontabchange">
<swiper-item class="swiper-item" v-for="(tab, index1) in tabItems" :key="index1">
<waterfall class="scroll-v" column-count="2" column-gap="7" left-gap="7" right-gap="7"
enableBackToTop="true" :show-scrollbar="false" loadmoreoffset="15" @loadmore="loadMore(index1)"
@scroll="swiperScroll" ref="waterfallRef">
<cstRefresh @refresh="onrefresh(index1)" :refreshing="tab.refreshing" @pullingdown="onpullingdown"
:refreshText="tab.refreshText"></cstRefresh>
<header class="header" v-if="index1 == 0">
<view class="banner-bg" :style="{backgroundColor:bgColor}"></view>
<swiper class="swiper-banner" indicator-active-color="#ffffff"
indicator-color="rgba(255,255,255,.4)" v-if="bannerAdvert.length > 0" :indicator-dots="true"
:autoplay="true" :circular="true" :interval="5000" :duration="500" @change="bannerChange">
<swiper-item class="swiper-banner-item" v-for="(item, index) in bannerAdvert" :key="index"
@tap="toCategory(item)">
<view class="swiper-banner-item">
<image :src="item.picture" class="swiper-banner-item-image"
placeholder="/static/img/ic_banner_placeholder_h310.png"></image>
</view>
</swiper-item>
</swiper>
<!--热门，购物。。。-->
<view class="advert-nav">
<view class="new-advert-nav">
<scroll-view class="advert-scroll" :scroll-left="navScorllLeft1"
scroll-direction="horizontal" :show-scrollbar="false" :scroll-x="true">
<view class="advert-tab-item" :ref="'navItem1' + eindex"
v-for="(item, eindex) in bannerAdvertLower" :key="eindex" :id="item.id"
@click="onAdvertNav(eindex)">
<text class="advert-tab-item-title"
:class="bannerAdvertLowerCurr === eindex ? 'advert-tab-item-title-active' : ''">{{ item.title }}</text>
</view>
</scroll-view>
</view>
<swiper class="nav-swiper" :indicator-dots="false" :autoplay="false"
:current="bannerAdvertLowerCurr" @change="bannerAdvertLowerChange">
<swiper-item class="nav-swiper-item" v-for="(item, index) in bannerAdvertLower"
:key="index">
<view class="nav-item" v-for="(nitem, nindex) in item.item" :key="nindex"
@click="toCategory(nitem)">
<image class="nav-item-image" :src="nitem.picture"
placeholder="/static/img/ic_default_placeholder.png"></image>
<text class="nav-item-text">{{ nitem.title }}</text>
</view>
</swiper-item>
</swiper>
<view class="swiper-pagination s-rows s-flex-center">
<view class="hhs-swiper-dots-item" v-for="(dotsItem, dindex) in bannerAdvertLower"
:key="dindex"
:class="[bannerAdvertLowerCurr === dindex ? 'hhs-swiper-dots-item-curr' : '']">
</view>
</view>
</view>
<view class="toutiao" v-if="darenlist.length > 0">
<view class="toutiao-box">
<view class="toutiao-logo" @click="navigatorTo('/pages/member/ucenter/help')">
<image src="/static/img/ic_home_headmsg.png" class="toutiao-logo-image"></image>
</view>
<swiper class="toutiao-swiper-slider" :vertical="true" :circular="true" :interval="2000"
:autoplay="true">
<swiper-item class="toutiao-swiper-slider-item" v-for="(daren, index) in darenlist"
:key="index" @click="darenDetail(daren)">
<text class="toutiao-swiper-slider-item-text">{{ daren.title }}</text>
</swiper-item>
</swiper>
<view class="toutiao-youjiantou"><text
class="hhs-iconfont toutiao-youjiantou-text"></text></view>
</view>
</view>
<view class="imgarea" style="margin-top:10rpx;">
<view style="margin-top:10rpx;flex-direction: row;">
<image src="/static/tbbj.png" style="width:362rpx;" mode="widthFix"
@click="navigatorTo('/pages/member/ucenter/bangzhu/infordetail?id=1')">
</image>
<image src="/static/pddbj.png" style="width:362rpx;margin-left: 6rpx;" mode="widthFix"
@click="navigatorTo('/pages/member/ucenter/bangzhu/infordetail?id=2')">
</image>
</view>
</view>
<!-- 进行中的活动 -->
<view class="home_activity" v-if="activity.length > 0">
<view class="home_activity_top" v-for="(item, index) in activity" :key="index">
<view class="home_activity_top-one" v-if="item.nodeCount == 1">
<image :src="item.bgImg" class="home_activity_top-one-image"
:style="{ width: item.width + 'rpx', height: item.height + 'rpx' }"></image>
</view>
<view class="home_activity_top-tow" v-if="item.nodeCount > 1"
:style="{ width: item.width + 'rpx', height: item.height + 'rpx', backgroundImage: item.bgImg }">
<block v-for="(sub, sindex) in item.nodeDTOList" :key="sindex">
<image :src="sub.posImage" class="home_activity_top-one-image"
:style="{ width: sub.width + 'rpx', height: sub.height + 'rpx' }"></image>
</block>
</view>
</view>
</view>
<!-- 发现好货 -->
<view class=" s-nowrap s-flex-center find_product_bg">
<text class="find_product_bg_text">=</text>
<text class="find_product_bg_text">发现好货</text>
<text class="find_product_bg_text">=</text>
</view>
</header>
<cell v-for="(item, index) in tab.data" :key="index" class="s-tab-list-cell">
<cstProductItem @detail="detail" :item="item" :index="index"></cstProductItem>
</cell>
<header class="tui-refresh" v-if="tab.isLoading || tab.data.length > 4">
<text class="refresh-text">{{ tab.loadingText }}</text>
</header>
</waterfall>
</swiper-item>
</swiper>
<!--领取优惠券提示框-->
<couponsDialog ref="couponsDialog"></couponsDialog>
<!-- 全局广告提示 -->
<topAddDialog ref="topAddDialog"></topAddDialog>
<!-- 超级搜索弹窗 -->
<searchDialog ref="searchDialog"></searchDialog>
<!--领取小鸡提示框-->
<xiaojiDialog ref="xiaojiDialog"></xiaojiDialog>
<!--提示框-->
<view class="tishikuang" @click="ontishikuang()" v-if="shwo_tishikuang">
<view class="tishikuang-content">
<image class="tishikuang-bg-img" src="../../static/img/quanyika_tishi_bg.png"></image>
<button class="tishikuang-button" @click="onLingka"><text class="btn-color">立即领卡</text></button>
<text class="tishikuang-text" @click="onYuanjia">原价购买</text>
</view>
</view>
</view>
</template>
<script>
const dom = weex.requireModule('dom');
import cstProductItem from '@/components/huahuasheng/nvue/hhs-product-item.vue';
import cstRefresh from '@/components/huahuasheng/nvue/hhs-refresh.nvue';
import couponsDialog from '@/components/huahuasheng/nvue/hhs-couponsDialog.nvue';
import {
mapState,
mapMutations
} from 'vuex';
//const _Dom = weex.requireModule('dom');
import mixins from './config/indexmixins.js';
import topAddDialog from '@/components/huahuasheng/nvue/hhs-adDialog.nvue';
import searchDialog from '@/components/huahuasheng/nvue/hhs-searchDialog.nvue';
import xiaojiDialog from '@/components/huahuasheng/nvue/hhs-xiaojiDialog.nvue';
// 缓存每页最多
const MAX_CACHE_DATA = 100;
// 缓存页签数量
const MAX_CACHE_PAGE = 3;
let hasOnload = false;
export default {
data() {
return {
statusBarHeight: '44rpx',
currentTab: 0,
tabItems: [],
cacheTab: [],
bannerAdvertLower: [],
bannerAdvertLowerCurr: 0,
bannerAdvert: [], // 广告位
darenlist: [],
showHeader: true,
navScorllLeft: 0,
navScorllLeft1: 0,
getHomeTopIcon: {
leftIcon: '',
rightIcon: ''
},
is_xiaoji: 0,
activity: [],
Item: [],
shwo_tishikuang: false,
mtElm: [],
bgColor: "#ffffff"
};
},
components: {
cstRefresh,
cstProductItem,
topAddDialog,
searchDialog,
couponsDialog,
xiaojiDialog
},
computed: {
...mapState(['hasLogin', 'userinfo', 'openid'])
},
onLoad() {
this.loadAppTopBanner();
this.getMtElm();
hasOnload = true;
var time = Date.now();
if (this.hasLogin && this.userinfo['vip_endtime'] > time) {
this.IsCouponsDialog();
}
},
onShow() {
if (hasOnload) {
this.getClipboardDataKeywords(); // 获取剪切板内容 实现超级搜索
this.dingweics();
}
},
mixins: [mixins],
methods: {
async dingweics() {
var that = this;
uni.getLocation({
type: 'gcj02',
geocode: true, //设置该参数为true可直接获取经纬度及城市信息
success: function(res) {
console.log(res.address);
that.saveaddress(res.address);
},
fail: function() {
console.log("获取定位失败")
uni.showToast({
title: '获取地址失败，将导致部分功能不可用',
icon: 'none'
});
}
});
},
async saveaddress(address){
var post = {
province:address.province,
city:address.city,
district:address.district,
uid: this.$store.state.openid
};
const res = await request.post('ucenter/saveAddress', post);
console.log(res);
},
async tojichang() {
if (!this.hasLogin) {
uni.navigateTo({
url: '/pages/member/ucenter/signIn'
});
return;
}
var that = this;
const res = await getApp().globalData.request.post('ucenter/getGameStatus', {
uid: this.$store.state.openid
});
if (res.code && res.code == 200) {
if (res.data.is_xiaoji !== 1) {
that.$refs.xiaojiDialog.open();
} else {
that.navigateTo('/pages/cart/cart', true);
}
}
},
ddd() {
console.log("点击");
},
async getMtElm() { //获取美团饿了么链接
var that = this;
try {
const res = await getApp().globalData.request.post('index/getMtElm', {});
console.log(res);
if (res.code == 200) {
that.mtElm = res.data;
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
} catch (e) {
uni.showToast({
title: "网络错误",
icon: 'none'
})
}
},
//充值vip赠送优惠券未领券提示
async IsCouponsDialog() {
var that = this;
try {
const res = await getApp().globalData.request.post('vip/vipCoupons', {
uid: that.$store.state.openid
});
console.log(res);
if (res.code == 200) {
var data = res.data;
if (data.vipCoupons == 1) {
that.$refs.couponsDialog.open();
}
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
} catch (e) {
uni.showToast({
title: "网络错误",
icon: 'none'
})
}
},
toMtElm(e) { //打开美团饿了么链接
var item = [];
if (e == 1) { //饿了么
item = this.mtElm["elm"];
} else {
item = this.mtElm["mt"];
}
getApp().globalData.request.navigateTo({
target: item.target,
url: item.url,
});
},
async youxi() {
uni.navigateTo({
url: '/pages/game/eluosi'
});
},
async getList(index, action = 1) {
let activeTab = this.tabItems[index];
if (activeTab.isLoading) {
return;
}
if (action === 1) {
activeTab.page = 1;
}
activeTab.isLoading = true;
try {
var post = {
page: activeTab.page,
limit: activeTab.limit,
cateid: activeTab.id,
source: 'home'
};
if (this.$store.state.hasLogin) {
post.uid = this.$store.state.openid;
}
const res = await getApp().globalData.request.post('product/goodslist', post);
console.log(res);
activeTab.isLoading = false;
if (action === 1) {
activeTab.data = [];
}
if (res.code == 200) {
res.data.forEach(item => {
if (item.goods_numiid) {
activeTab.data.push({
id: this.newGuid() + item.goods_numiid,
goods_picture: item.goods_picture,
goods_dtitle: item.goods_dtitle,
goods_title: item.goods_title,
goods_sale: item.goods_sale,
coupon_money: item.coupon_money,
goods_type: item.goods_type,
goods_price: item.goods_price,
goods_yprice: item.goods_yprice,
goods_numiid: item.goods_numiid,
goods_info: item.goods_info,
tkrates: item.tkrates,
goods_todaysale: item.goods_todaysale,
tkmoney: item.tkmoney,
goods_shoptype: item.goods_shoptype
});
} else {
activeTab.data.push(item);
}
});
activeTab.refreshing = false;
} else {
activeTab.loadingText = "加载完毕"
}
} catch (e) {
activeTab.isLoading = false;
activeTab.refreshing = false;
}
if (action == 1) {
activeTab.refreshing = false;
activeTab.refreshText = '已刷新';
activeTab.refreshFlag = false;
setTimeout(() => {
// TODO fix ios和Android 动画时间相反问题
this.pulling = false;
}, 500);
}
setTimeout(r => {
activeTab.refreshing = false;
}, 3000);
},
detail(e) {
this.navigatorTo(`/pages/detail/goodsinfo?itemid=${e.itemid}&goods_type=${e.goods_type}`);
},
navigateTo(url, isLogin) {
console.log(url);
if (isLogin == true && !this.hasLogin) {
console.log(url)
uni.navigateTo({
url: '/pages/member/index'
});
return;
}
uni.navigateTo({
url: url
});
},
newGuid() {
let s4 = function() {
return ((65536 * (1 + Math.random())) | 0).toString(16).substring(1);
};
return (s4() + s4() + '-' + s4() + '-4' + s4().substr(0, 3) + '-' + s4() + '-' + s4() + s4() + s4())
.toUpperCase();
},
loadMore(e) {
var activeTab = this.tabItems[this.currentTab];
activeTab.page = activeTab.page + 1;
this.getList(this.currentTab, 2);
},
onrefresh(e) {
var tab = this.tabItems[this.currentTab];
if (!tab.refreshFlag) {
return;
}
tab.refreshing = true;
tab.refreshText = '正在刷新...';
this.pulling = true;
this.getList(this.currentTab);
},
onpullingdown(e) {
var tab = this.tabItems[this.currentTab];
if (tab.refreshing || this.pulling) {
return;
}
if (Math.abs(e.pullingDistance) > Math.abs(e.viewHeight)) {
tab.refreshFlag = true;
tab.refreshText = '释放立即刷新';
} else {
tab.refreshFlag = false;
tab.refreshText = '下拉可以刷新';
}
},
async scrollNavBar(index) {
var offset = index * 40;
this.navScorllLeft = offset;
},
//获取navbar位置信息
switchTab(index) {
this.scrollNavBar(index);
if (this.tabItems[index].data.length === 0) {
this.getList(index);
}
if (this.currentTab === index) {
return;
}
// 缓存 tabId
if (this.tabItems[this.currentTab].data.length > MAX_CACHE_DATA) {
let isExist = this.cacheTab.indexOf(this.currentTab);
if (isExist < 0) {
this.cacheTab.push(this.currentTab);
}
}
this.currentTab = index;
// 释放 tabId
if (this.cacheTab.length > MAX_CACHE_PAGE) {
let cacheIndex = this.cacheTab[0];
this.clearTabData(cacheIndex);
this.cacheTab.splice(0, 1);
}
},
clearTabData(e) {
this.tabItems[e].data.length = 0;
this.tabItems[e].loadingText = '加载更多...';
},
onAdvertNav(index) {
this.bannerAdvertLowerCurr = index;
},
ontabtap(index) {
this.switchTab(index);
},
ontabchange(e) {
let index = e.target.current || e.detail.current;
this.switchTab(index);
},
toCategory(item) {
this.Item = item;
var time = Date.now();
if (item.dis == 1 && this.userinfo['vip_endtime'] < time) {
this.shwo_tishikuang = true;
return;
}
if (item.id == undefined) { //小宫格菜单 ，跳转查看特色功能
uni.navigateTo({
url: "/pages/nav/index"
})
return;
}
getApp().globalData.request.navigateTo({
target: item.target,
url: item.link,
title: item.title,
desc: item.desc_info,
param: item.params,
hasLogin: item.hasLogin || 0
});
},
darenDetail(item) {
this.navigatorTo(item.url);
},
navigatorTo(url) {
uni.navigateTo({
url: url
});
},
jumpAdList() {
console.info("jumpAdList");
if (!this.hasLogin) {
uni.navigateTo({
url: '/pages/member/ucenter/signIn'
});
return;
}
uni.navigateTo({
url: '/pages/game/index'
});
},
wap_sigin() {
if (this.hasLogin == false) {
this.navigatorTo('/pages/member/ucenter/signIn');
} else {
this.navigatorTo('/pages/member/agent/checkin');
}
},
wap_search() {
this.navigatorTo('/pages/search/index');
},
navigateBack() {
uni.navigateBack();
},
bannerAdvertLowerChange(e) {
const {
current
} = e.detail;
this.bannerAdvertLowerCurr = current;
var that = this;
this.navScorllLeft1 = current * 40;
},
bannerChange(e) {
var i = e.detail.current;
var banner = this.bannerAdvert[i];
this.bgColor = banner.bg_color;
},
swiperScroll(e) {
var contentOffset = e.contentOffset;
var tab = this.tabItems[this.currentTab];
if (contentOffset.y < (this.currentTab == 0 ? -380 : -100)) {
tab.showHeader = false;
} else {
tab.showHeader = true;
}
},
onLingka() {
this.shwo_tishikuang = false;
uni.navigateTo({
url: '/pages/member/pay?order_no=1221212'
});
return;
},
onYuanjia() {
var item = this.Item;
if (item.id == undefined) {
uni.navigateTo({ //小宫格菜单 ，跳转查看更多页面
url: "/pages/nav/index"
});
return;
}
getApp().globalData.request.navigateTo({
target: item.target,
url: item.link,
title: item.title,
desc: item.desc_info,
param: item.params,
hasLogin: item.hasLogin || 0
});
},
ontishikuang() {
this.shwo_tishikuang = false;
}
}
};
</script>
<style lang="less">
.new-home {
flex: 1;
flex-direction: column;
background-color: #f7f7f7;
}
.header-home {
background-color: #f1070b;
}
.index_header {
margin-top: 10rpx;
margin-bottom: 10rpx;
margin-left: 10rpx;
margin-right: 10rpx;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: nowrap;
}
.wap_left_icon {
width: 80rpx;
text-align: center;
justify-content: center;
align-items: center;
}
.wap_left_icon-image {
text-align: center;
justify-content: center;
align-items: center;
width: 70rpx;
height: 70rpx;
}
.wap_center_search {
flex: 1;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: nowrap;
}
.wap_search_icon {
height: 70rpx;
line-height: 70rpx;
flex: 1;
background-color: #f5f5f5;
color: #8a8a8a;
border-radius: 50rpx;
padding-left: 20rpx;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: nowrap;
font-size: 26rpx;
}
.wap_right_icon {
width: 120rpx;
text-align: center;
justify-content: center;
align-items: center;
}
.wap_right_icon-image {
text-align: center;
justify-content: center;
align-items: center;
width: 60rpx;
height: 60rpx;
}
/*分类*/
.new-home-top-nav {
flex-direction: row;
flex-wrap: nowrap;
height: 80rpx;
}
.new-home-top-nav-move {
width: 100rpx;
text-align: center;
height: 80rpx;
line-height: 80rpx;
}
.new-home-top-nav-move-text {
width: 100rpx;
color: #fff;
font-size: 34rpx;
height: 80rpx;
line-height: 80rpx;
font-weight: bold;
text-align: center;
}
/*宫格菜单分类*/
.advert-nav {
background-color: #fff;
border-radius: 25rpx;
margin: 5rpx 5rpx;
}
.new-advert-nav {
flex-direction: row;
flex-wrap: nowrap;
height: 50rpx;
margin-top: 30rpx;
padding: 0 20rpx;
}
.advert-scroll {
height: 80rpx;
flex-direction: row;
}
.advert-tab-item {
flex-wrap: nowrap;
text-align: center;
width: 100rpx;
}
.advert-tab-item-title {
width: 100rpx;
text-align: center;
color: #000000;
//color: rgba(255, 255, 255, 0.65);
font-size: 28rpx;
font-weight: bold;
padding: 5rpx 20rpx;
border-radius: 30rpx;
}
.advert-tab-item-title-active {
color: #fff;
background-color: #de0101;
}
.category-scroll {
width: 650rpx;
height: 80rpx;
flex-direction: row;
}
.category-tab-item {
flex-wrap: nowrap;
text-align: center;
width: 100rpx;
}
.category-tab-item-title {
width: 100rpx;
text-align: center;
color: #fff;
//color: rgba(255, 255, 255, 0.65);
font-size: 32rpx;
height: 80rpx;
line-height: 80rpx;
}
.category-tab-item-title-active {
border-bottom-color: #fff;
border-bottom-width: 4rpx;
}
.scroll-v {
flex: 1;
flex-direction: column;
}
.swiper-box {
flex: 1;
margin-top: -1rpx;
}
.swiper-item {
flex: 1;
flex-direction: column;
}
/*小宫格导航*/
.nav-swiper-item {
flex-wrap: wrap;
flex-direction: row;
background-color: #ffffff;
padding-top: 5rpx;
}
.nav-swiper {
flex: 1;
background-color: #ffffff;
height: 500rpx;
}
.nav-item {
padding-top: 20rpx;
width: 145rpx;
align-items: center;
}
.nav-item-image {
width: 75rpx;
height: 75rpx;
border-radius: 20rpx;
}
.nav-item-text {
line-height: 60rpx;
height: 60rpx;
text-align: center;
font-size: 26rpx;
padding-top: 10rpx;
color: #515a6e;
lines: 1;
}
.swiper-pagination {
padding-top: 10rpx;
padding-bottom: 20rpx;
//background-color: #ffffff;
}
.hhs-swiper-dots-item {
width: 20rpx;
height: 7rpx;
background-color: #c5c8ce;
}
.hhs-swiper-dots-item-curr {
background-color: #f23c39;
}
.header {
background-color: #fff;
}
/*广告位banner*/
.banner-bg {
height: 160rpx;
background-color: #f1070b;
border-bottom-left-radius: 20rpx;
border-bottom-right-radius: 20rpx;
}
.swiper-banner {
margin-top: -160rpx;
height: 270rpx;
}
.swiper-banner-item {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
.swiper-banner-item-image {
width: 720rpx;
flex: 1;
border-radius: 25rpx;
}
/*头条*/
.toutiao {
background-color: #ffffff;
}
.toutiao-box {
margin: 15rpx;
width: 710rpx;
flex-direction: row;
flex-wrap: nowrap;
background-color: #f6f6f6;
border-radius: 10rpx;
}
.toutiao-logo {
margin-right: 16rpx;
padding: 15rpx;
}
.toutiao-logo-image {
width: 118rpx;
height: 30rpx;
}
.toutiao-youjiantou {
width: 30rpx;
padding: 15rpx;
padding-left: 0rpx;
}
.toutiao-youjiantou-text {
width: 30rpx;
height: 30rpx;
line-height: 30rpx;
text-align: left;
}
.toutiao-swiper-slider {
width: 602rpx;
flex: 1;
height: 60rpx;
border-left-color: #f6f6f6;
border-left-width: 2rpx;
border-style: solid;
}
.toutiao-swiper-slider-item {
flex: 1;
}
.toutiao-swiper-slider-item-text {
height: 60rpx;
line-height: 60rpx;
font-size: 26rpx;
lines: 1;
}
/*饿了么美团广告位*/
.advertising {
display: flex;
flex-direction: row;
justify-content: space-around;
padding: 20rpx;
}
.advertising-item {
width: 330rpx;
height: 280rpx;
}
/*发现好货文字*/
.find_product_bg {
padding-top: 20rpx;
height: 60rpx;
background-color: #f7f7f7;
}
.find_product_bg_text {
font-size: 26rpx;
color: #333333;
height: 40rpx;
line-height: 40rpx;
margin: 0 10rpx;
}
/*首页进行中的活动*/
.home_activity {
background-color: #ffffff;
}
.home_activity_top-one {
flex: 1;
}
.home_activity_top-tow {
flex-direction: row;
flex-wrap: wrap;
padding-left: 15rpx;
padding-right: 15rpx;
}
.tishikuang {
width: 750rpx;
height: 1600rpx;
left: 0;
top: 0;
position: fixed;
z-index: 20;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
}
.tishikuang-content {
align-items: center;
}
.tishikuang-bg-img {
width: 750rpx;
height: 730rpx;
}
.tishikuang-button {
width: 360rpx;
height: 96rpx;
position: relative;
bottom: 220rpx;
background: linear-gradient(to right, #dcb393, #f8dec4);
border-radius: 50rpx;
border: 0;
box-shadow: 0px 5px 5 #7d7d7d;
}
.btn-color {
color: #78482f;
line-height: 70rpx;
font-size: 32rpx;
font-weight: bold;
}
.tishikuang-text {
width: 200rpx;
position: relative;
bottom: 180rpx;
text-align: center;
color: #78482f;
font-size: 32rpx;
font-weight: bold;
margin-top: 16rpx;
}
.imgarea{
align-items: center;
}
</style>
扫一扫
223
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
