客户页面

pages/admin/Hetong/Hetong.vue

@@ -6,7 +6,7 @@
 			<uni-icons class="nav-bar-right-icon bar-ml10" type="list" @click="handleGoLishi" size="30"></uni-icons>
 
 		</view>
-		<template>
+		<template v-if="tId">
 			<view class="pdf-box"> 
 			 <image v-for="item in imgList" mode="aspectFit" :src="`data:image/png;base64,${item}`" @click="previewBase64Image(`data:image/png;base64,${item}`)"></image>
 			</view>

pages/admin/Hetong/HetongInfo.vue

@@ -1,147 +1,153 @@
 <template>
-    <view class="phone-hetong-page">
-      <view class="icon-title-navBar-box">
-        <view @click="goUpPage" class="nav-bar-icon"></view>
-        <text class="nav-bar-title">合同</text>
-      </view>
-
-      <template v-if="tId">
-		  <view class="pdf-box">
-        <view class="pdf-box">
-          <image v-for="item in imgList" mode="aspectFit" :src="`data:image/png;base64,${item}`" @click="previewBase64Image(`data:image/png;base64,${item}`)"></image>
-        </view>
-      </view>
-      </template>
-	  
-	  <view class="hetong-tip-box" v-if="info.status == 0">
-		  请务必仔细阅读上述内容，确认已完全理解所有条款后，点击【我已阅读】按钮完成签字确认。
-	  </view>
-	  <button @click="handleQianming" v-if="info.status == 0"
-	  class="phone-green-btn ht-btn"  type="default">我已阅读</button>
-	  
-	  <uni-popup ref="popupRef" type="bottom" background-color="#fff" :is-mask-click="false" :mask-click="false">
-	  	<view class="ht-qm-popup">
-	  			<view class="icon-title-navBar-box">
-	  				<view @click="goback2" class="nav-bar-icon"></view>
-	  				<text class="nav-bar-title">签名</text>
-	  			</view>
-	  			<writeSign @getBase64="getBase64"></writeSign>
-	  	</view>
-	  </uni-popup>
-	  
-	  <!-- 加载提示 -->
-	  <view class="loading-overlay" v-if="isLoading">
-	  	<view class="loading-spinner"></view>
-	  	<text class="loading-text">加载中...</text>
-	  </view>
-    </view>
+	<view class="phone-hetong-page">
+		<view class="icon-title-navBar-box">
+			<view @click="goUpPage" class="nav-bar-icon"></view>
+			<text class="nav-bar-title">合同</text>
+		</view>
+
+		<template v-if="tId">
+			<view class="pdf-box">
+				<view class="pdf-box">
+					<image v-for="item in imgList" mode="aspectFit" :src="`data:image/png;base64,${item}`"
+						@click="previewBase64Image(`data:image/png;base64,${item}`)"></image>
+				</view>
+			</view>
+		</template>
+
+		<view class="hetong-tip-box" v-if="info.status == 0">
+			请务必仔细阅读上述内容，确认已完全理解所有条款后，点击【我已阅读】按钮完成签字确认。
+		</view>
+		<button @click="handleQianming" v-if="info.status == 0" class="phone-green-btn ht-btn"
+			type="default">我已阅读</button>
+
+		<uni-popup ref="popupRef" type="bottom" background-color="#fff" :is-mask-click="false" :mask-click="false">
+			<view class="ht-qm-popup">
+				<view class="icon-title-navBar-box">
+					<view @click="goback2" class="nav-bar-icon"></view>
+					<text class="nav-bar-title">签名</text>
+				</view>
+				<writeSign @getBase64="getBase64"></writeSign>
+			</view>
+		</uni-popup>
+
+		<!-- 加载提示 -->
+		<view class="loading-overlay" v-if="isLoading">
+			<view class="loading-spinner"></view>
+			<text class="loading-text">加载中...</text>
+		</view>
+	</view>
 </template>
 
 <script setup>
