开源淘客APP源码抖客京东客多多客uniapp开发模板
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"><textclass="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"><textclass="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;}// 缓存 tabIdif (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;// 释放 tabIdif (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>