wangguoyu 2 ماه پیش
والد
کامیت
c54b37e3d0
2فایلهای تغییر یافته به همراه80 افزوده شده و 16 حذف شده
  1. 51 12
      components/customMap/customMap.vue
  2. 29 4
      pages/admin/Jiazheng/gerenZiliao.vue

+ 51 - 12
components/customMap/customMap.vue

@@ -1,31 +1,58 @@
 <template>
 	<view>
+		<view class="icon-title-navBar-box">
+			<view @click="goUpPage" class="nav-bar-icon"></view>
+			<text class="nav-bar-title">选择地址</text>
+		</view>
+		<!-- 查询职业 -->
+		<view class="phone-search-box">
+			<input class="search-input" placeholder="请输入地址" v-model="data.keyword" />
+			<view class="search-icon" @click="handleClick">
+				<uni-icons type="search" size="24" color="#fff"></uni-icons>
+			</view>
+		</view>
 		<map style="width: 100%; height: 300px;" :latitude="data.latitude" :longitude="data.longitude"
 			:markers="data.covers" :show-location="true"> </map>
-			<input type="text" v-model="data.keyword" placeholder="请输入地址" style="padding: 10px 0">
-			
-			<view>{{result && result.data.data}}</view>
-			
-			<button @click="handleClick">查询</button>
+		<view  v-if="result"  v-for="(item,index) in result.data.data" key="index">
+			<view @click="xuanzeAdress(item)">
+				<view :class="index==0?'xxxactive':''" >{{item.title}}</view>
+				<view>{{item.address}}</view>
+			</view>
+
+		</view>
 	</view>
 </template>
 
 <script setup>
 	import {
-		reactive,ref
+		reactive,
+		ref
 	} from "vue"
 	import myIcon from "@/static/images/common/markIcon.png"
+
 	import {
-		onLoad, onHide, onShow
+		onLoad,
+		onHide,
+		onShow
 	} from "@dcloudio/uni-app"
-	import {useCustomMap} from "@/components/customMap/useMap.js"
-	const { getPositionSearchByKeyword } = useCustomMap();
-	
+	import {
+		useCustomMap
+	} from "@/components/customMap/useMap.js"
+
+	const emits = defineEmits(['close', 'xuanzeAdress'])
+	const {
+		getPositionSearchByKeyword
+	} = useCustomMap();
+
 	const result = ref(null);
-	
+
 	function handleClick() {
 		if (data.keyword) {
-			getPositionSearchByKeyword(data.keyword, `nearby(${data.latitude},${data.longitude},1000)`,  onSuccess, onError, {page:1, size:3,})
+			getPositionSearchByKeyword(data.keyword, `nearby(${data.latitude},${data.longitude},1000)`, onSuccess,
+				onError, {
+					page: 1,
+					size: 3,
+				})
 		}
 	}
 
@@ -33,10 +60,22 @@
 		console.log('数据', data);
 		result.value = data
 	}
+
 	function onError(err) {
 		console.log('错误', err)
 	}
 
+	function goUpPage(err) {
+		console.log('错误', err)
+		emits('close');
+
+	}
+	function xuanzeAdress(item) {
+		console.log('item');
+		emits('xuanzeAdress',item.address);
+
+	}
+
 	const data = reactive({
 		keyword: '', // 关键字
 		id: 0, // 使用 marker点击事件 需要填写id

+ 29 - 4
pages/admin/Jiazheng/gerenZiliao.vue

@@ -77,9 +77,19 @@
 				@change="selectChangeHunyinList" />
 		</view>
 
-		<view class="form-label-input form-top-margin flex-start-row">
+
+	<view class="form-label-select">
 			<view class="phone-form-label"><text class="form-label-require"></text>通讯地址</view>
-			<textarea v-model="formData.juzhuDizhi" placeholder="请输入通讯地址" class="form-textarea-box" />
+			<view>{{formData.juzhuDizhi}}</view>
+			<view @click="openMap">点击</view>
+		<!-- 	<picker :range="shuxiangList" mode='selector' :value="formData.shuxiangIndex" range-key="name"
+				@change="shuxiangChange" @cancel="shuxiangCancel" class="select-picker-box">
+				<view class="form-radio-select">
+					<view>{{ formData.juzhuDizhi  }}</view>
+					<icon></icon>
+				</view>
+			</picker> -->
+				<icon></icon>
 		</view>
 
 		<view class="form-label-select">
@@ -121,12 +131,16 @@
 			<button type="default" v-if="status =='add'" @click="goNext" class="phone-green-btn">下一步</button>
 			<button type="default" v-if="status =='edit'" @click="editSave" class="phone-green-btn">保存</button>
 		</view>
+		<uni-popup  ref="popupMap" background-color="#fff" :is-mask-click="false" :mask-click="false" >
+				<customMap  style="100vh" @xuanzeAdress="xuanzeAdress" @close="mapClose"></customMap>
+		</uni-popup>
 	</view>
 </template>
 
 <script>
 	import dataChecked from './common/dataChecked.vue';
 	import jiazhengUpload from "./common/jiazhengUpload.vue"
+	import customMap from "@/components/customMap/customMap.vue"
 	import {
 		getJiazhengXueli,
 		getJiazhengHunyin,
@@ -139,7 +153,8 @@
 	export default {
 		components: {
 			dataChecked,
-			jiazhengUpload
+			jiazhengUpload,
+			customMap
 		},
 		props: {
 			status: {
@@ -209,7 +224,17 @@
 			this.initRequests()
 		},
 		methods: {
-
+			xuanzeAdress(data){
+				console.log('data',data);
+				this.formData.juzhuDizhi = data
+				this.mapClose()
+			},
+			openMap(){
+				this.$refs.popupMap.open('bottom')
+			},
+			mapClose(){
+				this.$refs.popupMap.close()
+			},
 			async initRequests() {
 				try {
 					await Promise.all([