-import {
-  ref
-} from "vue";
-import * as httpApi from "@/api/hetong.js"
-import {
-  onLoad
-} from "@dcloudio/uni-app"
-import writeSign from "@/components/writeSign/index.vue"
-import {throttleAdvanced} from "@/utils/common.js"
-import {base64ToPath} from "image-tools";
-
-const tId = ref(null)
-
-const info = ref({})
-const show = ref(false)
-const popupRef = ref(null)
-const imgList = ref([])
-const isLoading = ref(true)
-const timer1 = ref(null)
-
-onLoad((options) => {
-  tId.value = options.id;
-  init();
-})
-
-function handleQianming() {
-  popupRef.value.open()
-}
-
-function init() {
-  httpApi.getHetongInfo({id: tId.value}).then(res => {
-	info.value = res.data;
-  imgList.value = res.data.base64List;
-  }).finally(() => {
-	  isLoading.value = false;
-  })
-}
-
-async function previewBase64Image(base64Data) {
-  try {
-    // 关键步骤：将 Base64 字符串转换为本地临时路径
-    // 此处以使用 image-tools 的 base64ToPath 为例
-    const localPath = await base64ToPath(base64Data);
-    // 调用 UniApp 的图片预览 API
-    uni.previewImage({
-      urls: [localPath], // 注意：urls 参数需要是数组，即使只预览一张图
-      current: 0, // 当前显示图片在 urls 数组中的索引
-    });
-  } catch (error) {
-    // 如果出现错误（如转换失败），隐藏加载提示并告知用户
-    console.error('预览失败:', error);
-    uni.showToast({
-      title: '预览失败',
-      icon: 'none'
-    });
-  }
-}
-
-function goUpPage() {
-  uni.navigateBack()
-  clearTimeout(timer1.value);
-  timer1.value = null;
-}
-
-const  handleQM = throttleAdvanced((img) => {
-  uni.showToast({
-    title: "签名提交中...",
-    mask: true,
-  })
-
-  httpApi.getHetongQianming({
-    id: tId.value,
-    yifangBase64: img.replace(/^data:image\/\w+;base64,/,'')
-  }).then(res => {
-    if (res.data) {
-      uni.showToast({
-        title: "签名成功",
-        duration: 2000,
-        mask: true,
-        success() {
-          timer1.value =  setTimeout(() => goUpPage(),2000)
-        }
-      })
-    }
-  })
-})
-
-function getBase64(img) {
-	if (!img) {
-		uni.showToast({
-			title: '签名异常'
+	import {
+		ref
+	} from "vue";
+	import * as httpApi from "@/api/hetong.js"
+	import {
+		onLoad
+	} from "@dcloudio/uni-app"
+	import writeSign from "@/components/writeSign/index.vue"
+	import {
+		throttleAdvanced
+	} from "@/utils/common.js"
+	import {
+		base64ToPath
+	} from "image-tools";
+
+	const tId = ref(null)
+
+	const info = ref({})
+	const show = ref(false)
+	const popupRef = ref(null)
+	const imgList = ref([])
+	const isLoading = ref(true)
+	const timer1 = ref(null)
+
+	onLoad((options) => {
+		tId.value = options.id;
+		init();
+	})
+
+	function handleQianming() {
+		popupRef.value.open()
+	}
+
+	function init() {
+		httpApi.getHetongInfo({
+			id: tId.value
+		}).then(res => {
+			info.value = res.data;
+			imgList.value = res.data.base64List;
+		}).finally(() => {
+			isLoading.value = false;
 		})
-		return;
 	}
-  console.log(22222)
-  handleQM(img)
 
-}
+	async function previewBase64Image(base64Data) {
+		try {
+			// 关键步骤：将 Base64 字符串转换为本地临时路径
+			// 此处以使用 image-tools 的 base64ToPath 为例
+			const localPath = await base64ToPath(base64Data);
+			// 调用 UniApp 的图片预览 API
+			uni.previewImage({
+				urls: [localPath], // 注意：urls 参数需要是数组，即使只预览一张图
+				current: 0, // 当前显示图片在 urls 数组中的索引
+			});
+		} catch (error) {
+			// 如果出现错误（如转换失败），隐藏加载提示并告知用户
+			console.error('预览失败:', error);
+			uni.showToast({
+				title: '预览失败',
+				icon: 'none'
+			});
+		}
+	}
 
+	function goUpPage() {
+		uni.navigateBack()
+		clearTimeout(timer1.value);
+		timer1.value = null;
+	}
 
-function goback2() {
-	popupRef.value.close()
-}
+	const handleQM = throttleAdvanced((img) => {
+		uni.showToast({
+			title: "签名提交中...",
+			mask: true,
+		})
 
+		httpApi.getHetongQianming({
+			id: tId.value,
+			yifangBase64: img.replace(/^data:image\/\w+;base64,/, '')
+		}).then(res => {
+			if (res.data) {
+				uni.showToast({
+					title: "签名成功",
+					duration: 2000,
+					mask: true,
+					success() {
+						timer1.value = setTimeout(() => goUpPage(), 2000)
+					}
+				})
+			}
+		})
+	})
+
+	function getBase64(img) {
+		if (!img) {
+			uni.showToast({
+				title: '签名异常'
+			})
+			return;
+		}
+		console.log(22222)
+		handleQM(img)
+
+	}
+
+
+	function goback2() {
+		popupRef.value.close()
+	}
 </script>
 
 <style scoped>