From f933249954d70a677e33fb0049e1d812a9b5131b Mon Sep 17 00:00:00 2001
From: 18631081161 <2088094923@qq.com>
Date: Sat, 3 May 2025 12:51:13 +0800
Subject: [PATCH] =?UTF-8?q?=E8=80=81=E8=99=8E=E6=9C=BA.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 App.vue                                       |  424 +-
 components/nav-header/nav-header.vue          |    2 +-
 .../tiner-swiper-loop/tiner-swiper-loop.vue   |  349 ++
 pages.json                                    |    7 +
 pages/shouye/detail_wuxian.vue                | 3974 +++++++++--------
 pages/shouye/index.vue                        |    6 +-
 pages/shouye/slots.vue                        |  175 +
 7 files changed, 2790 insertions(+), 2147 deletions(-)
 create mode 100644 components/tiner-swiper-loop/tiner-swiper-loop.vue
 create mode 100644 pages/shouye/slots.vue

diff --git a/App.vue b/App.vue
index fe7d570..5cbbac3 100644
--- a/App.vue
+++ b/App.vue
@@ -1,239 +1,255 @@
 <script>
-import Vue from "vue";
-// 移除全局预览弹窗方法导入
+	import Vue from "vue";
+	// 移除全局预览弹窗方法导入
 
-export default {
-  data() {
-    return {
-      isFirstLaunch: true, // 添加标志变量，用于标记是否是首次启动
-    }
-  },
-  onLaunch: function () {
-    console.log("App Launch");
-    // #ifdef MP-WEIXIN
-    const updateManager = uni.getUpdateManager();
+	export default {
+		data() {
+			return {
+				isFirstLaunch: true, // 添加标志变量，用于标记是否是首次启动
+			}
+		},
+		onLaunch: function() {
+			console.log("App Launch");
+			// #ifdef MP-WEIXIN
+			const updateManager = uni.getUpdateManager();
 
-    updateManager.onCheckForUpdate(function (res) {
-      // 请求完新版本信息的回调
-      console.log(res.hasUpdate);
-    });
+			updateManager.onCheckForUpdate(function(res) {
+				// 请求完新版本信息的回调
+				console.log(res.hasUpdate);
+			});
 
-    updateManager.onUpdateReady(function (res) {
-      uni.showModal({
-        title: "更新提示",
-        content: "新版本已经准备好，是否重启应用？",
-        success(res) {
-          if (res.confirm) {
-            // 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
-            updateManager.applyUpdate();
-          }
-        },
-      });
-    });
+			updateManager.onUpdateReady(function(res) {
+				uni.showModal({
+					title: "更新提示",
+					content: "新版本已经准备好，是否重启应用？",
+					success(res) {
+						if (res.confirm) {
+							// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
+							updateManager.applyUpdate();
+						}
+					},
+				});
+			});
 
-    updateManager.onUpdateFailed(function (res) {
-      // 新的版本下载失败
-    });
-    //#endif
-    var that = this;
+			updateManager.onUpdateFailed(function(res) {
+				// 新的版本下载失败
+			});
+			//#endif
+			var that = this;
 
-    this.$config.init().then(async (data) => {
-      //加载配置
-      let src = await that.$config.getAppSettingAsync("win_audio");
-      if (src == null || src == "") {
-        src = that.$img("/static/mp3/open.mp3");
-      }
-      //创建中奖音乐
-      const openBgm = uni.createInnerAudioContext();
-      Vue.prototype.bgmCtx = {};
-      Vue.prototype.bgmCtx.openBgm = openBgm;
-      openBgm.src = src;
-    });
+			this.$config.init().then(async (data) => {
+				//加载配置
+				let src = await that.$config.getAppSettingAsync("win_audio");
+				if (src == null || src == "") {
+					src = that.$img("/static/mp3/open.mp3");
+				}
+				//创建中奖音乐
+				const openBgm = uni.createInnerAudioContext();
+				Vue.prototype.bgmCtx = {};
+				Vue.prototype.bgmCtx.openBgm = openBgm;
+				openBgm.src = src;
 
-    // 调用登录记录接口
-    this.callLoginRecordApi();
 
-    /* 重置首页公告弹窗状态 */
-    uni.setStorageSync("_is_this_show", false);
+				//抽音效
+				let src2 = await that.$config.getAppSettingAsync("win_audio2");
+				if (src2 == null || src2 == "") {
+					src2 = that.$img("/static/mp3/slot_open.mp3");
+				}
+				//创建中奖音乐
+				const slotBgm = uni.createInnerAudioContext();
+				Vue.prototype.bgmCtx = {};
+				Vue.prototype.bgmCtx.slotBgm = slotBgm;
+				slotBgm.src = src2;
 
-    /* 清除缓存中的广告id */
-    uni.removeStorageSync("_ad_id");
-    /* 清除缓存中的click_id */
-    uni.removeStorageSync("_click_id");
-  },
-  onShow: function () {
-    console.log("App Show");
-    // // 如果不是首次启动才调用登录记录接口，避免与onLaunch重复调用，有问题，当用户分享的时候，会频繁触发
-    // if (!this.isFirstLaunch) {
-    //   this.callLoginRecordApi();
-    // } else {
-    //   this.isFirstLaunch = false; // 重置标志
-    // }
-  },
-  onHide: function () {
-    console.log("App Hide");
-  },
-  methods: {
-    // 调用登录记录接口的方法
-    callLoginRecordApi() {
-      // 检查用户是否已登录
-      const token = uni.getStorageSync('token');
-      if (!token) {
-        console.log('用户未登录，不调用登录记录接口');
-        return;
-      }
-      this.req({
-        url: 'login_record',
-        method: 'POST',
-        success: (res) => {
-          console.log('登录记录接口调用成功', res);
-        },
-        fail: (err) => {
-          console.log('登录记录接口调用失败', err);
-        }
-      });
-    }
-  }
-};
+
+
+
+			});
+
+			// 调用登录记录接口
+			this.callLoginRecordApi();
+
+			/* 重置首页公告弹窗状态 */
+			uni.setStorageSync("_is_this_show", false);
+
+			/* 清除缓存中的广告id */
+			uni.removeStorageSync("_ad_id");
+			/* 清除缓存中的click_id */
+			uni.removeStorageSync("_click_id");
+		},
+		onShow: function() {
+			console.log("App Show");
+			// // 如果不是首次启动才调用登录记录接口，避免与onLaunch重复调用，有问题，当用户分享的时候，会频繁触发
+			// if (!this.isFirstLaunch) {
+			//   this.callLoginRecordApi();
+			// } else {
+			//   this.isFirstLaunch = false; // 重置标志
+			// }
+		},
+		onHide: function() {
+			console.log("App Hide");
+		},
+		methods: {
+			// 调用登录记录接口的方法
+			callLoginRecordApi() {
+				// 检查用户是否已登录
+				const token = uni.getStorageSync('token');
+				if (!token) {
+					console.log('用户未登录，不调用登录记录接口');
+					return;
+				}
+				this.req({
+					url: 'login_record',
+					method: 'POST',
+					success: (res) => {
+						console.log('登录记录接口调用成功', res);
+					},
+					fail: (err) => {
+						console.log('登录记录接口调用失败', err);
+					}
+				});
+			}
+		}
+	};
 </script>
 
 <style lang="scss">
-/*每个页面公共css */
-@import "./common/animate.css";
-@import url("./common/common.css");
-@import url("/components/gaoyia-parse/parse.css");
+	/*每个页面公共css */
+	@import "./common/animate.css";
+	@import url("./common/common.css");
+	@import url("/components/gaoyia-parse/parse.css");
 
-/* 引入字体 */
-@font-face {
-  font-family: "YouSheBiaoTiHei";
-  src: url($imgurl + "font/YouSheBiaoTiHei.ttf") format("truetype");
-}
+	/* 引入字体 */
+	@font-face {
+		font-family: "YouSheBiaoTiHei";
+		src: url($imgurl + "font/YouSheBiaoTiHei.ttf") format("truetype");
+	}
 
-@font-face {
-  font-family: "zihun152hao-jijiachaojihei";
-  src: url($imgurl + "font/zihun152hao-jijiachaojihei.TTF") format("truetype");
-}
+	@font-face {
+		font-family: "zihun152hao-jijiachaojihei";
+		src: url($imgurl + "font/zihun152hao-jijiachaojihei.TTF") format("truetype");
+	}
 
-@font-face {
-  font-family: "zihun147hao-xingyuanhei";
-  src: url($imgurl + "font/zihun147hao-xingyuanhei.TTF") format("truetype");
-}
+	@font-face {
+		font-family: "zihun147hao-xingyuanhei";
+		src: url($imgurl + "font/zihun147hao-xingyuanhei.TTF") format("truetype");
+	}
 
-page {
-  overflow-x: hidden;
+	page {
+		overflow-x: hidden;
 
-  &:before {
-    content: "";
-    position: fixed;
-    z-index: -1;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    background-color: #1c1b20;
-  }
-}
+		&:before {
+			content: "";
+			position: fixed;
+			z-index: -1;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			left: 0;
+			background-color: #1c1b20;
+		}
+	}
 
-.ziti {
-  font-family: YouSheBiaoTiHei;
-}
+	.ziti {
+		font-family: YouSheBiaoTiHei;
+	}
 
-.flex_center {
-  display: flex;
-  align-items: center;
-}
+	.flex_center {
+		display: flex;
+		align-items: center;
+	}
 
-.hang2 {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  word-wrap: break-word;
-  word-break: break-all;
-}
+	.hang2 {
+		overflow: hidden;
+		text-overflow: ellipsis;
+		display: -webkit-box;
+		-webkit-line-clamp: 2;
+		-webkit-box-orient: vertical;
+		word-wrap: break-word;
+		word-break: break-all;
+	}
 
-.hang1 {
-  overflow: hidden;
-  /*超出部分隐藏*/
-  white-space: nowrap;
-  /*不换行*/
-  text-overflow: ellipsis;
-  /*超出部分文字以...显示*/
-}
+	.hang1 {
+		overflow: hidden;
+		/*超出部分隐藏*/
+		white-space: nowrap;
+		/*不换行*/
+		text-overflow: ellipsis;
+		/*超出部分文字以...显示*/
+	}
 
-.icon {
-  display: flex;
-  justify-content: center;
-  align-items: center;
+	.icon {
+		display: flex;
+		justify-content: center;
+		align-items: center;
 
-  image {
-    width: 100%;
-    height: 100%;
-  }
-}
+		image {
+			width: 100%;
+			height: 100%;
+		}
+	}
 
-.common_bg {
-  background-repeat: no-repeat;
-  background-position: 0 0;
-  background-size: 100% 100%;
-}
+	.common_bg {
+		background-repeat: no-repeat;
+		background-position: 0 0;
+		background-size: 100% 100%;
+	}
 
-.relative {
-  position: relative;
-}
+	.relative {
+		position: relative;
+	}
 
-button.hide {
-  position: absolute;
-  width: 100% !important;
-  height: 100% !important;
-  left: 0;
-  top: 0;
-  z-index: 1;
-  opacity: 0;
-}
+	button.hide {
+		position: absolute;
+		width: 100% !important;
+		height: 100% !important;
+		left: 0;
+		top: 0;
+		z-index: 1;
+		opacity: 0;
+	}
 
-/* 重写组件样式 */
-/deep/.uni-noticebar {
-  padding: 0 !important;
-  margin: 0 !important;
-}
+	/* 重写组件样式 */
+	/deep/.uni-noticebar {
+		padding: 0 !important;
+		margin: 0 !important;
+	}
 
-/deep/.mescroll-upwarp {
-  box-sizing: border-box;
-  min-height: 55px;
-  padding: 15px 0;
-  text-align: center;
-  clear: both;
-}
+	/deep/.mescroll-upwarp {
+		box-sizing: border-box;
+		min-height: 55px;
+		padding: 15px 0;
+		text-align: center;
+		clear: both;
+	}
 
-/deep/.cmd-progress-outer {
-  line-height: 0;
+	/deep/.cmd-progress-outer {
+		line-height: 0;
 
-  .cmd-progress-bg {
-    margin: 0 !important;
-  }
-}
+		.cmd-progress-bg {
+			margin: 0 !important;
+		}
+	}
 
-.uni-tabbar__bd {
-  height: 50px !important;
-}
+	.uni-tabbar__bd {
+		height: 50px !important;
+	}
 
-.uni-tabbar__icon {
-  height: 50px !important;
-}
+	.uni-tabbar__icon {
+		height: 50px !important;
+	}
 
