客户页面

pages/admin/Hetong/components/fuWuNeiRong.vue

@@ -1,9 +1,9 @@
 <template>
-	<uni-collapse class="sfht-collapse-box" @change="handleChange">
+	<uni-collapse ref="collapse" class="sfht-collapse-box" @change="handleChange">
 		<uni-collapse-item title="服务内容" :open="true">
 			
 			<jiawuItemVue></jiawuItemVue>
-			
+			<haiziNianlingVue @change="onChange"></haiziNianlingVue>
 			
 			
 			
@@ -13,10 +13,24 @@
 
 <script setup>
 	import jiawuItemVue from './jiawuItem.vue';
+	import haiziNianlingVue from './haiziNianling.vue';
+	import {ref} from "vue"
+	
 	const emits = defineEmits(['change'])
+	
+	const collapse= ref(null)
+	
+	
 	function handleChange() {
 		emits('change')
 	}
+	
+	function onChange() {
+		setTimeout(() => {
+			collapse.value && collapse.value.resize();
+			emits('change')
+		}, 300)
+	}
 </script>
 
 

pages/admin/Hetong/components/haiziNianling.vue

@@ -1,16 +1,67 @@
 <template>
-	<view>
-		<template >
-			
-		</template>
-		<view>孩子年龄</view>
-		<uni-easyinput v-model="data.hetong.lxName" placeholder="请输入住房面积" />
+	年龄：{{myData.children}}
+	<view v-for="(item,index) in myData.children" :key="item.timer">
+		<view><text v-if="index == 0">孩子年龄</text></view>
+		<uni-easyinput v-model="item.age" placeholder="请输入孩子年龄" @change="onChange" />
+		<button @click="handleAdd" v-if="myData.children.length == 1">+</button>
+		<button @click="handleAdd"
+			v-else-if="myData.children.length-1 == index && myData.children.length != 1 && myData.children.length<3">+</button>
+		<button @click="handleDelete(item.timer)" v-else>-</button>
 	</view>
 </template>
 
-<script>
-	
-	
+<script setup>
+	import {
+		computed,
+		reactive,
+		watch,
+		watchEffect
+	} from "vue"
+	import {
+		useHetong
+	} from "../useHetong.js"
+	const {
+		injectHetong
+	} = useHetong();
+
+	const data = injectHetong()
+
+	const emits = defineEmits(['change'])
+
+	const myData = reactive({
+		children: []
+	})
+
+	watchEffect(() => {
+		const list = data.hetong.qzHzNianliang && data.hetong.qzHzNianliang.split(',').map((item,index) => ({
+			age: item,
+			timer: new Date().getTime()+index
+		}));
+		myData.children = list.length ? list : [{
+			age: '',
+			timer: new Date().getTime()
+		}]
+	})
+
+	function onChange() {
+		data.hetong.qzHzNianliang = myData.children.map(item => item.age).join(',')
+	}
+
+	function handleAdd() {
+		myData.children.push({
+			age: '',
+			timer: new Date().getTime()
+		});
+		data.hetong.qzHzNianliang = myData.children.map(item => item.age).join(',')
+		emits('change')
+	}
+
+	function handleDelete(timer) {
+		console.log('timer', timer)
+		myData.children = myData.children.filter(item => item.timer != timer)
+		data.hetong.qzHzNianliang = myData.children.map(item => item.age).join(',')
+		emits('change')
+	}
 </script>
 
 <style>