完善

components/LeftNav/LeftNav.vue

@@ -4,7 +4,6 @@
 			<view class="box2">
 				<view class="banner" @click="navBtn(index)" v-for="(item, index) in navList" :key="item.name">
 					<view class="">
-						<!-- <image style="width: 120rpx; height: 120rpx" src="../../static/img/img_非遗百科@2x.png"></image> -->
 						<image style="width: 120rpx; height: 120rpx" :src="item.img"></image>
 					</view>
 					<view class="nav_tit">{{ item.name }}</view>
@@ -56,6 +55,12 @@ export default {
 					name: '回到首页',
 					img: '/static/img/icon_back@2x.png',
 					path: '/pages/index/index'
+				},
+
+				{
+					name: '回到探索页',
+					img: '/static/img/icon_back@2x.png',
+					path: '/pages/index/startPage'
 				}
 			]
 		};
@@ -76,12 +81,13 @@ export default {
 	width: 348rpx;
 	height: 1080rpx;
 	margin: auto;
-	margin-top: 50%;
+	margin-top: 30%;
 	background-color: #f8efe1;
 }
 .box2 {
 }
 .banner {
+	cursor: pointer;
 	display: flex;
 	align-items: center;
 	margin-bottom: 80rpx;

config/api.js

@@ -341,4 +341,12 @@ export const complete = (data, callback) => post('complete', data, callback,
 // 获取排行
 export const getTopList = (data, callback) => get('api/feiyizhanting/answer/getTopList' + queryParams(data,
 		true),
+	callback);
+// 非遗概览
+export const zhantinglists = (data, callback) => get('api/wuyuan/ich/zhantinglists' + queryParams(data,
+		true),
+	callback);
+// 非遗详情
+export const zhantingDetails = (data, callback) => get('api/wuyuan/ich/zhantingDetails' + queryParams(data,
+		true),
 	callback);

pages/index/feiYiBaiKe/feiYiBaiKe.vue

@@ -256,6 +256,7 @@ export default {
 	height: 180rpx;
 	margin: auto;
 	align-items: center;
+	cursor: pointer;
 	border-bottom: 1px solid #ded1c5;
 }
 .caidan {
@@ -263,6 +264,7 @@ export default {
 	margin-top: 0;
 	display: flex;
 	width: 180rpx;
+	cursor: pointer;
 	align-items: center;
 }
 .img {
@@ -322,4 +324,4 @@ export default {
 	justify-content: space-between;
 	align-items: center;
 }
-</style>
+</style>

pages/index/feiYiGaiLan/feiYiGaiLan.vue

@@ -17,10 +17,10 @@
 		<view class="box">
 			<scroll-view scroll-x="true" style="display: flex; white-space: nowrap">
 				<view class="container" v-for="(item, index) in projectList" :key="item.index">
-					<view class="mn_box" @click="projectBtn(index)">
-						<image style="border-radius: 0px 0px 100px 100px; width: 90%; height: 98%" :src="item.img"></image>
+					<view class="mn_box" @click="zhantingDetails(index)">
+						<image style="border-radius: 0px 0px 100px 100px; width: 90%; height: 98%" :src="item.thumbnail"></image>
 					</view>
-					<text class="title">{{ item.title }}</text>
+					<text class="title">{{ item.name }}</text>
 
 					<view class="sanjiao"></view>
 					<view class="sanjiao2"></view>
@@ -34,10 +34,20 @@
 				<view class="back" @click="detailsShow = false">
 					<image style="width: 100%; height: 100%" src="../../../static/img/icon_back@2x.png"></image>
 				</view>
+				<view class="ccr">传承人</view>
+				<view class="top_tit">
+					<u-parse :tagStyle="style" :content="detailsList.inheritor ? detailsList.inheritor : '暂无传承人'"></u-parse>
+				</view>
+				<view class="">
+					<view class="jieshao">
+						<view class="ccr">介绍</view>
+						<u-parse :tagStyle="style" :content="detailsList.introduce"></u-parse>
+					</view>
+				</view>
 			</view>
 		</view>
 		<!-- 切换按钮 -->
-		<view class="anNiu">
+		<!-- 	<view class="anNiu">
 			<view class="anNiu_item">
 				<image style="width: 120rpx; height: 120rpx" src="/static/img/Group 834@2x.png"></image>
 				<view class="dd_1"></view>
@@ -52,7 +62,7 @@
 				<view class="dd_1"></view>
 				<image style="width: 120rpx; height: 120rpx" src="/static/img/Group 834@2x(1).png"></image>
 			</view>
-		</view>
+		</view> -->
 		<!-- 菜单按钮 -->
 		<view class="caidan" @click="navBtn">
 			<image class="img" src="../../../static/img/icon_menu@2x.png"></image>
@@ -66,57 +76,43 @@
 </template>
 
 <script>
+let that;
 export default {
 	data() {
 		return {
+			style: {
+				// 字符串的形式
+				span: 'font-weight: 700;color: #563530;font-size: 24px !important;font-family: nzgrRuyinZouZhangKai-Regular, nzgrRuyinZouZhangKai;'
+			},
+			id: '',
 			show: false,
 			detailsShow: false,
-			projectList: [
-				{
-					title: '沈氏漆线雕',
-					img: 'https://www.xmqwzx.com.cn/xmfy/xmfy/xmml/201908/W020190828611283811392.jpg'
-				},
-				{
-					title: '闽台送王船习俗',
-					img: 'https://img1.baidu.com/it/u=4093092880,3787172119&fm=253&fmt=auto&app=138&f=JPEG?w=334&h=499'
-				},
-				{
-					title: '剪瓷雕',
-					img: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fss2.meipian.me%2Fusers%2F111326%2F3af384c937ce442cb3aae53bee45b095.jpg%3Fmeipian-watermark%2Fbucket%2Fivwen%2Fkey%2FdXNlcnMvMTExMzI2LzNhZjM4NGM5MzdjZTQ0MmNiM2FhZTUzYmVlNDViMDk1LmpwZw%3D%3D%2Fnickname%2FeWpy%2Fuserid%2FMTExMzI2%2Fsign%2Fe4034ce792c72b619dbb8a386637afd9.jpg&refer=http%3A%2F%2Fss2.meipian.me&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1701593316&t=6e9331d4d960501b3b6651cb05a85e4b'
-				},
-				{
-					title: '漆宝斋漆艺',
-					img: 'https://img1.baidu.com/it/u=2241138695,3173725763&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=764'
-				},
-				{
-					title: '仙岳山福德信俗',
-					img: 'https://img.pconline.com.cn/images/upload/upc/tx/photoblog/1301/20/c7/17566666_17566666_1358685409100_mthumb.jpg'
-				},
-				{
-					title: '讲古',
-					img: 'https://img1.baidu.com/it/u=505223839,1816123938&fm=253&fmt=auto&app=138&f=JPG?w=401&h=814'
-				},
-				{
-					title: '沈氏漆线雕',
-					img: 'https://hbimg.b0.upaiyun.com/fa7bf70c03c48e5faf55a0df22f32f31e15a7aed3b7a5-UwCBBR_fw658'
-				},
-				{
-					title: '闽台送王船习俗',
-					img: 'https://img1.baidu.com/it/u=4093092880,3787172119&fm=253&fmt=auto&app=138&f=JPEG?w=334&h=499'
-				},
-				{
-					title: '剪瓷雕',
-					img: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fss2.meipian.me%2Fusers%2F111326%2F3af384c937ce442cb3aae53bee45b095.jpg%3Fmeipian-watermark%2Fbucket%2Fivwen%2Fkey%2FdXNlcnMvMTExMzI2LzNhZjM4NGM5MzdjZTQ0MmNiM2FhZTUzYmVlNDViMDk1LmpwZw%3D%3D%2Fnickname%2FeWpy%2Fuserid%2FMTExMzI2%2Fsign%2Fe4034ce792c72b619dbb8a386637afd9.jpg&refer=http%3A%2F%2Fss2.meipian.me&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1701593316&t=6e9331d4d960501b3b6651cb05a85e4b'
-				}
-			]
+			projectList: [],
+			detailsList: []
 		};
 	},
+
+	onLoad() {
+		that = this;
+		this.zhantinglists();
+	},
 	methods: {
 		navBtn() {
 			this.show = true;
 		},
-		projectBtn(index) {
-			console.log(index);
+
+		// 非遗概况项目
+		zhantinglists() {
+			this.$api.zhantinglists({}, function (res) {
+				that.projectList = res.data;
+			});
+		},
+		// 非遗概况项目详情
+		zhantingDetails(index) {
+			this.$api.zhantingDetails({ id: that.projectList[index].id }, function (res) {
+				that.detailsList = res.data;
+				console.log(that.detailsList, 1212);
+			});
 			this.detailsShow = true;
 		},
 		close() {
@@ -133,6 +129,7 @@ export default {
 	padding-top: 100rpx;
 	box-sizing: border-box;
 }
+
 .header {
 	margin-left: 10%;
 	width: 960rpx;
@@ -144,9 +141,42 @@ export default {
 	display: flex;
 	align-items: center;
 	width: 65%;
+	/* overflow-x: scroll; */
+
 	height: 1280rpx;
 	margin-left: 20%;
 }
+
+.ccr {
+	width: 300rpx;
+	height: 80rpx;
+	font-size: 48rpx;
+	text-align: center;
+	line-height: 80rpx;
+	margin: auto;
+	background-image: linear-gradient(270deg, rgba(188, 95, 41, 1) 0, rgba(91, 60, 41, 1) 100%);
+	-webkit-background-clip: text;
+	-webkit-text-fill-color: transparent;
+}
+.top_tit {
+	width: 80%;
+	height: 200rpx;
+	overflow: scroll;
+	cursor: pointer;
+	margin: auto;
+	font-size: 46rpx !important;
+	color: #563530 !important;
+	border-bottom: 1px solid #f8efe1;
+}
+.jieshao {
+	width: 80%;
+	height: 500rpx;
+	overflow: scroll;
+	margin: auto;
+	margin-top: 30rpx;
+	font-size: 36rpx;
+	color: #563530;
+}
 .container {
 	position: relative;
 	display: inline-block;
@@ -155,7 +185,7 @@ export default {
 }
 .xq_box {
 	position: absolute;
-	top: 15%;
+	top: 12%;
 	z-index: 2;
 	width: 2200rpx;
 	height: 1200rpx;
@@ -184,6 +214,7 @@ export default {
 	margin-left: 40rpx;
 	padding-top: 20rpx;
 	margin-bottom: 20rpx;
+	cursor: pointer;
 	box-sizing: border-box;
 	background: url('/static/img/img_bk.png') no-repeat center;
 	background-size: 100% 100%;
@@ -262,7 +293,7 @@ export default {
 }
 .caidan {
 	margin-left: 10%;
-
+	cursor: pointer;
 	display: flex;
 	width: 180rpx;
 	align-items: center;
@@ -312,4 +343,4 @@ export default {
 	background-color: #8a7d6d;
 	border-radius: 50%;
 }
-</style>
+</style>

pages/index/feiYiShiPin/feiYiShiPin.vue

@@ -47,7 +47,7 @@
 
 		<u-popup mode="center" :show="detailsShow">
 			<view class="details_box">
-				<view @click="detailsShow = false" style="position: absolute; top: 70rpx; left: 80rpx; z-index: 5" class="">
+				<view @click="detailsShow = false" style="cursor: pointer; position: absolute; top: 70rpx; left: 80rpx; z-index: 5" class="">
 					<image style="width: 80rpx; height: 80rpx" src="/static/img/icon_back@2x.png"></image>
 				</view>
 				<view class="details_box2">
@@ -56,7 +56,7 @@
 					</view>
 
 					<view class="box_vido">
-						<video style="width: 100%; height: 100%" id="myVideo" :src="vidourl" autopla loop="true" @error="videoErrorCallback" controls></video>
+						<video style="width: 100%; height: 100%" id="myVideo" :src="vidourl" autoplay loop="true" @error="videoErrorCallback" controls></video>
 					</view>
 				</view>
 			</view>
@@ -112,15 +112,7 @@ export default {
 		that = this;
 		this.getIchVideoLists();
 	},
-	mounted() {
-		// this.list.forEach((item, index) => {
-		// 	const box = this.$refs[`box${index}`]; // 通过ref获取DOM元素实例
-		// 	if (index === this.middleIndex) {
-		// 		// 如果是中间的盒子，添加动态类名
-		// 		box.classList.add('bianda1'); // 添加动态类名，可以根据需要替换成其他类名
-		// 	}
-		// });
-	},
+	mounted() {},
 	methods: {
 		navBtn() {
 			this.show = true;
@@ -315,6 +307,7 @@ export default {
 	display: flex;
 	width: 180rpx;
 	align-items: center;
+	cursor: pointer;
 }
 .img {
 	width: 80rpx;
@@ -334,6 +327,7 @@ export default {
 	/* margin-left: 18%; */
 }
 .bianda1 {
+	cursor: pointer;
 	border-radius: 50% !important;
 	height: 800rpx !important;
 	/* display: flex; */
@@ -388,6 +382,7 @@ export default {
 	margin: 20rpx 0 0 20rpx;
 }
 .biank_3 {
+	cursor: pointer;
 	border-radius: 50%;
 	height: 540rpx;
 	border: 1px solid rgba(86, 53, 48, 0.5);
@@ -469,6 +464,7 @@ export default {
 	margin-left: 42%;
 }
 .anNiu_item {
+	cursor: pointer;
 	display: flex;
 	align-items: center;
 	justify-content: space-between;

pages/index/feiYiZhengCe/feiYiZhengCe.vue

@@ -12,7 +12,9 @@
 					<image style="width: 120rpx; height: 860rpx" src="/static/img/img_zce.png"></image>
 				</view>
 				<view class="fy_xm">
-					<view v-for="(item, index) in tabListName" :key="item.name" @click="tabBtn(item.id, index)" :class="{ active: tabIndex == index }">{{ item.name }}</view>
+					<view style="cursor: pointer" v-for="(item, index) in tabListName" :key="item.name" @click="tabBtn(item.id, index)" :class="{ active: tabIndex == index }">
+						{{ item.name }}
+					</view>
 				</view>
 			</view>
 		</view>
@@ -304,6 +306,7 @@ export default {
 	position: absolute;
 	width: 100rpx;
 	height: 100rpx;
+	cursor: pointer;
 }
 .details_tit {
 	margin-left: 140rpx;
@@ -316,8 +319,9 @@ export default {
 	display: flex;
 	align-items: center;
 	font-size: 40rpx;
+	cursor: pointer;
 	color: #563530;
 	letter-spacing: 0.2em;
 	border-bottom: 1px solid #ddd7d6;
 }
-</style>
+</style>

pages/index/huDongWenDa/huDongWenDa.vue

@@ -37,7 +37,7 @@
 			<view class="ph_box" v-if="rankinglShow">
 				<view class="ph_box2">
 					<view class="phb">排行榜</view>
-					<view class="phb_box" v-for="item in rankingList" :key="item.name">
+					<view class="phb_box" v-for="item in rankingList" :key="item.index">
 						<view class="phb_item">
 							<view class="phb_pm">
 								<image style="width: 100%; height: 100%" src="/static/img/img_no1@2x.png"></image>
@@ -63,7 +63,7 @@
 				<!-- 开始答题 -->
 				<view class="" v-if="resultShow">
 					<view class="tm_box">
-						<view @click="answerShow = false" style="position: absolute; top: -36rpx; left: 10rpx" class="">
+						<view @click="answerShow = false" style="cursor: pointer; position: absolute; top: -36rpx; left: 10rpx" class="">
 							<image style="width: 80rpx; height: 80rpx" src="/static/img/icon_back@2x.png"></image>
 						</view>
 						<view class="tihao">{{ i }}</view>
@@ -73,7 +73,7 @@
 					<!-- 答案 -->
 					<view class="daAn_box">
 						<!-- -->
-						<view @click="selectBtn(index)" v-for="(item, index) in list.optionList" :key="item.label" class="daAn_item" :class="{ active: index == selectTab2 }">
+						<view @click="selectBtn(index)" v-for="(item, index) in list.optionList" :key="item.index" class="daAn_item" :class="{ active: index == selectTab2 }">
 							{{ item.label }}
 						</view>
 					</view>
@@ -83,31 +83,30 @@
 					</view>
 				</view>
 			</view>
-			<!-- 答题结果 -->
-			<view class="jieGuo" v-if="jieGuoShow">
-				<view class="tm_box">
-					<view class="dt_end">答题结束</view>
-				</view>
-				<view class="fraction">
-					<text style="font-size: 38rpx">{{ recordNumber * 10 }}分</text>
-				</view>
-				<view class="txt_box">
-					<view class="txt_">共计{{ anNiuList.length }}题，您答对了 {{ recordNumber }} 道题！</view>
-					<view class="txt_">恭喜您！耗时 1分30秒 完成！</view>
+		</view>
+		<!-- 答题结果 -->
+		<view class="jieGuo" v-if="jieGuoShow">
+			<view class="tm_box2">
+				<view class="dt_end">答题结束</view>
+			</view>
+			<view class="fraction">
+				<text>{{ recordNumber * 10 }}分</text>
+			</view>
+			<view class="txt_box">
+				<view class="txt_">共计{{ anNiuList.length }}题，您答对了 {{ recordNumber }} 道题！</view>
+				<!-- <view class="txt_">恭喜您！耗时 {{ cost_time }} 完成！</view> -->
+			</view>
+			<!-- 查看排行榜按钮 -->
+			<view class="restart">
+				<view class="dt">
+					<image style="width: 100%; height: 100%" src="/static/img/img_left@2x.png"></image>
 				</view>
-				<!-- 重新答题按钮 -->
-				<view class="restart" @click="restartBtn">
-					<view class="dt">
-						<image style="width: 100%; height: 100%" src="/static/img/img_left@2x.png"></image>
-					</view>
-					<view class="dt_box">重新开始</view>
-					<view class="dt">
-						<image style="width: 100%; height: 100%" src="/static/img/img_right@2x.png"></image>
-					</view>
+				<view @click="phbBtn" class="dt_box">查看排行榜</view>
+				<view class="dt">
+					<image style="width: 100%; height: 100%" src="/static/img/img_right@2x.png"></image>
 				</view>
 			</view>
 		</view>
-
 		<!-- 菜单按钮 -->
 		<view class="caidan" @click="navBtn">
 			<image class="img" src="../../../static/img/icon_menu@2x.png"></image>
@@ -162,10 +161,12 @@ export default {
 		},
 		// 开始答题
 		starBtn() {
+			// this.startTime = new Date().getTime(); // 记录开始时间戳
+
 			this.answerShow = true;
 			this.$api.startChallenge({}, function (res) {
 				that.anNiuList = res.data.question_data;
-				console.log(that.anNiuList.length, '开始答题');
+				// console.log(that.anNiuList.length, '开始答题');
 			});
 
 			setTimeout(() => {
@@ -217,7 +218,7 @@ export default {
 		},
 		// 完成答题
 		completeBtn() {
-			// console.log(this.selectTab, '56565656');
+			this.endTime = new Date().getTime(); // 记录结束时间戳
 			if (!this.selectTab) {
 				this.$common.normalToShow('还未选择答案');
 				return false;
@@ -243,23 +244,18 @@ export default {
 				}, 500);
 				this.starShow = false;
 				this.resultShow = true;
-
-				// this.answerShow = true;
-				this.rankinglShow = true;
-
-				// this.jieGuoShow = true;
-				this.$api.getTopList({}, function (res) {
-					console.log(res, '排行');
-					that.rankingList = res.data;
-				});
+				this.jieGuoShow = true;
+				// this.yongShi = this.startTime - this.endTime;
 			}
 		},
-		// 重新答题
-		restartBtn() {
-			this.starBtn();
-			// this.nextBtn();
-			// this.jieGuoShow = false;
-			// this.resultShow = true;
+		// 排行榜
+		phbBtn() {
+			this.$api.getTopList({}, function (res) {
+				console.log(res, '排行');
+				that.rankingList = res.data;
+			});
+			this.jieGuoShow = false;
+			this.rankinglShow = true;
 		},
 
 		close() {
@@ -297,8 +293,10 @@ export default {
 }
 .jieGuo {
 	position: absolute;
-	top: 0;
-	left: 15%;
+	top: 400rpx;
+	left: 32%;
+	height: 1000rpx;
+	background-color: #efe6d8;
 }
 .box {
 	width: 1800rpx;
@@ -343,6 +341,7 @@ export default {
 	margin-top: 2%;
 	display: flex;
 	width: 180rpx;
+	cursor: pointer;
 	align-items: center;
 }
 .img {
@@ -371,6 +370,7 @@ export default {
 	margin-top: 260rpx;
 }
 .dt_box {
+	cursor: pointer;
 	width: 300rpx;
 	height: 80rpx;
 	font-size: 48rpx;
@@ -490,7 +490,7 @@ export default {
 	margin-top: 50rpx;
 	text-align: center;
 	line-height: 100rpx;
-
+	cursor: pointer;
 	border: #a65729 1px solid;
 	background: linear-gradient(180deg, #bc5f29 0%, #5b3c29 100%);
 	-webkit-background-clip: text;
@@ -519,6 +519,16 @@ export default {
 	height: 260rpx;
 	border-bottom: 1px solid #ddd0c4;
 }
+.tm_box2 {
+	display: flex;
+	position: relative;
+	justify-content: space-around;
+	align-items: center;
+	width: 100%;
+	margin-top: 60rpx;
+	height: 160rpx;
+	border-bottom: 1px solid #ddd0c4;
+}
 .tihao {
 	width: 90rpx;
 	height: 80rpx;
@@ -549,7 +559,7 @@ export default {
 .daAn_item {
 	width: 520rpx;
 	height: 120rpx;
-
+	cursor: pointer;
 	font-size: 36rpx;
 	color: #563530;
 	margin-top: 50rpx;
@@ -562,6 +572,7 @@ export default {
 	margin: auto;
 	font-size: 40rpx;
 	text-align: center;
+	cursor: pointer;
 	line-height: 90rpx;
 	letter-spacing: 0.2em;
 	background-image: linear-gradient(270deg, rgba(188, 95, 41, 1) 0, rgba(91, 60, 41, 1) 100%);

pages/index/huLiWenHua/huLiWenHua.vue

@@ -175,6 +175,7 @@ export default {
 	margin-top: 0;
 	display: flex;
 	width: 180rpx;
+	cursor: pointer;
 	align-items: center;
 }
 .img {
@@ -186,4 +187,4 @@ export default {
 	font-size: 36rpx;
 	color: #563530;
 }
-</style>
+</style>

pages/index/index.vue

@@ -119,6 +119,7 @@ export default {
 .box_item {
 	width: 420rpx;
 	height: 280rpx;
+	cursor: pointer;
 }
 .box_tit {
 	background-image: linear-gradient(270deg, rgba(188, 95, 41, 1) 0, rgba(188, 95, 41, 1), rgba(91, 60, 41, 1) 100%);

pages/index/startPage.vue

@@ -91,6 +91,7 @@ export default {
 	width: 340rpx;
 	padding: 16rpx 0 16rpx 0;
 	margin: auto;
+	cursor: pointer;
 	background-color: #fff9ec;
 	box-sizing: border-box;
 }