Merge branch '2024鹅状元' of https://gogs.mtavip.com/wangguoyu/uniProject into 2024鹅状元

pages.json

@@ -28,6 +28,13 @@
 				"navigationBarTitleText": "专题",
 				"navigationStyle": "custom"
 			}
+		},	
+		{
+			"path": "pages/zhuanti/zhuantiInfo",
+			"style": {
+				"navigationBarTitleText": "专题",
+				"navigationStyle": "custom"
+			}
 		},
 			{
 			"path": "pages/study/index",

pages/zhuanti/index.vue

@@ -1,8 +1,16 @@
 <template>
 	<view>
-		<CustomTabBar  :currentTabNumber="1"></CustomTabBar>
+		<view>
+			{{yhName}}
+		</view>
+		<view v-for="(item,index) in biaoqingList" :key="index" >
+			<view @click="goZhuantiInfo(item)">{{item.name}}</view>
+			<view >{{item.icon}}</view>
+		</view>
+
+		<CustomTabBar :currentTabNumber="1"></CustomTabBar>
 	</view>
-	
+
 </template>
 
 <script setup>
@@ -17,17 +25,72 @@
 
 	import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
 	import {
-		onLoad
-	} from '@dcloudio/uni-app';
-	import {
 		reactive,
 		ref
 	} from "vue";
 	import {
-		onShow
+		onLoad
 	} from '@dcloudio/uni-app';
-	onShow(() => {
+	const youkeFlag = ref(null);
+	const yhName = ref(null);
+	const biaoqingList = ref(
+		[{
+				icon: '',
+				name: '开心',
+				type: 'kaixin'
+			},
+			{
+				icon: '',
+				name: '愤怒',
+				type: 'fennu'
+			},
+			{
+				icon: '',
+				name: '悲伤',
+				type: 'beishang'
+			},
+			{
+				icon: '',
+				name: '害怕',
+				type: 'haipa'
+			},
+			{
+				icon: '',
+				name: '得意',
+				type: 'deyi'
+			},
+			{
+				icon: '',
+				name: '嫉妒',
+				type: 'jidu'
+			},
+			{
+				icon: '',
+				name: '压抑',
+				type: 'yayi'
+			},
+			{
+				icon: '',
+				name: '抱怨',
+				type: 'baoyuan'
+			}
+		]
 
+	)
+	onLoad((options) => {
+		if (cacheManager.get('auth')) {
+			youkeFlag.value = true
+			yhName.value = cacheManager.get('auth').realName || ''
+		} else {
+			// 游客
+			youkeFlag.value = false
+		}
 	})
-	const agreeType = ref(null);
+
+	function goZhuantiInfo(data) {
+		console.log('data', data);
+		uni.redirectTo({
+			url: '/pages/zhuanti/zhuantiInfo?type='+data.type
+		})
+	}
 </script>

pages/zhuanti/zhuantiInfo.vue

@@ -0,0 +1,142 @@
+<template>
+	<view>
+		<view class="icon-title-navBar-box">
+			<view @click="goUpPage" class="nav-bar-icon"></view>
+			<text class="nav-bar-title">详情</text>
+		</view>
+		<view>
+			<view v-if="[1,2,3,4,5,6,7,8].includes(type)">
+				<img :src="'img'+type" alt="">
+			</view>
+			<view @touchstart="handleTouchStart" @touchend="handleTouchEnd" @touchcancel="handleTouchCancel"
+				@touchmove="handleTouchMove" :class="[buttonState]">
+				{{ buttonText }}
+			</view>
+
+			<!-- 取消提示层 -->
+			<view v-if="showCancel" class="cancel-tip">松开取消</view>
+		</view>
+
+		<!-- 	<CustomTabBar  :currentTabNumber="1"></CustomTabBar> -->
+	</view>
+
+</template>
+
+<script setup>
+	import {
+		toast,
+		getUserIdentity
+	} from "@/utils/common";
+	import cacheManager from '@/utils/cacheManager.js';
+	import {
+
+	} from '@/api/zhuanti.js'
+
+	import CustomTabBar from '@/components/custom-tabbar/custom-tabbar.vue';
+	import {
+		reactive,
+		ref,
+		computed,
+		onBeforeUnmount
+	} from "vue";
+	import {
+		onLoad
+	} from '@dcloudio/uni-app';
+	const type = ref(null);
+	const showIcon = ref(null);
+	const img1 = ref(null);
+	const img2 = ref(null);
+	const img3 = ref(null);
+	const img4 = ref(null);
+	const img5 = ref(null);
+	const img6 = ref(null);
+	const img7 = ref(null);
+	const img8 = ref(null);
+	const isPressing = ref(false); // 是否正在按压
+	const isCancelled = ref(false); // 是否已取消
+	const touchPos = ref({
+		x: 0,
+		y: 0
+	}); // 触摸位置
+	onLoad((options) => {
+		console.log('opt', options);
+		type.value = options.type
+	})
+	// 按钮状态计算
+	const buttonState = computed(() => {
+		if (isCancelled.value) return 'cancelled';
+		return isPressing.value ? 'recording' : 'idle';
+	});
+
+	// 按钮文本
+	const buttonText = computed(() => {
+		if (isCancelled.value) return '已取消';
+		return isPressing.value ? '松开结束' : '按住开始';
+	});
+
+	// 是否显示取消提示
+	const showCancel = computed(() => {
+		return isPressing.value && !isCancelled.value;
+	});
+
+	// 触摸开始
+	const handleTouchStart = (e) => {
+		isPressing.value = true;
+		isCancelled.value = false;
+		touchPos.value = {
+			x: e.touches[0].clientX,
+			y: e.touches[0].clientY
+		};
+
+		// 这里触发开始逻辑（如开始录音）
+		console.log('操作开始');
+	};
+
+	// 触摸结束
+	const handleTouchEnd = () => {
+		if (isPressing.value && !isCancelled.value) {
+			// 正常结束逻辑
+			console.log('操作完成');
+		}
+
+		resetState();
+	};
+
+	// 触摸取消
+	const handleTouchCancel = () => {
+		isCancelled.value = true;
+		resetState();
+		console.log('操作取消');
+	};
+
+	// 触摸移动检测（判断是否滑动取消）
+	const handleTouchMove = (e) => {
+		if (!isPressing.value) return;
+
+		const currentX = e.touches[0].clientX;
+		const currentY = e.touches[0].clientY;
+		const moveDistance = Math.sqrt(
+			Math.pow(currentX - touchPos.value.x, 2) +
+			Math.pow(currentY - touchPos.value.y, 2)
+		);
+
+		// 移动超过50px视为取消
+		if (moveDistance > 50) {
+			isCancelled.value = true;
+		}
+	};
+
+	// 重置状态
+	const resetState = () => {
+		isPressing.value = false;
+		setTimeout(() => {
+			isCancelled.value = false;
+		}, 500); // 短暂保持
+	};
+	function goUpPage() {
+		uni.redirectTo({
+			url: `/pages/zhuanti/index`
+
+		})
+	}
+</script>