From 42a5ea5c1ccf4366ea53f7e75ed3550a9cae2c87 Mon Sep 17 00:00:00 2001
From: chen-xin-zhi <3588068430@qq.com>
Date: Sat, 22 Mar 2025 23:09:53 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=88=E5=AE=8C=E4=BA=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/request.ts                                |   2 +-
 .../myPhotoProductDetail.vue                  | 138 +++++++++++++-
 .../book/myPhotoProducts/myPhotoProducts.vue  | 168 +++++++++++++++---
 .../photoProductDetail/photoProductDetail.vue |   2 +-
 pages/book/photoProducts/photoProducts.vue    |   1 -
 .../component/clothesAttribute.vue            |  66 +++++--
 .../component/clothesAttributePlus.vue        |  56 ++++--
 pages/home/home.vue                           |   2 +-
 8 files changed, 378 insertions(+), 57 deletions(-)

diff --git a/api/request.ts b/api/request.ts
index e4616ea..07f68f1 100644
--- a/api/request.ts
+++ b/api/request.ts
@@ -6,4 +6,4 @@ export const domain = 'https://www.carboner.cn:8888/api'
 export const myIp = 'http://8.130.119.119:9092/api'
 export const nwct = 'https://winning-mouse-internally.ngrok-free.app/api'
 export const suiUrl = ''
-export const baseUrl = domain
+export const baseUrl = Url
diff --git a/pages/book/myPhotoProductDetail/myPhotoProductDetail.vue b/pages/book/myPhotoProductDetail/myPhotoProductDetail.vue
index c6b621c..4081573 100644
--- a/pages/book/myPhotoProductDetail/myPhotoProductDetail.vue
+++ b/pages/book/myPhotoProductDetail/myPhotoProductDetail.vue
@@ -1,27 +1,148 @@
 <template>
 	<view class="flex-col justify-start relative page" :style="{ backgroundImage: 'url(' + bkgUrl + ')'}">
 	  <image
-	    class="image pos"
-	    src="https://ide.code.fun/api/image?token=67dd8f7cdefdb1001119a623&name=06dd963dd45f6b4d3acf6fa059cd0ec6.png"
+	    class="image pos" mode="aspectFill"
+	    :src="publicPath + (isShow ? obj.introImg : obj.image)"
 	  />
 	  <view class="flex-col items-start section_2 pos_2">
-	    <text class="font text">汉服—曲裾系列</text>
-	    <text class="mt-20 font text_2">￥129/天</text>
+	    <text class="font text">{{ obj.name }}</text>
+	    <text class="mt-20 font text_2">￥{{ obj.price.toFixed(2) }}{{ isShow ? '起' : '/天' }}</text>
+	  </view>
+	  <view class="section_3 pos_3">
+		  <rich-text :nodes="obj.richText"></rich-text>
 	  </view>
-	  <view class="section_3 pos_3"></view>
 	  <view class="flex-col justify-start items-center section_4 pos_4">
-	    <view class="flex-col justify-start items-center text-wrapper"><text class="text_3">立即租赁</text></view>
+	    <view class="flex-col justify-start items-center text-wrapper" @click="openPopup"><text class="text_3">立即租赁</text></view>
 	  </view>
 	</view>
+	
+	<uni-popup ref="rent" :safe-area="false">
+		<view class="rent">
+			<clothesAttributeVue></clothesAttributeVue>
+		</view>
+	</uni-popup>
+	
+	
+	<uni-popup ref="book" :safe-area="false">
+		<view class="book">
+			<clothesAttributePlusVue></clothesAttributePlusVue>
+		</view>
+	</uni-popup>
+	
 </template>
 
 <script setup>
-	import {ref} from 'vue'
+	import {nextTick, onMounted, onUnmounted, ref} from 'vue'
+	import { baseUrl } from '../../../api/request';
 	import { bookUrl } from '../../../common/globalImagesUrl';
+	import { publicPath } from '../../../common/globalImagesUrl';
+	import { onLoad } from "@dcloudio/uni-app";
+	import clothesAttributeVue from '../../clothesRent/component/clothesAttribute.vue';
+	import clothesAttributePlusVue from '../../clothesRent/component/clothesAttributePlus.vue';
+	import emitter from '../../../utils/emitter';
+
+	const book = ref(null)
+	const rent = ref(null)
+	const cookie = wx.getStorageSync("cookie")  //请求头
 	const bkgUrl = ref(bookUrl + '/myPhotoProductDetail/bkg.png')
