cte-share/pages/shanpinxungou/shangjia/shangjiaView.vue

<template>
	<view style="background-color: whitesmoke;" @touchstart="rightF" @touchend="leftF">
		<customNav :shownav="true" :title="posName" titledetl=""></customNav>
		<view style="width: 100%;height: 80rpx;background-color:  #00A6FF;"></view>
		<view class="nodetail">
			<view class="contentInRowS" style="width: 100%;">
				<netImage style="margin-left: 12rpx;margin-top: -20rpx;" width="160" height="160" bradius="80"
					:mysrc="mendianMs.logo" mymode="scaleToFill"></netImage>
				<view class="contentColumn" style="width: 500rpx;margin-right: 20rpx;">
					<text class="dianpuming">{{mendianMs.posName}}</text>
					<text class="peisongsuoming">{{$t('index.manX')}} {{$formPr(mendianMs.posPrice)}}
						{{$t('locale.huobidw')}}</text>
					<view class="contentInRowS">
						<view class="contentColumnC" style="width: 24%; visibility: hidden;">
							<image class="actimge" :src="shouchangIcon" mode="aspectFit" @click="shouchang"></image>
							<text class="textfontS3">{{$t('index.shouchang')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/daipinglun@3x.png" mode="aspectFit"
								@click="pinglunList"></image>
							<text class="textfontS3">{{$t('index.pinglun')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/gengduozx.png" mode="aspectFit"
								@click="gengduozx"></image>
							<text class="textfontS3">{{$t('index.mendian')}}</text>
						</view>
						<view class="contentColumnC" style="width: 24%;">
							<image class="actimge" src="/static/images/lianxikf.png" mode="aspectFit"
								@click="callPhone"></image>
							<text class="textfontS3">{{$t('mend.kefudianhua')}}</text>
						</view>
					</view>
				</view>
			</view>
			<view v-if="mendianMs.state==1" class="contentInRowR">
				<text
					style="margin-top: 10rpx;color: darkgreen;font-size: 28rpx;padding-right: 40rpx;">{{$t('mend.statedy')}}</text>
			</view>
			<view style="height: 20rpx;"></view>
		</view>
		<view v-if="cuxiaoImge.length==0">
			<netImage style="margin-top:20rpx;margin-left: 25rpx;" width="700" height="400" bradius="6"
				:mysrc="mendianMs.image" mymode="scaleToFill"></netImage>
		</view>

		<view v-if="cuxiaoImge.length>0"><!-- 促销活动 -->
			<swiperImgs style="margin-top: 20rpx;" width="750" height="400" :imageList="cuxiaoImge"></swiperImgs>
		</view>
		<view style="margin-top: 40rpx;">
			<view :class="[(isFixedTop[0]) ?cssName:'']" id="box" class="box">
				<view class="contentInRowL"
					style="width: 90%;margin-left: 5%;margin-bottom: 20rpx;align-items: center;">
					<view>
						<text class="fenleiTitle" @click="popfenlei">{{$t('index.goodsfenlei')}}</text>
					</view>
					<image class="actimgezy" style="margin-left: 10rpx;" src="/static/images/zuoyouhd.png"
						mode="aspectFit"></image>
					<view class="">
						<swiper style="height: 60rpx;width: 450rpx;align-items: center;" display-multiple-items="2"
							:indicator-dots="false" :autoplay="false" :current="current" :duration="500"
							@animationfinish="fenleiSel">
							<swiper-item v-for="(item,index) in shangpinfenlei">
								<view class="swiper-item text1row">{{item.name}}</view>
							</swiper-item>
						</swiper>
					</view>
				</view>
			</view>
			<view v-if="shangpinfenlei.length>0" class="page-view contentColumnC">
				<view class="contentInRowC">
					<text class="textdop2"></text>
					<text class="textdop1"></text>
					<text class="text2row"
						style="margin-left: 10rpx;font-size: 30rpx;font-weight: bold;max-width: 600rpx;">{{shangpinfenlei[current].name}}</text>
					<text class="textdop1"></text>
					<text class="textdop2"></text>
				</view>
			</view>
			<view class="page-view contentColumn">
				<view class="item_list">
					<view class="item_content" v-for="(item1, index1) in shangpinlist" :key="index1">
						<view v-if="item1.stackingUp==0" class="thumb-boxR contentColumnC">
							<netImage class="goodimage" width="334" height="334" :mysrc="item1.image"
								mymode="scaleToFill" v-on:Emyimageclick="shangpinsl(item1.id)"></netImage>
							<view class="msText">
								<text class="dianpuming" @click="shangpinsl(item1.id)">{{item1.name}}</text>
								<view class="buyBT">
									<text class="peisongsuoming detailtextV">{{item1.introduce}}</text>
								</view>
								<view v-if="shangpingoumaiS[current][index1]" class="buyBTSB">
									<text class="peisongsuoming">{{$formPr(item1.price)}}{{$t('locale.huobidw')}}</text>
									<view v-if="item1.stackingUp==0" class="rconten">
										<image v-if="shangpingoumaiS[current][index1].shuliang>0" class="imageRJ"
											src="/static/images/jian@3x.png" mode="aspectFit"
											@click="jiangouwuche(index1)"></image>
										<text v-if="shangpingoumaiS[current][index1].shuliang>0"
											class="textR">{{shangpingoumaiS[current][index1].shuliang}}</text>
										<image class="imageR" src="/static/images/plus-circle-fill@3x.png"
											mode="aspectFit" @click="editSKU(index1)"></image>
									</view>
									<view v-if="item1.stackingUp==1" class="rconten">
										<text class="textR">{{$t('mend.yixiajia')}}</text>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view style="height: 260rpx;"></view>
			</view>
		</view>

		<!-- <view v-if="dailinghb.length>0" class="hongbaoFV">
			<view class="hongbaoImage" @click="openhbkq">
				<image src="/static/images/hongbkq.png" style="width: 100%;height: 100%;" mode="aspectFit"></image>
			</view>
		</view> -->

		<view class="bottomfloatV">
			<view class="buyBT">
				<image class="gouwuche" :src="gouwcheimg" mode="aspectFit" @click="gotoGouwuche"></image>
				<text class="peisongsuoming">{{notext}}</text>
				<text class="qjs" :style="{backgroundColor:gwbcolor,color:gwbTcolor}"
					@click="gotojiesuan">{{$t('comp.qujiesuan')}}</text>
			</view>
		</view>

		<popViewGG :show="showpop" :showbotom="false" :maskClosable="true" :isCancel="true"
			@chooseCancel="chooseCancel">
			<foodxuangou style="width:100%;max-height: 70vh" :food="spindexSP" v-on:Ejiagouwuche="jiagouwuche">
			</foodxuangou>
		</popViewGG>
		<uni-popup style="z-index: 999;" ref="popfl" type="center" :isMaskClick="true" :safeArea="true">
			<view class="contentColumnC" style="width:660upx;background-color:white;border-radius: 8rpx;">
				<text class="fenleiTitle"
					style="margin-top: 16rpx;margin-bottom: 16rpx;">{{$t('index.goodsfenlei')}}</text>
				<scroll-view scroll-y="true" style="max-height: 400rpx;">
					<view>
						<view class="" v-for="(item,index) in shangpinfenlei">
							<view class="fenleiitem" @click="ppfenleisel(index)">{{item.name}}</view>
						</view>
					</view>
				</scroll-view>
				<view style="height: 20rpx;"></view>
			</view>
		</uni-popup>

		<popViewGG :show="hongbkqs" :acttips="$t('order.queding')" :maskClosable="true" :isCancel="false"
			@chooseCancel="chooseCancel">
			<view class="contentColumnC" style="width: 100%;background-color: whitesmoke;">
				<view class="contentColumnC" style="height: 80rpx;width: 100%;background-color: lightgray;">
					<view class="contentInRowS" style="height: 80rpx;width: 90%;">
						<text style="font-size: 30rpx;color: crimson;"></text>
						<text style="font-size: 28rpx;">{{$t('index.hongbaokq')}}</text>
						<text style="font-size: 30rpx;color: #00A6FF;"
							@click="querenyhhd">{{$t('order.queding')}}</text>
					</view>
				</view>
				<view v-if="dailinghb.length>0" style="width: 90%;">
					<view class="contentColumn" style="margin-top: 16rpx;" v-for="(item, index) in dailinghb"
						:key="index">
						<view class="contentInRowS">
							<view class="contentColumn withpophbkq"
								:style="item.type==0?'color: #00A6FF;':'color:green;'">
								<text style="font-size: 28rpx;">{{item.name}}</text>
								<text style="font-size: 28rpx;">{{getNote(item,1)}}</text>
							</view>
							<view class="contentInRowC"
								style="width: 150rpx;height:50rpx;background-color:chocolate;border-radius: 6rpx;"
								@click="lingququan(item.id)">
								<text style="font-size: 26rpx;color: white;">{{$t("hongbaokq.lingqu")}}</text>
							</view>
						</view>
					</view>
				</view>
				<view style="height: 80rpx;"></view>
			</view>
		</popViewGG>

		<!-- 下载app弹窗 -->
		<uni-popup ref="downloadPopup" type="center" :mask-click="true">
			<view class="download-popup-content">
				<!-- 标题栏 -->
				<view class="download-popup-header">
					<text class="download-popup-title">{{$t('api.message')}}</text>
					<view class="download-popup-close" @click="closeDownloadPopup">
						<text class="close-icon">×</text>
					</view>
				</view>
				<!-- 内容 -->
				<view class="download-popup-body">
					<text class="download-popup-text">{{$t('jiesuan.xiazapp')}}</text>
				</view>
				<!-- 按钮 -->
				<view class="download-popup-buttons">
					<view class="download-popup-btn download-popup-btn-ios" @click="downloadIOS">
						<text class="download-popup-btn-text">{{$t('jiesuan.xzios')}}</text>
					</view>
					<view class="download-popup-btn download-popup-btn-android" @click="downloadAndroid">
						<text class="download-popup-btn-text">{{$t('jiesuan.xiazandriod')}}</text>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import api from "@/pages/api/api.js";
	export default {
		data() {
			return {
				isFixedTop: [],
				Topdistance: [],
				cssName: '',
				//------------------------------
				cuxiaoImge: [],
				id: 1,
				userid: 0,
				mendianMs: [],
				posName: '',
				isfirstShow: 0,
				isShouchang: 0,
				shouchangIcon: '/static/images/faver@3x.png',
				option: {},
				login: false,
				showpop: false,
				gouwuche: '',
				scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
				shangpinfenlei: [],
				shangpinlist: [],
				shangpingoumaiS: [],
				current: 0, // 当前分类值
				spindex: 0, //当前分类商品操作INDEX
				spindexSP: '', //当前分类商品操作INDEX对应商品
				itemId: 0, // 栏目右边scroll-view用于滚动的id
				gouwcheimg: '/static/images/gouwuh@3x.png',
				notext: this.$t('comp.weixgsp'),
				goumaijine: 0,
				gwbcolor: 'darkgray',
				gwbTcolor: 'black',
				startX: 0,
				startY: 0,
				lang: '0',
				dailinghb: [],
				hongbkqs: false,
				downloadUrls: {},
				isShangjia: 0,
				id: 0,
				androidPackageName: '', // 安卓应用包名
			}
		},
		onShow() {
			if (0 == this.isfirstShow) {
				this.getmendianDetail(this.id);
				this.isfirstShow = 1;
			} else {
				this.refleashdata();
			}
			// this.getHbkaq();
			var that = this;
			try { //读取
				that.token = uni.getStorageSync("token");
				//console.log('2222',that.token)
				if (that.token == '' || that.token == undefined || that.token == null) {
					that.login = false;
					return;
				} else {
					that.login = true;
					return;
				}
			} catch (e) { //错误
				return;
			}

		},
		onLoad(option) {
			console.log(option)
			if (!('id' in option) || !('isShangjia' in option) || !('language' in option)) {
				this.$nextTick(() => {
					uni.showToast({
						title: this.$t('mend.wuxiaofw'),
						icon: 'error',
						duration: 2000
					});
				});
				return
			}
			this.isShangjia = option.isShangjia
			this.id = option.id

			var code = option.language
			console.log(code)
			uni.setStorageSync('language', code);
			uni.setLocale(code);
			this.$i18n.locale = code;


			var language = uni.getStorageSync('language');
			if (language == 'yuenan') {
				this.lang = '0';
			}
			if (language == 'zh-Hans') {
				this.lang = '2';
			}
			if (language == 'zh-Hant') {
				this.lang = '3';
			}
			this.id = option.id;
			this.refleashdata();
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 0
			})

			var info = uni.getSystemInfoSync();
			var isAndroid = info.platform.toLowerCase() === 'android';
			if (isAndroid) {
				this.cssName = 'fixedTop';
			} else {
				this.cssName = 'fixedTopios';
			}
		},
		mounted() {
			this.GetTop()
		},
		onPageScroll(e) {
			const that = this
			// console.log(e.scrollTop,JSON.stringify(this.Topdistance),JSON.stringify(this.isFixedTop))
			for (let i = 0; i < this.Topdistance.length; i++) {
				if (e.scrollTop > this.Topdistance[i] - 70) {
					// console.log('***************')
					this.isFixedTop[i] = true
					this.$set(this.isFixedTop, i, true)
					this.isFixedTop[i] = true
				} else {
					// console.log('++++++++++')
					this.isFixedTop[i] = false
					this.$set(this.isFixedTop, i, false)
					this.isFixedTop[i] = false
				}
			}
		},
		methods: {
			// 检测是否为安卓设备
			isAndroidDevice() {
				// 在H5环境中检测
				// #ifdef H5
				const ua = navigator.userAgent.toLowerCase();
				return ua.indexOf('android') > -1;
				// #endif

				// 在App环境中检测
				// #ifdef APP-PLUS
				return plus.os.name === 'Android';
				// #endif

				// 其他环境默认返回false
				return false;
			},

			// 检测是否为iOS设备
			isIOSDevice() {
				// #ifdef H5
				const ua = navigator.userAgent.toLowerCase();
				return /iphone|ipad|ipod/.test(ua);
				// #endif

				// #ifdef APP-PLUS
				return plus.os.name === 'iOS';
				// #endif

				return false;
			},

			// 显示下载app提示
			showDownloadAppModal() {
				api('getAppDownload', {}, r => {
					console.log(r)
					this.downloadUrls = r.data.data;
					// 保存安卓包名
					if (r.data.data.androidPackageName) {
						this.androidPackageName = r.data.data.androidPackageName;
					}
					this.$refs.downloadPopup.open();
				});
			},

			// 关闭下载app弹窗
			closeDownloadPopup() {
				this.$refs.downloadPopup.close();
			},

			// 下载iOS版本
			downloadIOS() {
				// 先尝试打开已安装的应用
				this.tryOpenInstalledApp('cityexpressuser');
				this.closeDownloadPopup();
			},

			// 下载Android版本
			downloadAndroid() {
				// 先尝试打开已安装的应用
				this.tryOpenInstalledApp('deliveryking');
				this.closeDownloadPopup();
			},

			// 尝试打开已安装的应用
			tryOpenInstalledApp(schema) {
				const that = this;

				const appSchema = schema + '://pages/shanpinxungou/shangjia/shangjiaView?id=' + this.id +
					'&isShangjia=' + this.isShangjia;

				// 在App环境中使用plus.runtime.openURL
				// #ifdef APP-PLUS
				plus.runtime.openURL(appSchema, function() {
					console.log(that.$t('download.app_opened_success'));
				}, function(e) {
					console.log(that.$t('download.app_not_installed'));
					// 应用未安装，继续下载流程
					that.startDownloadProcess();
				});
				// #endif

				// 在H5环境中尝试打开应用
				// #ifdef H5
				this.tryOpenAppInH5(appSchema);
				// #endif
			},

			// 在H5环境中尝试打开应用
			tryOpenAppInH5(appSchema) {
				const that = this;

				// 检测是否为iOS设备
				const isIOS = this.isIOSDevice();

				if (isIOS) {
					// iOS设备使用特殊处理
					this.tryOpenIOSApp(appSchema);
				} else {
					// 安卓设备使用iframe方式
					this.tryOpenAndroidApp(appSchema);
				}
			},

			// 尝试打开iOS应用
			tryOpenIOSApp(appSchema) {
				const that = this;

				// 记录开始时间
				const startTime = Date.now();
				let hasApp = false;

				// 监听页面可见性变化
				const handleVisibilityChange = () => {
					if (document.hidden) {
						hasApp = true;
						clearTimeout(timeout);
						document.removeEventListener('visibilitychange', handleVisibilityChange);
						document.removeEventListener('pagehide', handlePageHide);
						document.removeEventListener('blur', handleBlur);
					}
				};

				// 监听页面隐藏事件
				const handlePageHide = () => {
					hasApp = true;
					clearTimeout(timeout);
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				};

				// 监听窗口失焦事件
				const handleBlur = () => {
					hasApp = true;
					clearTimeout(timeout);
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				};

				// 设置超时检测
				const timeout = setTimeout(() => {
					if (!hasApp) {
						// 应用未安装，继续下载流程
						that.startDownloadProcess();
					}
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				}, 1500); // 缩短超时时间

				// 添加事件监听器
				document.addEventListener('visibilitychange', handleVisibilityChange);
				document.addEventListener('pagehide', handlePageHide);
				window.addEventListener('blur', handleBlur);

				// 尝试打开应用
				try {
					// 方法1: 直接使用window.location
					window.location.href = appSchema;
				} catch (e) {
					// 方法2: 使用iframe
					const iframe = document.createElement('iframe');
					iframe.style.display = 'none';
					iframe.style.width = '1px';
					iframe.style.height = '1px';
					iframe.src = appSchema;
					document.body.appendChild(iframe);

					// 清理iframe
					setTimeout(() => {
						if (document.body.contains(iframe)) {
							document.body.removeChild(iframe);
						}
					}, 1000);
				}
			},

			// 尝试打开安卓应用
			tryOpenAndroidApp(appSchema) {
				const that = this;

				let hasApp = false;

				// 监听页面可见性变化
				const handleVisibilityChange = () => {
					if (document.hidden) {
						hasApp = true;
						clearTimeout(timeout);
						document.removeEventListener('visibilitychange', handleVisibilityChange);
						document.removeEventListener('pagehide', handlePageHide);
						document.removeEventListener('blur', handleBlur);
					}
				};

				// 监听页面隐藏事件
				const handlePageHide = () => {
					hasApp = true;
					clearTimeout(timeout);
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				};

				// 监听窗口失焦事件
				const handleBlur = () => {
					hasApp = true;
					clearTimeout(timeout);
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				};

				// 设置超时检测
				const timeout = setTimeout(() => {
					if (!hasApp) {
						// 应用未安装，继续下载流程
						that.startDownloadProcess();
					}
					document.removeEventListener('visibilitychange', handleVisibilityChange);
					document.removeEventListener('pagehide', handlePageHide);
					document.removeEventListener('blur', handleBlur);
				}, 1500); // 缩短超时时间

				// 添加事件监听器
				document.addEventListener('visibilitychange', handleVisibilityChange);
				document.addEventListener('pagehide', handlePageHide);
				window.addEventListener('blur', handleBlur);

				// 尝试打开应用
				try {
					// 方法1: 直接使用window.location
					window.location.href = appSchema;
				} catch (e) {
					// 方法2: 使用iframe
					const iframe = document.createElement('iframe');
					iframe.style.display = 'none';
					iframe.style.width = '1px';
					iframe.style.height = '1px';
					iframe.src = appSchema;
					document.body.appendChild(iframe);

					// 清理iframe
					setTimeout(() => {
						if (document.body.contains(iframe)) {
							document.body.removeChild(iframe);
						}
					}, 1000);
				}
			},

			// 开始下载流程
			startDownloadProcess() {
				const that = this;

				// 显示下载提示
				uni.showLoading({
					title: this.$t('download.downloading'),
					mask: true
				});

				// 获取下载链接
				api('getAppDownload', {}, r => {
					console.log(r);

					// 保存安卓包名
					if (r.data.data.androidPackageName) {
						this.androidPackageName = r.data.data.androidPackageName;
					}

					// 检测是否为安卓设备
					const isAndroid = this.isAndroidDevice();

					if (isAndroid) {
						// 安卓设备跳转到谷歌商店
						that.openGooglePlay('com.deliveryking.user');
					} else {
						// iOS设备打开App Store
						that.openAppStore(r.data.data.iosUrl);
					}
				});
			},

			// 打开谷歌商店
			openGooglePlay(packageName) {
				const that = this;
				uni.hideLoading();

				if (!packageName) {
					// 如果没有包名，提示错误
					uni.showToast({
						title: 'Package name not found',
						icon: 'none',
						duration: 2000
					});
					return;
				}

				// 构建谷歌商店URL
				const googlePlayUrl = `https://play.google.com/store/apps/details?id=${packageName}`;

				// 在H5环境中
				// #ifdef H5
				// 直接跳转到谷歌商店
				window.location.href = googlePlayUrl;
				// #endif

				// 在App环境中
				// #ifdef APP-PLUS
				plus.runtime.openURL(googlePlayUrl, function(res) {
					console.log('Opening Google Play Store success');
				}, function(err) {
					console.log('Opening Google Play Store failed');
					// 如果打开失败，提供手动下载选项
					uni.showModal({
						title: that.$t('download.download_failed'),
						content: that.$t('download.download_failed_manual'),
						showCancel: true,
						cancelText: that.$t('comp.quxiao'),
						confirmText: that.$t('comp.queren'),
						success: function(res) {
							if (res.confirm) {
								// 使用浏览器打开谷歌商店链接
								plus.runtime.openURL(googlePlayUrl);
							}
						}
					});
				});
				// #endif
			},

			// 下载安卓APK（备用方法）
			downloadAndroidAPK(androidUrl) {
				const that = this;

				// 在App环境中使用plus.downloader
				// #ifdef APP-PLUS
				const appDownloadTask = plus.downloader.createDownload(androidUrl, {
					filename: '_downloads/CTE.apk'
				}, function(download, status) {
					uni.hideLoading();

					if (status === 200) {
						// 下载成功，尝试安装
						that.installAndroidApp(download.filename);
					} else {
						uni.showToast({
							title: that.$t('download.download_failed'),
							icon: 'none',
							duration: 2000
						});
					}
				});

				// 监听下载进度
				appDownloadTask.addEventListener('statechanged', function(download, status) {
					if (status === 200) {
						const progress = Math.round((download.downloadedSize / download.totalSize) * 100);
						uni.showLoading({
							title: that.$t('download.downloading_progress', {
								progress: progress
							}),
							mask: true
						});
					}
				});

				appDownloadTask.start();
				// #endif

				// 在H5环境中使用uni.downloadFile
				// #ifdef H5
				const h5DownloadTask = uni.downloadFile({
					url: androidUrl,
					success: function(res) {
						uni.hideLoading();

						if (res.statusCode === 200) {
							// 下载成功，尝试安装
							that.installAndroidApp(res.tempFilePath);
						} else {
							uni.showToast({
								title: that.$t('download.download_failed'),
								icon: 'none',
								duration: 2000
							});
						}
					},
					fail: function(err) {
						uni.hideLoading();
						console.log('下载失败:', err);

						// 下载失败时，提供手动下载选项
						uni.showModal({
							title: that.$t('download.download_failed'),
							content: that.$t('download.download_failed_manual'),
							showCancel: true,
							cancelText: that.$t('comp.quxiao'),
							confirmText: that.$t('comp.queren'),
							success: function(res) {
								if (res.confirm) {
									// 使用浏览器打开下载链接
									window.open(androidUrl, '_blank');
								}
							}
						});
					}
				});

				// 监听下载进度
				h5DownloadTask.onProgressUpdate(function(res) {
					const progress = Math.round(res.progress);
					uni.showLoading({
						title: that.$t('download.downloading_progress', {
							progress: progress
						}),
						mask: true
					});
				});
				// #endif
			},

			// 打开App Store
			openAppStore(iosUrl) {
				const that = this;

				// 在App环境中使用plus.runtime.openURL
				// #ifdef APP-PLUS
				plus.runtime.openURL(
					'itms-apps://itunes.apple.com/cn/app/cte/id6468907188',
					(res) => {
						console.log(that.$t('download.app_store_success'))
					},
					(err) => {
						console.log(that.$t('download.app_store_failed'))
						// 如果 itms-apps:// 失败，回退到浏览器打开
						plus.runtime.openURL('https://apps.apple.com/cn/app/cte/id6468907188')
					}
				);
				// #endif

				// 在H5环境中，针对iOS设备优化
				// #ifdef H5
				// 先尝试直接打开App Store链接
				const appStoreUrl = 'https://apps.apple.com/cn/app/cte/id6468907188';

				// 尝试多种方式打开App Store
				that.tryOpenAppStore(appStoreUrl);
				// #endif
			},

			// 安装安卓应用
			installAndroidApp(filePath) {
				const that = this;

				// 在App环境中，直接尝试安装APK
				// #ifdef APP-PLUS
				uni.showModal({
					title: that.$t('download.download_complete'),
					content: that.$t('download.install_confirm'),
					showCancel: true,
					cancelText: that.$t('comp.quxiao'),
					confirmText: that.$t('comp.queren'),
					success: function(res) {
						if (res.confirm) {
							// 使用plus.runtime.install安装APK
							plus.runtime.install(filePath, {
								force: false
							}, function() {
								uni.showToast({
									title: that.$t('download.install_success'),
									icon: 'success',
									duration: 2000
								});
							}, function(e) {
								console.log('安装失败:', e);
								uni.showModal({
									title: that.$t('download.install_failed'),
									content: that.$t('download.install_failed_manual'),
									showCancel: true,
									cancelText: that.$t('comp.quxiao'),
									confirmText: that.$t('comp.queren'),
									success: function(res) {
										if (res.confirm) {
											// 打开文件管理器
											plus.runtime.openFile(filePath);
										}
									}
								});
							});
						}
					}
				});
				// #endif

				// 在H5环境中，提示用户手动安装
				// #ifdef H5
				uni.showModal({
					title: that.$t('download.download_complete'),
					content: that.$t('download.manual_install_hint'),
					showCancel: false,
					confirmText: that.$t('comp.queren'),
					success: function(res) {
						if (res.confirm) {
							// 尝试打开下载链接，让用户手动下载
							window.open(filePath, '_blank');
						}
					}
				});
				// #endif
			},

			// 尝试打开App Store的多种方式
			tryOpenAppStore(appStoreUrl) {
				// 方法1: 直接使用window.open
				const newWindow = window.open(appStoreUrl, '_blank');

				// 如果新窗口被阻止，尝试其他方法
				if (!newWindow || newWindow.closed || typeof newWindow.closed == 'undefined') {
					// 方法2: 尝试使用itms-apps协议
					this.tryItmsProtocol();
				}
			},

			// 尝试使用itms-apps协议
			tryItmsProtocol() {
				const itmsUrl = 'itms-apps://itunes.apple.com/cn/app/cte/id6468907188';

				// 创建一个隐藏的iframe来尝试打开itms-apps协议
				const iframe = document.createElement('iframe');
				iframe.style.display = 'none';
				iframe.style.width = '1px';
				iframe.style.height = '1px';
				iframe.src = itmsUrl;
				document.body.appendChild(iframe);

				// 设置超时，如果App Store没有打开，则回退到浏览器
				setTimeout(() => {
					if (document.body.contains(iframe)) {
						document.body.removeChild(iframe);
					}
					// 最后回退到浏览器打开
					window.location.href = 'https://apps.apple.com/cn/app/cte/id6468907188';
				}, 1500);
			},

			//选择和领取红包卡券
			getHbkaq() {
				console.log('1212------------------')
				api('userUnclaimedList', {
					pageNum: '1',
					pageSize: '30',
					mdId: this.id
				}, res => {
					console.log('-----------', res)
					if (res.data.code == 200) {
						this.dailinghb = res.data.rows;
					}
				}, failc => {
					console.log('getadvertis----', failc)
				})
			},

			openhbkq() {
				this.hongbkqs = true;
			},
			querenyhhd() {
				this.hongbkqs = false;
			},
			getNote(obj, index) {
				var str = '';
				if (index == 1) {

					if (obj.yhfangs == 1 && obj.yhnum > 1) { //优惠方式：1 运费，2 订单 ,3 商品
						str = this.$t('hongbaokq.yunfeiyh');
					}
					if (obj.yhfangs == 1 && obj.yhnum < 1 && obj.yhnum > 0) { //优惠方式：1 运费，2 订单 ,3 商品
						str = this.$t('hongbaokq.yunfeizk');
					}
					if (obj.yhfangs == 1 && obj.yhnum == 0) { //优惠方式：1 运费，2 订单 ,3 商品
						str = this.$t('hongbaokq.yunfeiquanm');
					}
					if (obj.yhfangs == 2 && obj.yhnum > 1) {
						str = this.$t('hongbaokq.dingdanyh');
					}
					if (obj.yhfangs == 2 && obj.yhnum < 1) {
						str = this.$t('hongbaokq.dingdanzk');
					}
					if (obj.yhfangs == 3 && obj.yhnum > 1) {
						str = this.$t('hongbaokq.shangpinyh');
					}
					if (obj.yhfangs == 3 && obj.yhnum < 1) {
						str = this.$t('hongbaokq.shangpinzk');
					}

					if (obj.yhnum != 0) {
						str = str + ' ' + obj.yhnum;
					}
				}
				return str;
			},

			lingququan(id) {
				api('userQuanyireceive', {
					quanyiId: id,
					num: 1
				}, r => {
					console.log('-----------', r)
					if (r.data.code == 200) {
						this.getHbkaq();
						uni.showToast({
							title: this.$t('hongbaokq.lingqucg'),
							icon: 'none',
							duration: 2500
						})
					} else {
						uni.showToast({
							title: this.$t('hongbaokq.lingqushib'),
							icon: 'none',
							duration: 2500
						})
					}
				}, failc => {
					uni.showToast({
						title: this.$t('hongbaokq.lingqushib'),
						icon: 'none',
						duration: 2500
					})
					//console.log('getadvertis----',failc)
				})
			},
			//----------------------------------------------------

			GetTop() {
				var _this = this
				uni.getSystemInfo({
					success: (resu) => {
						//console.log('resu',JSON.stringify(resu))
						const query = uni.createSelectorQuery().in(this)
						query.selectAll('.box').boundingClientRect()
						query.selectViewport().scrollOffset()
						query.exec(function(res) {
							//console.log('res',JSON.stringify(res))
							_this.arr(res[0])
						})
					},
					fail: (res) => {}
				})
			},
			arr(res) {
				for (let i = 0; i < res.length; i++) {
					this.Topdistance[i] = res[i].top
					this.isFixedTop[i] = false
				}
				//console.log('----',JSON.stringify(this.Topdistance))
			},
			//------------------------------------------------------------------------------
			rightF(e) {
				//console.log('rightF',e)
				this.startX = e.changedTouches[0].pageX;
				this.startY = e.changedTouches[0].pageY;
			},
			leftF(e) {
				//console.log('leftF',e)
				var s, n;
				s = e.changedTouches[0].pageX;
				n = e.changedTouches[0].pageY;

				var dx, dy;
				dx = this.startX - s;
				dy = Math.abs(this.startY - n);

				if (Math.abs(dx) > 100 && Math.abs(dx) > dy) {
					if (dx > 0) {
						if (this.current < this.shangpinfenlei.length - 1) {
							this.current = this.current + 1;
						}
					} else {
						if (this.current > 0) {
							this.current = this.current - 1;
						}
					}
				}
			},
			fanhui() {
				uni.navigateBack();
			},
			shareToggle() {
				this.$refs.share.open()
			},
			chooseCancel() {
				this.showpop = false;
				this.hongbkqs = false;

			},
			fenxiang(item, index) {
				this.option = {
					//绘制海报内容
					//codeUrl: 'https://pic1.zhimg.com/80/v2-2714df42147132464a71af391ed04be4_720w.jpg', //小程序太阳码
					codeUrl: '/static/defimages/erweim.png', //小程序太阳码
					coverUrl: '/static/defimages/ddd.png', //题库图片
					headUrl: '/static/logo.png', //头像
					//bgUrl: 'https://pic3.zhimg.com/v2-8fbde0f9ac6a19a23aa839e73394618a_b.jpg', //图片背景填充，和 fillStyle 只能传一个，bgUrl 优先级高于 fillStyle
					fillStyle: '#00A6FF', //纯色背景填充颜色
					nickName: '跑腿王', //授权登录的用户名
					miniName: '不出门吃遍全世界', //小程序名称
					tkName: this.posName, //题库名称
					tkAuthor: '门店介绍', //题库作者
					tkType: '外送', //题库类型
					cost: '自取', //是否需要收费   免费/付费
					isPub: '堂食' //公开 还是 私有
				};
				this.$refs.draw.share_qrcode(this.option);
			},
			shouchang() {
				this.showDownloadAppModal();
			},
			callPhone() {
				this.showDownloadAppModal();
			},
			gengduozx() {
				this.showDownloadAppModal();
			},
			pinglunList() {
				this.showDownloadAppModal();
			},
			fenleiSel(e) {
				console.log(e);
				this.current = e.detail.current;
				this.getmendianshangpinList(this.shangpinfenlei[this.current].id);
				this.itemId = 0;
			},
			shangpinsl(id) {
				//选择商品
				this.showDownloadAppModal();
			},
			gotoGouwuche() {
				this.showDownloadAppModal();
			},
			gotojiesuan() {
				this.showDownloadAppModal();
			},
			//pop------------------------------------------
			popfenlei() {
				if (this.shangpinfenlei.length > 0) {
					this.$refs.popfl.open('center');
				}
			},
			ppfenleisel(index) {
				this.current = index;
				this.$refs.popfl.close();
				this.getmendianshangpinList(this.shangpinfenlei[this.current].id);
				this.itemId = 0;
			},
			//------------------------------------
			addcollect() {
				if (!this.login) {
					uni.navigateTo({
						url: '/pages/UserCenter/LoginView'
					})
				}
				console.log('addcollect：id', this.id);
				api('addcollect', {
					mdid: this.id
				}, res => {
					console.log(res)
					if (this.isShouchang == 0) {
						this.isShouchang = 1;
						this.shouchangIcon = '/static/images/faverr@3x.png'
					} else {
						this.isShouchang = 0;
						this.shouchangIcon = '/static/images/faver@3x.png'
					}
				}, failc => {
					//console.log('getadvertis----',failc)
				})
			},

			getmendianDetail(id) {
				//console.log('getmendianDetail：id',id);
				uni.showLoading({
					mask: true
				})
				api('getmendianDetail', {
					id: id
				}, r => {
					console.log(r.data.data);
					uni.hideLoading();
					this.mendianMs = r.data.data;
					this.userid = this.mendianMs.userId;
					this.posName = this.mendianMs.posName;
					this.isShouchang = this.mendianMs.Collect;
					if (this.isShouchang == 1) {
						this.shouchangIcon = '/static/images/faverr@3x.png'
					} else {
						this.shouchangIcon = '/static/images/faver@3x.png'
					}
					this.getmendianshangpinFL(id);
					// this.cuxiaoList();

				}, failc => {
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},
			getmendianshangpinFL(id) {
				uni.showLoading({
					mask: true
				})
				api('getmendianshangpinFL', {
					id: id,
					language: this.lang
				}, res => {
					uni.hideLoading();
					this.shangpinfenlei = res.data.data;
					if (this.shangpinfenlei.length > 0) {
						this.getmendianshangpinList(this.shangpinfenlei[0].id);
					}
				}, failc => {
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},

			getmendianshangpinList(id) {
				uni.showLoading({
					mask: true
				})
				console.log(this.lang)
				api('getmendianshangpinList', {
					id: id,
					language: this.lang
				}, r => {
					console.log(r);
					uni.hideLoading();
					this.dowithshangpinList(r.data.data);
					this.shangpinlist = r.data.data;
				}, failc => {
					uni.hideLoading();
					//console.log('getadvertis----',failc)
				})
			},
			dowithshangpinList(shangpinlist) {
				if (this.shangpingoumaiS.length == 0) {
					for (var i = 0; i < this.shangpinfenlei.length; i++) {
						this.shangpingoumaiS.push([]);
					}
				}
				this.shangpingoumaiS[this.current] = [];
				if (shangpinlist) {
					for (var j = 0; j < shangpinlist.length; j++) {
						var shuliang = this.tongbugouwuchexinxi(shangpinlist[j]);
						var otherPrice = this.getotherPrice(shangpinlist[j].foodSku);
						var tempSKU = this.gettempSKU(shangpinlist[j].foodSku);
						var tempsp = {
							"shangpin": shangpinlist[j],
							"sku": tempSKU,
							"otherPrice": otherPrice,
							"shuliang": shuliang
						}
						this.shangpingoumaiS[this.current].push(tempsp);
					}
				}
			},
			cuxiaoList() {
				api('cuxiaoList', {
					mdId: this.id,
					price: ''
				}, r => {
					//console.log('-----------',r)
					if (r.data.code == 200) {
						this.cuxiaoImge = [];
						var objs = r.data.data;
						for (var i = 0; i < objs.length; i++) {
							var obj = objs[i];
							if (obj.poster && obj.poster.length > 0) {
								this.cuxiaoImge.push(obj.poster);
							}
						}
					}
				}, failc => {
					//console.log('getadvertis----',failc)
				})
			},
			//--------------------------------------
			tongjigouwuche() {
				this.goumaijine = 0;
				if (this.gouwuche.mendid == this.id) {
					for (var j = 0; j < this.gouwuche.foodlist.length; j++) {
						var sp = this.gouwuche.foodlist[j];
						this.goumaijine = this.goumaijine + sp.number * (sp.price + sp.otherPrice);
					}
				}
				this.jinger();
			},
			tongbugouwuchexinxi(sp) {
				var tempshuliang = 0;
				for (var i = 0; i < this.gouwuche.foodlist.length; i++) {
					if (this.gouwuche.foodlist[i].id == sp.id) {
						tempshuliang = tempshuliang + this.gouwuche.foodlist[i].number;
					}
				}
				return tempshuliang;
			},
			refleashdata() {
				var gwc = uni.getStorageSync('gouwuche');
				if ('' == gwc || null == gwc || undefined == gwc) {
					this.gouwuche = {
						foodlist: [],
						mendid: '',
						userid: '',
						mendname: ''
					};
					this.tongjigouwuche();
				} else {
					this.gouwuche = JSON.parse(gwc);
					this.tongjigouwuche();
				}
				if (this.shangpinlist.length > 0) {
					this.dowithshangpinList(this.shangpinlist);
				}
			},
			jiangouwuche(e) {
				//跳转购物车
				this.showDownloadAppModal();
			},

			jiagouwuche(e) {
				var gwc = uni.getStorageSync('gouwuche');
				if ('' == gwc || null == gwc || undefined == gwc) {
					this.gouwuche = {
						foodlist: [],
						mendid: '',
						userid: '',
						mendname: ''
					};
				} else {
					this.gouwuche = JSON.parse(gwc);
				}
				this.dowithshangpinList(this.shangpinlist);

				this.tongjigouwuche();
				var temp = [];
				for (var i = 0; i < this.shangpinlist.length; i++) {
					temp.push(this.shangpinlist[i]);
				}
				this.shangpinlist = temp;

				this.showpop = false;

			},
			jinger() {
				if (this.goumaijine > 0) {
					this.notext = this.$formPr(this.goumaijine) + this.$t('locale.huobidw');
					console.log(this.notext);
					this.gwbcolor = 'green';
					this.gwbTcolor = 'white';
					this.gouwcheimg = '/static/images/gouwu@3x.png';
					this.showbt = true;
				}
				if (this.goumaijine == 0) {
					this.gwbcolor = 'darkgray';
					this.gwbTcolor = 'black';
					this.notext = this.$t('comp.weixgsp');
					this.gouwcheimg = '/static/images/gouwuh@3x.png';
					this.showbt = false;
				}
			},
			editSKU(index) {
				this.showDownloadAppModal();
			},
			gettempSKU(foodSku) {
				var selectsku = [];
				for (var i = 0; i < foodSku.length; i++) {
					if (foodSku[i].objects.length > 0) {
						for (var j = 0; j < foodSku[i].objects.length; j++) {
							if (foodSku[i].objects[j].state == 1) {
								selectsku.push(foodSku[i].objects[j].name);
							}
						}
					}
				}
				return selectsku;
			},
			getotherPrice(foodSku) {
				var jiner = 0;
				for (var i = 0; i < foodSku.length; i++) {
					if (foodSku[i].objects.length > 0) {
						for (var j = 0; j < foodSku[i].objects.length; j++) {
							if (foodSku[i].objects[j].state == 1) {
								jiner = jiner + parseFloat(foodSku[i].objects[j].price);
							}
						}
					}
				}
				return parseFloat(jiner);
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F2F3F7;
	}

	.box {
		height: 100upx;
		line-height: 100upx;
		text-align: center;
		background-color: white;
	}

	.fixedTop {
		position: fixed;
		top: 140rpx;
		left: 0;
		right: 0;
		z-index: 9999999;
	}

	.fixedTopios {
		position: fixed;
		top: 180rpx;
		left: 0;
		right: 0;
		z-index: 9999999;
	}

	//-----------------------------
	.nodetail {
		width: 94%;
		margin-left: 3%;
		margin-top: -40rpx;
		background-color: white;
		border-radius: 10rpx;
	}

	.fenleiTitle {
		padding-left: 16rpx;
		padding-right: 16rpx;
		line-height: 36rpx;
		font-size: 28rpx;
		border-radius: 20rpx;
		color: darkgray;
		background-color: white;
		border: 1rpx solid darkgray;
	}

	.swiper-item {
		flex: 1;
		flex-direction: row;
		padding-left: 30rpx;
		font-size: 28rpx;
		line-height: 60rpx;
		text-align: left;
		font-weight: bold;
		text-decoration: underline;
	}

	.textdop1 {
		width: 12rpx;
		height: 12rpx;
		background-color: #00A6FF;
		border-radius: 6rpx;
		margin-left: 10rpx;
	}

	.textdop2 {
		width: 8rpx;
		height: 8rpx;
		background-color: #00A6FF;
		border-radius: 4rpx;
		margin-left: 10rpx;
	}

	.page-view {
		background-color: #F2F3F7;
	}

	.item_list {
		padding: 0 15rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;

		.item_content {
			width: 50%;
			margin: 10rpx 0;
			padding: 14rpx;
			box-sizing: border-box;
		}
	}

	.thumb-boxR {
		width: 334rpx;
		background-color: white;
	}

	.goodimage {
		margin-top: 0rpx;
	}

	.detailtextV {
		width: 90%;
		height: 80rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.rconten {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: auto;
		justify-content: flex-end;
	}

	.actimgeCT {
		position: fixed;
		width: 94%;
		left: 3%;
		top: 100rpx;
		z-index: 9;
	}

	.actimge {
		width: 60rpx;
		height: 60rpx;
	}

	.actimgezy {
		width: 40rpx;
		height: 40rpx;
	}

	.imageRJ {
		width: 56rpx;
		height: 56rpx;
		margin-right: 8rpx;
	}

	.imageR {
		width: 56rpx;
		height: 56rpx;
		margin-right: 30rpx;
	}

	.textR {
		margin-left: 6rpx;
		margin-right: 6rpx;
	}

	.msText {
		width: 90%;
		margin-top: 20rpx;
		padding-left: 30rpx;
		text-align: left;
		font-size: 22rpx;
		line-height: 32rpx;
	}

	.buyBT {
		display: flex;
		flex-direction: row;
		justify-content: left;
		align-items: center;
		width: 100%;
	}

	.gouwuche {
		width: 120rpx;
		height: 120rpx;
	}

	.dianpuming {
		font-size: 30rpx;
		line-height: 32rpx;
		height: 32rpx;
		font-weight: bold;
		overflow: hidden;
		text-overflow: ellipsis;
		/* #ifndef APP-PLUS-NVUE */
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		/* #endif */
	}

	.peisongsuoming {
		font-size: 26rpx;
		line-height: 38rpx;
		height: 38rpx;
		color: dimgray;
	}

	.bottomfloatV {
		position: fixed;
		flex-direction: row;
		align-items: center;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		background-color: whitesmoke;
		height: 140rpx;
	}

	.qjs {
		border-radius: 8rpx;
		padding: 6rpx;
		margin-left: auto;
		margin-right: 30rpx;
		font-size: 32rpx;
		height: 40rpx;
		line-height: 40rpx;
	}

	.fenleiitem {
		text-align: center;
		margin-top: 12rpx;
		margin-bottom: 12rpx;
		width: 660upx;
		border-radius: 10rpx;
		color: darkblue;
		line-height: 54rpx;
		font-size: 28rpx;
		border: solid lavender;
		border-width: 0px 0px 1rpx 0px;
	}

	.hongbaoFV {
		position: fixed;
		flex-direction: row;
		align-items: center;
		left: 50rpx;
		top: 400rpx;
		z-index: 9999;
		height: 120rpx;
		width: 120rpx;
	}

	.hongbaoImage {
		height: 120rpx;
		width: 120rpx;
	}

	.withpophbkq {
		width: 80%;
	}

	/* 下载app弹窗样式 */
	.download-popup-content {
		width: 600rpx;
		background-color: white;
		border-radius: 16rpx;
		overflow: hidden;
	}

	.download-popup-header {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		padding: 40rpx 40rpx 20rpx 40rpx;
		position: relative;
	}

	.download-popup-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		text-align: center;
		flex: 1;
	}

	.download-popup-close {
		position: absolute;
		right: 0;
		top: 0;
		width: 60rpx;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 0 16rpx 0 8rpx;
		background-color: #ff4444;
	}

	.close-icon {
		font-size: 40rpx;
		color: white;
		line-height: 1;
	}

	.download-popup-body {
		padding: 20rpx 40rpx 40rpx 40rpx;
		text-align: center;
	}

	.download-popup-text {
		font-size: 30rpx;
		color: #666;
		line-height: 1.5;
	}

	.download-popup-buttons {
		display: flex;
		flex-direction: row;
		border-top: 1rpx solid #f0f0f0;
	}

	.download-popup-btn {
		flex: 1;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
	}

	.download-popup-btn:not(:last-child)::after {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		width: 1rpx;
		background-color: #f0f0f0;
	}

	.download-popup-btn-ios {
		background-color: white;
	}

	.download-popup-btn-android {
		background-color: white;
	}

	.download-popup-btn-text {
		font-size: 32rpx;
	}

	.download-popup-btn-ios .download-popup-btn-text {
		color: #666;
	}

	.download-popup-btn-android .download-popup-btn-text {
		color: #007AFF;
		font-weight: 500;
	}
</style>