呼叫管理

2024-04-22 14:09:42 +08:00
parent f09e688c1f
commit 915e468d26
3 changed files with 224 additions and 102 deletions
--- a/pages/manage/call-manage.vue
+++ b/pages/manage/call-manage.vue
@@ -11,13 +11,23 @@
 			<view class="zd_wrapper">
 				<view class="zd-row mgb20 border-bottom">
 					<uni-icons type="arrow-up" size="18" color="#ff6a00"></uni-icons>
-					<view class="zd-col-6 item-font-2">任务起点</view>
-					<view class="zd-col-16 item-font-1">{{sCode}}</view>
+					<view class="zd-col-6 filter_label">任务起点</view>
+					<view class="zd-col-18 relative">
+						<input type="text" class="filter_input" v-model="sCode" @input="matchData(1)">
+						<view v-if="filterNo ===1 && filteredData.length" class="filter_select_wraper">
+							<view class="filter_select_item" v-for="(e, i) in filteredData" :key="'ul'+ i" @tap.stop="sCode = e.device_code,filteredData = []">{{e.device_code}}</view>
+						</view>
+					</view>
 				</view>
 				<view class="zd-row">
 					<uni-icons type="arrow-down" size="18" color="#ff6a00"></uni-icons>
-					<view class="zd-col-6 item-font-2">任务终点</view>
-					<view class="zd-col-16 item-font-1">{{nCode}}</view>
+					<view class="zd-col-6 filter_label">任务终点</view>
+					<view class="zd-col-18 relative">
+						<input type="text" class="filter_input" v-model="nCode" @input="matchData(2)">
+						<view v-if="filterNo ===2 && filteredData.length" class="filter_select_wraper">
+							<view class="filter_select_item" v-for="(e, i) in filteredData" :key="'ul'+ i" @tap.stop="nCode = e.device_code,filteredData = []">{{e.device_code}}</view>
+						</view>
+					</view>
 				</view>
 			</view>
 			<view class="zd_wrapper">
@@ -47,9 +57,9 @@
 			<view class="zd-row jccenter">
 				<uni-icons type="map-pin-ellipse" size="18" color="#fff"></uni-icons>
 			</view>
-			<view class="zd-row pop_point_content">
-				<view class="zd-col-11 item-font-6 bggreen" @tap="getstartcode">任务起点</view>
-				<view class="zd-col-11 item-font-6 bgblue" @tap="getnextcode">任务终点</view>
+			<view class="zd-row pop_point_content" :class="{'pop_point_content_up': this.popup}">
+				<view class="zd-col-11 item-font-6 bggreen" @tap="popCode(1)">任务起点</view>
+				<view class="zd-col-11 item-font-6 bgblue" @tap="popCode(2)">任务终点</view>
 			</view>
 		</view>
 		<view v-if="show" class="msg_mask" @tap="colsePop"></view>
@@ -75,16 +85,55 @@
 				nCode: '',
 				show: false,
 				distanceToTop: -300,
-				distanceToLeft: -300
+				distanceToLeft: -300,
+				windowHeight: '',
+				popHeight: '',
+				filteredData: [],
+				filterNo: '',
+				popup: false
 			};
 		},
 		onLoad (options) {
 			this.title = options.title
+			uni.getSystemInfo({
+			  success: (info) => {
+				this.windowHeight = info.windowHeight
+			  }
+			})
+		},
+		onReady () {
+			const query = uni.createSelectorQuery().in(this)
+			query
+			.select('.pop_point_content')
+			.boundingClientRect(data => {
+				this.popHeight = data.height
+			}).exec()
 		},
 		created () {
 			this.initArea()
 		},
 		methods: {
+			matchData (no) {
+				this.filterNo = no
+				let query = ''
+				switch (no) {
+					case 1:
+						query = this.sCode.toLowerCase()
+						break
+					case 2:
+						query = this.nCode.toLowerCase()
+						break
+					default:
+						break
+				}
+				if (!query) {
+					this.filteredData = []
+					return
+				}
+				this.filteredData = this.pointArr.filter(item => {
+					return item.device_code.toLowerCase().includes(query)
+				})
+			},
 			async initArea () {
 				let res = await queryArea()
 				this.areaArr = [...res.data]
@@ -111,6 +160,12 @@
 					if (data) {
 						this.distanceToTop = data.top + (data.height / 2) - 9
 						this.distanceToLeft = data.left
+						console.log(this.popHeight)
+						if ((this.windowHeight - this.distanceToTop) < (this.popHeight + 20)) {
+							this.popup = true
+						} else {
+							this.popup = false
+						}
 					}
 				}).exec()
 				this.show = true
@@ -123,23 +178,18 @@
 					this.distanceToLeft = -300
 				}
 			},
-			getstartcode () {
-				if (this.nCode !== '' && this.nCode === this.code) {
-					this.nCode = ''
-				} 
-				this.sCode = this.code
-				this.show = false
-				this.distanceToTop = -300
-				this.distanceToLeft = -300
-			},
-			getnextcode () {
-				if (this.sCode !== '' && this.sCode === this.code) {
-					this.sCode = ''
+			popCode (code) {
+				switch (code) {
+					case 1:
+						this.sCode = this.code
+						break
+					case 2:
+						this.nCode = this.code
+						break
+					default:
+						break
 				}
-				this.nCode = this.code
-				this.show = false
-				this.distanceToTop = -300
-				this.distanceToLeft = -300
+				this.colsePop()
 			},
 			/** 清空点位选择 */
 			cancle () {
@@ -149,7 +199,15 @@
 			},
 			async _callTask (type) {
 				this.disabled = true
-				if (this.sCode === '' || nCode === '') {
+				if (this.sCode === '' || this.nCode === '') {
+					this.disabled = false
+					return
+				}
+				if (this.sCode === this.nCode) {
+					uni.showToast({
+						title: '任务起点终点不能相同',
+						icon: 'none'
+					})
 					this.disabled = false
 					return
 				}
@@ -174,8 +232,12 @@
 	}
 </script>

-<style lang="stylus">
+<style lang="stylus" scoped>
@import '../../common/style/mixin.styl';
 .item-font-6
 	color #fff
+.filter_label
+	padding-left 0
+.pop_point_content_up
+	top -200rpx
 </style>