+	const isShow = ref(true)
+	const id = ref(0)
+	const obj = ref({})
+	
+	
+	const closeClothesAttributePopupHandler = () => {
+		nextTick(() => {
+			if (rent.value) {
+				rent.value.close()
+			}
+		})
+	}
+	
+	const closeClothesAttributePlusPopupHandler = () => {
+		nextTick(() => {
+			if (book.value) {
+				book.value.close()
+			}
+		})
+	}
+	
+	
+	onLoad((options) => {
+		id.value = JSON.parse(options.id)
+		isShow.value = JSON.parse(options.isShow)
+	})
+	
+	onMounted(() => {
+		if (isShow.value) {
+			getPhotoProductsById(id.value)
+		} else {
+			getClothesById(id.value)
+		}
+		emitter.on('closeClothesAttributePopup', closeClothesAttributePopupHandler)
+		
+		emitter.on('closeClothesAttributePlusPopup', closeClothesAttributePlusPopupHandler)
+	})
+	
+	onUnmounted(() => {
+		emitter.off('closeClothesAttributePopup', closeClothesAttributePopupHandler)
+		
+		emitter.off('closeClothesAttributePlusPopup', closeClothesAttributePlusPopupHandler)
+	})
+	
+	const getPhotoProductsById = async (val) => {
+		const res = await uni.request({
+			url: baseUrl + '/photoProducts/list/detail',
+			method: 'POST',
+			header: {
+				cookie
+			},
+			data: {
+				id: val
+			}
+		})
+		obj.value = res.data.data
+		console.log(obj.value)
+	}
+	
+	const getClothesById = async (val) => {
+		const res = await uni.request({
+			url: baseUrl + '/clothes/get/id',
+			method: 'POST',
+			header: {
+				cookie
+			},
+			data: {
+				id: val
+			}
+		})
+		obj.value = res.data.data
+		console.log(obj.value)
+	}
+	
+	const openPopup = () => {
+		if (isShow.value) {
+			emitter.emit('getPhotoProductsInfo', obj.value)
+			book.value.open('bottom')
+		} else {
+			emitter.emit('getClothesInfo', obj.value)
+			rent.value.open('bottom')
+		}
+	}
+	
 </script>
 
 <style scoped lang="scss">
