~admin/srs-police-affairs.git

			@@ -7,13 +7,45 @@
			<div class="rightBor"></div>
			</div>
			<div class="timeTab">
			<span class="beforetime" :class="{ choosed: timetype == 0 }" @click="timeTabClick(0)">近一周</span>
			<span>/</span>
			<span class="beforetime" :class="{ choosed: timetype == 1 }" @click="timeTabClick(1)">近一月</span>
			<span class="beforetime" :class="{ choosed: timetype == 0 }" @click="timeTabClick(0)">周</span>
			<span class="beforetime" :class="{ choosed: timetype == 1 }" @click="timeTabClick(1)">月</span>
			</div>
			</div>

			<div class="body" ref="tableBox">
			<ul>
			<li style="color: #fff; background: rgb(1, 76, 137);">
			<span class="num">序号</span>
			<span class="type">警情类别</span>
			<span class="comingPhone">报警电话</span>
			<span class="dealTime">接警时间</span>
			<span class="dealPolice">经办民警</span>
			<span class="callPeople">报警人</span>
			<span class="callPhone">报警人联系人</span>
			<span class="callContent">报警内容</span>
			</li>
			</ul>
			<vue-seamless-scroll :data="timetype == 0 ? pliceSituationWeekArr : pliceSituationMouthArr" class="warp"
			:style="{
			height: currentTableHeight - 44 + 'px', width: '100%'
			}">
			<ul class="item">
			<li v-for="(item, index) in (timetype == 0 ? pliceSituationWeekArr : pliceSituationMouthArr)"
			:key="index">
			<span class="num" v-text="item.num"></span>
			<span class="type" v-text="item.type"></span>
			<span class="comingPhone" v-text="item.comingPhone"></span>
			<span class="dealTime" v-text="item.dealTime"></span>
			<span class="dealPolice" v-text="item.dealPolice"></span>
			<span class="callPeople" v-text="item.callPeople"></span>
			<span class="callPhone" v-text="item.callPhone"></span>
			<span class="callContent" v-text="item.callContent"></span>
			</li>
			</ul>
			</vue-seamless-scroll>
			</div>

			<!-- <div class="body" ref="tableBox">
			<el-table :data="timetype == 0 ? pliceSituationWeekArr : pliceSituationMouthArr" style="width: 100%"
			:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
			:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" :row-class-name="tableRowClassName"
			@@ -27,12 +59,13 @@
			<el-table-column prop="callPhone" label="报警人联系人"></el-table-column>
			<el-table-column prop="callContent" label="报警内容"></el-table-column>
			</el-table>
			</div>
			</div> -->
			</div>
			</template>

			<script>
			let interTime
			import vueSeamlessScroll from 'vue-seamless-scroll'

			export default {
			data () {
			@@ -44,6 +77,10 @@
			{ 'num': '3', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-09', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '4', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-12', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '5', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '6', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '7', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '8', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			{ 'num': '9', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手' },
			],
			pliceSituationMouthArr: [
			{ 'num': '1', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-01', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			@@ -51,15 +88,22 @@
			{ 'num': '3', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-13', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '4', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-20', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '5', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '6', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '7', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '8', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			{ 'num': '9', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手' },
			],
			currentTableHeight: 0,

			}
			},

			components: {
			vueSeamlessScroll
			},

			mounted () {
			this.$nextTick(() => {
			this.tableScroll()
			// this.tableScroll()
			this.setDomStyle()
			})

			@@ -103,6 +147,7 @@
			width: 100%;

			.header {
			position: relative;
			width: 100%;
			height: 36px;

			@@ -140,10 +185,20 @@
			}

			.timeTab {
			float: right;
			width: 20%;
			height: 36px;
			line-height: 36px;
			position: absolute;
			top: 10px;
			right: 10px;
			display: flex;
			border-radius: 6px;
			overflow: hidden;

			span {
			width: 42px;
			height: 26px;
			text-align: center;
			line-height: 26px;
			background: rgb(1, 76, 137);
			}

			.beforetime {
			color: rgb(98, 95, 95);
			@@ -166,6 +221,61 @@
			height: calc(100% - 56px);

			/* 解决自定义滚动条 x 轴显示问题 */
			.warp {
			margin: 0 auto;
			overflow: hidden;
			}

			ul {

			li {
			height: 44px;
			line-height: 44px;
			display: flex;

			.num {
			width: 8%;
			}

			.type {
			width: 10%;
			}

			.comingPhone {
			width: 14%;
			}

			.dealTime {
			width: 12%;
			}

			.dealPolice {
			width: 12%;
			}

			.callPeople {
			width: 12%;
			}

			.callPhone {
			width: 14%;
			}

			.callContent {
			flex: 1;
			}
			}

			li:nth-child(2n) {
			background: rgba(20, 50, 123, 1.0);
			color: #fff !important;
			}

			li:nth-child(2n-1) {
			background: rgba(29, 38, 105, 1.0);
			color: #fff;
			}
			}
			}
			}
			</style>