拉取代码

components/IncidentListFilter.vue

@@ -21,7 +21,7 @@
 
       <view class="area" @click="clickPageRouter('area')">
         <text class="name">楼栋</text>
-        <text class="value ellipsis">{{searchData.area ? searchData.area.buildingName : ''}}</text>
+        <text class="value ellipsis">{{searchData.areaName.length>0 ? searchData.areaName.join('/') : ''}}</text>
       </view>
 
       <view class="category">
@@ -63,12 +63,18 @@
       </view>
 
       <scroll-view scroll-y class="areas">
-        <view class="areas_item" v-for="area in pageData.areaList" :key="area.id" @click="clickArea(area)">{{area.buildingName}}</view>
+				<view class="view-box">
+					<view class="areas_item" v-for="area in pageData.areaList"
+					:key="area.id" @click="clickAreaItem(area)" 
+					:class="searchData.selectBuildingId.indexOf(area.id)!=-1 ? 'ActiveClass': ''"
+					>{{area.buildingName}}</view>
+				</view>
       </scroll-view>
     </view>
     <view class="container_foot">
       <view class="foot_btns">
         <view class="cancel" @click="clickPageRouter('default')">取消</view>
+				<view class="cancel submit" @click="clickArea()">确定</view>
       </view>
     </view>
   </view>
@@ -133,21 +139,24 @@
     pageRouter: 'default',
     areaList: [],
     categoryList: [],
-		deptList:[]
+		deptList:[],
+		selectBuildingList:[],
   });
-
+	
 	// 是否开启跨科查看
 	const showDept = ref(false);
 
   const searchData = reactive({
     hospital: {},
     selected: 'todoingAll',
-    area: {id: 0, area: '全部'},
+    area: [],
     category: {},
 		categoryValue:{},
     acceptDate: [],
 		dept: {},
-		deptValue: {}
+		deptValue: {},
+		selectBuildingId:[],
+		areaName:[]
   })
 
   // 显示登记时间
@@ -165,11 +174,29 @@
   function clickTab(tab){
     searchData.selected = tab.value;
   }
-
-  // 点击区域
-  function clickArea(area){
+	
+	// 点击区域
+	function clickAreaItem(item){
+		let index = searchData.selectBuildingId.indexOf(item.id)
+		if(index==-1){
+			pageData.selectBuildingList.push(item)
+		}else{
+			pageData.selectBuildingList.splice(index, 1)
+		}
+		searchData.selectBuildingId = pageData.selectBuildingList.map(i=>{
+			return i.id
+		})
+		// console.log(998998,searchData.selectBuildingId)
+	}
+	
+  // 选中楼栋
+  function clickArea(){
     pageData.pageRouter = 'default';
-    searchData.area = area;
+    searchData.area = pageData.selectBuildingList
+		searchData.areaName = []
+		pageData.selectBuildingList.forEach(i=>{
+			searchData.areaName.push(i.buildingName)
+		})
   }
 
   // 点击故障现象
@@ -182,7 +209,7 @@
   function clear(){
     setHospital();
     searchData.selected = 'todoingAll';
-    searchData.area = {id: 0, area: '全部'};
+    searchData.area = [];
     searchData.category = {};
     searchData.acceptDate = [];
 		searchData.categoryValue = {};
@@ -270,7 +297,8 @@
 		  .then((res) => {
 				uni.hideLoading();
 		    let list = res.list || [];
-		    pageData.areaList = [{ id: 0, area: '全部' }, ...list];
+				pageData.areaList = list;
+		    // pageData.areaList = [{ id: 0, area: '全部' }, ...list];
 		  });
   }
 
@@ -361,8 +389,18 @@
 		let data = loginUserStore.loginUser.infoPermission
 		pageData.deptList = data.dutyList
     setHospital();
+		// console.log(999,evt)
     searchData.selected = evt.selected;
     searchData.area = evt.area;
+		if(evt.area && evt.area.length>0){
+			pageData.selectBuildingList = evt.area
+			searchData.selectBuildingId = []
+			searchData.areaName = []
+			evt.area.forEach(i=>{
+				searchData.selectBuildingId.push(i.id)
+				searchData.areaName.push(i.buildingName)
+			})
+		}
     searchData.category = evt.category;
 		searchData.categoryValue = evt.categoryValue;
     searchData.acceptDate = evt.acceptDate;
@@ -436,12 +474,30 @@
   .areas{
     flex: 1;
     min-height: 0;
-    margin-top: 16rpx;
+    margin-top: 20rpx;
+		padding-top: 20rpx;
     background-color: #fff;
-    .areas_item{
-      padding: 24rpx;
-      border-bottom: 1rpx solid #DEDEDE;
-    }
+		.view-box{
+			display: flex; 
+			flex-wrap: wrap;
+			.areas_item{
+				width: 30%;
+				height: 80rpx;
+				background: #F6F6F6;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				border-radius: 10rpx;
+				margin: 0 10rpx 20rpx 10rpx;
+			}
+			.ActiveClass{
+				background: #FFEAE7;
+				color: #D95D4D;
+				border: 1px solid #A13728;
+				box-sizing: border-box;
+			}
+		}
+    
   }
 
   .categorys{
@@ -530,6 +586,10 @@
         display: flex;
         justify-content: center;
       }
+			.submit{
+				color: #49b856;
+				border-left: 1px solid #BFBFBF;
+			}
       .confirm{
         flex: 1;
         font-size: 32rpx;

pages/incidentList/incidentList.vue

@@ -370,10 +370,12 @@
       postData.incident.acceptDateEnd = format(endOfDay(dataInfo.evtFilter.acceptDate[1]), 'yyyy-MM-dd HH:mm:ss');
     }
 
-    if(dataInfo.evtFilter && dataInfo.evtFilter.area && dataInfo.evtFilter.area.id){
-			let id = dataInfo.evtFilter.area.id
+    if(dataInfo.evtFilter && dataInfo.evtFilter.area && dataInfo.evtFilter.area.length>0){
+			let id = dataInfo.evtFilter.area.map(i=>{
+				return i.id
+			})
 			// postData.incident.area = dataInfo.evtFilter.area
-			postData.incident.area = {id:id}
+			postData.incident.areas = id.join(',')
     }
 
     incidentListSearchStore.setIncidentListSearchData(dataInfo);