-@keyframes m-zoom {
-  0% {
-    transform: scale(1);
-  }
+	@keyframes m-zoom {
+		0% {
+			transform: scale(1);
+		}
 
-  50% {
-    transform: scale(0.9);
-  }
+		50% {
+			transform: scale(0.9);
+		}
 
-  100% {
-    transform: scale(1);
-  }
-}
-</style>
+		100% {
+			transform: scale(1);
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/components/nav-header/nav-header.vue b/components/nav-header/nav-header.vue
index 548edb5..a2af64b 100644
--- a/components/nav-header/nav-header.vue
+++ b/components/nav-header/nav-header.vue
@@ -336,7 +336,7 @@ $nav-height: 44px;
 		top: 0;
 		left: 0;
 		right: 0;
-		z-index: 998;
+		z-index: 98;
 	}
 	
 	&--shadow {
diff --git a/components/tiner-swiper-loop/tiner-swiper-loop.vue b/components/tiner-swiper-loop/tiner-swiper-loop.vue
new file mode 100644
index 0000000..2a5f18d
--- /dev/null
+++ b/components/tiner-swiper-loop/tiner-swiper-loop.vue
@@ -0,0 +1,349 @@
+<template>
+	<view class="scroll-view" @touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd">
+		<view class="view-list" :style="scrollOffsetStyle">
+			<view class="list-item" v-for="(item,index) in suffixItems" :key="index+'left'"
+				:style="(index-excessCount == curIndex && itemSelectBig) ? itemParentSelectStyle : itemParentNomalStyle"
+				@click="onItemClick(-excessCount,index)">
+
+				<view :class="{'item-checked ':itemSelectBig && (curIndex == index - excessCount)}"
+					:style="itemAnimateStyle">
+					<slot :item="item" :index="index"></slot>
+				</view>
+			</view>
+			<view class="list-item" v-for="(item,index) in items"
+				:style="(index == curIndex && itemSelectBig) ? itemParentSelectStyle : itemParentNomalStyle"
+				@click="onItemClick(index)" :key="index">
+
+				<view :class="{'item-checked ':itemSelectBig && (index == curIndex)}" :style="itemAnimateStyle">
+					<slot :item="item" :index="index"></slot>
+				</view>
+			</view>
+
+			<view class="list-item" v-for="(item,index) in prefixItems" :key="index + 'right'"
+				:style="(items.length + index == curIndex && itemSelectBig) ? itemParentSelectStyle : itemParentNomalStyle"
+				@click="onItemClick(items.length,index)">
+
+				<view :class="{'item-checked ':itemSelectBig && (curIndex == index + items.length)}"
+					:style="itemAnimateStyle">
+					<slot :item="item" :index="index"></slot>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	let lottrypoolCount = 30;
+
+	export default {
+
+		props: {
+			aTime: {
+				type: [Number],
+				default: 0.2
+			},
+			//每个元素的宽度 单位px
+			itemW: {
+				type: [Number],
+				default: uni.upx2px(170)
+			},
+			//每个元素的高度, 单位px
+			itemH: {
+				type: [Number],
+				default: uni.upx2px(220)
+			},
+			//两边各多出几个item
+			excessCount: {
+				type: [Number],
+				default: 4
+			},
+			items: {
+				type: [Array],
+				default: []
+			},
+			//选中的item 是否有放大效果
+			itemSelectBig: {
+				type: [Boolean],
+				default: false
+			},
+			//是否禁止触摸滑动
+			disableTouch: {
+				type: [Boolean],
+				default: false
+			},
+			//是否是抽奖
+			isLottry: {
+				type: [Boolean],
+				default: false
+			}
+		},
+		data() {
+			return {
+				scrolloffset: 0,
+				aniTime: this.aTime,
+				curIndex: 0,
+
+				isTouch: false,
+				isMove: false,
+				startX: 0,
+				endX: 0,
+				prizePoolItems: [], //奖池数据
+			}
+		},
+		computed: {
+			// 初始偏移量
+			startOffset() {
+				let itemScle = 1;
+				if (this.itemSelectBig) {
+					itemScle = 1.4
+				}
+				return uni.upx2px(375) - this.itemW * itemScle / 2 - this.excessCount * this.itemW;
+			},
+			scrollOffsetStyle() {
+				// 注意：translateX 的单位得用px，不然会有误差，不知道什么原因，不信你可以试试。把所有单位换成rpx
+				return `transition: all ${ this.isTouch ? 0 :this.aniTime }s ${this.isLottry?'ease-in-out':'linear'};transform: translateX(${this.scrolloffset}px);`
+			},
+			//后缀部分
+			prefixItems() {
+				return this.items.slice(0, this.excessCount);
+			},
+			//前缀部分
+			suffixItems() {
+				return this.items.slice(this.items.length - this.excessCount, this.items.length);
+			},
+			//选中的item容器（放大1.4）
+			itemParentSelectStyle() {
+				return `width:${this.itemW * 1.4}px;height:${this.itemH*1.4}px;transition: all ${this.aniTime}s linear;`
+			},
+			//正常情况下的容器
+			itemParentNomalStyle() {
+				return `width:${this.itemW}px;height:${this.itemH}px;transition: all ${this.aniTime}s linear;`
+			},
+			itemAnimateStyle() {
+				return `transition: all ${this.aniTime}s linear;transform-origin: bottom center;`
+			}
+		},
+
+		mounted() {
+			if (this.isLottry) {
+				this.initLottryData();
+			} else {
+				this.scrolloffset = this.startOffset;
+			}
+		},
+		methods: {
+
+			onTouchStart(e) {
+				if (this.disableTouch) return
+				let x = e.changedTouches[0].clientX;
+				//console.log("触摸开始=====",x);
+
+				this.isTouch = true;
+				// 记录之前的偏移量
+				this.oldOffset = this.scrolloffset;
+				this.startX = x;
+			},
+			onTouchMove(e) {
+				if (this.disableTouch) return
+				this.isMove = true;
+				let x = e.changedTouches[0].clientX;
+				console.log("触摸结束=====", x);
+				this.endX = x;
+				this.scrolloffset = this.oldOffset + this.endX - this.startX;
+			},
+			onTouchEnd(e) {
+				if (this.disableTouch || this.isLottry) return
+				let x = e.changedTouches[0].clientX;
+				//console.log("触摸结束=====",x);
+				if (this.isMove && !this.isLottry) {
+					//只有移动的时候才会对不齐中间，点击item的时候不执行这个
+					this.moveItemAfterToCenter();
+				}
+				this.isTouch = false;
+				this.isMove = false;
+
+			},
+			//针对触摸后屏幕中心点没有和item的中心对齐，使其对齐
+			moveItemAfterToCenter() {
+				//1、计算出当前偏移量在哪个item上，求curIndex 
+				//this.scrolloffset = startOffset - realIndex * this.itemW;
+				//根据上面的公式计算realIndex  = (startOffset - this.scrolloffset)/this.itemW; 
+				//因为偏移量是指向中心位置的，所以这个realIndex是中间位置，也就是 realIndex ± 0.5 都是这个item,所以必须是四舍五入，要不然就要再减去 this.itemW/2，
+				//最后公式是realIndex  = (startOffset - this.scrolloffset - this.itemW/2)/this.itemW;
+
+				//四舍五入的情况是 let curIndex =  Math.round((startOffset - this.scrolloffset) / this.itemW);
+				//下面是向上取整
+				let curIndex = Math.ceil((this.startOffset - this.scrolloffset - this.itemW / 2) / this.itemW);
+				this.curIndex = curIndex;
+				console.log("计算得到当前索引：", curIndex);
+				this.scrolloffset = this.startOffset - curIndex * this.itemW;
+				this.loopOffset(curIndex);
+			},
+			onItemClick(startIndex, index) {
+				if (this.disableTouch) {
+					return;
+				}
+				let realIndex = startIndex;
+				if (startIndex > 9) {
+					realIndex = startIndex + index;
+				}
+				if (startIndex < 0) {
+					realIndex = startIndex + index;
+				}
+				this.curIndex = realIndex;
+				this.scrolloffset = this.startOffset - realIndex * this.itemW;
+
+				//console.log("偏移量：",this.scrolloffset);
+				this.loopOffset(realIndex);
+			},
+			//无限循环的关键
+			loopOffset(realIndex) {
+				if (realIndex > this.items.length - 1 || realIndex < 0) {
+					let rindex = 0;
+					if (realIndex > this.items.length - 1) { //后缀item， 需要回到真正的偏移量
+						rindex = realIndex - this.items.length;
+					} else { //前缀item，偏移量需要指向最后边的那几个item
+						rindex = this.items.length + realIndex;
+					}
+					setTimeout(() => {
+						console.log("归正：");
+						//点击后有个动画时间，过了动画后以不可察觉的无动画方式使偏离量回正。
+						this.aniTime = 0;
+						this.scrolloffset = this.startOffset - rindex * this.itemW;
+						this.curIndex = rindex;
+
+						setTimeout(() => {
+							console.log("归正结束");
+							this.aniTime = this.aTime;
+						}, 100) //执行上一句需要时间，等待一会儿再把动画时间复原
+					}, 300)
+				} else {
+					this.curIndex = realIndex;
+				}
+			},
+			//设置数据
+			initLottryData() {
+				// 随机一个数作为奖品（应该注意的是，抽奖前奖品是什么就已经注定，滚动只是一个效果，奖品是随机也确实没啥大问题。））
+				// let winPrizeItemIndex = parseInt(Math.random()*this.items.length);
+				let winPrizeItemIndex = 4;
+
+				let prizeItem = this.items[winPrizeItemIndex]; //当前奖品
+				let listLength = this.items.length;
+
+				let prizePoolItems = [];
+				if (this.prizePoolItems.length == 0) { //第一次，不用考虑当前屏幕显示的是哪几个奖品
+					console.log("第一次抽奖：");
+					while (prizePoolItems.length < lottrypoolCount) {
+						if (prizePoolItems.length == lottrypoolCount - 3) {
+							//将本次奖品放入奖品池中
+							prizePoolItems.push(prizeItem);
+						} else {
+							//从商品池中随机选一个
+							const randomIndex = parseInt(Math.random() * listLength);
+							prizePoolItems.push(this.items[randomIndex]);
+						}
+					}
+				} else {
+
+					//需要上一次抽奖的后三个，放在这次奖品池数据的头三个，形成视觉误差，
+					prizePoolItems.push(this.prizePoolItems[this.prizePoolItems.length - 5]);
+					prizePoolItems.push(this.prizePoolItems[this.prizePoolItems.length - 4]);
+					prizePoolItems.push(this.prizePoolItems[this.prizePoolItems.length - 3]);
+					prizePoolItems.push(this.prizePoolItems[this.prizePoolItems.length - 2]);
+					prizePoolItems.push(this.prizePoolItems[this.prizePoolItems.length - 1]);
+
+					while (prizePoolItems.length < lottrypoolCount) {
+						if (prizePoolItems.length == lottrypoolCount - 3) {
+							//将本次奖品放入奖品池中
+							prizePoolItems.push(prizeItem);
+						} else {
+							//从商品池中随机选一个
+							const randomIndex = parseInt(Math.random() * listLength);
+							prizePoolItems.push(this.items[randomIndex]);
+						}
+					}
+				}
+				//记录上一次的商品池进神
+				this.prizePoolItems = prizePoolItems;
+
+				this.items = prizePoolItems;
+				console.log("奖品池数据：", prizePoolItems);
+				this.aniTime = 0;
+				this.scrolloffset = this.startOffset - 2 * this.itemW;
+				setTimeout(() => {
+					this.aniTime = this.aTime;
+				}, 100)
+			},
+			startDraw() {
+				console.log("startDraw");
+				if (this.drawTimer) {
+					uni.showToast({
+						title: "正在抽奖，请稍后。。。",
+						icon: "none"
+					})
+					return
+				}
+
+				this.scrolloffset = this.startOffset - 27 * this.itemW;
+
+				console.log("this.scrolloffset", this.scrolloffset);
+
+				this.drawTimer = setTimeout(() => {
+					clearTimeout(this.drawTimer);
+					this.drawTimer = null;
+					this.initLottryData();
+				}, this.aniTime * 1000);
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.scroll-view {
+		position: relative;
+		height: 152.78rpx;
+		overflow: hidden;
+		display: flex;
+		align-items: center;
+		flex-direction: row;
+		box-sizing: border-box;
+	}
+
+	.view-list {
+		position: relative;
+		display: flex;
+		flex-wrap: nowrap;
+		flex-direction: row;
+		align-items: center;
+		box-sizing: border-box;
+
+		.list-item {
+			position: relative;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			box-sizing: border-box;
+			transform-origin: bottom center;
+
+
+			// .item—normal {
+			// 	box-sizing: border-box;
+			// 	transform-origin: bottom center;
+			// }
+
+			.item-checked {
+				background-color: gold;
+				transform: scale(1.4);
+			}
+
+			.item-center-line {
+				position: absolute;
+				height: 100%;
+				width: 1rpx;
+				background-color: green;
+				box-sizing: border-box;
+			}
+
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index f2ab369..0e101d7 100644
--- a/pages.json
+++ b/pages.json
@@ -364,6 +364,13 @@
 			{
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			"path" : "pages/shouye/slots",
+			"style" : 
+			{
+				"navigationStyle": "custom"
+			}
 		}
 	],
 	"subPackages": [{
diff --git a/pages/shouye/detail_wuxian.vue b/pages/shouye/detail_wuxian.vue
index 53d3bb7..bfa5798 100644
--- a/pages/shouye/detail_wuxian.vue
+++ b/pages/shouye/detail_wuxian.vue
@@ -14,7 +14,7 @@
 					<image class="ml20" :src="$img1('index/suoxinag.png')" mode="aspectFit"></image>
 					<view class="ml30">倒计时：{{ secNum }}S</view>
 				</view>
-				<view class="header-title center"  
+				<view class="header-title center"
 					:style="{ background: 'url(' + $img1('common/chouTitle.png') + ') no-repeat 0 0 / 100% 100%' }">
 					<text>
 						<template></template>
@@ -139,9 +139,15 @@
 					</view>
 				</mescroll-body>
 			</template>
-			<!-- 选项按钮 -->
+
+			<!-- 选项按钮 冲一发-->
 			<detail-button v-if="pageData" :pageData="pageData" :isWuxian="true" @button-click="confirmSubmit"
 				@button-wx-click="wuxianchou"></detail-button>
+
+
+
+
+			<!-- 抽奖结果 -->
 			<uni-popup ref="resPop" type="center" mask-background-color="rgba(0,0,0,0.8)">
 				<view class="res-pop common_bg column center" @click="close('resPop')">
 					<view class="res-pop-hd"></view>
@@ -237,2082 +243,2168 @@
 			<!-- 添加直接引用的预览组件 -->
 			<detail-preview-popup ref="localPreviewPopup"></detail-preview-popup>
 		</view>
+		<!-- 老虎机 -->
+		<uni-popup ref="slotPop" type="center">
+
+			<view class="slot-pop" style="">
+
+				<view class="slot-view">
+					<view class=""
+					style="width: 100%; height: 152.78rpx; background-color: aquamarine; margin-top: 195rpx;">
+	
+					<tiner-swiper-loop ref="lottryRef" 
+						:items="productList" :aTime="5" :isLottry="true" :excessCount="0" :disableTouch="true"
+						style="height: 152.78rpx; width: 100%;">
+						<template v-slot="{item,index}">
+							<view class="item-lottry">{{item.title}}</view>
+						</template>
+					</tiner-swiper-loop>
+	
+				</view>
+
+				</view>
+				<text style="color: #484848; font-size: 19rpx;">动画结果因设备差异可能会显示异常，获得赏品以（恭喜获得）结果为准</text>
+			</view>
+
+		</uni-popup>
+
 	</page-container>
 </template>
 
 <script>
-import PageContainer from '@/components/page-container/page-container.vue'
-import OrderConfirmPopup from '@/components/order-confirm-popup/order-confirm-popup.vue'
-import DetailListItem from '@/components/detail-list-item/detail-list-item.vue'
-import DetailButton from '@/components/detail-button/detail-button.vue'
-// 导入预览组件和方法
-import DetailPreviewPopup from '@/components/detail-preview-popup/detail-preview-popup.vue'
-import preview from '@/components/detail-preview-popup/index.js'
-import DetailWuxianLingzhu from '@/components/detail-wuxian-lingzhu/detail-wuxian-lingzhu.vue'
-import DetailWuxianRage from '@/components/detail-wuxian-rage/detail-wuxian-rage.vue'
+	import PageContainer from '@/components/page-container/page-container.vue'
+	import OrderConfirmPopup from '@/components/order-confirm-popup/order-confirm-popup.vue'
+	import DetailListItem from '@/components/detail-list-item/detail-list-item.vue'
+	import DetailButton from '@/components/detail-button/detail-button.vue'
+	// 导入预览组件和方法
+	import DetailPreviewPopup from '@/components/detail-preview-popup/detail-preview-popup.vue'
+	import preview from '@/components/detail-preview-popup/index.js'
+	import DetailWuxianLingzhu from '@/components/detail-wuxian-lingzhu/detail-wuxian-lingzhu.vue'
+	import DetailWuxianRage from '@/components/detail-wuxian-rage/detail-wuxian-rage.vue'
 
-export default {
-	components: {
-		PageContainer,
-		OrderConfirmPopup,
-		DetailListItem,
-		DetailButton,
-		DetailPreviewPopup,
-		DetailWuxianLingzhu,
-		DetailWuxianRage // 注册新组件
-	},
-	data() {
-		return {
-			userCoupon: null,
-			optData: '',
-			title: '',
-			buyNum: 0,
-			useMoney: true,
-			useIntegral: true,
-			useMoney2: true,
-			// 下拉刷新的配置(可选, 绝大部分情况无需配置)
-			downOption: {
-				auto: false
-			},
-			// 上拉加载的配置(可选, 绝大部分情况无需配置)
-			upOption: {
-				auto: false,
-				page: {
-					size: 15 // 每页数据的数量,默认10
-				}
-			},
-			tabList: {
-				1: {
-					title: '包含以下赠品'
-				},
-				2: {
-					title: '中赏记录'
-				}
-			},
-			tabCur: 1,
-			swCur: 0,
-			autoplay: false,
-			subTab: [],
-			subTabCur: 0,
-			pageData: '',
-			previewData: '',
-			orderData: '',
-			prizeData: '',
-			sendRuleData: '',
-			couponData: '',
-			isAgree: true,
-			aniShow: false,
-			logList: [],
-			choujiangloading: false,
-			goods: null,
-		}
-	},
-
-	computed: {
-		reChooseNum() {
-			if (!this.prizeData || this.prizeData.data.length <= 0) {
-				return 0
-			}
-
-			const arr = this.prizeData.data.filter(item => item.isChoose)
-			console.log(arr.length)
-
-			return arr.length
-		}
-	},
-
-	onShareAppMessage() {
-
-		if (this.$refs["couponPop"] != null) {
-			var co = this.$refs["couponPop"].getfengxiaodata();
-			if (co != null) {
-				console.log(co);
-				return co;
-			}
-		}
-
-		return {
-			title: this.$config.getAppSetting("app_name") + `${this.pageData.goods.title}系列`,
-			imageUrl: this.pageData.goods.imgurl_detail,
-			path: '/pages/shouye/detail_wuxian' +
-				this.$c.qs({
-					goods_id: this.pageData.goods.id,
-					goods_num: this.pageData.goods.num,
-					pid: uni.getStorageSync('userinfo').ID
-				})
-		}
-	},
-
-	onLoad(options) {
-		this.optData = options;
-		console.log(options);
-
-		uni.$on('chooseCoupon', data => {
-			// console.log('data', data)
-
-			this.couponData = data
-			this.confirmSubmit([0, this.buyNum])
-		})
-
-
-		this.$c.getRule(10).then(res => {
-			if (res.status == 1) {
-				this.sendRuleData = res.data
-			}
-		})
-	},
-
-	onShow() {
-		this.autoplay = true
-	},
-
-	onReady() {
-		// this.tabChange(this.tabCur)
-		this.getData();
-	},
-
-	onHide() {
-		this.autoplay = false
-	},
-
-	onUnload() {
-		uni.$off('chooseCoupon')
-	},
-
-	methods: {
-		previewDetail(item, a) {
-
-			const obj = {
-				imgurl: a.imgurl,
-				title: a.title,
-				// shang_title: item.shang_title,
-				pro: '概率:' + this.$c.removeTrailingZeros(a.real_pro) + '%',
-				shang_info: {
-					title: item.shang_title,
-					color: item.shang_color
-				},
-				goods_type: a.goods_type,
-				id: a.id
-
-			}
-			let goods = {
-				id: item.goods_id,
-				num: 0,
-			};
-			// console.log(a);
-			//console.log( this.optData.type_text);
-
-			// 使用本地引入的方法调用预览弹窗
-			preview({
-				productType: this.title,
-				dataItem: obj,
-				goods: goods
-			}).then(() => {
-				console.log('预览弹窗打开成功');
-			});
-			// this.previewData = obj
-
-			// this.open('dPop')
+	export default {
+		components: {
+			PageContainer,
+			OrderConfirmPopup,
+			DetailListItem,
+			DetailButton,
+			DetailPreviewPopup,
+			DetailWuxianLingzhu,
+			DetailWuxianRage // 注册新组件
 		},
-
-		doReDraw() {
-			if (this.orderData.item_card_count <= 0) {
-				this.$c.toast({
-					title: '重置卡不足'
-				})
-
-				return
-			}
-
-			const arr = this.prizeData.data.map(item => item.id)
-
-			if (arr.length <= 0) {
-				this.$c.toast({
-					title: '请选择重置赏品'
-				})
-				return
-			}
-
-			this.req({
-				url: 'item_card_chou',
-				data: {
-					goods_id: this.pageData.goods.id,
-					order_list_ids: arr.join(',')
+		data() {
+			return {
+				userCoupon: null,
+				optData: '',
+				title: '',
+				buyNum: 0,
+				useMoney: true,
+				useIntegral: true,
+				useMoney2: true,
+				// 下拉刷新的配置(可选, 绝大部分情况无需配置)
+				downOption: {
+					auto: false
 				},
-				success: res => {
-					if (res.status == 1) {
-						this.close('resPop')
-
-						this.doRefresh()
-						this.getPrize(res.data.order_num)
+				// 上拉加载的配置(可选, 绝大部分情况无需配置)
+				upOption: {
+					auto: false,
+					page: {
+						size: 15 // 每页数据的数量,默认10
 					}
-				}
-			})
-		},
-
-		swChange(e) {
-			this.swCur = e.detail.current
-		},
-
-		toggleCollect() {
-			this.req({
-				url: 'addCollect',
-				data: {
-					goods_id: this.pageData.goods.id
 				},
-				success: res => {
-					if (res.status == 1) {
-						this.getData()
+				tabList: {
+					1: {
+						title: '包含以下赠品'
+					},
+					2: {
+						title: '中赏记录'
 					}
+				},
+				tabCur: 1,
+				swCur: 0,
+				autoplay: false,
+				subTab: [],
+				subTabCur: 0,
+				pageData: '',
+				previewData: '',
+				orderData: '',
+				prizeData: '',
+				sendRuleData: '',
+				couponData: '',
+				isAgree: true,
+				aniShow: false,
+				logList: [],
+				choujiangloading: false,
+				goods: null,
+				productList: []
+			}
+		},
+
+		computed: {
+			reChooseNum() {
+				if (!this.prizeData || this.prizeData.data.length <= 0) {
+					return 0
 				}
-			})
+
+				const arr = this.prizeData.data.filter(item => item.isChoose)
+				console.log(arr.length)
+
+				return arr.length
+			}
 		},
 
-		toBag() {
-			this.close('resPop')
+		onShareAppMessage() {
 
-			this.$c.to({
-				type: 3,
-				url: '/pages/sangdai/sangdai'
-			})
-		},
-
-		toCoupon() {
-			this.$c.to({
-				url: '/pages/user/coupon',
-				query: {
-					type: 2,
-					total_price: this.orderData.order_total
+			if (this.$refs["couponPop"] != null) {
+				var co = this.$refs["couponPop"].getfengxiaodata();
+				if (co != null) {
+					console.log(co);
+					return co;
 				}
-			})
-		},
-
-		getPrize(order_num) {
-			if (!order_num) {
-				return
 			}
 
-			setTimeout(() => {
+			return {
+				title: this.$config.getAppSetting("app_name") + `${this.pageData.goods.title}系列`,
+				imageUrl: this.pageData.goods.imgurl_detail,
+				path: '/pages/shouye/detail_wuxian' +
+					this.$c.qs({
+						goods_id: this.pageData.goods.id,
+						goods_num: this.pageData.goods.num,
+						pid: uni.getStorageSync('userinfo').ID
+					})
+			}
+		},
+
+		onLoad(options) {
+			this.optData = options;
+			console.log(options);
+
+			uni.$on('chooseCoupon', data => {
+				// console.log('data', data)
+
+				this.couponData = data
+				this.confirmSubmit([0, this.buyNum])
+			})
+
+
+			this.$c.getRule(10).then(res => {
+				if (res.status == 1) {
+					this.sendRuleData = res.data
+				}
+			})
+		},
+
+		onShow() {
+			this.autoplay = true
+		},
+
+		onReady() {
+			// this.tabChange(this.tabCur)
+			this.getData();
+		},
+
+		onHide() {
+			this.autoplay = false
+		},
+
+		onUnload() {
+			uni.$off('chooseCoupon')
+		},
+
+		methods: {
+			previewDetail(item, a) {
+
+				const obj = {
+					imgurl: a.imgurl,
+					title: a.title,
+					// shang_title: item.shang_title,
+					pro: '概率:' + this.$c.removeTrailingZeros(a.real_pro) + '%',
+					shang_info: {
+						title: item.shang_title,
+						color: item.shang_color
+					},
+					goods_type: a.goods_type,
+					id: a.id
+
+				}
+				let goods = {
+					id: item.goods_id,
+					num: 0,
+				};
+				// console.log(a);
+				//console.log( this.optData.type_text);
+
+				// 使用本地引入的方法调用预览弹窗
+				preview({
+					productType: this.title,
+					dataItem: obj,
+					goods: goods
+				}).then(() => {
+					console.log('预览弹窗打开成功');
+				});
+				// this.previewData = obj
+
+				// this.open('dPop')
+			},
+
+			doReDraw() {
+				if (this.orderData.item_card_count <= 0) {
+					this.$c.toast({
+						title: '重置卡不足'
+					})
+
+					return
+				}
+
+				const arr = this.prizeData.data.map(item => item.id)
+
+				if (arr.length <= 0) {
+					this.$c.toast({
+						title: '请选择重置赏品'
+					})
+					return
+				}
+
 				this.req({
-					url: 'infinite_prizeorderlog',
+					url: 'item_card_chou',
 					data: {
-						order_num
+						goods_id: this.pageData.goods.id,
+						order_list_ids: arr.join(',')
 					},
 					success: res => {
 						if (res.status == 1) {
-							res.data.data.map(item => {
-								item.isChoose = false
-							})
+							this.close('resPop')
 
-							this.prizeData = res.data
-
-							if (res.data.data.length <= 0) {
-								this.getPrize(order_num)
-								return
-							}
-
-
-							this.bgmCtx.openBgm.play()
-							this.open('resPop')
-							// }, 1300)
+							this.doRefresh()
+							this.getPrize(res.data.order_num)
 						}
 					}
 				})
-			}, 500)
-		},
+			},
 
-		changePay(type) {
-			if (type === 'useMoney') {
-				this.useMoney = !this.useMoney;
-			} else if (type === 'useIntegral') {
-				if (this.couponData != null && this.couponData.id != '') {
-					this.couponData = null;
-				}
-				this.useIntegral = !this.useIntegral;
-			} else if (type === 'useMoney2') {
-				this.useMoney2 = !this.useMoney2;
-			}
-			this.confirmSubmit([0, this.buyNum]);
-		},
+			swChange(e) {
+				this.swCur = e.detail.current
+			},
 
-		confirmSubmit([type, num, flag]) {
-			this.choujiangloading = true;
-			uni.showLoading({
-				title: '加载中'
-			});
+			toggleCollect() {
+				this.req({
+					url: 'addCollect',
+					data: {
+						goods_id: this.pageData.goods.id
+					},
+					success: res => {
+						if (res.status == 1) {
+							this.getData()
+						}
+					}
+				})
+			},
 
-			let data = {
-				goods_id: this.optData.goods_id,
-				goods_num: this.pageData.goods.num,
-				num: num,
-				use_money: this.useMoney ? 1 : 0,
-				use_integral: this.useIntegral ? 1 : 0,
-				use_money2: this.useMoney2 ? 1 : 0,
-				prize_id: this.optData.prize_id,
-			};
+			toBag() {
+				this.close('resPop')
 
-			let url = 'infinite_ordermoney'
-			console.log(type);
-			if (type == 1) {
-				url = 'infinite_orderbuy'
+				this.$c.to({
+					type: 3,
+					url: '/pages/sangdai/sangdai'
+				})
+			},
 
-				if (this.$refs.buyNotice.getIsShow() && !flag) {
-					this.$refs.buyNotice.getRule(6)
+			toCoupon() {
+				this.$c.to({
+					url: '/pages/user/coupon',
+					query: {
+						type: 2,
+						total_price: this.orderData.order_total
+					}
+				})
+			},
+
+			getPrize(order_num) {
+				if (!order_num) {
 					return
 				}
-			}
 
-			this.buyNum = num;
-
-			let coupon_id = (this.couponData && this.couponData.id) || ''
-			if (coupon_id != '' && this.useIntegral) {
-				this.useIntegral = false;
-			} else if (this.useIntegral && coupon_id != '') {
-				this.couponData = null;
-				coupon_id = '';
-			}
-			this.req({
-				url,
-				data: {
-					goods_id: this.pageData.goods.id,
-					prize_num: this.buyNum,
-					use_money_is: this.useMoney ? 1 : 2,
-					use_integral_is: this.useIntegral ? 1 : 2,
-					use_money2_is: this.useMoney2 ? 1 : 2,
-					coupon_id: coupon_id,
-
-					// ad_id: uni.getStorageSync('_ad_id')
-				},
-				success: async res => {
-					if (res.status == 1) {
-						if (type == 0) {
-							if (res.data.coupon_id) {
-								this.couponData = {
-									id: res.data.coupon_id,
-									price: res.data.coupon_price
-								}
-							}
-							this.orderData = res.data
-							this.$nextTick(() => {
-								if (this.$refs.buyPop) {
-									this.$refs.buyPop.open()
-								} else {
-									console.error('buyPop组件未找到')
-								}
-							})
-						}
-						if (type == 1) {
-							this.close('buyPop')
-
-							if (res.data.status == 1) {
-								const status = await this.$c.wxMpPay({
-									data: res.data.res
+				setTimeout(() => {
+					this.req({
+						url: 'infinite_prizeorderlog',
+						data: {
+							order_num
+						},
+						success: res => {
+							if (res.status == 1) {
+								res.data.data.map(item => {
+									item.isChoose = false
 								})
 
-								if (status == 'success') {
-									this.getPrize(res.data.order_num)
-									this.doRefresh()
+								this.prizeData = res.data
+
+								if (res.data.data.length <= 0) {
+									this.getPrize(order_num)
+									return
 								}
-							} else {
-								this.$c.toast({
-									title: res.msg,
-									duration: 500,
-									success: () => {
-										this.getPrize(res.data.order_num)
-										this.doRefresh()
+
+
+								this.bgmCtx.openBgm.play()
+								this.open('resPop')
+								// }, 1300)
+							}
+						}
+					})
+				}, 500)
+			},
+
+			changePay(type) {
+				if (type === 'useMoney') {
+					this.useMoney = !this.useMoney;
+				} else if (type === 'useIntegral') {
+					if (this.couponData != null && this.couponData.id != '') {
+						this.couponData = null;
+					}
+					this.useIntegral = !this.useIntegral;
+				} else if (type === 'useMoney2') {
+					this.useMoney2 = !this.useMoney2;
+				}
+				this.confirmSubmit([0, this.buyNum]);
+			},
+
+			confirmSubmit([type, num, flag]) {
+
+				this.$refs.slotPop.open();
+				return;
+
+				this.choujiangloading = true;
+				uni.showLoading({
+					title: '加载中'
+				});
+
+				let data = {
+					goods_id: this.optData.goods_id,
+					goods_num: this.pageData.goods.num,
+					num: num,
+					use_money: this.useMoney ? 1 : 0,
+					use_integral: this.useIntegral ? 1 : 0,
+					use_money2: this.useMoney2 ? 1 : 0,
+					prize_id: this.optData.prize_id,
+				};
+
+				let url = 'infinite_ordermoney'
+				console.log(type);
+				if (type == 1) {
+					url = 'infinite_orderbuy'
+
+					if (this.$refs.buyNotice.getIsShow() && !flag) {
+						this.$refs.buyNotice.getRule(6)
+						return
+					}
+				}
+
+				this.buyNum = num;
+
+				let coupon_id = (this.couponData && this.couponData.id) || ''
+				if (coupon_id != '' && this.useIntegral) {
+					this.useIntegral = false;
+				} else if (this.useIntegral && coupon_id != '') {
+					this.couponData = null;
+					coupon_id = '';
+				}
+				this.req({
+					url,
+					data: {
+						goods_id: this.pageData.goods.id,
+						prize_num: this.buyNum,
+						use_money_is: this.useMoney ? 1 : 2,
+						use_integral_is: this.useIntegral ? 1 : 2,
+						use_money2_is: this.useMoney2 ? 1 : 2,
+						coupon_id: coupon_id,
+
+						// ad_id: uni.getStorageSync('_ad_id')
+					},
+					success: async res => {
+						if (res.status == 1) {
+							if (type == 0) {
+								if (res.data.coupon_id) {
+									this.couponData = {
+										id: res.data.coupon_id,
+										price: res.data.coupon_price
+									}
+								}
+								this.orderData = res.data
+								this.$nextTick(() => {
+									if (this.$refs.buyPop) {
+										this.$refs.buyPop.open()
+									} else {
+										console.error('buyPop组件未找到')
 									}
 								})
 							}
+							if (type == 1) {
+								this.close('buyPop')
+
+								if (res.data.status == 1) {
+									const status = await this.$c.wxMpPay({
+										data: res.data.res
+									})
+
+									if (status == 'success') {
+										this.getPrize(res.data.order_num)
+										this.doRefresh()
+									}
+								} else {
+									this.$c.toast({
+										title: res.msg,
+										duration: 500,
+										success: () => {
+											this.getPrize(res.data.order_num)
+											this.doRefresh()
+										}
+									})
+								}
+							}
 						}
 					}
+				})
+				if (type == 1) {
+					this.close('buyPop')
 				}
-			})
-			if (type == 1) {
-				this.close('buyPop')
-			}
-		},
+			},
 
-		doRefresh() {
-			this.getData()
+			doRefresh() {
+				this.getData()
 
-			if (this.tabCur == 2) {
-				this.tabChange(this.tabCur)
-			}
-		},
+				if (this.tabCur == 2) {
+					this.tabChange(this.tabCur)
+				}
+			},
 
-		subTabChange(i) {
-			this.subTabCur = i
-			this.logList = []
+			subTabChange(i) {
+				this.subTabCur = i
+				this.logList = []
 
-			this.$nextTick(() => {
-				setTimeout(() => {
-					this.mescroll.resetUpScroll()
-				}, 100)
-			})
-		},
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this.mescroll.resetUpScroll()
+					}, 100)
+				})
+			},
 
-		tabChange(i) {
-			if (i == this.tabCur) {
-				return;
-			}
-			this.tabCur = i
+			tabChange(i) {
+				if (i == this.tabCur) {
+					return;
+				}
+				this.tabCur = i
 
-			switch (Number(i)) {
-				case 1:
-					this.getData()
-					break
-				case 2:
-					this.subTabChange(this.subTabCur)
-					break
-			}
-		},
+				switch (Number(i)) {
+					case 1:
+						this.getData()
+						break
+					case 2:
+						this.subTabChange(this.subTabCur)
+						break
+				}
+			},
 
-		getLog({
-			num,
-			size
-		}) {
-			if (num > 1) return this.mescroll.endByPage(this.logList.length, 1)
-			this.req({
-				url: 'infinite_shang_log',
-				data: {
-					page: num,
-					goods_id: this.optData.goods_id,
-					shang_id: this.subTab.length > 0 ? this.subTab[this.subTabCur].shang_id : ''
-				},
-				Loading: true,
-				success: res => {
-					if (res.status == 1) {
-						this.subTab = res.data.category
+			getLog({
+				num,
+				size
+			}) {
+				if (num > 1) return this.mescroll.endByPage(this.logList.length, 1)
+				this.req({
+					url: 'infinite_shang_log',
+					data: {
+						page: num,
+						goods_id: this.optData.goods_id,
+						shang_id: this.subTab.length > 0 ? this.subTab[this.subTabCur].shang_id : ''
+					},
+					Loading: true,
+					success: res => {
+						if (res.status == 1) {
+							this.subTab = res.data.category
 
-						if (num == 1) {
-							this.logList = []
+							if (num == 1) {
+								this.logList = []
+							}
+
+							this.logList = this.logList.concat(res.data.data)
+							this.mescroll.endByPage(res.data.data.length, res.data.last_page)
+
+							// console.log(this.logList)
+
+							// setTimeout(() => {
+							//   console.log(this.logList)
+							// }, 1000)
 						}
-
-						this.logList = this.logList.concat(res.data.data)
-						this.mescroll.endByPage(res.data.data.length, res.data.last_page)
-
-						// console.log(this.logList)
-
-						// setTimeout(() => {
-						//   console.log(this.logList)
-						// }, 1000)
 					}
-				}
-			})
-		},
+				})
+			},
+
+			getData() {
+				this.req({
+					url: 'infinite_goodsdetail',
+					data: {
+						goods_id: this.optData.goods_id
+					},
+					success: res => {
+						if (res.status == 1) {
+							this.goods = res.data.goods;
+							res.data.goodslist.forEach(item => {
+								this.$set(item, 'open', false)
+							})
+							if (res.data.goods.type_text) {
+								this.title = res.data.goods.type_text
+								// 使用$refs访问page-container组件的方法来设置标题
+								// this.$refs.pageContainer.setNavTitle(res.data.goods.type_text);
+							}
+							this.pageData = res.data
+							let goodType = this.$config.getGoodTypeFind(this.pageData.goods.type);
+							this.useMoney = goodType.pay_balance == 1 ? true : false;
+							this.useIntegral = goodType.pay_currency == 1 ? true : false;
+							this.useMoney2 = goodType.pay_currency2 == 1 ? true : false;
+
+							console.log(this.pageData);
+
+							this.pageData.goodslist.forEach(item => {
+
+								item.goods_list.forEach(item => {
+									this.productList.push(item);
+								})
+
+							});
+
+							console.log("productList", this.productList);
 
-		getData() {
-			this.req({
-				url: 'infinite_goodsdetail',
-				data: {
-					goods_id: this.optData.goods_id
-				},
-				success: res => {
-					if (res.status == 1) {
-						this.goods = res.data.goods;
-						res.data.goodslist.forEach(item => {
-							this.$set(item, 'open', false)
-						})
-						if (res.data.goods.type_text) {
-							this.title = res.data.goods.type_text
-							// 使用$refs访问page-container组件的方法来设置标题
-							// this.$refs.pageContainer.setNavTitle(res.data.goods.type_text);
 						}
-						this.pageData = res.data
-						let goodType = this.$config.getGoodTypeFind(this.pageData.goods.type);
-						this.useMoney = goodType.pay_balance == 1 ? true : false;
-						this.useIntegral = goodType.pay_currency == 1 ? true : false;
-						this.useMoney2 = goodType.pay_currency2 == 1 ? true : false;
-
-						console.log(this.pageData);
 					}
-				}
-			})
-		},
-
-		close(e) {
-			if (e === 'buyPop') {
-				if (this.$refs.buyPop) {
-					this.$refs.buyPop.close()
-				}
-			} else {
-				this.$refs[e].close()
-			}
-			if (e == "resPop") {
-				if (this.prizeData['user_coupon'] != null) {
-					this.$refs["couponPop"].open(this.prizeData['user_coupon']);
-				}
-			}
-		},
-
-		open(e) {
-			this.$refs[e].open()
-		},
-
-		// 设置背景颜色
-		getBgColor(text) {
-			switch (text) {
-				case "普通":
-					return "#DAFF27";
-					break;
-				case "黄金":
-					return "#9A8EF6";
-					break;
-				case "欧皇":
-					return "#FFEB8E";
-					break;
-				case "超神":
-					return "#FF8E8E";
-					break;
-			}
-		},
-
-		// 设置文字颜色
-		getTextColor(text) {
-			switch (text) {
-				case "普通":
-					return "#86AD46";
-					break;
-				case "黄金":
-					return "#FFFFFF";
-					break;
-				case "欧皇":
-					return "#DA8A50";
-					break;
-				case "超神":
-					return "#FFEFB4";
-					break;
-			}
-		},
-		async wuxianchou() {
-			this.useMoney = true;
-			this.useIntegral = false;
-			this.useMoney2 = false;
-			if (this.choujiangloading) {
-				this.choujiangloading = false;
-
-			} else {
-				this.choujiangloading = true;
-				this.wuxianchou1();
-			}
-		},
-		async wuxianchou1() {
-
-
-			uni.showLoading({
-				title: '加载中'
-			});
-			let url = 'infinite_orderbuy'
-			this.buyNum = 10;
-			const { status, data, msg } = await this.req({
-				url,
-				data: {
-					goods_id: this.pageData.goods.id,
-					prize_num: this.buyNum,
-					use_money_is: this.useMoney ? 1 : 2,
-					use_integral_is: this.useIntegral ? 1 : 2,
-					use_money2_is: this.useMoney2 ? 1 : 2,
-					coupon_id: 0,
-				}
-			});
-			if (status == 0) {
-				this.$c.msg(msg);
-				return;
-			}
-			if (status == 1) {
-				if (data.status == 1) {
-					const status = await this.$c.wxMpPay({
-						data: data.res
-					})
-
-					if (status == 'success') {
-						this.getPrize(data.order_num)
+				})
+			},
 
+			close(e) {
+				if (e === 'buyPop') {
+					if (this.$refs.buyPop) {
+						this.$refs.buyPop.close()
 					}
 				} else {
-					this.$c.toast({
-						title: msg,
-						duration: 500,
-						success: () => {
-							this.getPrize(data.order_num)
-							setTimeout(() => {
-								if (this.choujiangloading) {
-									this.close('resPop');
-									this.wuxianchou1();
-								}
-							}, 2000)
-						}
-					})
+					this.$refs[e].close()
 				}
+				if (e == "resPop") {
+					if (this.prizeData['user_coupon'] != null) {
+						this.$refs["couponPop"].open(this.prizeData['user_coupon']);
+					}
+				}
+			},
+
+			open(e) {
+				this.$refs[e].open()
+			},
+
+			// 设置背景颜色
+			getBgColor(text) {
+				switch (text) {
+					case "普通":
+						return "#DAFF27";
+						break;
+					case "黄金":
+						return "#9A8EF6";
+						break;
+					case "欧皇":
+						return "#FFEB8E";
+						break;
+					case "超神":
+						return "#FF8E8E";
+						break;
+				}
+			},
+
+			// 设置文字颜色
+			getTextColor(text) {
+				switch (text) {
+					case "普通":
+						return "#86AD46";
+						break;
+					case "黄金":
+						return "#FFFFFF";
+						break;
+					case "欧皇":
+						return "#DA8A50";
+						break;
+					case "超神":
+						return "#FFEFB4";
+						break;
+				}
+			},
+			async wuxianchou() {
+				this.useMoney = true;
+				this.useIntegral = false;
+				this.useMoney2 = false;
+				if (this.choujiangloading) {
+					this.choujiangloading = false;
+
+				} else {
+					this.choujiangloading = true;
+					this.wuxianchou1();
+				}
+			},
+			async wuxianchou1() {
+
+
+				uni.showLoading({
+					title: '加载中'
+				});
+				let url = 'infinite_orderbuy'
+				this.buyNum = 10;
+				const {
+					status,
+					data,
+					msg
+				} = await this.req({
+					url,
+					data: {
+						goods_id: this.pageData.goods.id,
+						prize_num: this.buyNum,
+						use_money_is: this.useMoney ? 1 : 2,
+						use_integral_is: this.useIntegral ? 1 : 2,
+						use_money2_is: this.useMoney2 ? 1 : 2,
+						coupon_id: 0,
+					}
+				});
+				if (status == 0) {
+					this.$c.msg(msg);
+					return;
+				}
+				if (status == 1) {
+					if (data.status == 1) {
+						const status = await this.$c.wxMpPay({
+							data: data.res
+						})
+
+						if (status == 'success') {
+							this.getPrize(data.order_num)
+
+						}
+					} else {
+						this.$c.toast({
+							title: msg,
+							duration: 500,
+							success: () => {
+								this.getPrize(data.order_num)
+								setTimeout(() => {
+									if (this.choujiangloading) {
+										this.close('resPop');
+										this.wuxianchou1();
+									}
+								}, 2000)
+							}
+						})
+					}
+				}
+			},
+
+			lotteryItemSize() {
+				console.log("8888888888");
+				let height = uni.upx2px(220);
+				let width = uni.upx2px(170);
+				return [width, height];
 			}
 		}
 	}
-}
 </script>
 
 <style lang="scss">
-.navLeft {
-	position: fixed;
-	left: 30rpx;
-	z-index: 100;
-	height: 44px;
-
-	>view {
-		font-weight: 600;
-		font-size: 50rpx;
-		color: #FFFFFF;
-	}
-}
-
-
-.content {
-	padding: 0 0 0rpx;
-	background-color: #FFFFFF;
-
-	.boss-card {
-		margin: 0 auto -20rpx;
-		width: 690rpx;
-		height: 260rpx;
-		box-sizing: border-box;
-		display: flex;
-		justify-content: space-between;
-		padding: 50rpx 50rpx 0 40rpx;
-
-		.boss-l {
-			flex: 1;
-			padding-top: 10rpx;
-
-			.user {
-				display: flex;
-				align-items: center;
-
-				.avatar {
-					width: 100rpx;
-					height: 100rpx;
-					background: #9d9d9d;
-					border: 1px solid #cccccc;
-					border-radius: 50%;
-				}
-
-				.info {
-					width: 250rpx;
-					margin-left: 20rpx;
-
-					.name {
-						font-size: 32rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #ffffff;
-					}
-
-					.hang1 {}
-
-					.btn-text {
-						margin-top: 6rpx;
-						white-space: nowrap;
-
-						font-size: 36rpx;
-						font-family: YouSheBiaoTiHei;
-						font-weight: 400;
-						color: #d0d1ff;
-					}
-				}
-			}
-
-			.btn-list {
-				display: flex;
-				justify-content: flex-end;
-				margin-top: 20rpx;
-
-				.btn {
-					width: 110rpx;
-					height: 40rpx;
-					margin-left: 30rpx;
-
-					&.large {
-						width: 150rpx;
-					}
-				}
-
-				.btn {}
-
-				.large {}
-			}
-		}
-
-		.boss-r {
-			display: flex;
-			flex-flow: column nowrap;
-			align-items: center;
-			padding-left: 50rpx;
-
-			.pic {
-				width: 130rpx;
-				height: 130rpx;
-				border: 1px solid;
-				border-image: linear-gradient(90deg, #6adeff, #7ab5ff, #ff7feb) 1 1;
-				box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(176, 128, 255, 0.8);
-			}
-
-			.ling {
-				width: 142rpx;
-				height: 50rpx;
-			}
-		}
-	}
-
-	.header {
-		width: 750rpx;
-		height: 722rpx;
-		margin-top: 0rpx;
-		background-color: #D8D8D8;
-
-		&-wuzhe {
-			width: 160rpx;
-			height: 60rpx;
-			position: absolute;
-			top: 300rpx;
-			left: 0;
-		}
-
-		&-goodsTitel {
-			position: absolute;
-			font-weight: 400;
-			font-size: 24rpx;
-			color: #FFFFFF;
-			left: 50%;
-			transform: translateX(-50%);
-			bottom: 24rpx;
-			z-index: 2;
-		}
-
-		&-shoucang {
-			width: 65rpx;
-			height: 95rpx;
-			position: absolute;
-			right: 0;
-			top: 56rpx;
-			box-sizing: border-box;
-			// background: url($imgurl+'/common/shoucang.png') no-repeat 0 0 / 100% 100%;
-
-			>image {
-				width: 64rpx;
-				height: 64rpx;
-				// margin-top: 22rpx;
-			}
-
-			>text {
-				width: 100%;
-				text-align: center;
-				font-weight: 400;
-				font-size: 20rpx;
-				color: #FFFFFF;
-				margin-top: 4rpx;
-				// line-height: 66rpx;
-				text-shadow: #000 1px 0 0, #000 0 1px 0, #000 -1px 0 0, #000 0 -1px 0;
-			}
-		}
-
-		&-suoxiang {
-			position: absolute;
-			width: 584rpx;
-			height: 120rpx;
-			background: rgba(0, 0, 0, 0.73);
-			left: 50%;
-			transform: translateX(-50%);
-			bottom: 390rpx;
-			z-index: 2;
-
-			>image:nth-of-type(1) {
-				width: 46rpx;
-				height: 46rpx;
-				border: 2rpx solid #FFFFFF;
-				border-radius: 50rpx;
-			}
-
-			>image:nth-of-type(2) {
-				width: 144rpx;
-				height: 68rpx;
-			}
-
-			>view:nth-of-type(1) {
-				width: 140rpx;
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #FFFFFF;
-			}
-
-			>view:nth-of-type(2) {
-				font-weight: 400;
-				font-size: 24rpx;
-				color: #FFFFFF;
-			}
-		}
-
-		&-title {
-			position: absolute;
-			padding: 0 20rpx;
-			width: 280rpx;
-			height: 44rpx;
-			left: 50%;
-			transform: translateX(-50%);
-			bottom: 78rpx;
-			z-index: 10;
-
-			>text:nth-child(2n+1) {
-				font-weight: 400;
-				font-size: 18rpx;
-				color: #000000;
-			}
-
-			>text:nth-child(2) {
-				font-weight: 700;
-				font-size: 24rpx;
-				color: #000000;
-			}
-		}
-
-		&-canyu {
-			position: absolute;
-			left: 304rpx;
-			bottom: 142rpx;
-			z-index: 10;
-
-			&-imgs {
-				>image {
-					margin-left: -12rpx;
-					width: 32rpx;
-					height: 32rpx;
-					border-radius: 50rpx;
-				}
-			}
-
-			&-num {
-				font-weight: 400;
-				font-size: 20rpx;
-				margin-left: 8rpx;
-				color: #FFFFFF;
-				// text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
-			}
-		}
-
-		&-footer {
-			width: 750rpx;
-			position: absolute;
-			left: 0;
-			bottom: 0;
-
-			&-one {
-				width: 186rpx;
-				height: 106rpx;
-				display: flex;
-				position: absolute;
-				left: 0;
-				bottom: 0;
-				z-index: 1;
-
-				>image {
-					width: 100%;
-					height: 100%;
-				}
-			}
-
-			&-two {
-				width: 224rpx;
-				height: 119rpx;
-				display: flex;
-				position: absolute;
-				left: 160rpx;
-				bottom: 0;
-				z-index: 1;
-
-				>image {
-					width: 100%;
-					height: 100%;
-				}
-			}
-
-			&-three {
-				width: 224rpx;
-				height: 119rpx;
-				display: flex;
-				position: absolute;
-				right: 160rpx;
-				bottom: 0;
-
-				>image {
-					width: 100%;
-					height: 100%;
-				}
-			}
-
-			&-four {
-				width: 186rpx;
-				height: 106rpx;
-				display: flex;
-				position: absolute;
-				right: 0;
-				bottom: 0;
-
-				>image {
-					width: 100%;
-					height: 100%;
-				}
-			}
-		}
-	}
-
-	.user-btns {
-		width: 690rpx;
-		padding: 0 30rpx;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		position: absolute;
-		left: 0;
-		top: 60rpx;
-		z-index: 1;
-
-		.user-num {
-			display: flex;
-			align-items: center;
-
-			font-size: 24rpx;
-			font-family: Source Han Sans CN;
-			font-weight: 400;
-			color: #dddddd;
-
-			.user-list {
-				display: flex;
-				padding-left: 26rpx;
-				padding-right: 10rpx;
-
-				.avatar {
-					width: 50rpx;
-					height: 50rpx;
-					background: #7f7f7f;
-					border: 1px solid #cccccc;
-					border-radius: 50%;
-					box-sizing: border-box;
-					position: relative;
-					margin-left: -26rpx;
-				}
-			}
-		}
-
-		.btns {
-			display: flex;
-			align-items: center;
-
-			.btn {
-				display: flex;
-				align-items: center;
-				margin-left: 40rpx;
-
-				font-size: 28rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-				color: #ffffff;
-
-				.icon {
-					width: 32rpx;
-					height: 32rpx;
-					margin-right: 6rpx;
-				}
-
-				&.pd {
-					padding-left: 60rpx;
-				}
-
-				&.dis {
-					filter: grayscale(1);
-				}
-			}
-
-			.btn {
-				.icon {}
-			}
-		}
-	}
-
-	.angry {
-		margin: 30rpx auto 0;
-		width: 690rpx;
-		height: 136rpx;
-		box-sizing: border-box;
-		padding: 0 30rpx;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		background: #3B3941;
-		border-radius: 24rpx 24rpx 24rpx 24rpx;
-		border: 2rpx solid #FFFFFF;
-
-		.icon {
-			width: 100rpx;
-			height: 58rpx;
-		}
-
-		.ang-info {
-			width: 490rpx;
-
-			.ang-num {
-				text-align: center;
-				font-size: 24rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-				color: #FFFFFF;
-			}
-
-			.progress {
-				margin-top: 10rpx;
-
-				/deep/.cmd-progress-inner {
-					border-radius: 0;
-					background: #444444;
-				}
-			}
-
-			.tip {
-				margin-top: 20rpx;
-				display: flex;
-				font-size: 20rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-				color: #ffffff;
-				line-height: 20rpx;
-			}
-		}
-	}
-
-	.list {
-
-
-		.list-item {
-			box-sizing: border-box;
-
-			.list-title {
-				height: 52rpx;
-
-				>view:nth-child(1) {
-					>image {
-						width: 160rpx;
-						height: 72rpx;
-					}
-
-					>text {
-						font-weight: 400;
-						font-size: 20rpx;
-						color: #FFFFFF;
-					}
-				}
-			}
-
-			.goods-list {
-				margin-top: 25rpx;
-				margin-bottom: 5rpx;
-				display: grid;
-				grid-template-columns: repeat(3, 31.5%);
-				gap: 30rpx 20rpx;
-
-				.goods-item {
-					display: inline-flex;
-					width: 220rpx;
-					background-color: #F8F8F8;
-					border-radius: 16rpx;
-					// height: 255rpx;
-
-					.pic {
-						width: 220rpx;
-						height: 220rpx;
-						border-radius: 12rpx;
-						position: relative;
-						margin: 0 auto;
-						background-color: #D8D8D8;
-						border-radius: 16rpx 16rpx 0rpx 0rpx;
-
-						.yu-tag {
-							position: absolute;
-							right: 10rpx;
-							bottom: 10rpx;
-							z-index: 1;
-							display: flex;
-							justify-content: center;
-							align-items: center;
-							font-weight: 400;
-							font-size: 32rpx;
-							color: #894DD3;
-							text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
-						}
-					}
-
-					.title {
-						text-align: left;
-						width: 200rpx;
-						margin: 20rpx auto 0;
-						font-size: 20rpx;
-						font-weight: 400;
-						color: #333333;
-					}
-
-					.price {
-						width: 200rpx;
-						margin: 12rpx auto 24rpx;
-						font-weight: 400;
-						font-size: 20rpx;
-						color: #333333;
-					}
-				}
-			}
-		}
-	}
-
-	.sub-tab {
-		white-space: nowrap;
-		padding: 10rpx 0 10rpx;
-
-		.sub-tab-item {
-			display: inline-flex;
-			align-items: center;
-			justify-content: center;
-			min-width: 88rpx;
-			height: 44rpx;
-			margin-left: 30rpx;
-			// font-family: YouSheBiaoTiHei;
-			font-weight: 400;
-			font-size: 20rpx;
-			color: #333333;
-			background: #F5F5F5;
-			border-radius: 8rpx;
-			border: 2rpx solid rgba(#FFFFFF, 0.7);
-
-			&.act {
-				background: #E6F791;
-				// font-family: YouSheBiaoTiHei;
-				font-weight: 400;
-				font-size: 20rpx;
-				color: #333333;
-			}
-
-			&:last-child {
-				margin-right: 30rpx;
-			}
-		}
-
-	}
-
-	.log-list {
-		padding: 1rpx 30rpx 30rpx;
-
-		.log-item {
-			height: 144rpx;
-			padding: 0 20rpx;
-			display: flex;
-			align-items: center;
-			background: #F8F8F8;
-			margin-top: 24rpx;
-			position: relative;
-			/* 添加相对定位 */
-
-			.avatar {
-				width: 80rpx;
-				height: 80rpx;
-				background: #9d9d9d;
-				border: 1px solid #cccccc;
-				border-radius: 50%;
-				overflow: hidden;
-			}
-
-			.info {
-				width: 230rpx;
-				margin-left: 20rpx;
-
-				.name {
-					font-size: 28rpx;
-					font-family: Source Han Sans CN;
-					font-weight: 400;
-					color: #333333;
-				}
-
-				.hang1 {}
-
-				.time {
-					margin-top: 10rpx;
-					white-space: nowrap;
-
-					font-size: 24rpx;
-					font-family: Source Han Sans CN;
-					font-weight: 400;
-					color: #999999;
-				}
-			}
-
-			.prize {
-				flex: 1;
-				padding-left: 50rpx;
-				display: flex;
-				align-items: center;
-
-				.pic {
-					width: 100rpx;
-					height: 100rpx;
-				}
-
-				// >view:nth-child(2) {
-				// 	>view:nth-child(1) {
-				// 		padding: 0 20rpx;
-				// 		min-width: 68rpx;
-				// 		height: 32rpx;
-				// 		box-sizing: border-box;
-				// 		line-height: 40rpx;
-				// 		border-radius: 18rpx;
-				// 		font-size: 14rpx;
-				// 		color: #FFFFFF;
-				// 	}
-
-				// }
-
-				.title {
-					width: 120rpx;
-					margin-left: 10rpx;
-					font-weight: 400;
-					font-size: 24rpx;
-					color: #333333;
-				}
-
-				.num {
-					font-size: 24rpx;
-					font-family: Source Han Sans CN;
-					font-weight: 400;
-					color: #333333;
-				}
-			}
-		}
-	}
-
-	/* **************************************** */
-	/* **************************************** */
-	/* **************************************** */
-
-	.fixed-btns {
+	.navLeft {
 		position: fixed;
-		z-index: 10;
-		right: 20rpx;
-		bottom: 300rpx;
+		left: 30rpx;
+		z-index: 100;
+		height: 44px;
 
-		.btn {
-			width: 94rpx;
-			height: 110rpx;
-			margin-top: 40rpx;
-		}
-	}
-
-	.res-pop {
-		width: 100%;
-		height: 100vh;
-		position: relative;
-		background: url($imgurl+'common/yb.png') no-repeat 0 0 / 100% 100%;
-
-		.res-pop-hd {
-			width: 380rpx;
-			height: 104rpx;
-			background: url($imgurl+'common/gxhd.png') no-repeat 0 0 / 100% 100%;
-		}
-
-		.res-pop-bd {
-			width: 636rpx;
-			height: 760rpx;
-			background-color: #FFFFFF;
-			border-radius: 16rpx;
-			margin: 36rpx auto;
-
-			.res-list {
-				padding: 20rpx 10rpx;
-				display: grid;
-				grid-template-columns: repeat(3, 210rpx);
-				gap: 24rpx 10rpx;
-
-				.res-item {
-					width: 180rpx;
-					height: 240rpx;
-					background-color: #F8F8F8;
-					border-radius: 16rpx;
-
-					.pic {
-						width: 180rpx;
-						height: 180rpx;
-						position: relative;
-						background: #D8D8D8;
-						border-radius: 16rpx 16rpx 0rpx 0rpx;
-
-						>image {
-							width: 180rpx;
-							height: 180rpx;
-							border-radius: 16rpx 16rpx 0rpx 0rpx;
-						}
-
-						.type-tag {
-							position: absolute;
-							left: 12rpx;
-							top: 12rpx;
-							z-index: 2;
-							width: 68rpx;
-							height: 32rpx;
-							border-radius: 18rpx;
-							// background: url($imgurl+ 'common/chouLabel.png') no-repeat 0 0 / 100% 100%;
-							font-weight: 400;
-							font-size: 14rpx;
-							// color: #F8F8F8;
-						}
-
-						.num {
-							position: absolute;
-							z-index: 2;
-							left: 50%;
-							transform: translateX(-50%);
-							bottom: 10rpx;
-							min-width: 42rpx;
-							height: 28rpx;
-							font-weight: 400;
-							font-size: 14rpx;
-							color: #ffffff;
-							background: rgba(0, 0, 0, 0.5);
-							border-radius: 18rpx;
-						}
-					}
-
-					.title {
-						width: 180rpx;
-						padding: 22rpx 0;
-						font-weight: 400;
-						font-size: 16rpx;
-						color: #333333;
-					}
-
-					.exchange {
-						padding: 10rpx 10rpx;
-						font-weight: 400;
-						font-size: 20rpx;
-						color: #FFFFFF;
-					}
-				}
-			}
-		}
-
-		.res-pop-ft {
-			padding-top: 40rpx;
-
-			.btn-list {
-				width: 750rpx;
-				display: flex;
-				justify-content: space-evenly;
-
-				.ft-btn {
-					width: 200rpx;
-					height: 68rpx;
-					font-weight: 400;
-					font-size: 24rpx;
-				}
-
-				>view:nth-child(1) {
-					color: #333333;
-				}
-
-				>view:nth-child(2) {
-					color: #333333;
-				}
-			}
-
-			.r-draw {
-				margin: 50rpx auto 0;
-				width: 244rpx;
-				height: 116rpx;
-				font-weight: 400;
-				font-size: 28rpx;
-				color: #0E7792;
-
-				>text {
-					margin-top: 36rpx;
-				}
-			}
-		}
-	}
-
-	.boss-pop {
-		width: 750rpx;
-		box-sizing: border-box;
-		padding: 0 46rpx 40rpx;
-		position: relative;
-		background: #F7F7F7;
-		border-radius: 16rpx 16rpx 0rpx 0rpx;
-
-		&::after {
-			content: '';
-			position: absolute;
-			top: -62rpx;
-			left: 0;
-			width: 750rpx;
-			height: 62rpx;
-			// background: url($imgurl+'common/ding.png') no-repeat 0 0 / 100% 100%;
-		}
-
-		.boss-pop-title {
-			padding: 40rpx 0;
-			text-align: center;
-			// font-family: YouSheBiaoTiHei;
-			font-weight: 400;
-			font-size: 44rpx;
-			color: #333333;
-		}
-
-		.boss-pop-guize {
-			position: absolute;
-			top: 24rpx;
-			right: 24rpx;
+		>view {
+			font-weight: 600;
+			font-size: 50rpx;
 			color: #FFFFFF;
-			font-size: 28rpx;
-
-			>image {
-				width: 30rpx;
-				height: 30rpx;
-			}
 		}
+	}
 
-		.close {
-			position: absolute;
-			width: 30rpx;
-			height: 30rpx;
-			top: 50rpx;
-			right: 36rpx;
-		}
 
-		.boss-avatar {
-			margin: 20rpx auto 0;
-			width: 686rpx;
-			height: 264rpx;
-			background-color: #FFFFFF;
+	.content {
+		padding: 0 0 0rpx;
+		background-color: #FFFFFF;
 
-			>image:nth-child(1) {
-				position: absolute;
-				left: 50%;
-				transform: translateX(-50%);
-				bottom: 112rpx;
-				width: 98rpx;
-				height: 98rpx;
-				border-radius: 50%;
-				z-index: 1;
-			}
-
-			>image:nth-child(2) {
-				position: absolute;
-				left: 50%;
-				transform: translateX(-50%);
-				width: 181rpx;
-				height: 173rpx;
-				bottom: 80rpx;
-				z-index: 2;
-			}
-		}
-
-		.boss-name {
-			margin: 30rpx auto 0;
-			width: 200rpx;
-			text-align: center;
-			font-size: 28rpx;
-			font-family: Source Han Sans CN;
-			font-weight: 400;
-			color: #333333;
-			left: 50%;
-			transform: translateX(-50%);
-			position: absolute;
-			bottom: 32rpx;
-		}
-
-		.hang1 {}
-
-		.boss-box {
-			margin: 70rpx auto 0;
-			width: 590rpx;
-			position: relative;
-			background: #3B3941;
-			border-radius: 22rpx;
-			padding: 30rpx;
-
-			.box-title {
-				color: #999999;
-
-				>text:nth-child(1) {
-					color: #999999;
-					font-size: 20rpx;
-					font-weight: bold;
-				}
-
-				>text:nth-child(2) {
-					font-size: 20rpx;
-					font-weight: 400;
-				}
-			}
-
-			.get-money {
-				margin-top: 30rpx;
-				font-size: 24rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-				color: #ffffff;
-
-				&-one {
-					font-weight: 400;
-					font-size: 26rpx;
-					color: #999999;
-				}
-
-				// &-two {
-				// 	width: 34rpx;
-				// 	height: 34rpx;
-				// 	margin: 0 10rpx;
-				// }
-
-				&-three {
-					font-weight: 400;
-					font-size: 26rpx;
-					color: #999999;
-				}
-			}
-		}
-
-		.common_bg {}
-
-		.boss-tab {
-			padding: 30rpx 0;
+		.boss-card {
+			margin: 0 auto -20rpx;
+			width: 690rpx;
+			height: 260rpx;
+			box-sizing: border-box;
 			display: flex;
-			justify-content: space-around;
-			align-items: center;
+			justify-content: space-between;
+			padding: 50rpx 50rpx 0 40rpx;
 
-			.boss-tab-item {
-				width: 33%;
-				height: 60rpx;
-				font-size: 20rpx;
-				font-weight: 400;
-				color: #8A8A8A;
-				display: flex;
-				justify-content: space-around;
-				align-items: center;
-				text-align: center;
-				background-color: #FFFFFF;
-				border-radius: 8rpx;
+			.boss-l {
+				flex: 1;
+				padding-top: 10rpx;
 
-				&.act {
-					font-weight: 500;
-					font-size: 20rpx;
-					color: #333333;
-					background-color: #E6F791;
-					border-radius: 8rpx;
-				}
-			}
-		}
-
-		.list-wrap {
-			// height: 350rpx;
-
-			.boss-list {
-				display: flex;
-				flex-flow: row wrap;
-				justify-content: space-between;
-
-				.people-item {
+				.user {
 					display: flex;
 					align-items: center;
-					width: 30%;
 
 					.avatar {
-						width: 52rpx;
-						height: 52rpx;
-						background: #9d9d9d;
-						border-radius: 50%;
-						box-sizing: border-box;
-						overflow: hidden;
-					}
-
-					.name {
-						width: calc(100% - 70rpx);
-						box-sizing: border-box;
-						padding-left: 10rpx;
-
-						font-size: 20rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #999999;
-					}
-
-					.hang1 {}
-				}
-
-				.boss-log {
-					width: 100%;
-					box-sizing: border-box;
-					display: flex;
-					flex-direction: row;
-					align-items: center;
-					justify-content: space-between;
-					padding: 10rpx;
-
-					.avatar {
-						width: 60rpx;
-						height: 60rpx;
-						background: #9d9d9d;
-						// border: 1px solid #cccccc;
-						border-radius: 50%;
-						overflow: hidden;
-					}
-
-					.name {
 						width: 100rpx;
-						margin-left: 20rpx;
-						font-size: 20rpx;
-						// font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #999999;
-					}
-
-					.hang1 {}
-
-					.place {
-						margin-left: 30rpx;
-
-						font-size: 20rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #999999;
-
-						text {
-							padding-left: 4rpx;
-							color: #999999;
-						}
-					}
-
-					.time {
-						flex: 1;
-						padding-left: 30rpx;
-
-						font-size: 24rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #999999;
-					}
-				}
-
-				.boss-money {
-					width: 100%;
-					padding: 10rpx;
-					display: flex;
-					align-items: center;
-
-					.avatar {
-						width: 60rpx;
-						height: 60rpx;
+						height: 100rpx;
 						background: #9d9d9d;
 						border: 1px solid #cccccc;
 						border-radius: 50%;
 					}
 
-					.name {
-						width: 200rpx;
+					.info {
+						width: 250rpx;
 						margin-left: 20rpx;
 
-						font-size: 24rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #ffffff;
-					}
+						.name {
+							font-size: 32rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #ffffff;
+						}
 
-					.hang1 {}
+						.hang1 {}
 
-					.money {
-						flex: 1;
-						text-align: right;
+						.btn-text {
+							margin-top: 6rpx;
+							white-space: nowrap;
 
-						font-size: 24rpx;
-						font-family: Source Han Sans CN;
-						font-weight: 400;
-						color: #ffffff;
-
-						text {
-							padding-left: 10rpx;
+							font-size: 36rpx;
+							font-family: YouSheBiaoTiHei;
+							font-weight: 400;
 							color: #d0d1ff;
 						}
 					}
 				}
-			}
-		}
-	}
 
-	.play-pop {
-		width: 680rpx;
-		box-sizing: border-box;
-		padding: 0 46rpx 40rpx;
-		position: relative;
-		background: #FFFFFF;
-		border-radius: 30rpx;
-		// border: 1px solid #7776AD;
+				.btn-list {
+					display: flex;
+					justify-content: flex-end;
+					margin-top: 20rpx;
 
-		.play-pop-hd {
-			position: relative;
-			top: -50rpx;
-			margin: 0 auto;
-			width: 460rpx;
-			height: 120rpx;
-		}
+					.btn {
+						width: 110rpx;
+						height: 40rpx;
+						margin-left: 30rpx;
 
-		.close {
-			padding: 30rpx 0;
-
-			.close-title {
-				font-weight: 500;
-				font-size: 28rpx;
-				color: #333333;
-			}
-
-			.close-icon {
-				width: 30rpx;
-				height: 30rpx;
-			}
-		}
-
-		.p-swiper {
-			margin-top: 10rpx;
-			width: 100%;
-			height: 300rpx;
-
-			.p-item {
-				.play-pic {
-					margin: 0 auto 0;
-					width: 200rpx;
-					height: 200rpx;
-					position: relative;
-
-					.play-type {
-						position: absolute;
-						left: 50%;
-						top: 20rpx;
-						z-index: 1;
-						width: 120rpx;
-						border-radius: 20rpx;
-						display: flex;
-						justify-content: center;
-						align-items: center;
-						transform: translateX(-50%);
-
-						text {
-							font-family: YouSheBiaoTiHei;
-							font-weight: 400;
-							font-size: 28rpx;
-							color: #FFFFFF;
-							text-stroke: 1rpx #F42FEA;
-							-webkit-text-stroke: 1rpx #F42FEA;
+						&.large {
+							width: 150rpx;
 						}
 					}
+
+					.btn {}
+
+					.large {}
+				}
+			}
+
+			.boss-r {
+				display: flex;
+				flex-flow: column nowrap;
+				align-items: center;
+				padding-left: 50rpx;
+
+				.pic {
+					width: 130rpx;
+					height: 130rpx;
+					border: 1px solid;
+					border-image: linear-gradient(90deg, #6adeff, #7ab5ff, #ff7feb) 1 1;
+					box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(176, 128, 255, 0.8);
+				}
+
+				.ling {
+					width: 142rpx;
+					height: 50rpx;
+				}
+			}
+		}
+
+		.header {
+			width: 750rpx;
+			height: 722rpx;
+			margin-top: 0rpx;
+			background-color: #D8D8D8;
+
+			&-wuzhe {
+				width: 160rpx;
+				height: 60rpx;
+				position: absolute;
+				top: 300rpx;
+				left: 0;
+			}
+
+			&-goodsTitel {
+				position: absolute;
+				font-weight: 400;
+				font-size: 24rpx;
+				color: #FFFFFF;
+				left: 50%;
+				transform: translateX(-50%);
+				bottom: 24rpx;
+				z-index: 2;
+			}
+
+			&-shoucang {
+				width: 65rpx;
+				height: 95rpx;
+				position: absolute;
+				right: 0;
+				top: 56rpx;
+				box-sizing: border-box;
+				// background: url($imgurl+'/common/shoucang.png') no-repeat 0 0 / 100% 100%;
+
+				>image {
+					width: 64rpx;
+					height: 64rpx;
+					// margin-top: 22rpx;
+				}
+
+				>text {
+					width: 100%;
+					text-align: center;
+					font-weight: 400;
+					font-size: 20rpx;
+					color: #FFFFFF;
+					margin-top: 4rpx;
+					// line-height: 66rpx;
+					text-shadow: #000 1px 0 0, #000 0 1px 0, #000 -1px 0 0, #000 0 -1px 0;
+				}
+			}
+
+			&-suoxiang {
+				position: absolute;
+				width: 584rpx;
+				height: 120rpx;
+				background: rgba(0, 0, 0, 0.73);
+				left: 50%;
+				transform: translateX(-50%);
+				bottom: 390rpx;
+				z-index: 2;
+
+				>image:nth-of-type(1) {
+					width: 46rpx;
+					height: 46rpx;
+					border: 2rpx solid #FFFFFF;
+					border-radius: 50rpx;
+				}
+
+				>image:nth-of-type(2) {
+					width: 144rpx;
+					height: 68rpx;
+				}
+
+				>view:nth-of-type(1) {
+					width: 140rpx;
+					font-weight: 400;
+					font-size: 28rpx;
+					color: #FFFFFF;
+				}
+
+				>view:nth-of-type(2) {
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #FFFFFF;
+				}
+			}
+
+			&-title {
+				position: absolute;
+				padding: 0 20rpx;
+				width: 280rpx;
+				height: 44rpx;
+				left: 50%;
+				transform: translateX(-50%);
+				bottom: 78rpx;
+				z-index: 10;
+
+				>text:nth-child(2n+1) {
+					font-weight: 400;
+					font-size: 18rpx;
+					color: #000000;
+				}
+
+				>text:nth-child(2) {
+					font-weight: 700;
+					font-size: 24rpx;
+					color: #000000;
+				}
+			}
+
+			&-canyu {
+				position: absolute;
+				left: 304rpx;
+				bottom: 142rpx;
+				z-index: 10;
+
+				&-imgs {
+					>image {
+						margin-left: -12rpx;
+						width: 32rpx;
+						height: 32rpx;
+						border-radius: 50rpx;
+					}
 				}
 
-				.play-ling {
-					width: 180rpx;
-					height: 60rpx;
-					margin: 10rpx auto 0;
-				}
-
-				.play-name {
-					width: 310rpx;
-					margin: 16rpx auto 0;
-					text-align: center;
-
-					font-size: 20rpx;
-					// font-family: Source Han Sans CN;
+				&-num {
 					font-weight: 400;
-					color: #333333;
+					font-size: 20rpx;
+					margin-left: 8rpx;
+					color: #FFFFFF;
+					// text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
+				}
+			}
+
+			&-footer {
+				width: 750rpx;
+				position: absolute;
+				left: 0;
+				bottom: 0;
+
+				&-one {
+					width: 186rpx;
+					height: 106rpx;
+					display: flex;
+					position: absolute;
+					left: 0;
+					bottom: 0;
+					z-index: 1;
+
+					>image {
+						width: 100%;
+						height: 100%;
+					}
+				}
+
+				&-two {
+					width: 224rpx;
+					height: 119rpx;
+					display: flex;
+					position: absolute;
+					left: 160rpx;
+					bottom: 0;
+					z-index: 1;
+
+					>image {
+						width: 100%;
+						height: 100%;
+					}
+				}
+
+				&-three {
+					width: 224rpx;
+					height: 119rpx;
+					display: flex;
+					position: absolute;
+					right: 160rpx;
+					bottom: 0;
+
+					>image {
+						width: 100%;
+						height: 100%;
+					}
+				}
+
+				&-four {
+					width: 186rpx;
+					height: 106rpx;
+					display: flex;
+					position: absolute;
+					right: 0;
+					bottom: 0;
+
+					>image {
+						width: 100%;
+						height: 100%;
+					}
 				}
 			}
 		}
 
-		.hang1 {}
-
-		.line {
-			margin: 0 auto 0;
-			width: 560rpx;
-			height: 1px;
-			background: #444444;
-		}
-
-		.rule-title {
-			width: 118rpx;
-			margin-left: 10rpx;
-			// font-family: YouSheBiaoTiHei;
-			font-weight: 400;
-			font-size: 32rpx;
-			color: #FFFFFF;
-		}
-
-		.rule-text {
-			width: 560rpx;
-			height: 200rpx;
-			margin: 20rpx auto 0;
-			font-size: 24rpx;
-			font-weight: 400;
-			color: #8A8A8A;
-		}
-	}
-
-	.d-pop {
-		position: relative;
-		width: 564rpx;
-		box-sizing: border-box;
-
-		.pic {
-			width: 564rpx;
-			height: 564rpx;
-			border-radius: 16rpx;
-
-			>image {
-				width: 564rpx;
-				height: 564rpx;
-				border-radius: 16rpx;
-			}
-
-			>view {
-				width: 68rpx;
-				height: 32rpx;
-				position: absolute;
-				top: 24rpx;
-				left: 24rpx;
-				font-weight: 400;
-				font-size: 14rpx;
-				color: #FFFFFF;
-				box-sizing: border-box;
-				background: url($imgurl+'common/chouLabel.png') no-repeat 0 0 / 100% 100%;
-			}
-		}
-
-		.title {
-			margin: 40rpx auto 0;
-			width: 564rpx;
-			height: 82rpx;
-			box-sizing: border-box;
+		.user-btns {
+			width: 690rpx;
+			padding: 0 30rpx;
 			display: flex;
-			justify-content: center;
-			align-items: center;
-			box-sizing: border-box;
-			padding: 20rpx;
-			// border: 2rpx solid #894DD3;
-			border-radius: 12rpx;
-			background: #F5F5F5;
-
-			>text {
-				font-weight: 400;
-				font-size: 24rpx;
-				color: #333333;
-			}
-		}
-
-		.d-list {
-			display: flex;
-			flex-flow: row wrap;
 			justify-content: space-between;
-			padding: 20rpx 0 0;
+			align-items: center;
+			position: absolute;
+			left: 0;
+			top: 60rpx;
+			z-index: 1;
 
-			.d-item {
-				margin-top: 14rpx;
+			.user-num {
+				display: flex;
+				align-items: center;
 
 				font-size: 24rpx;
 				font-family: Source Han Sans CN;
 				font-weight: 400;
-				color: #ffffff;
+				color: #dddddd;
+
+				.user-list {
+					display: flex;
+					padding-left: 26rpx;
+					padding-right: 10rpx;
+
+					.avatar {
+						width: 50rpx;
+						height: 50rpx;
+						background: #7f7f7f;
+						border: 1px solid #cccccc;
+						border-radius: 50%;
+						box-sizing: border-box;
+						position: relative;
+						margin-left: -26rpx;
+					}
+				}
+			}
+
+			.btns {
+				display: flex;
+				align-items: center;
+
+				.btn {
+					display: flex;
+					align-items: center;
+					margin-left: 40rpx;
+
+					font-size: 28rpx;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					color: #ffffff;
+
+					.icon {
+						width: 32rpx;
+						height: 32rpx;
+						margin-right: 6rpx;
+					}
+
+					&.pd {
+						padding-left: 60rpx;
+					}
+
+					&.dis {
+						filter: grayscale(1);
+					}
+				}
+
+				.btn {
+					.icon {}
+				}
 			}
 		}
 
-		.close {
-			width: 48rpx;
-			height: 48rpx;
-			position: absolute;
-			left: 50%;
-			bottom: 0;
-			transform: translate(-50%, 160%);
+		.angry {
+			margin: 30rpx auto 0;
+			width: 690rpx;
+			height: 136rpx;
+			box-sizing: border-box;
+			padding: 0 30rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			background: #3B3941;
+			border-radius: 24rpx 24rpx 24rpx 24rpx;
+			border: 2rpx solid #FFFFFF;
+
+			.icon {
+				width: 100rpx;
+				height: 58rpx;
+			}
+
+			.ang-info {
+				width: 490rpx;
+
+				.ang-num {
+					text-align: center;
+					font-size: 24rpx;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					color: #FFFFFF;
+				}
+
+				.progress {
+					margin-top: 10rpx;
+
+					/deep/.cmd-progress-inner {
+						border-radius: 0;
+						background: #444444;
+					}
+				}
+
+				.tip {
+					margin-top: 20rpx;
+					display: flex;
+					font-size: 20rpx;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					color: #ffffff;
+					line-height: 20rpx;
+				}
+			}
+		}
+
+		.list {
+
+
+			.list-item {
+				box-sizing: border-box;
+
+				.list-title {
+					height: 52rpx;
+
+					>view:nth-child(1) {
+						>image {
+							width: 160rpx;
+							height: 72rpx;
+						}
+
+						>text {
+							font-weight: 400;
+							font-size: 20rpx;
+							color: #FFFFFF;
+						}
+					}
+				}
+
+				.goods-list {
+					margin-top: 25rpx;
+					margin-bottom: 5rpx;
+					display: grid;
+					grid-template-columns: repeat(3, 31.5%);
+					gap: 30rpx 20rpx;
+
+					.goods-item {
+						display: inline-flex;
+						width: 220rpx;
+						background-color: #F8F8F8;
+						border-radius: 16rpx;
+						// height: 255rpx;
+
+						.pic {
+							width: 220rpx;
+							height: 220rpx;
+							border-radius: 12rpx;
+							position: relative;
+							margin: 0 auto;
+							background-color: #D8D8D8;
+							border-radius: 16rpx 16rpx 0rpx 0rpx;
+
+							.yu-tag {
+								position: absolute;
+								right: 10rpx;
+								bottom: 10rpx;
+								z-index: 1;
+								display: flex;
+								justify-content: center;
+								align-items: center;
+								font-weight: 400;
+								font-size: 32rpx;
+								color: #894DD3;
+								text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
+							}
+						}
+
+						.title {
+							text-align: left;
+							width: 200rpx;
+							margin: 20rpx auto 0;
+							font-size: 20rpx;
+							font-weight: 400;
+							color: #333333;
+						}
+
+						.price {
+							width: 200rpx;
+							margin: 12rpx auto 24rpx;
+							font-weight: 400;
+							font-size: 20rpx;
+							color: #333333;
+						}
+					}
+				}
+			}
+		}
+
+		.sub-tab {
+			white-space: nowrap;
+			padding: 10rpx 0 10rpx;
+
+			.sub-tab-item {
+				display: inline-flex;
+				align-items: center;
+				justify-content: center;
+				min-width: 88rpx;
+				height: 44rpx;
+				margin-left: 30rpx;
+				// font-family: YouSheBiaoTiHei;
+				font-weight: 400;
+				font-size: 20rpx;
+				color: #333333;
+				background: #F5F5F5;
+				border-radius: 8rpx;
+				border: 2rpx solid rgba(#FFFFFF, 0.7);
+
+				&.act {
+					background: #E6F791;
+					// font-family: YouSheBiaoTiHei;
+					font-weight: 400;
+					font-size: 20rpx;
+					color: #333333;
+				}
+
+				&:last-child {
+					margin-right: 30rpx;
+				}
+			}
+
+		}
+
+		.log-list {
+			padding: 1rpx 30rpx 30rpx;
+
+			.log-item {
+				height: 144rpx;
+				padding: 0 20rpx;
+				display: flex;
+				align-items: center;
+				background: #F8F8F8;
+				margin-top: 24rpx;
+				position: relative;
+				/* 添加相对定位 */
+
+				.avatar {
+					width: 80rpx;
+					height: 80rpx;
+					background: #9d9d9d;
+					border: 1px solid #cccccc;
+					border-radius: 50%;
+					overflow: hidden;
+				}
+
+				.info {
+					width: 230rpx;
+					margin-left: 20rpx;
+
+					.name {
+						font-size: 28rpx;
+						font-family: Source Han Sans CN;
+						font-weight: 400;
+						color: #333333;
+					}
+
+					.hang1 {}
+
+					.time {
+						margin-top: 10rpx;
+						white-space: nowrap;
+
+						font-size: 24rpx;
+						font-family: Source Han Sans CN;
+						font-weight: 400;
+						color: #999999;
+					}
+				}
+
+				.prize {
+					flex: 1;
+					padding-left: 50rpx;
+					display: flex;
+					align-items: center;
+
+					.pic {
+						width: 100rpx;
+						height: 100rpx;
+					}
+
+					// >view:nth-child(2) {
+					// 	>view:nth-child(1) {
+					// 		padding: 0 20rpx;
+					// 		min-width: 68rpx;
+					// 		height: 32rpx;
+					// 		box-sizing: border-box;
+					// 		line-height: 40rpx;
+					// 		border-radius: 18rpx;
+					// 		font-size: 14rpx;
+					// 		color: #FFFFFF;
+					// 	}
+
+					// }
+
+					.title {
+						width: 120rpx;
+						margin-left: 10rpx;
+						font-weight: 400;
+						font-size: 24rpx;
+						color: #333333;
+					}
+
+					.num {
+						font-size: 24rpx;
+						font-family: Source Han Sans CN;
+						font-weight: 400;
+						color: #333333;
+					}
+				}
+			}
+		}
+
+		/* **************************************** */
+		/* **************************************** */
+		/* **************************************** */
+
+		.fixed-btns {
+			position: fixed;
+			z-index: 10;
+			right: 20rpx;
+			bottom: 300rpx;
+
+			.btn {
+				width: 94rpx;
+				height: 110rpx;
+				margin-top: 40rpx;
+			}
+		}
+
+		.res-pop {
+			width: 100%;
+			height: 100vh;
+			position: relative;
+			background: url($imgurl+'common/yb.png') no-repeat 0 0 / 100% 100%;
+
+			.res-pop-hd {
+				width: 380rpx;
+				height: 104rpx;
+				background: url($imgurl+'common/gxhd.png') no-repeat 0 0 / 100% 100%;
+			}
+
+			.res-pop-bd {
+				width: 636rpx;
+				height: 760rpx;
+				background-color: #FFFFFF;
+				border-radius: 16rpx;
+				margin: 36rpx auto;
+
+				.res-list {
+					padding: 20rpx 10rpx;
+					display: grid;
+					grid-template-columns: repeat(3, 210rpx);
+					gap: 24rpx 10rpx;
+
+					.res-item {
+						width: 180rpx;
+						height: 240rpx;
+						background-color: #F8F8F8;
+						border-radius: 16rpx;
+
+						.pic {
+							width: 180rpx;
+							height: 180rpx;
+							position: relative;
+							background: #D8D8D8;
+							border-radius: 16rpx 16rpx 0rpx 0rpx;
+
+							>image {
+								width: 180rpx;
+								height: 180rpx;
+								border-radius: 16rpx 16rpx 0rpx 0rpx;
+							}
+
+							.type-tag {
+								position: absolute;
+								left: 12rpx;
+								top: 12rpx;
+								z-index: 2;
+								width: 68rpx;
+								height: 32rpx;
+								border-radius: 18rpx;
+								// background: url($imgurl+ 'common/chouLabel.png') no-repeat 0 0 / 100% 100%;
+								font-weight: 400;
+								font-size: 14rpx;
+								// color: #F8F8F8;
+							}
+
+							.num {
+								position: absolute;
+								z-index: 2;
+								left: 50%;
+								transform: translateX(-50%);
+								bottom: 10rpx;
+								min-width: 42rpx;
+								height: 28rpx;
+								font-weight: 400;
+								font-size: 14rpx;
+								color: #ffffff;
+								background: rgba(0, 0, 0, 0.5);
+								border-radius: 18rpx;
+							}
+						}
+
+						.title {
+							width: 180rpx;
+							padding: 22rpx 0;
+							font-weight: 400;
+							font-size: 16rpx;
+							color: #333333;
+						}
+
+						.exchange {
+							padding: 10rpx 10rpx;
+							font-weight: 400;
+							font-size: 20rpx;
+							color: #FFFFFF;
+						}
+					}
+				}
+			}
+
+			.res-pop-ft {
+				padding-top: 40rpx;
+
+				.btn-list {
+					width: 750rpx;
+					display: flex;
+					justify-content: space-evenly;
+
+					.ft-btn {
+						width: 200rpx;
+						height: 68rpx;
+						font-weight: 400;
+						font-size: 24rpx;
+					}
+
+					>view:nth-child(1) {
+						color: #333333;
+					}
+
+					>view:nth-child(2) {
+						color: #333333;
+					}
+				}
+
+				.r-draw {
+					margin: 50rpx auto 0;
+					width: 244rpx;
+					height: 116rpx;
+					font-weight: 400;
+					font-size: 28rpx;
+					color: #0E7792;
+
+					>text {
+						margin-top: 36rpx;
+					}
+				}
+			}
+		}
+
+		.boss-pop {
+			width: 750rpx;
+			box-sizing: border-box;
+			padding: 0 46rpx 40rpx;
+			position: relative;
+			background: #F7F7F7;
+			border-radius: 16rpx 16rpx 0rpx 0rpx;
+
+			&::after {
+				content: '';
+				position: absolute;
+				top: -62rpx;
+				left: 0;
+				width: 750rpx;
+				height: 62rpx;
+				// background: url($imgurl+'common/ding.png') no-repeat 0 0 / 100% 100%;
+			}
+
+			.boss-pop-title {
+				padding: 40rpx 0;
+				text-align: center;
+				// font-family: YouSheBiaoTiHei;
+				font-weight: 400;
+				font-size: 44rpx;
+				color: #333333;
+			}
+
+			.boss-pop-guize {
+				position: absolute;
+				top: 24rpx;
+				right: 24rpx;
+				color: #FFFFFF;
+				font-size: 28rpx;
+
+				>image {
+					width: 30rpx;
+					height: 30rpx;
+				}
+			}
+
+			.close {
+				position: absolute;
+				width: 30rpx;
+				height: 30rpx;
+				top: 50rpx;
+				right: 36rpx;
+			}
+
+			.boss-avatar {
+				margin: 20rpx auto 0;
+				width: 686rpx;
+				height: 264rpx;
+				background-color: #FFFFFF;
+
+				>image:nth-child(1) {
+					position: absolute;
+					left: 50%;
+					transform: translateX(-50%);
+					bottom: 112rpx;
+					width: 98rpx;
+					height: 98rpx;
+					border-radius: 50%;
+					z-index: 1;
+				}
+
+				>image:nth-child(2) {
+					position: absolute;
+					left: 50%;
+					transform: translateX(-50%);
+					width: 181rpx;
+					height: 173rpx;
+					bottom: 80rpx;
+					z-index: 2;
+				}
+			}
+
+			.boss-name {
+				margin: 30rpx auto 0;
+				width: 200rpx;
+				text-align: center;
+				font-size: 28rpx;
+				font-family: Source Han Sans CN;
+				font-weight: 400;
+				color: #333333;
+				left: 50%;
+				transform: translateX(-50%);
+				position: absolute;
+				bottom: 32rpx;
+			}
+
+			.hang1 {}
+
+			.boss-box {
+				margin: 70rpx auto 0;
+				width: 590rpx;
+				position: relative;
+				background: #3B3941;
+				border-radius: 22rpx;
+				padding: 30rpx;
+
+				.box-title {
+					color: #999999;
+
+					>text:nth-child(1) {
+						color: #999999;
+						font-size: 20rpx;
+						font-weight: bold;
+					}
+
+					>text:nth-child(2) {
+						font-size: 20rpx;
+						font-weight: 400;
+					}
+				}
+
+				.get-money {
+					margin-top: 30rpx;
+					font-size: 24rpx;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					color: #ffffff;
+
+					&-one {
+						font-weight: 400;
+						font-size: 26rpx;
+						color: #999999;
+					}
+
+					// &-two {
+					// 	width: 34rpx;
+					// 	height: 34rpx;
+					// 	margin: 0 10rpx;
+					// }
+
+					&-three {
+						font-weight: 400;
+						font-size: 26rpx;
+						color: #999999;
+					}
+				}
+			}
+
+			.common_bg {}
+
+			.boss-tab {
+				padding: 30rpx 0;
+				display: flex;
+				justify-content: space-around;
+				align-items: center;
+
+				.boss-tab-item {
+					width: 33%;
+					height: 60rpx;
+					font-size: 20rpx;
+					font-weight: 400;
+					color: #8A8A8A;
+					display: flex;
+					justify-content: space-around;
+					align-items: center;
+					text-align: center;
+					background-color: #FFFFFF;
+					border-radius: 8rpx;
+
+					&.act {
+						font-weight: 500;
+						font-size: 20rpx;
+						color: #333333;
+						background-color: #E6F791;
+						border-radius: 8rpx;
+					}
+				}
+			}
+
+			.list-wrap {
+				// height: 350rpx;
+
+				.boss-list {
+					display: flex;
+					flex-flow: row wrap;
+					justify-content: space-between;
+
+					.people-item {
+						display: flex;
+						align-items: center;
+						width: 30%;
+
+						.avatar {
+							width: 52rpx;
+							height: 52rpx;
+							background: #9d9d9d;
+							border-radius: 50%;
+							box-sizing: border-box;
+							overflow: hidden;
+						}
+
+						.name {
+							width: calc(100% - 70rpx);
+							box-sizing: border-box;
+							padding-left: 10rpx;
+
+							font-size: 20rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #999999;
+						}
+
+						.hang1 {}
+					}
+
+					.boss-log {
+						width: 100%;
+						box-sizing: border-box;
+						display: flex;
+						flex-direction: row;
+						align-items: center;
+						justify-content: space-between;
+						padding: 10rpx;
+
+						.avatar {
+							width: 60rpx;
+							height: 60rpx;
+							background: #9d9d9d;
+							// border: 1px solid #cccccc;
+							border-radius: 50%;
+							overflow: hidden;
+						}
+
+						.name {
+							width: 100rpx;
+							margin-left: 20rpx;
+							font-size: 20rpx;
+							// font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #999999;
+						}
+
+						.hang1 {}
+
+						.place {
+							margin-left: 30rpx;
+
+							font-size: 20rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #999999;
+
+							text {
+								padding-left: 4rpx;
+								color: #999999;
+							}
+						}
+
+						.time {
+							flex: 1;
+							padding-left: 30rpx;
+
+							font-size: 24rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #999999;
+						}
+					}
+
+					.boss-money {
+						width: 100%;
+						padding: 10rpx;
+						display: flex;
+						align-items: center;
+
+						.avatar {
+							width: 60rpx;
+							height: 60rpx;
+							background: #9d9d9d;
+							border: 1px solid #cccccc;
+							border-radius: 50%;
+						}
+
+						.name {
+							width: 200rpx;
+							margin-left: 20rpx;
+
+							font-size: 24rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #ffffff;
+						}
+
+						.hang1 {}
+
+						.money {
+							flex: 1;
+							text-align: right;
+
+							font-size: 24rpx;
+							font-family: Source Han Sans CN;
+							font-weight: 400;
+							color: #ffffff;
+
+							text {
+								padding-left: 10rpx;
+								color: #d0d1ff;
+							}
+						}
+					}
+				}
+			}
+		}
+
+		.play-pop {
+			width: 680rpx;
+			box-sizing: border-box;
+			padding: 0 46rpx 40rpx;
+			position: relative;
+			background: #FFFFFF;
+			border-radius: 30rpx;
+			// border: 1px solid #7776AD;
+
+			.play-pop-hd {
+				position: relative;
+				top: -50rpx;
+				margin: 0 auto;
+				width: 460rpx;
+				height: 120rpx;
+			}
+
+			.close {
+				padding: 30rpx 0;
+
+				.close-title {
+					font-weight: 500;
+					font-size: 28rpx;
+					color: #333333;
+				}
+
+				.close-icon {
+					width: 30rpx;
+					height: 30rpx;
+				}
+			}
+
+			.p-swiper {
+				margin-top: 10rpx;
+				width: 100%;
+				height: 300rpx;
+
+				.p-item {
+					.play-pic {
+						margin: 0 auto 0;
+						width: 200rpx;
+						height: 200rpx;
+						position: relative;
+
+						.play-type {
+							position: absolute;
+							left: 50%;
+							top: 20rpx;
+							z-index: 1;
+							width: 120rpx;
+							border-radius: 20rpx;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+							transform: translateX(-50%);
+
+							text {
+								font-family: YouSheBiaoTiHei;
+								font-weight: 400;
+								font-size: 28rpx;
+								color: #FFFFFF;
+								text-stroke: 1rpx #F42FEA;
+								-webkit-text-stroke: 1rpx #F42FEA;
+							}
+						}
+					}
+
+					.play-ling {
+						width: 180rpx;
+						height: 60rpx;
+						margin: 10rpx auto 0;
+					}
+
+					.play-name {
+						width: 310rpx;
+						margin: 16rpx auto 0;
+						text-align: center;
+
+						font-size: 20rpx;
+						// font-family: Source Han Sans CN;
+						font-weight: 400;
+						color: #333333;
+					}
+				}
+			}
+
+			.hang1 {}
+
+			.line {
+				margin: 0 auto 0;
+				width: 560rpx;
+				height: 1px;
+				background: #444444;
+			}
+
+			.rule-title {
+				width: 118rpx;
+				margin-left: 10rpx;
+				// font-family: YouSheBiaoTiHei;
+				font-weight: 400;
+				font-size: 32rpx;
+				color: #FFFFFF;
+			}
+
+			.rule-text {
+				width: 560rpx;
+				height: 200rpx;
+				margin: 20rpx auto 0;
+				font-size: 24rpx;
+				font-weight: 400;
+				color: #8A8A8A;
+			}
+		}
+
+		.d-pop {
+			position: relative;
+			width: 564rpx;
+			box-sizing: border-box;
+
+			.pic {
+				width: 564rpx;
+				height: 564rpx;
+				border-radius: 16rpx;
+
+				>image {
+					width: 564rpx;
+					height: 564rpx;
+					border-radius: 16rpx;
+				}
+
+				>view {
+					width: 68rpx;
+					height: 32rpx;
+					position: absolute;
+					top: 24rpx;
+					left: 24rpx;
+					font-weight: 400;
+					font-size: 14rpx;
+					color: #FFFFFF;
+					box-sizing: border-box;
+					background: url($imgurl+'common/chouLabel.png') no-repeat 0 0 / 100% 100%;
+				}
+			}
+
+			.title {
+				margin: 40rpx auto 0;
+				width: 564rpx;
+				height: 82rpx;
+				box-sizing: border-box;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				box-sizing: border-box;
+				padding: 20rpx;
+				// border: 2rpx solid #894DD3;
+				border-radius: 12rpx;
+				background: #F5F5F5;
+
+				>text {
+					font-weight: 400;
+					font-size: 24rpx;
+					color: #333333;
+				}
+			}
+
+			.d-list {
+				display: flex;
+				flex-flow: row wrap;
+				justify-content: space-between;
+				padding: 20rpx 0 0;
+
+				.d-item {
+					margin-top: 14rpx;
+
+					font-size: 24rpx;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					color: #ffffff;
+				}
+			}
+
+			.close {
+				width: 48rpx;
+				height: 48rpx;
+				position: absolute;
+				left: 50%;
+				bottom: 0;
+				transform: translate(-50%, 160%);
+			}
+		}
+
+
+		.ani-pop {
+			width: 100vw;
+			height: 100vh;
+			position: fixed;
+			left: 0;
+			top: 0;
+			z-index: 88;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			background: #000;
+
+			image {
+				width: 100%;
+				height: 1624rpx;
+			}
 		}
 	}
 
+	.gradient-text {
+		background-image: linear-gradient(to right, #FF5722, #FFEB3B);
+		/* 从橙色到黄色的渐变 */
+		-webkit-background-clip: text;
+		background-clip: text;
+		-webkit-text-fill-color: transparent;
+		color: #FF5722;
+	}
 
-	.ani-pop {
-		width: 100vw;
-		height: 100vh;
-		position: fixed;
-		left: 0;
-		top: 0;
-		z-index: 88;
+	.yu-tag-text {
+		position: absolute;
+		right: 10rpx;
+		bottom: 10rpx;
+		z-index: 1;
 		display: flex;
 		justify-content: center;
 		align-items: center;
-		background: #000;
+		font-weight: 400;
+		font-size: 32rpx;
 
-		image {
-			width: 100%;
-			height: 1624rpx;
-		}
 	}
-}
-
-.gradient-text {
-	background-image: linear-gradient(to right, #FF5722, #FFEB3B);
-	/* 从橙色到黄色的渐变 */
-	-webkit-background-clip: text;
-	background-clip: text;
-	-webkit-text-fill-color: transparent;
-	color: #FF5722;
-}
-
-.yu-tag-text {
-	position: absolute;
-	right: 10rpx;
-	bottom: 10rpx;
-	z-index: 1;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	font-weight: 400;
-	font-size: 32rpx;
-
-}
 
 
-.item-info {
-	padding: 5rpx 0;
-}
+	.item-info {
+		padding: 5rpx 0;
+	}
 
-.item-title {
-	padding: 0 2%;
-	margin: 10rpx 0rpx 0rpx 0rpx;
-	width: 96%;
-	font-size: 21rpx;
-	text-align: left;
-	height: 35rpx;
-	line-height: 35rpx;
-	font-weight: 500;
-	color: #333333;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
+	.item-title {
+		padding: 0 2%;
+		margin: 10rpx 0rpx 0rpx 0rpx;
+		width: 96%;
+		font-size: 21rpx;
+		text-align: left;
+		height: 35rpx;
+		line-height: 35rpx;
+		font-weight: 500;
+		color: #333333;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
 
-.item-probability {
-	padding: 0 2%;
-	margin: 1rpx 0;
-	width: 100%;
-	font-size: 21rpx;
-	text-align: left;
-	height: 35rpx;
-	line-height: 35rpx;
-	color: #f39205;
-}
+	.item-probability {
+		padding: 0 2%;
+		margin: 1rpx 0;
+		width: 100%;
+		font-size: 21rpx;
+		text-align: left;
+		height: 35rpx;
+		line-height: 35rpx;
+		color: #f39205;
+	}
 
-.item-price {
-	padding: 0 2%;
-	margin: 1rpx 0;
-	width: 100%;
-	font-size: 21rpx;
-	text-align: left;
-	height: 35rpx;
-	line-height: 35rpx;
-	color: #333333;
-}
+	.item-price {
+		padding: 0 2%;
+		margin: 1rpx 0;
+		width: 100%;
+		font-size: 21rpx;
+		text-align: left;
+		height: 35rpx;
+		line-height: 35rpx;
+		color: #333333;
+	}
 
-.log-tag {
-	padding: 0 20rpx;
-	min-width: 68rpx;
-	height: 32rpx;
-	box-sizing: border-box;
-	line-height: 32rpx;
-	border-radius: 18rpx;
-	font-size: 22rpx;
-	color: #FFFFFF;
-}
+	.log-tag {
+		padding: 0 20rpx;
+		min-width: 68rpx;
+		height: 32rpx;
+		box-sizing: border-box;
+		line-height: 32rpx;
+		border-radius: 18rpx;
+		font-size: 22rpx;
+		color: #FFFFFF;
+	}
 
-.multiple-tag {
+	.multiple-tag {
 
-	padding: 0 20rpx;
-	min-width: 50rpx;
-	height: 32rpx;
-	box-sizing: border-box;
-	line-height: 32rpx;
-	border-radius: 18rpx;
+		padding: 0 20rpx;
+		min-width: 50rpx;
+		height: 32rpx;
+		box-sizing: border-box;
+		line-height: 32rpx;
+		border-radius: 18rpx;
 
-	color: #FFFFFF;
-	background-color: #BBF3D0;
-	font-size: 22rpx;
-	margin-left: 6rpx;
-}
+		color: #FFFFFF;
+		background-color: #BBF3D0;
+		font-size: 22rpx;
+		margin-left: 6rpx;
+	}
 
-/* 添加角标样式 */
-.corner-tag {
-	position: absolute;
-	left: 0;
-	top: 0;
-	background: url($iconurl + "fbs.png") no-repeat;
-	background-size: 100% 100%;
-	color: #FFFFFF;
-	font-size: 20rpx;
-	padding: 4rpx 12rpx;
-	border-radius: 0 0 12rpx 0;
-	z-index: 10;
-	min-width: 68rpx;
-	height: 32rpx;
-}
+	/* 添加角标样式 */
+	.corner-tag {
+		position: absolute;
+		left: 0;
+		top: 0;
+		background: url($iconurl + "fbs.png") no-repeat;
+		background-size: 100% 100%;
+		color: #FFFFFF;
+		font-size: 20rpx;
+		padding: 4rpx 12rpx;
+		border-radius: 0 0 12rpx 0;
+		z-index: 10;
+		min-width: 68rpx;
+		height: 32rpx;
+	}
 
-.lingzhu-tag {
-	position: absolute;
-	left: 0;
-	top: 0;
-	background: url($iconurl + "lingzhu.png") no-repeat;
-	background-size: 100% 100%;
-	color: #FFFFFF;
-	font-size: 20rpx;
-	padding: 4rpx 12rpx;
-	border-radius: 0 0 12rpx 0;
-	z-index: 10;
-	min-width: 68rpx;
-	height: 32rpx;
-}
+	.lingzhu-tag {
+		position: absolute;
+		left: 0;
+		top: 0;
+		background: url($iconurl + "lingzhu.png") no-repeat;
+		background-size: 100% 100%;
+		color: #FFFFFF;
+		font-size: 20rpx;
+		padding: 4rpx 12rpx;
+		border-radius: 0 0 12rpx 0;
+		z-index: 10;
+		min-width: 68rpx;
+		height: 32rpx;
+	}
 
-.log-multiple-tag {
-	position: absolute;
-	z-index: 5;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	font-weight: 400;
-	background: url($iconurl + "fanbei.png") no-repeat;
-	background-size: 100% 100%;
-	color: #000;
-	width: 68rpx;
-	height: 32rpx;
-	// border-radius: 25rpx;
-	top: 12rpx;
-	right: 12rpx;
-	font-size: 22rpx;
-	line-height: 32rpx;
-}
+	.log-multiple-tag {
+		position: absolute;
+		z-index: 5;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-weight: 400;
+		background: url($iconurl + "fanbei.png") no-repeat;
+		background-size: 100% 100%;
+		color: #000;
+		width: 68rpx;
+		height: 32rpx;
+		// border-radius: 25rpx;
+		top: 12rpx;
+		right: 12rpx;
+		font-size: 22rpx;
+		line-height: 32rpx;
+	}
 
-.log-lingzhu-tag {
-	position: absolute;
-	z-index: 5;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	font-weight: 400;
-	background: url($iconurl + "lingzhu.png") no-repeat;
-	background-size: 100% 100%;
-	color: #000;
-	width: 68rpx;
-	height: 32rpx;
-	// border-radius: 25rpx;
-	top: 12rpx;
-	right: 12rpx;
-	font-size: 22rpx;
-	line-height: 32rpx;
-}
+	.log-lingzhu-tag {
+		position: absolute;
+		z-index: 5;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-weight: 400;
+		background: url($iconurl + "lingzhu.png") no-repeat;
+		background-size: 100% 100%;
+		color: #000;
+		width: 68rpx;
+		height: 32rpx;
+		// border-radius: 25rpx;
+		top: 12rpx;
+		right: 12rpx;
+		font-size: 22rpx;
+		line-height: 32rpx;
+	}
+
+	.slot-pop {
+		width: 100vw;
+		height: 100vh;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		background-image: url($imgurl + 'common/slot_bg.webp');
+		background-size: cover;
+		background-position: center;
+
+	}
+
+	.slot-view {
+		background-image: url($imgurl + 'common/slot1.png');
+		background-size: cover;
+		background-position: center;
+		width: 100%;
+		height: 427.78rpx;
+	}
+
+	.item-lottry {
+		height: 152.78rpx;
+		width: 152.78rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-size: 30rpx;
+		border-radius: 16rpx;
+		color: black;
+		box-sizing: border-box;
+		background-color: rgba(255, 255, 255, 0.8);
+	}
 </style>
\ No newline at end of file
diff --git a/pages/shouye/index.vue b/pages/shouye/index.vue
index 1e64f68..89374d7 100644
--- a/pages/shouye/index.vue
+++ b/pages/shouye/index.vue
@@ -7,7 +7,7 @@
 	<view class="content">
 		<view class="navLeft align-center" :style="{ top: $sys().statusBarHeight + 'px' }" @tap="$c.back(1)">
 			<view class="flex" style="width: 100%">
-				<view class="title1" style="width: 166rpx; height: 64rpx; margin-top: 5rpx;">
+				<view class="title1" style="width: 166rpx; height: 64rpx; margin-top: 5rpx;" @click="jumapSlots()">
 					<image :src="$img1('common/home_logo.png')" style="width: 166rpx; height: 64rpx;" mode=""></image>
 				</view>
 			</view>
@@ -430,6 +430,10 @@ export default {
 		toyaqingRanking() {
 			this.$customRouter.navigateTo("/pages/shouye/yaoqing_ranking");
 		},
+		
+		jumapSlots(){
+			this.$customRouter.navigateTo("/pages/shouye/slots");
+		}
 	},
 };
 </script>
diff --git a/pages/shouye/slots.vue b/pages/shouye/slots.vue
new file mode 100644
index 0000000..5f9558e
--- /dev/null
+++ b/pages/shouye/slots.vue
@@ -0,0 +1,175 @@
+<template>
+	<page-container title="老虎机" :showBack="true">
+
+		<view class="content-container">
+
+
+			<view class="slot-view">
+
+				<view class=""
+					style="width: 100%; height: 152.78rpx; background-color: aquamarine; margin-top: 195rpx;">
+
+
+					<tiner-swiper-loop ref="lottryRef" :itemW="lotteryItemSize[0]" :itemH="lotteryItemSize[1]"
+						:items="items" :aTime="5" :isLottry="true" :excessCount="0" :disableTouch="true"
+						style="height: 152.78rpx;">
+						<template v-slot="{item,index}">
+							<view class="item-lottry" :style="{ color: item.color }">{{item.value}}</view>
+						</template>
+					</tiner-swiper-loop>
+
+
+				</view>
+
+
+			</view>
+
+
+		</view>
+
+		<button style="margin-top: 20rpx;" @click="onStartDraw">开始抽奖</button>
+
+
+	</page-container>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				// 原始数据
+				items: [{
+						value: '一等奖',
+						color: '#ff0000'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					}, {
+						value: '七等奖',
+						color: '#ff8800'
+					}, {
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '二等奖',
+						color: '#00ff00'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					}, {
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '三等奖',
+						color: '#0000ff'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '四等奖',
+						color: '#ffff00'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					}, {
+						value: '七等奖',
+						color: '#ff8800'
+					}, {
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '五等奖',
+						color: '#ff00ff'
+					},
+					{
+						value: '六等奖',
+						color: '#00ffff'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					},
+					{
+						value: '七等奖',
+						color: '#ff8800'
+					},
+				],
+
+			}
+		},
+		computed: {
+
+			lotteryItemSize() {
+				let height = uni.upx2px(220);
+				let width = uni.upx2px(170);
+				return [width, height];
+			}
+		},
+		methods: {
+
+			onStartDraw() {
+				//this.$refs.lottryRef.initLottryData();
+				this.bgmCtx.slotBgm.play()
+				this.$refs.lottryRef.startDraw();
+			}
+		}
+
+	}
+</script>
+
+<style lang="scss">
+	.content-container {
+		width: 100%;
+		height: 100vh;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		box-sizing: border-box;
+		background-image: url($imgurl + 'common/slot_bg.webp');
+		background-size: cover;
+		background-position: center;
+	}
+
+	.slot-view {
+		background-image: url($imgurl + 'common/slot1.png');
+		background-size: cover;
+		background-position: center;
+		width: 100%;
+		height: 427.78rpx;
+	}
+
+
+	.view-center-line {
+		position: absolute;
+		width: 1rpx;
+		background-color: red;
+		height: 300rpx;
+		z-index: 10;
+	}
+
+	.item-lottry {
+		height: 152.78rpx;
+		width: 152.78rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-size: 30rpx;
+		border-radius: 16rpx;
+		color: black;
+		box-sizing: border-box;
+		background-color: rgba(255, 255, 255, 0.8);
+	}
+</style>
\ No newline at end of file