+	
+.rent {
+	justify-content: center;
+	background-color: #fff;
+	border-radius: 20rpx 20rpx 0 0;	
+}
+.book {
+	justify-content: center;
+	background-color: #fff;
+	border-radius: 20rpx 20rpx 0 0;	
+}
 .page {
   background-color: #ffffff;
   background-size: 100% 100%;
@@ -68,9 +189,10 @@
   background-color: #ffffff;
   border-radius: 18.75rpx;
   width: 712.5rpx;
-  height: 913.13rpx;
+  height: auto;
 }
 .pos_3 {
+  padding: 40rpx;
   margin: 984.38rpx 18.75rpx 200rpx;
 }
 .section_4 {
diff --git a/pages/book/myPhotoProducts/myPhotoProducts.vue b/pages/book/myPhotoProducts/myPhotoProducts.vue
index 06baca4..a33f281 100644
--- a/pages/book/myPhotoProducts/myPhotoProducts.vue
+++ b/pages/book/myPhotoProducts/myPhotoProducts.vue
@@ -1,42 +1,43 @@
 <template>
 	<view class="flex-col justify-start relative page" :style="{ backgroundImage: 'url(' + bkgUrl + ')'}">
-	  <view class="flex-row equal-division">
-	    <view class="flex-col items-center group equal-division-item">
+	  <view class="flex-row equal-division flex-box">
+	    <view class="flex-col items-center group equal-division-item" @click="changeSelectedStatus(true)">
 	      <image
 	        class="image"
-	        :src="bookUrl + '/myPhotoProducts/xz-gl.png'"
+	        :src="xzUrl"
 	      />
-	      <text class="font text mt-10">写真预约</text>
+	      <text class="font text mt-10" :style="xzColor">写真预约</text>
 	    </view>
-	    <view class="flex-col items-center group equal-division-item">
+	    <view class="flex-col items-center group equal-division-item" @click="changeSelectedStatus(false)">
 	      <image
 	        class="image"
-	        :src="bookUrl + '/myPhotoProducts/fz.png'"
+	        :src="fzUrl"
 	      />
-	      <text class="font text_2 mt-10">服装租赁</text>
+	      <text class="font text_2 mt-10" :style="fzColor">服装租赁</text>
 	    </view>
 	  </view>
 	  <view class="divider pos"></view>
 	  <view class="section_2 pos_2"></view>
 	  <view class="flex-col pos_3">
 	    <view
-	      class="flex-col justify-start items-center text-wrapper_1 list-item mt-19"
-	      v-for="(item, index) in items"
+	      class="flex-col justify-start items-center text-wrapper_1 list-item mt-19" 
+	      v-for="(item, index) in typeList"  @click="isSelected(item, index)" :style="asideStyle[index]"
 	      :key="index"
 	    >
-	      <text class="font_2 text_11">入门款</text>
+	      <text class="font_2 text_11">{{ item }}</text>
 	    </view>
 	  </view>
 	  <view class="flex-col group_2 pos_4">
-	    <view class="flex-row justify-between list-item_2 mt-12" v-for="(item, index) in items_1" :key="index">
+	    <view class="flex-row justify-between list-item_2 mt-12" @click="gotoDetailPage(item.id)"
+		v-for="(item, index) in pointItemList" :key="index">
 	      <view class="flex-row">
 	        <image
-	          class="image_2"
-	          src="https://ide.code.fun/api/image?token=67dd8f7cdefdb1001119a623&name=44f1a80f5d889d8ec63f758b61082674.png"
+	          class="image_2" mode="aspectFill"
+	          :src="publicPath + (isShow ? item.introImg : item.image)"
 	        />
 	        <view class="flex-col items-start ml-7">
-	          <text class="font_2 text_9">汉服—曲裾系列</text>
-	          <text class="font_2 text_10 mt-50">129元起</text>
+	          <text class="font_2 text_9">{{ item.name }}</text>
+	          <text class="font_2 text_10 mt-50">{{ item.price.toFixed(2) }}元{{ isShow ? '起' : '/天' }}</text>
 	        </view>
 	      </view>
 	      <view class="flex-col justify-start items-center self-start text-wrapper_2">
@@ -48,14 +49,131 @@
 </template>
 
 <script setup>
-	import {ref} from 'vue'
+	import {onMounted, ref} from 'vue'
 	import { bookUrl } from '../../../common/globalImagesUrl';
+	import { baseUrl } from '../../../api/request';
+	import { publicPath } from '../../../common/globalImagesUrl';
+	
+	const cookie = wx.getStorageSync("cookie")  //请求头
 	const bkgUrl = ref(bookUrl + '/myPhotoProducts/bkg.png')
-	const items = ref([null, null, null])
-	const items_1 = ref([null, null, null])
+	const xzgl = bookUrl + '/myPhotoProducts/xz-gl.png'
+	const xz = bookUrl + '/myPhotoProducts/xz.png'
+	const fzgl = bookUrl + '/myPhotoProducts/fz-gl.png'
+	const fz = bookUrl + '/myPhotoProducts/fz.png'
+	
+	const xzUrl = ref(xzgl)
+	const fzUrl = ref(fz)
+	const isShow = ref(true)
+	let clothesMap = null
+	let photoProductsMap = null
+	let pointMap = ref(null)
+	let typeList = ref(null)
+	let pointItemList = ref(null)
+	let pointIdx = ref(0)
+	const asideStyle = ref([])
+	const xzColor = ref({ color: '#C35C5D', fontSize: '38.75rpx;', fontWeight: 'bold' })
+	const fzColor = ref({ color: '#323232', fontSize: '33.75rpx;', fontWeight: 'normal' })
+	
+	onMounted(() => {
+		getAllData()
+	})
+	
+	const getAllData = async () => {
+		const res = await uni.request({
+			url: baseUrl + '/global/getAllProducts',
+			method: 'GET',
+			header: {
+				cookie
+			}
+		})
+		clothesMap = Object.entries(res.data.data['clothesMap'])
+		photoProductsMap = Object.entries(res.data.data['photoProductsMap'])
+		pointMap.value = photoProductsMap
+		typeList.value = pointMap.value.map(item => item[0])
+		pointItemList.value = pointMap.value[0][1]
+		asideStyle.value = Array(typeList.value.length).fill(null).map(() => ({
+			backgroundColor: '#FBDEDF'
+		}))
+		asideStyle.value[0].backgroundColor = '#FFB6B9'
+	}
+	
+	
+	
+	
+	const changeSelectedStatus = (val) => {
+		if (isShow.value && !val) {
+			xzUrl.value = xz
+			fzUrl.value = fzgl
+			isShow.value = !isShow.value
+			
+			pointMap.value = clothesMap
+			typeList.value = pointMap.value.map(item => item[0])
+			pointItemList.value = pointMap.value[0][1]
+			
+			pointIdx.value = 0
+			asideStyle.value[0].backgroundColor = '#FFB6B9'
+			for (var i = 1; i < asideStyle.value.length; i ++ ) {
+				asideStyle.value[i].backgroundColor = '#FBDEDF'
+			}
+			
+			xzColor.value = { color: '#323232', fontSize: '33.75rpx;', fontWeight: 'normal' }
+			fzColor.value = { color: '#C35C5D', fontSize: '38.75rpx;', fontWeight: 'bold' }
+		} 
+		if (!isShow.value && val) {
+			xzUrl.value = xzgl
+			fzUrl.value = fz
+			isShow.value = !isShow.value
+			
+			pointMap.value = photoProductsMap
+			typeList.value = pointMap.value.map(item => item[0])
+			pointItemList.value = pointMap.value[0][1]
+			
+			pointIdx.value = 0
+			asideStyle.value[0].backgroundColor = '#FFB6B9'
+			for (var i = 1; i < asideStyle.value.length; i ++ ) {
+				asideStyle.value[i].backgroundColor = '#FBDEDF'
+			}
+			xzColor.value = { color: '#C35C5D', fontSize: '38.75rpx;', fontWeight: 'bold' }
+			fzColor.value = { color: '#323232', fontSize: '33.75rpx;', fontWeight: 'normal' }
+		}
+	}
+	
+	
+	const isSelected = (item, index) => {
+		if (pointIdx.value === index) return 
+		pointIdx.value = index
+		for (var i = 0; i < asideStyle.value.length; i ++ ) {
+			if (i == index) {
+				asideStyle.value[i].backgroundColor = '#FFB6B9'
+			} else {
+				asideStyle.value[i].backgroundColor = '#FBDEDF'
+			}
+		}
+		pointItemList.value = pointMap.value[pointIdx.value][1]
+	}
+	
+	
+	const gotoDetailPage = (val) => {
+		uni.navigateTo({
+			url: '/pages/book/myPhotoProductDetail/myPhotoProductDetail?isShow=' + isShow.value + '&id=' + val
+		})
+	}
+	
+
+	
+	 
+	
+	
 </script>
 
 <style scoped lang="scss">
+::-webkit-scrollbar {
+  display: none;  /* 隐藏滚动条 */
+}
+.flex-box {
+	display: flex;
+	justify-content: space-around;
+}
 .mt-19 {
   margin-top: 35.63rpx;
 }
@@ -77,7 +195,7 @@
   top: 18.13rpx;
 }
 .group {
-  flex: 1 1 350.63rpx;
+  // flex: 1 1 350.63rpx;
 }
 .equal-division-item {
   padding: 7.31rpx 0 9.99rpx;
@@ -109,20 +227,23 @@
   top: 280.31rpx;
 }
 .section_2 {
-  background-color: #ffffff96;
+  background-color: #fff;
   border-radius: 18.75rpx 18.75rpx 0rpx 0rpx;
   width: 159.38rpx;
-  height: 1198.13rpx;
 }
 .pos_2 {
   position: absolute;
   left: 0;
   top: 309.38rpx;
+  bottom: 0;
 }
 .pos_3 {
   position: absolute;
   left: 0;
   top: 309.38rpx;
+  bottom: 0;
+  overflow-y: auto;
+  padding-bottom: 40rpx;
 }
 .text-wrapper_1 {
   padding: 60.38rpx 0 60.11rpx;
@@ -149,9 +270,12 @@
   position: absolute;
   right: 16.88rpx;
   top: 309.38rpx;
+  bottom: 0;
+  overflow-y: auto;
+  padding-bottom: 40rpx;
 }
 .list-item_2 {
-  padding: 13.13rpx 16.88rpx 12.58rpx;
+  padding: 18.13rpx 19.88rpx 17.58rpx;
   background-color: #ffffff;
   border-radius: 18.75rpx;
 }
