chore: 警情动态无数据弹窗完成

app/src/assets/css/main.css

@@ -72,4 +72,10 @@ html,body {
 }
 
 
+.el-date-editor  .el-range-input,.el-range-separator {
+  color: #fff !important;
+}
 
+.el-date-table td.in-range div, .el-date-table td.in-range div:hover, .el-date-table.is-week-mode .el-date-table__row.current div, .el-date-table.is-week-mode .el-date-table__row:hover div {
+  background-color: rgba(0,213,255, 0.3) !important;
+}

app/src/views/Home/components/AlarmingSituationDynamics/AlaemList.vue

@@ -29,7 +29,6 @@
 				<span class="result1">处置状态</span>
 				<span class="result2">报警时间</span>
 			</div>
-			<!-- <VueSeamlessScroll :data="list" :class-option="classOption" class="warp" hoverStop> -->
 			<div class="" style="height: 100vh;overflow: auto;">
 				<ul class="item">
 					<div v-for="(item, index) in czztList" :key="index">
@@ -52,7 +51,6 @@
 					</div>
 				</ul>
 			</div>
-			<!-- </VueSeamlessScroll> -->
 		</div>
 	</div>
 </template>
@@ -105,7 +103,6 @@
 			};
 		},
 		components: {
-			// VueSeamlessScroll,
 		},
 		computed: {
 			classOption() {
@@ -114,7 +111,24 @@
 				};
 			},
 		},
-		props: ['list', 'pId'],
+		props: ['list', 'pId', 'selectTimes'],
+    watch: {
+      list: {
+        handler(data) {
+          this.czztList = data
+        },
+        deep: true
+      },
+      selectTimes: {
+        handler(data) {
+          if (data.length === 1) {
+            this.times = [new Date(data[0]), new Date(data[0])]
+          } else if (data.length === 2) {
+            this.times = [new Date(data[0]), new Date(data[1])]
+          }
+        }
+      }
+    },
 		methods: {
 			searchTab() {
         let tempTimes = []
@@ -123,7 +137,7 @@
         } else {
           tempTimes = this.times.map(item => moment(item).format('YYYY-MM-DD'))
         }
-
+        
 				const params = {
 					pageSize: 100,
 					pageNum: 1,
@@ -136,6 +150,11 @@
 					this.czztList = res.data.rows
 				})
 			},
+      resetData() {
+        this.times = []
+        this.value = ""
+        this.search = ""
+      },
 			tab(id) {
 				this.id = id;
 				this.$emit('callback', id);
@@ -155,12 +174,19 @@
 				this.type = Number(this.$route.query.type)
 			}
 
+      if (this.selectTimes.length === 1) {
+        this.times = [new Date(this.selectTimes[0]), new Date(this.selectTimes[0])]
+      } else if (this.selectTimes.length === 2) {
+        this.times = [new Date(this.selectTimes[0]), new Date(this.selectTimes[1])]
+      }
+
 			this.searchTab()
 		}
 	};
 </script>
 
 <style scoped lang="less">
+
 	::-webkit-scrollbar {
 			border-radius: 3px;
 		width: 8px;
@@ -191,9 +217,6 @@
 			color: #fff;
 		}
 
-    ::v-deep(.el-range-input) {
-      color: '#fff';
-    }
 
 		::v-deep(.el-button) {
 			border: none;

app/src/views/Home/components/AlarmingSituationDynamics/ModalContent.vue

@@ -2,7 +2,7 @@
 	<div style="padding: 0px; display: flex; justify-content: space-between">
 		<div>
 			<border-panel height="350px" width="540px" style="margin-bottom: 6px" :headerType="3" title="警情列表">
-				<AlaemList :list="bjxxList" v-if="bjxxList && bjxxList.length > 0" @callback="callback" :pId="pId" />
+				<AlaemList :selectTimes="selectTimes" :list="bjxxList" v-if="bjxxList && bjxxList.length > 0" @callback="callback" :pId="pId" />
 			</border-panel>
 			<border-panel height="593px" width="540px" style="margin-bottom: 6px" :headerType="3" title="出动力量">
 				<MobilizeStrength style="width: 518px;" :list="cdxxList" :zlxx="zlxx" :hcws="hcws" />
@@ -28,7 +28,6 @@
 	import UnitInfo from "@/views/PoliceSituation/components/UnitInfo.vue";
 	import Map from "@/components/Map.vue";
 	import {
-		getBjxx,
 		geTzl,
 		getCdllxx,
 		getHcws,
@@ -38,8 +37,17 @@
 		getFxyhxx,
 		getZhd,
 	} from "@/api/jqdt.js";
+  import {
+		getJumpList
+	} from '@/api/index.js'
 	export default {
 		name: "ModalContent",
+    props: {
+      selectTimes: {
+        type: Array,
+        default: () => []
+      }
+    },
 		components: {
 			Map,
 			AlaemList,
@@ -69,6 +77,14 @@
 				mapData: null,
 			};
 		},
+    watch: {
+      selectTimes: {
+        handler() {
+          this.getList()
+        },
+        deep: true
+      }
+    },
 		methods: {
 			getMapData() {
 				// console.log(this.params.id);
@@ -154,9 +170,9 @@
 			getList() {
 				const params1 = {
 					pageSize: 10000,
-					pageNum: 1,
+					pageNum: 1
 				};
-				getBjxx(params1).then((res) => {
+				getJumpList(params1).then((res) => {
 					let list = res.data.rows;
 					if (this.pId) {
 						list = list.filter((p) => p.id !== this.pId);

app/src/views/Home/components/AlarmingSituationDynamics/index.vue

@@ -34,7 +34,7 @@
 			<div>{{ item.type }}</div>
 		</div>
     <basic-modal  top="0px" width="100%"  name="历史警情查询" ref="alarmingSituationDynamics">
-      <ModalContent></ModalContent>
+      <ModalContent :selectTimes="times"></ModalContent>
     </basic-modal>
 	</div>
 </template>
@@ -44,6 +44,7 @@
 	import VueSeamlessScroll from "vue-seamless-scroll";
 	import { getJqdtListWithZero } from '@/api/index'
 	import ModalContent from './ModalContent.vue'
+  import moment from "moment";
 	export default {
 		props: {
 			PoliceList: {
@@ -73,7 +74,8 @@
 						type: '本月',
 						con: 0
 					}
-				]
+				],
+        times: []
 			};
 		},
 		watch: {
@@ -111,6 +113,19 @@
 				})
 			},
 			onClickHandler(idx) {
+        const date = new Date()
+        if (idx === 0) {
+          this.times = [moment(date).format("YYYY-MM-DD")]
+        } else if(idx === 1) {
+          this.times = [
+            moment(date).weekday(1).format("YYYY-MM-DD"),
+            moment(date).weekday(7).format("YYYY-MM-DD")
+        ]
+        } else if(idx === 2) {
+          this.times = [
+          moment(date).startOf("month").format("YYYY-MM-DD"),
+          moment(date).endOf('month').format("YYYY-MM-DD")]
+        }
         this.showModal("alarmingSituationDynamics")
 			}
 		},