dudao_uniapp/pages/taBbar/Home/Home.vue

<template>
	<view class="bg">
		<!-- 轮播 -->
		<view class="swipercontent ">
			<swiper class="swiper-box" style='height:474upx;' autoplay="true" circular="true" current="{swiperCurrent}"
				@change="swiperChange($event)" :data-current="swiperCurrent">
				<!-- <block > -->
				<swiper-item v-for="(item, index) in pic" :key="index">
					<view class='swiper-img'>
						<image :src="item" class="slide-image" />
					</view>
				</swiper-item>
			</swiper>
			<view class="dots">
				<block v-for="(item, index) in pic" :key="index">
					<view class="dot" :class="index == swiperCurrent ? ' active' : ''"></view>
				</block>
			</view>
		</view>
		<!--内容区域  -->
		<view class="content">
			<view class="cont-title">
				<view class="dtitle">
					<image class="limg" src="../../../static/images/ling.png" mode=""></image>
					<view class="title">
						读道文旅是谁？
					</view>
					<image class="limg" src="../../../static/images/ling.png" mode=""></image>
				</view>
				<view class="ftitle">
					公司简介(Company Profile）
				</view>
				<view class="introduce">
					<view class="grace-rich-text">
						<rich-text class="richtext" :nodes='desc'></rich-text>
					</view>
					<!-- 读道文旅集团(北京读道创意旅游文化发展股份有限公司)是一家为政府、企业提供“互联网+创意”的集成服务商，下设乡村振兴、田园综合体、特色小镇、超级旅游景区IEPCO+IP孵化产品创新+创意策划规划设计四轮驱动业务。 -->
					<!-- 作为IEPCO模式的创造者和实践者、中国文旅自媒体矩阵的运营者，集团以百号千群百万粉丝互联网矩阵实现文旅B端用户全覆盖，并依托百余人精英团队，以“不落地、不创意”的理念和“不辜负每块土地及每位客户的期望”的宗旨为300多家政府及企业提供创意落地服务，成功落地众多经典项目。我们真诚期待与您携手共创下一个奇迹！ -->
				</view>
			</view>

			<!-- 			<view class="cont-title h weiixn">
				<image @tap="ThePublicNumber" class="weiixn-pic1"  src="../../../static/images/dud.jpg" mode="widthFix"></image>
				<image class="weiixn-pic2" src="../../../static/images/w.jpg" mode="widthFix"></image>
			</view> -->


			<view class="cont-title h">
				<!-- 	<view class="dtitle">
					<image class="limg" src="../../../static/images/ling.png" mode=""></image>
					<view class="title">
						读道文旅做过什么？
					</view>
					<image class="limg" src="../../../static/images/ling.png" mode=""></image>
				</view>
				<view class="ftitle">
					案例解读(Case Interpretation）
				</view> -->
				<!-- <image :src="top" mode="widthFix"></image> -->
				<view class="types">
					<image class="typePic" :src="top" mode="widthFix"></image>
				</view>
			</view>

		</view>

		<!-- tab列表  //:class=" tab{{tabnum}}-->
		<!-- <view class='listening'> -->
		<!-- <scroll-view scroll-x="true" bindscroll="scroll" class="tab-h tab4"> -->
		<!-- <swiper class="tab-h tab4" autoplay="false" circular="true" interval="3000" duration="1000" display-multiple-items="4" current="0"   @change="swichNav" > -->
		<!-- <swiper-item  v-for="(item, id) in cate" :key="id">         -->
		<!-- v-for="(item, id) in cate" :key="id" -->
		<scroll-view scroll-x="true" bindscroll="scroll" class="tab-h tab4" scroll-with-animation="true">
			<view class="tab-title">
				<block v-for="(item, id) in cate" :key="id">
					<view class="tab-item" :data-current="id" :data-cateid="item.id" @tap="swichNav">
						<view class="tab-text" :class="currentTab== id ?'actives':'' ">
							{{item.name}}
						</view>
					</view>
					<!-- <view class="" :class="currentTab== id ?'actives':'' " :data-current="id" :data-cateid="item.id" @tap="swichNav"></view> -->
				</block>

			</view>
			<!-- </swiper-item> -->
			<!-- </swiper> -->
		</scroll-view>
		<!-- </view> -->
		<view class='listening'>
			<!-- listCase -->
			<!-- <scroll-view class="list" scroll-x="true" :current="currentTab" :scroll-left="navScrollLeft"  scroll-with-animation="true"  @tap="switchNav($event)">	 -->
			<view class="list">
				<!-- <swiper style="height:550px" :current="currentTab"  circular="true"  @change="switchTab"> -->

				<view class="listcent" v-for="(item, index) in listCase" :key="index">
					<!-- <swiper-item >	 -->
					<view @tap="list($event)" :data-id="item.id">

						<image class="listPic" :src="item.pic" mode=""></image>
						<view class="biaot">
							<view class="bt">{{item.name}}</view>
							<view class="xianq">
								<view class="text">点击查看详情</view>
								<image class="jt" src="../../../static/images/jt.png" mode=""></image>
							</view>
						</view>

					</view>
					<!-- </swiper-item> -->
				</view>

				<!-- </swiper> -->
			</view>
			<!-- </scroll-view> -->




			<view class="btn">
				<view class="btn-cont" @tap="cateList">
					<view class="anli">了解更多案例</view>
					<image class="gd" src="../../../static/images/gd.gif" mode=""></image>
				</view>
			</view>
		</view>






		<!-- v-if="poster != '' && wechat != '' " -->
		<view class="qiye-wei" v-if="poster != '' || wechat != '' ">

			<image v-if=" poster != '' " class="qiye-pic1" :src="poster" mode="widthFix"></image>

			<image v-if=" wechat != ''" class="qiye-pic2" :src="wechat" mode="widthFix"></image>


		</view>


		<!-- 	poster:'',
		wechat:'' -->







		<view class="footer">
			<view class="footer-cont">
				<view class="footer-btn">

					<view class="btn-title">
						<label class="btn-title-sz"> {{config.but_name[0]}}</label>
						<label class="btn-title-sz1"> {{config.but_name[1]}}</label>
						<text class=""></text>
					</view>

					<view class="btn-fdesc">{{config.but_title}}<text></text></view>
				</view>

				<view class="logocont">
					<view class="logos">
						<image class="logo" src="../../../static/images/icon.png" mode=""></image>
						<view class="logo-text">
							<text v-for="(item, index) in config.account" :key="index">{{item}}</text>
						</view>
					</view>

					<view class="code">
						<image class="codePic" :src="catePic" mode=""></image>
						<view class="codetext"><text class="codetext-s"> 长按二维码 获取更多</text> <text
								class="codetext-a">超级创意</text> </view>
					</view>
				</view>

			</view>


			<!-- 底部标签 -->
			<view class="business">
				<view class="businesscard">


					<image class="pic" :src="config.tel_pic" mode=""></image>
					<view class="cont">

						<view class="bus-cont">
							<view class="title1">{{config.but_count}} <text></text> </view>

							<view class="tel">
								<label class="tel-num">{{config.name}}:</label>
								<label class="tel-txt">{{config.phone}}</label>
								<text></text>
							</view>

							<view class="bus-desc">{{config.but_flag}}<text></text></view>
						</view>

					</view>

					<view class="rights1" @tap="tel">
						<image class="ri-tel" src="../../../static/images/phone.gif" mode=""></image>
						<!-- <view class="ri-tel">立即咨询</view> -->
					</view>

				</view>
			</view>



		</view>


		<!-- <official-account></official-account> -->

	</view>
</template>

<script>
	var graceRichText = require("../../../components/richText.js");
	import share from '../../../components/share2.js'

	// import h5jquery from '@/components/h5Shsre/jquery-3.5.1.min.js';
	// import jWeixin from '@/components/h5Shsre/jweixin-module.js';

	// import h5weixin from '@/components/h5Shsre/weixin.js';




	export default {
		data() {
			return {
				swiperCurrent: 0,
				pic: [],
				top: '',
				tabnum: 4,
				currentTab: 0, //预设当前项的值
				navScrollLeft: 0,
				currentTabs: 0,
				scrollLeft: 0, //tab标题的滚动条位置
				scrollTop: 0,
				account: [],
				phine: '',
				cate: [],
				listCase: [],
				cateid: '',
				desc: '',
				id: '',
				catePic: '',
				shares: '',
				config: '',
				type: '',
				poster: '',
				wechat: ''

			}
		},
		onLoad(e) {
			// //#ifdef H5
			// console.log(3333333,Dever_Share)
			// //#endif
			// uni.hideShareMenu()
			var that = this;
			console.log(2222, e)

			if (e) {
				that.type = e.type
				that.id = e.id
			}
			this.swiperChange = function(event) {
				var that = this;
				this.swiperCurrent = event.detail.current;
			}


			wx.loadFontFace({
				family: 'MFJinHei',
				source: 'url("https://trade.5dev.cn/cmmc/main/assets/mobile/css/MFJinHei_Noncommercial-Regular1.ttf")',
				// family: 'MFJinHei',
				// source: 'url("https://trade.5dev.cn/cmmc/main/assets/mobile/css/mfjin.TTF")',
				success: console.log
			})

			wx.getSystemInfo({
				success: (res) => {
					// this.setData({
					that.pixelRatio = res.pixelRatio,
						that.windowHeight = res.windowHeight,
						that.windowWidth = res.windowWidth
					// })
				}
			})

			//#ifdef H5

			this.inso1()
			this.insow()
			this.inso()
			// console.log(33338333,Dever_Share())

			//#endif


			this.getap()
			this.share()
			this.con_list()




		},

		onShow() {

		},
		// onShareAppMessage(e) {
		// 	var that = this;
		// 	var pic = this.shares.home_pic;
		// 	console.log(111, pic)
		// 	// return share.share(this.typename, '/pages/taBbar/home/home?path=https://trade.5dev.cn/cmmc/dist/#/my?type=' + this.applet +'&id=',this.id, this.typename, that,
		// 	// 			  2,this.typename,
		// 	// 			);
		// 	// return share.share(this.name, '/pages/content/share/share?id='+ uni.getStorageSync('uid')+'&path=/pages/content/share/share?type=' + this.applet +'&id=',uni.getStorageSync('uid'),  this.name, that,
		// 	// return share.share(this.name, '/pages/content/share/share?type=' + this.applet +'&id=',uni.getStorageSync('uid'), this.name, that,

		// 	return share.share(this.shares.home_name, '/pages/taBbar/Home/Home?id=', this.config.id, this.shares.home_name, that,
		// 		this.shares.home_pic, this.shares.home_name,
		// 	);

		// },

		onShareAppMessage(e) {

			var that = this;
			console.log(111, e)

			// var pic = that.myshopShare.pic;
			var scene = uni.getStorageSync('scene', scene);
			return share.share('/pages/taBbar/Home/Home?id=' + this.config.id,
				this.shares.home_name, this.shares.home_pic, 9)
		},

		methods: {

			ThePublicNumber() {
				uni.navigateTo({
					url: '../../content/ThePublicNumber/ThePublicNumber'
				})
			},

			share() {
				var that = this;
				var params = new Object()
				uni.request({
					// url: 'https://trade.5dev.cn/dudaowenlv/content/?l=api.share',
					url: this.host + 'api.share',
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success(res) {
						that.shares = res.data.data



						console.log(2222, res)
					}
				})
			},
			getap() {
				var that = this;
				var params = new Object()
				// params.signature = uni.getStorageSync('signature')
				uni.showLoading({
					title: '加载中'
				});
				uni.request({
					// url: 'https://trade.5dev.cn/dudaowenlv/content/?api.home',
					url: this.host + 'api.home',
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success(res) {


						uni.setNavigationBarTitle({
							title: res.data.data.config.title
						})

						that.pic = res.data.data.config.pic.split(",")
						that.top = res.data.data.config.top
						that.config = res.data.data.config
						that.account = res.data.data.config.account
						that.catePic = res.data.data.config.code
						console.log(22222, res.data.data.config.cote)
						that.listCase = res.data.data.cate[0].case
						// that.listCase = res.data.data.cate[0]
						// console.log(99999,res.data.data.cate[0].case)

						that.cate = res.data.data.cate
						// 
						that.cateid = res.data.data.cate[0].id
						that.desc = graceRichText.format(res.data.data.config.desc);
						var mob = res.data.data.config.phone;
						that.phine = mob.replace(/(\d{3})(\d{4})/, "$1  $2  ");
						// console.log(2222, that.pic)
						uni.hideLoading();
						uni.hideNavigationBarLoading();
						uni.stopPullDownRefresh(); //得到数据后停止下拉刷新	
						// var mob="13800138000";


						//#ifdef H5

						let button = false;
						let uid = -1;
						let project = 104;
						let url = "http://cm.5dev.cn/wechat/share/?api.";
						let param = {
							title: res.data.data.config.h5_share_name,
							img: res.data.data.config.h5_share_pic,
							desc: res.data.data.config.h5_share_desc,
							url: window.location.href
						};
						console.log(89897, param);

						Dever_Share.Init(uid, project, url, param, button);
						//#endif

						// var mob= res.data.data.config.phine;

						// that.phine= mob.replace(/(\d{3})(\d{4})/,"$1  $2  ");

						if (that.type == 2) {
							console.log(888, that.id)
							uni.navigateTo({
								url: '../../content/List/List?cateid=' + that.id
							})
						} else if (that.type == 3) {
							uni.navigateTo({
								url: '../../content/List-dl/List-dl?id=' + that.id
							})
						}
						// 						console.log(11118, m)
					}
				})
			},
			// switchTab(event){
			// 	console.log(22225, event)
			// 	var that = this;
			// 	// var cur = event.currentTarget.dataset.current; 
			//              var cur = event.detail.current;
			// 	//每个tab选项宽度占1/5
			// 	var singleNavWidth = this.windowWidth / 5;
			// 	//tab选项居中                            
			// 	// this.setData({
			// 		that.navScrollLeft= (cur - 2) * singleNavWidth
			// 	// })      
			// 	if (this.currentTab == cur) {
			// 		return false;
			// 	} else {
			// 		// this.setData({
			// 			that.currentTab= cur
			// 		// })
			// 	}
			// 	var params = new Object()
			// 		if(event.detail.current){
			// 		var detailcurrent=  event.detail.current
			// 		that.cateid =  that.cate[detailcurrent].id;
			// 		var cateid =  that.cate[detailcurrent].id;
			// 		console.log(99999888,event.detail.current)
			// 		console.log(88887777,that.cate[detailcurrent].id)
			// 		params.id = that.cate[detailcurrent].id
			// 		}else{
			// 		params.id = 1
			// 		
			// 		}
			// 	// params.id =  e.currentTarget.dataset.cateid
			// 	//发起请求
			// 	uni.request({
			// 		
			// 		url: 'https://trade.5dev.cn/dudaowenlv/content/?l=api.home_cate',
			// 		// https://trade.5dev.cn/dudaowenlv/content/?l=api.lists
			// 		data: params,
			// 		method: 'GET',
			// 		header: {
			// 			'content-type': 'application/json' // 默认值
			// 		},
			// 		success: function(res) {
			// 			// console.log(343434,res)
			// 			that.listCase = res.data.data.case
			// 			//拿到解密后的数据，进行代码逻辑
			// 		},
			// 		fail: function() {},
			// 	})
			// 	
			// 	
			// },
			swichNav(e) {

				console.log(8888, e)
				// return
				var that = this;
				var cur = e.currentTarget.dataset.current;
				// var cur = e.detail.current;
				// var singleNavWidth = this.windowWidth / 5;
				// that.navScrollLeft= (cur - 2) * singleNavWidth

				if (this.currentTab == cur) {
					return false;
				} else {
					that.currentTab = cur
				}

				// http://192.168.0.10/dudaowenlv/content/?api.lists
				var params = new Object()
				// if(e.detail.current){
				// 	var detailcurrent=  e.detail.current
				// 	that.cateid =  that.cate[detailcurrent].id;
				// 	var cateid =  that.cate[detailcurrent].id;
				// 	console.log(99999888,e.detail.current)
				// 	console.log(88887777,that.cate[detailcurrent].id)
				// 	params.id = that.cate[detailcurrent].id
				// 	}else{
				// 	params.id = 1
				// 	}
				that.cateid = e.currentTarget.dataset.cateid
				params.id = e.currentTarget.dataset.cateid
				//发起请求
				uni.request({

					// url: 'https://trade.5dev.cn/dudaowenlv/content/?l=api.home_cate',
					url: this.host + 'l=api.home_cate',
					// https://trade.5dev.cn/dudaowenlv/content/?l=api.lists
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success: function(res) {
						// console.log(343434,res)
						that.listCase = res.data.data.case
						//拿到解密后的数据，进行代码逻辑
					},
					fail: function() {},
				})

			},


			con_list() {
				var that = this;
				var params = new Object()
				uni.request({
					// url: 'https://trade.5dev.cn/dudaowenlv/content/?l=api.share',
					url: this.host + 'api.con_list',
					data: params,
					method: 'GET',
					header: {
						'content-type': 'application/json' // 默认值
					},
					success(res) {
						console.log(222229, res)
						that.poster = res.data.data.config.poster
						that.wechat = res.data.data.config.wechat
						// that.poster=""
						// that.wechat=""
						// that.shares = res.data.data

					}
				})
			},


			cateList() {
				var that = this;
				console.log(111136, that.cateid)
				uni.navigateTo({
					url: '../../content/List/List?cateid=' + that.cateid
				})
			},
			list(event) {
				// event.currentTarget.dataset.id
				// console.log(22222,event.currentTarget.dataset.id)
				var id = event.currentTarget.dataset.id
				uni.navigateTo({
					url: '../../content/List-dl/List-dl?id=' + id
				})
			},

			tel() {
				var that = this;
				uni.makePhoneCall({
					phoneNumber: that.phine
				});
			},


			inso1() {
				var url =
					"https://code.jquery.com/jquery-3.5.1.min.js";
				console.log(111198, url);
				var jsap = document.createElement("script");
				jsap.charset = "utf-8";
				jsap.src = url;
				document.head.appendChild(jsap);
			},

			inso() {
				var url =
					"https://trade.5dev.cn/dever_package/script/assets/dever/share.js?t1&callback=onLoad";
				console.log(111198, url);
				var jsap = document.createElement("script");
				jsap.charset = "utf-8";
				jsap.src = url;
				document.head.appendChild(jsap);
			},

			insow() {
				var url =
					"https://trade.5dev.cn/dever_package/script/assets/lib/share/weixin.js";
				console.log(111198, url);
				var jsap = document.createElement("script");
				jsap.charset = "utf-8";
				jsap.src = url;
				document.head.appendChild(jsap);
			},

		}
	}
</script>

<style>
	/* <image class="weiixn-pic1" class="" src="../../../static/images/dud.jpg" mode=""></image> */
	/* <image class="weiixn-pic2" src="../../../static/images/w.jpg" mode=""></image> */

	.weiixn {
		overflow: hidden;
		_zoom: 1;
		padding: 20rpx 0rpx;
		background: #FFFFFF;
	}

	.weiixn-pic1 {
		float: left;
		width: 375rpx;
		height: auto;
		display: block;
	}

	.weiixn-pic2 {
		float: right;
		width: 375rpx;
		height: auto;
		display: block;
	}

	.bg {
		background: #f7f7f7;
	}

	/* 轮播自定义样式 */
	.swipercontent {
		position: relative;
	}

	.swiper-box {
		background: #fff;
	}

	.slide-image {
		width: 100%;
		height: 454upx;
		display: block;
	}

	.swiper-box .uni-swiper-dots {
		position: absolute;
		margin: 0 auto !important;
		top: 316upx;
	}

	.swiper-box .uni-swiper-dot {
		width: 19upx;
		display: inline-flex;
		height: 7upx;
		margin-right: 20upx;
		justify-content: space-between;
	}

	.swiper-box .uni-swiper-dot::before {
		content: '';
		flex-grow: 1;
		background: #e0e0e0;
	}

	.swiper-box .uni-swiper-dot-active::before {
		background: #2f2f2f;
		border-radius: 4upx;
	}

	.swipercontent {
		position: relative;
	}

	.dots {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0upx;
		display: flex;
		justify-content: center;
	}

	.dot {
		margin: 0 8upx;
		width: 21upx;
		height: 9upx;
		background: #333;
		border-radius: 16upx;
	}

	.dot.active {
		width: 21upx;
		background: #dfdfdf;
	}

	/* 结束 */

	/* 内容 */
	.cont-title {
		background: #FFFFFF;
	}

	.h {
		margin-top: 20upx;
	}

	.dtitle {
		overflow: hidden;
		_zoom: 1;
		display: flex;
		justify-content: center;
		margin: 0 auto;
		padding-top: 47upx;

		/* width: 300upx; */
	}

	.title {
		font-size: 42upx;
		font-family: PingFang-SC-Medium;
		font-weight: bold;
		color: rgba(34, 34, 34, 1);
		padding: 0 24upx;
		float: left;
	}

	.limg {
		float: left;
		width: 35upx;
		height: 15upx;
		display: block;
		margin-top: 22upx;

	}

	.ftitle {
		margin-top: 8upx;
		font-size: 28upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
		text-align: center;
	}

	.introduce {
		/* 	font-size: 30upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		padding: 55upx 34upx; */

	}

	.grace-rich-text {
		font-size: 30upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		padding: 55upx 34upx;
	}

	.types {
		margin: 0 9upx;
		padding: 0upx 0 0upx 0;
	}

	.typePic {
		width: 100%;


	}

	/* tab切换列表 */
	::-webkit-scrollbar {
		width: 0;
		height: 0;
		color: transparent;
	}

	.tab-h {
		box-sizing: border-box;
		height: 102upx;
		line-height: 94upx;
		white-space: nowrap;
		z-index: 99;
		background: #fff;
		border-bottom: 1upx solid #E5E5E5;
		box-sizing: border-box;
		/* padding-bottom: 16upx;  */
	}

	.tab-title {
		margin: 0 32upx;
		position: relative;
	}

	.tab6 .tab-item {
		margin: 0upx 50upx;
		display: inline-block;
		font-size: 28upx;
		color: #474245;
		/* float: left; */
	}

	.tab5 .tab-item {
		margin: 0upx 50upx;
		display: inline-block;
		font-size: 34upx;
	}

	.tab4 .tab-item {
		margin-right: 39upx;
		display: inline-block;
		font-size: 28upx;
		color: #474245;
		/* width: 180upx; */
		text-align: center !important;
	}

	.tab3 .tab-item {
		margin: 0upx 80upx;
		display: inline-block;
		font-size: 34upx;
	}

	.actives {
		/* width: 60upx; */
		font-size: 32upx !important;
		font-family: PingFang-SC-Bold;
		font-weight: bold;
		color: #DD4243 !important;
		border-bottom: 2px solid rgba(221, 66, 67, 1);
		border-bottom-left-radius: 4upx;
		box-sizing: border-box;
		/* text-align:center; */
		/* margin:0 auto; */

		/* width: 50upx; */
		/* 	position: absolute;
		left: 0;
		top: 0; */
	}

	/* .tab-text:f */
	/*   .tab-text{
		padding: 0 40upx;
	} */
	.tab-content {
		z-index: 9999;
		margin-top: 92upx;
		width: 100%;
		height: auto;
		display: block;
	}


	/* 列表 */
	.listening {
		background: #FFFFFF;
	}

	.list {
		margin: 0 10upx;
		padding-top: 31upx;
		/* display:flex; */
		overflow: hidden;
		_zoom: 1;
		margin-bottom: 61upx;
	}

	.listcent {
		margin-left: 23upx;
		float: left;
		width: 333upx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0upx 4upx 8upx 0upx rgba(201, 201, 201, 0.75);
		border-radius: 10upx;
		height: 348upx;
		margin-bottom: 21upx;
	}

	.listPic {
		display: block;
		width: 333upx;
		height: 230upx;
		border-radius: 10upx 10upx 0px 0px;
	}

	/*  */
	.biaot {
		background: #fff;
		text-align: center;
	}

	.bt {
		font-size: 26upx;
		font-family: PingFang-SC-Regular;
		font-weight: bold;
		color: rgba(51, 51, 51, 1);
		padding: 20upx 12upx 18upx 12upx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;

	}

	.xianq {
		overflow: hidden;
		_zoom: 1;
		margin: 0 81upx;
	}

	.text {
		font-size: 24upx;
		font-family: PingFang-SC-Regular;
		font-weight: 400;
		color: rgba(102, 102, 102, 1);
		float: left;
	}

	.jt {
		width: 14upx;
		height: 16upx;
		float: right;
		display: block;
		margin-top: 11upx;

	}

	.btn {
		padding-bottom: 82upx;
	}

	.btn-cont {
		margin: 0 155upx;

		height: 70upx;
		background: #f4f4f4;
		/* box-shadow:3upx 5upx 134upx 7upx rgba(7,7,7,0.13); */
		/* opacity:0.2; */
		border-radius: 35upx;
		overflow: hidden;
		_zoom: 1;
		padding: 0 107upx;
	}

	.anli {
		font-size: 30upx;
		font-family: PingFang-SC-Regular;
		font-weight: bold;
		color: rgba(102, 102, 102, 1);

		line-height: 70upx;
		float: left;
	}

	.gd {
		width: 30upx;
		height: 29upx;
		float: right;
		margin-top: 22upx;

	}

	.footer-cont {
		padding: 0upx 73upx 37upx 86upx;
		background: #FFFFFF;
	}

	.tag {
		overflow: hidden;
		_zoom: 1;
	}

	.labels {
		overflow: hidden;
		_zoom: 1;
		float: left;
		/* display: inline-block; */
		/* display: flex; */
	}

	.label {
		font-size: 26upx;
		font-family: SourceHanSansCN-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		float: left;
	}

	.lxian {
		font-size: 26upx;
		font-family: SourceHanSansCN-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		float: left;
		margin: 0 4upx;
	}

	.labels:last-child .lxian {
		font-size: 0upx;
		float: left;
		margin: 0;
	}

	.labels:first-child .lxian {
		font-size: 0upx;
		float: left;
		margin: 0;
	}

	/* 	.tel {
		overflow: hidden;
		_zoom: 1;
		margin-top: 23upx;
		line-height:44upx;

	} */

	.telpic {
		width: 37upx;
		height: 41upx;
		float: left;
		display: block;
		margin-right: 20upx;
	}

	.laos {
		/* font-family: MFJinHei; */
		/* font-weight: bold; */
		font-size: 34upx;
		color: #FFFFFF;
		float: left;
	}

	.phine {
		/* font-family: MFJinHei; */
		letter-spacing: 2upx;
		/* font-weight: bold; */
		font-size: 34upx;
		color: #FFFFFF;
		float: left;
	}

	.bohao {
		width: 36upx;
		height: 40upx;
		display: block;
		float: left;
		margin-left: 38upx;
		margin-top: 5upx;

	}

	/* .flex{height:100%;display:flex;justify-content:center;align-items:center} */
	/* .bohao{
		width: 34upx;
		height: 36upx;
		display: block;
		float: left;
		margin-left: 38upx;
		margin-top: 5upx;

} */


	.tjt {
		width: 39upx;
		height: 28upx;
		display: block;
		float: left;
		margin-left: 12upx;
		margin-top: 12upx;

	}






	.footer-btn {
		width: 100%;
	}

	.footer-btn view {

		text-align: justify;
		display: inline-block;
		text-align-last: justify;
		text-justify: inter-ideograph;
		vertical-align: top;
	}

	.footer-btn view text {
		display: inline-block;
		height: 0;
		width: 100%
			/* 换行 */
	}

	.btn-title {
		display: flex;
		font-size: 58upx;
		font-family: Source Han Sans CN;
		font-weight: 800;
		color: rgba(220, 66, 66, 1);
		line-height: 58upx;
		margin-bottom: 14rpx;
		height: 58rpx;
		width: 100%;
	}

	.btn-title-sz {
		color: #DC4242;

	}

	.btn-title-sz1 {
		color: #211717;

	}

	.btn-fdesc {
		width: 100%;
		font-size: 32upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 32upx;
		height: 32rpx;
		text-align: center;
		margin-bottom: 24rpx;
	}

	.logocont {
		overflow: hidden;
		_zoom: 1;
		/* margin-top: 42upx; */
	}

	.logos {
		float: left;
		width: 352upx;
		margin-top: 15upx;
	}

	.logo {
		width: 324upx;
		height: 160upx;
		display: block;
		margin: 0 auto;

	}

	.logo-text {
		text-align: center;
		font-size: 28upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 28upx;
		margin-top: 20rpx;
	}

	.code {
		float: right;
	}

	.codePic {
		width: 210upx;
		height: 210upx;
		display: block;

	}

	.codetext {
		text-align: center;
		/* font-size: 16upx;
		font-family: SourceHanSansCN-Bold;
		font-weight: bold;
		color: rgba(255, 255, 255, 1); */

		font-size: 16upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 16upx;
		/* text-align:justify;
		 text-align-last:justify; */
	}

	.codetext-s {
		color: #333333;
	}

	.codetext-a {
		color: #DC4242;
	}



	/* 	.bohao {

    animation: shake 1s;
    -o-animation: shake 1s;
    -webkit-animation: shake 1s;
    -moz-animation: shake 1s;
} */

	/* .bohao {
    animation: move 1s 0s infinite;
    -webkit-animation: move 1s 0s infinite;

} */

	@keyframes move {

		0%,
		5% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		15% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		25% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		35% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		45% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		55% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		60% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		65% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		70% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		75% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		80% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		85% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		90% {
			-webkit-transform: rotate(6deg);
			transform: rotate(6deg);
		}

		95% {
			-webkit-transform: rotate(-6deg);
			transform: rotate(-6deg);
		}

		100% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
	}

	.tjt {
		animation: move 1s 0s infinite;
		-webkit-animation: move 1s 0s infinite;
	}


	.tjt {
		position: relative;
		animation: myfirst 1s 0s infinite;
		-webkit-animation: myfirst 1s linear 1s infinite alternate;
	}

	@keyframes myfirst {
		0% {
			left: 0px;
		}

		25% {
			left: 3px;
		}

		50% {
			left: 6px;
		}

		75% {
			left: 3px;
		}

		100% {
			left: 0px;
		}
	}



	/* 底部 */

	.business {
		width: 100%;
		background: #DD4243;


	}

	.businesscard {
		height: 190upx;
		overflow: hidden;
		_zoom: 1;
		padding: 0 42upx 0 53upx;
		display: flex;

	}

	.left {}

	.rights1 {

		margin-top: 13upx;
		margin-left: 10rpx;
	}

	.ri-tel {
		width: 103upx;
		height: 173upx;
		display: block;
	}

	.phone {
		overflow: hidden;
		_zoom: 1;
		display: flex;
	}

	.pic {
		width: 154upx;
		height: 154upx;
		/* border-radius: 50%; */
		display: block;
		margin: 18upx 20upx 0 0upx;
		display: block;
		/* margin-bottom: 17upx; */

	}

	.bus-cont view {
		/* 	text-align: justify;
		text-align-last: justify; */
		text-align: justify;
		display: inline-block;
		text-align-last: justify;
		text-justify: inter-ideograph;
		vertical-align: top;
		width: 100%;

	}

	.bus-cont view text {
		display: inline-block;
		height: 0;
		width: 100%
			/* 换行 */
	}




	.title1 {
		margin-top: 41upx;
		margin-bottom: 17rpx;
		font-size: 28upx;
		height: 28upx;
		line-height: 28upx;
		/* font-weight:bold; */
		color: #fff;
	}

	.tel {
		color: #fff;
		font-size: 30upx;

		line-height: 30upx;
		height: 30upx;
		/* text-align: left; */
		/* display: flex; */
		/* line-height: 30rpx; */

	}

	.tel-num {
		/* height: 30upx;
		line-height: 30upx; */
	}

	.tel-txt {
		/* 	height: 30upx;
		line-height: 30upx; */
		letter-spacing: 6upx;
	}

	.bus-desc {
		/* margin-top: 20rpx; */
		font-size: 20upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		/* color:rgba(51,51,51,1); */
		line-height: 20upx;
		color: #fff;
		height: 20upx;

		/* font-size:20px; */
		/* font-family:Source Han Sans CN; */
		/* font-weight:400; */
		/* color:rgba(51,51,51,1); */
		/* line-height:29px; */
	}

	.cont {
		overflow: hidden;
		_zoom: 1;
		flex: 1;
	}


	.bustag {
		overflow: hidden;
		_zoom: 1;
	}

	.bustext {
		overflow: hidden;
		_zoom: 1;
		float: left;
		/* margin-bottom: 30upx; */
	}

	.buslxian {
		float: left;
		font-size: 30upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		margin: 0 6upx;
	}

	.bustext:first-child .buslxian {
		float: left;
		font-size: 0upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		margin: 0;
	}

	.bust {
		float: left;
		font-size: 30upx;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
	}

	.btnPic {
		width: 100%;
		display: block;
	}



	/* 	<view class="qiye-wei">
		
		<image class="qiye-pic1" src="../../../static/images/微信图片_20210604135943.jpg" mode="widthFix"></image>
		
		<image class="qiye-pic1"  src="../../../static/images/微信图片_20210604135950.jpg" mode="widthFix"></image>
		
		
	</view> */


	.qiye-wei {
		background: #FFFFFF;
		padding-bottom: 50rpx;
		position: relative;
	}

	.qiye-pic1 {
		margin: auto;
		display: block;
		height: 300rpx;
		vertical-align: middle;
		max-width: 100%;
	}

	.qiye-pic2 {
		margin: auto;
		display: block;
		vertical-align: middle;
		height: 300rpx;
		max-width: 100%;
	}


	image {}
</style>
<!-- 				<view class="logocont">
					<image class="logo" src="../../../static/images/logo.png" mode=""></image>
					<view class="code">
						<image class="codePic" src="../../../static/images/code.png" mode=""></image>
						<view class="codetext" class="">长按 获取更多超级创意</view>
					</view>
				</view> -->