diff --git a/pages/book/photoProductDetail/photoProductDetail.vue b/pages/book/photoProductDetail/photoProductDetail.vue
index d1e127a..f9b997a 100644
--- a/pages/book/photoProductDetail/photoProductDetail.vue
+++ b/pages/book/photoProductDetail/photoProductDetail.vue
@@ -72,7 +72,7 @@
 	const bookingSelected = ref(null)
 	const obj = ref({})
 	const type = ref('')
-	const bookingDateVOList =ref([])
+	const bookingDateVOList = ref([])
 	const bkgUrl = ref(bookUrl + '/photoProductDetail/bkg.png')
 	
 	onLoad((options) => {
diff --git a/pages/book/photoProducts/photoProducts.vue b/pages/book/photoProducts/photoProducts.vue
index 3e9bfb7..0e86b40 100644
--- a/pages/book/photoProducts/photoProducts.vue
+++ b/pages/book/photoProducts/photoProducts.vue
@@ -81,7 +81,6 @@
 	})
 	
 	onMounted( async () => {
-		getFonts()
 		await getAllCategory()
 		await getPhotoProductsByCategoryId(categoryName.value)
 		getSpecialIds()
diff --git a/pages/clothesRent/component/clothesAttribute.vue b/pages/clothesRent/component/clothesAttribute.vue
index 3cebbec..ee8b558 100644
--- a/pages/clothesRent/component/clothesAttribute.vue
+++ b/pages/clothesRent/component/clothesAttribute.vue
@@ -3,31 +3,32 @@
 	  <view class="flex-row justify-between group">
 	    <text class="font text">请选择租赁天数</text>
 	    <image
+		  @click="closePopup"
 	      class="image"
 	      :src="clothesRentUrl + '/component/cha.png'"
 	    />
 	  </view>
 	  <view class="flex-row items-center group view">
 	    <image
-	      class="image_2"
-	      src="https://ide.code.fun/api/image?token=67dd57af4ae84d00122a84d1&name=ef8fd08c2a91d3833c648cd64691f68d.png"
+	      class="image_2" mode="aspectFill"
+	      :src="publicPath + clothesInfo.image"
 	    />
 	    <view class="flex-col items-start flex-1 ml-13">
-	      <text class="font_2 text_2">淡雅古风衣淡雅古风衣淡雅古风衣淡</text>
-	      <text class="mt-48 font_2 text_3">￥129.00</text>
+	      <text class="font_2 text_2">{{ clothesInfo.name }}</text>
+	      <text class="mt-48 font_2 text_3">￥{{ clothesInfo.price.toFixed(2) }}</text>
 	    </view>
 	  </view>
 	  <view class="flex-row justify-between items-center group_2 view_2">
 	    <text class="font">租赁天数</text>
 	    <view class="flex-row">
-	      <view class="flex-col justify-start items-center image-wrapper">
+	      <view class="flex-col justify-start items-center image-wrapper" @click="sub">
 	        <image
 	          class="image_3"
 	          :src="clothesRentUrl + '/component/sub.png'"
 	        />
 	      </view>
-	      <view class="ml-2 flex-col justify-start items-center text-wrapper"><text class="text_4">2</text></view>
-	      <view class="ml-2 flex-col justify-start items-center image-wrapper_2">
+	      <view class="ml-2 flex-col justify-start items-center text-wrapper"><text class="text_4">{{ cnt }}</text></view>
+	      <view class="ml-2 flex-col justify-start items-center image-wrapper_2" @click="add">
 	        <image
 	          class="image_3"
 	          :src="clothesRentUrl + '/component/add.png'"
@@ -40,7 +41,7 @@
 	    <view class="flex-col justify-start items-start relative group_3">
 	      <view class="group_4"></view>
 	      <text class="font text_5 pos">定金：</text>
-	      <text class="font text_6 pos_2">￥129.00</text>
+	      <text class="font text_6 pos_2">￥{{ totalAmount.toFixed(2) }}</text>
 	    </view>
 	    <view class="flex-col justify-start items-center text-wrapper_2"><text class="text_7">确定</text></view>
 	  </view>
@@ -48,8 +49,44 @@
 </template>
 
 <script setup>
-	import {ref} from 'vue' 
+	import {onMounted, onUnmounted, ref} from 'vue' 
 	import { clothesRentUrl } from '../../../common/globalImagesUrl';
+	import emitter from '../../../utils/emitter';
+	import { publicPath } from '../../../common/globalImagesUrl';
+	const clothesInfo = ref({})
+	const cnt = ref(1)
+	let singleAmount = 0
+	const totalAmount = ref(0)
+	const sub = () => {
+		if (cnt.value > 1) {
+			cnt.value --
+			totalAmount.value = singleAmount * cnt.value
+		} 
+	}
+	const add = () => {
+		if (cnt.value < clothesInfo.value.period) {
+			cnt.value ++
+			totalAmount.value = singleAmount * cnt.value
+		}
+	}
+	
+	const closePopup = () => {
+		emitter.emit('closeClothesAttributePopup')
+	}
+	
+	const getClothesInfoHandler = (val) => {
+		clothesInfo.value = val
+		singleAmount = val.price
+		totalAmount.value = singleAmount * cnt.value
+	}
+	
+	onMounted(() => {
+		emitter.on('getClothesInfo', getClothesInfoHandler)
+	})
+	
+	onUnmounted(() => {
+		emitter.off('getClothesInfo', getClothesInfoHandler)
+	})
 	
 </script>
 
@@ -65,9 +102,11 @@
 	  overflow-y: auto;
 	  overflow-x: hidden;
 	  height: 100%;
+	  border-radius: 20rpx 20rpx 0 0;	
 	}
 	.group {
 	  padding: 0 22.5rpx;
+	  position: relative;
 	}
 	.font {
 	  font-size: 37.5rpx;
@@ -97,10 +136,14 @@
 	  color: #323232;
 	}
 	.text_2 {
+	  position: absolute;
+	  top: 0;
 	  line-height: 41.25rpx;
 	  width: 369.38rpx;
 	}
 	.text_3 {
+	  position: absolute;
+	  bottom: 0;
 	  margin-left: 7.5rpx;
 	  line-height: 22.54rpx;
 	}
@@ -150,12 +193,11 @@
 	}
 	.group_3 {
 	  margin-top: 18.75rpx;
-	  width: 254.23rpx;
 	}
 	.group_4 {
 	  margin-left: 22.5rpx;
 	  border-radius: 9.38rpx 9.38rpx 0 0;
-	  width: 123.75rpx;
+	  width: 60vw;
 	  height: 89.06rpx;
 	}
 	.text_5 {
@@ -172,7 +214,7 @@
 	}
 	.pos_2 {
 	  position: absolute;
-	  right: 0;
+	  left: 100rpx;
 	  top: 9.17rpx;
 	}
 	.text-wrapper_2 {
diff --git a/pages/clothesRent/component/clothesAttributePlus.vue b/pages/clothesRent/component/clothesAttributePlus.vue
index a11e5d8..a32ab11 100644
--- a/pages/clothesRent/component/clothesAttributePlus.vue
+++ b/pages/clothesRent/component/clothesAttributePlus.vue
@@ -4,18 +4,19 @@
 	    <view class="flex-row justify-between self-stretch">
 	      <text class="font text">请选择产品规格</text>
 	      <image
+		    @click="closePopup"
 	        class="image"
 	        :src="clothesRentUrl + '/component/cha.png'"
 	      />
 	    </view>
 	    <view class="flex-row self-stretch group_2">
 	      <image
-	        class="shrink-0 image_2"
-	        src="https://ide.code.fun/api/image?token=67dd8f7cdefdb1001119a623&name=ef8fd08c2a91d3833c648cd64691f68d.png"
+	        class="shrink-0 image_2" mode="aspectFill"
+	        :src="publicPath + photoProductsInfo.introImg"
 	      />
 	      <view class="flex-col shrink-0 group_3 ml-13">
-	        <text class="self-stretch font_2 text_2">淡雅古风衣淡雅古风衣淡雅古风衣淡</text>
-	        <text class="mt-48 self-start font_2 text_3">￥129.00</text>
+	        <text class="self-stretch font_2 text_2">{{ photoProductsInfo.name }}</text>
+	        <text class="mt-48 self-start font_2 text_3">￥{{ photoProductsInfo.price.toFixed(2) }}</text>
 	      </view>
 	    </view>
 	    <view class="flex-col self-stretch">
@@ -24,10 +25,10 @@
 	        <text class="font_2 text_4 pos">妆造服务</text>
 	      </view>
 	      <view class="flex-row">
-	        <view class="flex-col justify-start items-center text-wrapper">
+	        <view :style="styleObj1" class="flex-col justify-start items-center text-wrapper" @click="selectStatus1(true)">
 	          <text class="font_3 text_5">本店上妆</text>
 	        </view>
-	        <view class="flex-col justify-start items-center text-wrapper ml-17">
+	        <view :style="styleObj2" class="flex-col justify-start items-center text-wrapper ml-17" @click="selectStatus(false)">
 	          <text class="font_3 text_6">无需妆造</text>
 	        </view>
 	      </view>
@@ -59,7 +60,7 @@
 	  <view class="flex-row justify-between items-center group_5">
 	    <view class="flex-row items-baseline">
 	      <text class="font text_9">定金：</text>
-	      <text class="font text_10">￥129.00</text>
+	      <text class="font text_10">￥{{ photoProductsInfo.price.toFixed(2) }}</text>
 	    </view>
 	    <view class="flex-col justify-start items-center text-wrapper_2"><text class="text_11">确定</text></view>
 	  </view>
@@ -67,6 +68,38 @@
 </template>
 
 <script setup>
+	import {onMounted, onUnmounted, ref} from 'vue'
+	import { clothesRentUrl } from '../../../common/globalImagesUrl';
+	import emitter from '../../../utils/emitter';
+	import { publicPath } from '../../../common/globalImagesUrl';
+	let style1 = { color: '#323232', borderColor: '#C3C3C3', backgroundColor: '#fff' }
+	let style2 = { color: '#E79EA1', borderColor: '#FFB6B9', backgroundColor: '#FBDEDF'}
+	const photoProductsInfo = ref({})
+	const styleObj1 = ref({})
+	const styleObj2 = ref({})
+	let point = -1
+	
+	const closePopup = () => {
+		emitter.emit('closeClothesAttributePlusPopup')
+	}
+	const getPhotoProductsInfoHandler = (val) => {
+		console.log(val)
+		photoProductsInfo.value = val
+	}
+	
+	const selectStatus = (val) => {
+		if (val && point ) {
+			 
+		}
+	}
+	
+	onMounted(() => {
+		emitter.on('getPhotoProductsInfo', getPhotoProductsInfoHandler)
+	})
+	
+	onUnmounted(() => {
+		emitter.off('getPhotoProductsInfo', getPhotoProductsInfoHandler)
+	})
 	
 </script>
 
@@ -89,6 +122,7 @@
 	  overflow-y: auto;
 	  overflow-x: hidden;
 	  height: 100%;
+	  border-radius: 20rpx 20rpx 0 0;	
 	}
 	.group {
 	  padding: 37.5rpx 22.5rpx;
@@ -117,6 +151,7 @@
 	  height: 200.63rpx;
 	}
 	.group_3 {
+	  position: relative;
 	  margin-right: 112.5rpx;
 	  margin-bottom: 7.5rpx;
 	  width: 369.38rpx;
@@ -133,6 +168,8 @@
 	.text_3 {
 	  margin-left: 7.5rpx;
 	  line-height: 22.54rpx;
+	  position: absolute;
+	  bottom: 0;
 	}
 	.group_4 {
 	  margin-left: 26.25rpx;
@@ -155,10 +192,7 @@
 	  border-radius: 37.5rpx;
 	  width: 159.38rpx;
 	  height: 54.38rpx;
-	  border-left: solid 1.88rpx #c3c3c3;
-	  border-right: solid 1.88rpx #c3c3c3;
-	  border-top: solid 1.88rpx #c3c3c3;
-	  border-bottom: solid 1.88rpx #c3c3c3;
+	  border: solid 1.88rpx #c3c3c3;
 	}
 	.font_3 {
 	  font-size: 26.25rpx;
diff --git a/pages/home/home.vue b/pages/home/home.vue
index 3c3fd6f..8356d5e 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -88,7 +88,7 @@ const getMyUser = async () =>{
 }
 const jump_xiezhen =()=>{  //跳转写真预约
 	uni.navigateTo({
-		url: '/pages/book/photoProducts/photoProducts'
+		url: '/pages/book/myPhotoProducts/myPhotoProducts'
 	})
 }
 const jump_feiyi =()=>{   //跳转非遗工坊