sk před 1 rokem
rodič
revize
8965408293

+ 1 - 1
app/src/components/unit3D.vue

@@ -308,7 +308,7 @@ function getPie3D(pieData, internalDiameterRatio) {
   series.push(labelSeries);
   // 准备待返回的配置项,把准备好的 legendData、series 传入。
   const option = {
-    color: ["#1162fe", "#3fc865", "#a8fce3", "#5ef8c9", "#5ed3f8", "#5e92f8"],
+    color: [ "#FC2626", "#1162fe", "#F4F85E", "#FF7A00", "#5ef8c9", "#5e92f8"],
     legend: {
       // type: "scroll",
       data: ["有管理单位(物业)", "有管理单位(非物业)", "居民自主管理", "街道社区代管", "其他管理形式", "无管理主体"],

+ 163 - 147
app/src/views/Fire/components/Construction.vue

@@ -1,50 +1,42 @@
 <template>
-  <div>
-    <div class="unit" @click="showHunit(3)">
-      <span class="unit-c" >管理主体</span>
-      <div class="unit-num" v-for="(item,index) in glztList" :key="index" @click="showHunit" >
-        <div >
-          <LinearText
-            style="display: inline-block"
-            :text="item.sl"
-            fontSize="28px"
-          ></LinearText>
-          <span>家</span>
-        </div>
-        <div>{{ item.sfzddw}}</div>
-      </div>
-      <!-- <div class="unit-num">
-        <div>
-          <LinearText
-            style="display: inline-block"
-            text="1223"
-            fontSize="32px"
-          ></LinearText>
-          <span>家</span>
-        </div>
-        <div>重点单位</div>
-      </div> -->
-    </div>
-    <div class="unit-echats" @click="showHunit(1)">
-      <div class="unit-g">
-        管理形式
-        <unit3D :fierList="fierList" />
-      </div>
-    </div>
-    <div class="unit maintenance" @click="showHunit(2)">
-      <span class="unit-w">维保形式</span>
-      <div class="unit-num" v-for="(item,index) in wbxsList" :key="index">
-        <div>
-          <LinearText
-            style="display: inline-block"
-            :text="item.sl"
-            fontSize="28px"
-          ></LinearText>
-          <span>家</span>
-        </div>
-        <div>{{ item.wbxs }}</div>
-      </div>
-      <!-- <div class="unit-num">
+	<div>
+		<div class="unit-echats" @click="showHunit(1)">
+			<div class="unit-g">
+				管理形式
+				<unit3D :fierList="fierList" />
+			</div>
+		</div>
+		<div class="unit maintenance">
+			<span class="unit-c">管理主体</span>
+			<div class="unit-num" v-for="(item,index) in glztList" :key="index" @click="showTab">
+				<div>
+					<LinearText style="display: inline-block" :text="item.sl" fontSize="28px"></LinearText>
+					<span>家</span>
+				</div>
+				<div>{{ item.sfzddw}}</div>
+			</div>
+			<!-- <div class="unit-num">
+		  <div>
+		    <LinearText
+		      style="display: inline-block"
+		      text="1223"
+		      fontSize="32px"
+		    ></LinearText>
+		    <span>家</span>
+		  </div>
+		  <div>重点单位</div>
+		</div> -->
+		</div>
+		<div class="unit" @click="showHunit(2)">
+			<span class="unit-w">消防设施维保形式</span>
+			<div class="unit-num" v-for="(item,index) in wbxsList" :key="index">
+				<div>
+					<LinearText style="display: inline-block" :text="item.sl" fontSize="28px"></LinearText>
+					<span>家</span>
+				</div>
+				<div>{{ item.wbxs }}</div>
+			</div>
+			<!-- <div class="unit-num">
         <div>
           <LinearText
             style="display: inline-block"
@@ -66,112 +58,136 @@
         </div>
         <div>无维保</div>
       </div> -->
-    </div>
-    
-    <!-- 弹窗 -->
-    <basic-modal top="120px" ref="higthModal" name="高层建筑管理">
-      <higthList :flag="flag" :qx="qx" />
-    </basic-modal>
-  </div>
+		</div>
+
+		<!-- 弹窗 -->
+		<basic-modal top="120px" ref="higthModal" name="高层建筑管理">
+			<higthList :flag="flag" :qx="qx" />
+		</basic-modal>
+		<basic-modal top="120px" ref="HistoryModal" name="管理单位查询">
+			<GldwModalContent :flag="flag" :qx="qx" />
+		</basic-modal>
+	</div>
 </template>
 
 <script>
-import unit3D from "@/components/unit3D.vue";
-import { gettotalGlxx } from "@/api/management.js";
-import higthList from "./higthList.vue";
-export default {
-  components: { unit3D,higthList },
-  props: {
-    qx: String,
-    glztList:Array,
-    wbxsList:Array,
-  
-  },
-  data() {
-    return {
-      fierList: [],
-      params: {
-        pageSize: 100,
-        pageNum: 1
-      },
-      flag:1
-    };
-  },
-  watch: {
-    qx() {
-      this.manageList()
-    }
-  },
-  methods:{
-    manageList() {
-      gettotalGlxx({...this.params, qx: this.qx === '重庆市' ? "" : this.qx}).then((res) => {
-        this.fierList = res.data.rows.map((item) => {
-          return {
-            name: item.xfaqglxs,
-            value: item.sl,
-          };
-        });
-      });
-    },
-    
-    // 弹窗
-    showHunit(val){
-      this.flag=val
-      this.showModal("higthModal");
+	import unit3D from "@/components/unit3D.vue";
+	import {
+		gettotalGlxx
+	} from "@/api/management.js";
+	import higthList from "./higthList.vue";
+	import GldwModalContent from "./GldwModalContent.vue";
+	export default {
+		components: {
+			unit3D,
+			higthList,
+			GldwModalContent
+		},
+		props: {
+			qx: String,
+			glztList: Array,
+			wbxsList: Array,
+
+		},
+		data() {
+			return {
+				fierList: [],
+				params: {
+					pageSize: 100,
+					pageNum: 1,
+				},
+				flag: 1
+			};
+		},
+		watch: {
+			qx() {
+				this.manageList()
+			}
+		},
+		methods: {
+			manageList() {
+				gettotalGlxx({
+					...this.params,
+					qx: this.qx === '重庆市' ? "" : this.qx
+				}).then((res) => {
+					this.fierList = res.data.rows.map((item) => {
+						return {
+							name: item.xfaqglxs,
+							value: item.sl,
+						};
+					});
+				});
+			},
+
+			// 弹窗
+			showHunit(val) {
+				this.flag = val
+				this.showModal("higthModal");
 
-    }
-  },
-  created() {
-    this.manageList();
-  },
-};
+			},
+			showTab() {
+				this.showModal("HistoryModal");
+
+			}
+		},
+		created() {
+			this.manageList();
+		},
+	};
 </script>
 
 <style lang="less" scoped>
-.unit {
-  display: flex;
-  margin: 5px 0 10px 10px;
-  font-size: 18px;
-  .unit-c {
-    display: inline-block;
-    margin: 25px 18px 0 0;
-  }
-  .unit-num {
-    width: 146px;
-    height: 72px;
-    margin: 10px 10px;
-    letter-spacing: 1px;
-    padding: 5px 0 0 0;
-    background-color: rgba(0, 163, 255, 0.3);
-    color: #fff;
-    text-align: center;
-    font-size: 16px;
-    line-height: 30px;
-    padding-top: 10px;
-    // 渐变
-    // .num {
-    //   font-size: 32px;
-    //   font-weight: 600;
-    //   color: rgb(105, 193, 208);
-    // }
-  }
-}
-.unit-echats {
-  height: 150px;
-}
-.unit-w {
-  width: 136px;
+	.unit {
+		display: flex;
+		margin: 5px 0 5px 10px;
+		font-size: 18px;
+
+		.unit-c {
+			display: inline-block;
+			margin: 25px 18px 0 0;
+		}
+
+		.unit-num {
+			width: 146px;
+			height: 72px;
+			margin: 10px 10px;
+			letter-spacing: 1px;
+			padding: 5px 0 0 0;
+			background-color: rgba(0, 163, 255, 0.3);
+			color: #fff;
+			text-align: center;
+			font-size: 16px;
+			line-height: 30px;
+			padding-top: 10px;
+			// 渐变
+			// .num {
+			//   font-size: 32px;
+			//   font-weight: 600;
+			//   color: rgb(105, 193, 208);
+			// }
+		}
+	}
+
+	.unit-echats {
+		height: 150px;
+	}
+
+	.unit-w {
+		width: 136px;
+
+	}
+
+	.unit-g {
+		font-size: 18px;
+		margin-left: 10px;
+		padding-top: 10px;
+	}
+
+	.maintenance {
+		margin-top: 37px;
 
-}
-.unit-g {
-  font-size: 18px;
-  margin-left: 10px;
-  padding-top: 10px;
-}
-.maintenance {
-  margin-top: 30px;
-  .unit-num{
-    width: 180px !important;
-  }
-}
-</style>
+		// .unit-num {
+		// 	width: 180px !important;
+		// }
+	}
+</style>

+ 322 - 0
app/src/views/Fire/components/GldwModalContent.vue

@@ -0,0 +1,322 @@
+<script>
+	import {
+		getRzdw
+	} from "@/api/detail.js";
+	import punishmentMixin from "@/mixin/unit.js";
+	export default {
+		name: "GldwModalContent",
+		mixins: [punishmentMixin],
+		data() {
+			return {
+				options: [],
+				fxdjList: [],
+				tableData: [],
+				unitList: [],
+				params: {
+					pageSize: 10,
+					pageNum: 1,
+					sfzddw: null,
+					gcjzmc: null,
+					dwmc: null,
+					rzxs: null,
+				},
+				total: 0,
+				search: "",
+			};
+		},
+		props: {
+			qy: String,
+			default: Object,
+			unitName: String
+		},
+		watch: {
+			default: {
+				handler() {
+					const params = JSON.parse(JSON.stringify(this.params));
+					params.gcjzmc = this.default.gcjzmc;
+					this.params = params;
+					this.funRzdwList();
+				},
+				immediate: true,
+				deep: true,
+			},
+			unitName: {
+				handler(val) {
+					if (val) {
+						this.params.dwmc = val
+						this.funRzdwList();
+					}
+				},
+				immediate: true,
+				deep: true,
+			},
+		},
+		methods: {
+			funRzdwList() {
+				getRzdw({
+					...this.params,
+				}).then((res) => {
+			       console.log(res,987);
+					this.tableData = res.data.rows;
+					this.total = res.data.total;
+				});
+			},
+			handleSizeChange(val) {
+				this.params.pageSize = val;
+				this.funRzdwList();
+			},
+			handleCurrentChange(val) {
+				this.params.pageNum = val;
+				this.funRzdwList();
+			},
+			resetForm() {
+				this.params = {
+					pageSize: 10,
+					pageNum: 1,
+					sfzddw: null,
+					gcjzmc: null,
+					dwmc: null,
+					rzxs: null,
+				};
+				this.funRzdwList();
+			},
+		},
+		mounted() {
+			console.log(this.default);
+			const params = JSON.parse(JSON.stringify(this.params));
+			params.gcjzmc = this.default.gcjzmc;
+			this.params = params;
+			console.log(this.params);
+			this.funRzdwList();
+		},
+	};
+</script>
+
+<template>
+	<div>
+		<!-- 搜索 -->
+		<div class="maintenance-supervision">
+			<div class="maintenance-supervision_header">
+				<el-form class="form" v-model="params">
+					<!-- 是否重点单位 -->
+					<el-form-item>
+						<el-select v-model="params.sfzddw" placeholder="是否重点单位">
+							<el-option :value="item.value" :label="item.label" v-for="(item, index) in glList"
+								:key="index">
+							</el-option>
+						</el-select>
+					</el-form-item>
+					<!-- 建筑名称 -->
+					<el-form-item>
+						<div class="inp">
+							<el-input v-model="params.gcjzmc" placeholder="建筑名称(模糊)"></el-input>
+						</div>
+					</el-form-item>
+					<!-- 单位名称 -->
+					<el-form-item>
+						<div class="inp">
+							<el-input v-model="params.dwmc" placeholder="单位名称(模糊)"></el-input>
+						</div>
+					</el-form-item>
+				</el-form>
+				<div class="btn-item">
+					<el-button @click="funRzdwList">搜索</el-button>
+					<el-button @click="resetForm">重置</el-button>
+				</div>
+			</div>
+		</div>
+
+		<basic-table :data="tableData" style="text-align: center">
+			<el-table-column type="index" label="序号" width="60"> </el-table-column>
+			<el-table-column prop="gcjzmc" label="高层建筑名称" width="180" show-overflow-tooltip>
+			</el-table-column>
+			<el-table-column prop="gcjzbh" label="高层建筑编号" show-overflow-tooltip min-width="120">
+			</el-table-column>
+			<el-table-column prop="jzszqx" label="建筑所在区县" show-overflow-tooltip>
+			</el-table-column>
+			<el-table-column prop="rzxs" label="入驻形式" show-overflow-tooltip>
+			</el-table-column>
+			<el-table-column prop="rzdwszlc" label="入驻单位所在楼层" show-overflow-tooltip align="center" width="100">
+			</el-table-column>
+			<el-table-column prop="dwmc" label="单位名称" show-overflow-tooltip min-width="180">
+			</el-table-column>
+			<el-table-column prop="xfaqfzr" label="消防安全负责人姓名" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="xfaqfzrsjh" label="消防安全负责人手机号" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="xfaqgly" label="消防安全管理员姓名" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="xfaqglysjh" label="消防安全管理员手机号" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="xfaqlxrxm" label="消防安全联系人姓名" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="xfaqlxrdh" label="消防安全联系人手机号" show-overflow-tooltip>
+			</el-table-column>
+
+			<el-table-column prop="sfzddw" label="是否重点单位" show-overflow-tooltip>
+			</el-table-column>
+		</basic-table>
+		<br />
+		<basic-pagination layout="->,prev, pager, next, sizes,jumper" :page-sizes="[10, 20, 50, 100]"
+			:page-size="params.pageSize" :current-page="params.PageNum" :total="total" @size-change="handleSizeChange"
+			@current-change="handleCurrentChange" />
+	</div>
+</template>
+
+<style scoped lang="less">
+	.maintenance-supervision {
+
+		// padding: 10px 10px 0px 20px;
+		::v-deep(.el-input__inner) {
+			border: none;
+			background: linear-gradient(360deg,
+					rgba(0, 148, 255, 0.5) 0%,
+					rgba(0, 148, 255, 0.31) 100%);
+			color: #fff;
+		}
+
+		::v-deep(.el-button) {
+			border: none;
+			background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
+			color: #fff;
+		}
+
+		.maintenance-supervision_header {
+			width: 70%;
+			height: 60px;
+			display: flex;
+			flex-wrap: wrap;
+			// justify-content: space-between;
+			// border-bottom: 1px solid #154956;
+			padding-bottom: 10px;
+			font-size: 12px;
+			color: rgb(79, 149, 186);
+			// .select-item{
+			//   margin-right: 20px;
+			// }
+		}
+
+		.btn-item {
+			margin-top: 4px;
+
+		}
+
+		.warp {
+			height: 520px;
+			margin: 0 auto;
+			overflow: hidden;
+
+			.item {
+				list-style: none;
+				padding: 0;
+				margin: 0 auto;
+				cursor: pointer;
+			}
+		}
+
+		/deep/.el-input__inner {
+			background-color: #184254;
+			width: 150px;
+			height: 30px;
+			margin-bottom: 5px;
+		}
+
+		/deep/.el-button {
+			width: 100px;
+			height: 32px;
+			font-size: 14px;
+			line-height: 2px;
+			// margin: 0 20px 0 30px;
+			color: #fff;
+			border-radius: 5px;
+			border: none;
+		}
+
+		/deep/.el-button:hover {
+			color: rgb(80, 147, 224);
+		}
+
+		/deep/.select_btn {
+			position: absolute;
+			top: 225px;
+			right: 320px;
+			//下拉框
+		}
+
+		/deep/.el-input {
+			width: 150px;
+			// margin-left: 20px;
+		}
+
+		.header {
+			color: #fff;
+			height: 33px !important;
+			line-height: 33px !important;
+			background-color: rgba(0, 163, 255, 0.3) !important;
+			color: #61dbff;
+			margin-top: 15px;
+			margin-bottom: 6px;
+		}
+
+		.row,
+		li,
+		a {
+			display: block;
+			height: 39px;
+			line-height: 39px;
+			margin-bottom: 4px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			font-size: 16px;
+			background-color: rgba(0, 0, 0, 0.2);
+
+			.time,
+			.num,
+			.person,
+			.result {
+				flex: 0.33;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+
+			.num {
+				flex: 0.15;
+			}
+		}
+
+		.inp {
+			margin-left: 20px;
+		}
+	}
+
+	.unit-bulid {
+		display: flex;
+		justify-content: space-between;
+		margin-bottom: 20px;
+		font-size: 18px;
+	}
+
+	.unit-num {
+		width: 200px;
+		height: 109px;
+		border: 1px solid #0463a7;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-items: center;
+		line-height: 59px;
+	}
+
+	.form {
+		// flex-grow: 1;
+		margin-right: 40px;
+		display: flex;
+	}
+</style>

+ 331 - 357
app/src/views/Fire/components/UnitInfo.vue

@@ -1,391 +1,365 @@
 <template>
-  <div class="maintenance-supervision">
-    <div class="maintenance-supervision_header">
-      <el-input v-model="search" placeholder="建筑名称"></el-input>
-      <div>
-        <el-select v-model="value" placeholder="管理形式">
-          <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
-          </el-option>
-        </el-select>
-      </div>
+	<div class="maintenance-supervision">
+		<div class="maintenance-supervision_header">
+			<el-input v-model="search" placeholder="建筑名称"></el-input>
+			<div>
+				<el-select v-model="value" placeholder="管理形式">
+					<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+					</el-option>
+				</el-select>
+			</div>
 
-      <el-button @click="getZjglList">搜索</el-button>
-      <el-button @click="colos">重置</el-button>
-    </div>
-    <div v-if="checked === 0">
-      <div class="row header">
-        <span class="num">序号</span>
-        <span class="time">建筑名称</span>
-        <span class="person">管理形式</span>
-        <span class="result">管理单位</span>
-      </div>
-      <VueSeamlessScroll
-        :data="ZjglList"
-        :class-option="classOption"
-        class="warp"
-      >
-        <ul class="item">
-          <li
-            class="row"
-            v-for="(item, index) in ZjglList"
-            :key="index"
-            @click="ToUnitInfo(item)"
-          >
-            <span class="num">{{ index + 1 }}</span>
-            <span class="time">{{ item.gcjzmc }}</span>
-            <span class="person">{{ item.xfaqglxs }}</span>
-            <span
-              class="result"
-              :style="{
+			<el-button @click="getZjglList">搜索</el-button>
+			<el-button @click="colos">重置</el-button>
+		</div>
+		<div v-if="checked === 0">
+			<div class="row header">
+				<span class="num">序号</span>
+				<span class="time">建筑名称</span>
+				<span class="person">管理形式</span>
+				<span class="result">管理单位</span>
+			</div>
+			<VueSeamlessScroll :data="ZjglList" :class-option="classOption" class="warp">
+				<ul class="item">
+					<li class="row" v-for="(item, index) in ZjglList" :key="index" @click="ToUnitInfo(item)">
+						<span class="num">{{ index + 1 }}</span>
+						<span class="time">{{ item.gcjzmc }}</span>
+						<span class="person">{{ item.xfaqglxs }}</span>
+						<span class="result" :style="{
                 color: resultType(item.glzthztjzd),
-              }"
-              >{{ item.glzthztjzd }}</span
-            >
-          </li>
-        </ul>
-      </VueSeamlessScroll>
-    </div>
+              }">{{ item.glzthztjzd }}</span>
+					</li>
+				</ul>
+			</VueSeamlessScroll>
+		</div>
 
-    <div v-if="checked === 1">
-      <div class="row header">
-        <span class="time">检查结束事件</span>
-        <span class="person">执法机构</span>
-        <span class="result">检查结果</span>
-      </div>
-      <VueSeamlessScroll :data="list2" :class-option="classOption" class="warp">
-        <ul class="item">
-          <li class="row" v-for="(item, index) in list2" :key="index">
-            <span class="time">{{ item[0] }}</span>
-            <span class="person">{{ item[1] }}</span>
-            <span
-              class="result"
-              :style="{
+		<div v-if="checked === 1">
+			<div class="row header">
+				<span class="time">检查结束事件</span>
+				<span class="person">执法机构</span>
+				<span class="result">检查结果</span>
+			</div>
+			<VueSeamlessScroll :data="list2" :class-option="classOption" class="warp">
+				<ul class="item">
+					<li class="row" v-for="(item, index) in list2" :key="index">
+						<span class="time">{{ item[0] }}</span>
+						<span class="person">{{ item[1] }}</span>
+						<span class="result" :style="{
                 color: resultType(item[2]),
-              }"
-              >{{ item[2] }}</span
-            >
-          </li>
-        </ul>
-      </VueSeamlessScroll>
-    </div>
-    <div v-if="checked === 2">
-      <div class="row header">
-        <span class="time">登记事件</span>
-        <span class="person">排查人员</span>
-        <span class="result">是否存在隐患</span>
-      </div>
-      <VueSeamlessScroll :data="list3" :class-option="classOption" class="warp">
-        <ul class="item">
-          <li class="row" v-for="(item, index) in list3" :key="index">
-            <span class="time">{{ item[0] }}</span>
-            <span class="person">{{ item[1] }}</span>
-            <span
-              class="result"
-              :style="{
+              }">{{ item[2] }}</span>
+					</li>
+				</ul>
+			</VueSeamlessScroll>
+		</div>
+		<div v-if="checked === 2">
+			<div class="row header">
+				<span class="time">登记事件</span>
+				<span class="person">排查人员</span>
+				<span class="result">是否存在隐患</span>
+			</div>
+			<VueSeamlessScroll :data="list3" :class-option="classOption" class="warp">
+				<ul class="item">
+					<li class="row" v-for="(item, index) in list3" :key="index">
+						<span class="time">{{ item[0] }}</span>
+						<span class="person">{{ item[1] }}</span>
+						<span class="result" :style="{
                 color: resultType(item[2]),
-              }"
-              >{{ item[2] }}</span
-            >
-          </li>
-        </ul>
-      </VueSeamlessScroll>
-    </div>
-    <div v-if="checked === 3">
-      <div class="row header">
-        <span class="time">检查时间</span>
-        <span class="person">检查人</span>
-        <span class="result">检查结果</span>
-      </div>
-      <VueSeamlessScroll :data="list4" :class-option="classOption" class="warp">
-        <ul class="item">
-          <li class="row" v-for="(item, index) in list4" :key="index">
-            <span class="time">{{ item[0] }}</span>
-            <span class="person ellipsis">{{ item[1] }}</span>
-            <span class="result ellipsis">{{ item[2] }}</span>
-          </li>
-        </ul>
-      </VueSeamlessScroll>
-    </div>
-  </div>
+              }">{{ item[2] }}</span>
+					</li>
+				</ul>
+			</VueSeamlessScroll>
+		</div>
+		<div v-if="checked === 3">
+			<div class="row header">
+				<span class="time">检查时间</span>
+				<span class="person">检查人</span>
+				<span class="result">检查结果</span>
+			</div>
+			<VueSeamlessScroll :data="list4" :class-option="classOption" class="warp">
+				<ul class="item">
+					<li class="row" v-for="(item, index) in list4" :key="index">
+						<span class="time">{{ item[0] }}</span>
+						<span class="person ellipsis">{{ item[1] }}</span>
+						<span class="result ellipsis">{{ item[2] }}</span>
+					</li>
+				</ul>
+			</VueSeamlessScroll>
+		</div>
+	</div>
 </template>
 <script>
-import VueSeamlessScroll from "vue-seamless-scroll";
-import { getZjgldwxx } from "@/api/management.js";
-export default {
-  name: "MaintenanceSupervision",
-  data() {
-    return {
-      ZjglList: [],
-      search: "",
-      options: [
-        {
-          value: "有管理单位(物业)",
-          label: "有管理单位 (物业)",
-        },
-        {
-          value: "有管理单位(非物业)",
-          label: "有管理单位 (非物业)",
-        },
-        {
-          value: "居民自主管理",
-          label: "居民自主管理",
-        },
-        {
-          value: "街道社区代表",
-          label: "街道社区代表",
-        },
-        {
-          value: "其他",
-          label: "其他",
-        },
-        {
-          value: "无管理主体",
-          label: "无管理主体",
-        },
-      ],
-      value: "",
-      checked: 0,
-    };
-  },
-  props: {
-    qx: String,
-  },
-  components: {
-    VueSeamlessScroll,
-  },
-  computed: {
-    classOption() {
-      return {
-        singleHeight: 43,
-      };
-    },
-  },
-  watch: {
-    qx() {
-      this.getZjglList();
-    },
-  },
-  methods: {
-    colos() {
-      this.search = "";
-      this.value = "";
-      this.getZjglList();
-    },
-    change(idx) {
-      this.checked = idx;
-    },
-    resultType(text) {
-      return {
-        合格: "#23f59d",
-        不合格: "#df575b",
-        是: "#23f59d",
-        否: "#df575b",
-      }[text];
-    },
-    // 管理单位信息
-    getZjglList() {
-      const params = {
-        pageSize: 100,
-        pageNum: 1,
-        qx: this.qx === "重庆市" ? "" : this.qx,
-        gcjzmc: this.search,
-        xfaqglxs: this.value,
-      };
-      getZjgldwxx(params).then((res) => {
-        this.ZjglList = res.data.rows;
-      });
-    },
-    // 跳转独栋(目前未加ID)
-    ToUnitInfo(item) {
-      console.log(item);
-      return;
-      this.$router.push(`/detail?id=${item.jzid}`);
-    },
-  },
-  created() {
-    this.getZjglList();
-  },
-};
+	import VueSeamlessScroll from "vue-seamless-scroll";
+	import {
+		getZjgldwxx
+	} from "@/api/management.js";
+	export default {
+		name: "MaintenanceSupervision",
+		data() {
+			return {
+				ZjglList: [],
+				search: "",
+				options: [{
+						value: "有管理单位(物业)",
+						label: "有管理单位 (物业)",
+					},
+					{
+						value: "有管理单位(非物业)",
+						label: "有管理单位 (非物业)",
+					},
+					{
+						value: "居民自主管理",
+						label: "居民自主管理",
+					},
+					{
+						value: "街道社区代表",
+						label: "街道社区代表",
+					},
+					{
+						value: "其他",
+						label: "其他",
+					},
+					{
+						value: "无管理主体",
+						label: "无管理主体",
+					},
+				],
+				value: "",
+				checked: 0,
+			};
+		},
+		props: {
+			qx: String,
+		},
+		components: {
+			VueSeamlessScroll,
+		},
+		computed: {
+			classOption() {
+				return {
+					singleHeight: 43,
+				};
+			},
+		},
+		watch: {
+			qx() {
+				this.getZjglList();
+			},
+		},
+		methods: {
+			colos() {
+				this.search = "";
+				this.value = "";
+				this.getZjglList();
+			},
+			change(idx) {
+				this.checked = idx;
+			},
+			resultType(text) {
+				return {
+					合格: "#23f59d",
+					不合格: "#df575b",
+					是: "#23f59d",
+					否: "#df575b",
+				} [text];
+			},
+			// 管理单位信息
+			getZjglList() {
+				const params = {
+					pageSize: 100,
+					pageNum: 1,
+					qx: this.qx === "重庆市" ? "" : this.qx,
+					gcjzmc: this.search,
+					xfaqglxs: this.value,
+				};
+				getZjgldwxx(params).then((res) => {
+					this.ZjglList = res.data.rows;
+				});
+			},
+			// 跳转独栋(目前未加ID)
+			ToUnitInfo(item) {
+				console.log(item);
+				return;
+				this.$router.push(`/detail?id=${item.jzid}`);
+			},
+		},
+		created() {
+			this.getZjglList();
+		},
+	};
 </script>
 
 <style scoped lang="less">
-.maintenance-supervision {
-  // padding: 10px 10px 0px 20px;
-  ::v-deep(.el-input__inner) {
-    border: none;
-    background: linear-gradient(
-      360deg,
-      rgba(0, 148, 255, 0.5) 0%,
-      rgba(0, 148, 255, 0.31) 100%
-    );
-    color: #fff;
-  }
+	.maintenance-supervision {
 
-  ::v-deep(.el-button) {
-    border: none;
-    background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
-    color: #fff;
-  }
+		// padding: 10px 10px 0px 20px;
+		::v-deep(.el-input__inner) {
+			border: none;
+			background: linear-gradient(360deg,
+					rgba(0, 148, 255, 0.5) 0%,
+					rgba(0, 148, 255, 0.31) 100%);
+			color: #fff;
+		}
 
-  .maintenance-supervision_header {
-    display: flex;
-    justify-content: space-around;
-    border-bottom: 1px solid #154956;
-    padding-bottom: 2px;
-    margin-top: 15px;
-    font-size: 12px;
-    color: rgb(79, 149, 186);
-  }
+		::v-deep(.el-button) {
+			border: none;
+			background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
+			color: #fff;
+		}
 
-  .warp {
-    height: 520px;
-    margin: 0 auto;
-    overflow: hidden;
+		.maintenance-supervision_header {
+			display: flex;
+			justify-content: space-around;
+			border-bottom: 1px solid #154956;
+			padding-bottom: 2px;
+			margin-top: 15px;
+			font-size: 12px;
+			color: rgb(79, 149, 186);
+		}
 
-    .item {
-      list-style: none;
-      padding: 0;
-      margin: 0 auto;
-      cursor: pointer;
-    }
-  }
+		.warp {
+			height: 520px;
+			margin: 0 auto;
+			overflow: hidden;
 
-  .header {
-    color: #fff;
-    height: 33px !important;
-    line-height: 33px !important;
-    background-color: rgba(0, 163, 255, 0.3) !important;
-    color: #61dbff;
-    margin-top: 15px;
-    margin-bottom: 6px;
-  }
+			.item {
+				list-style: none;
+				padding: 0;
+				margin: 0 auto;
+				cursor: pointer;
+			}
+		}
 
-  .row,
-  li,
-  a {
-    display: block;
-    height: 39px;
-    line-height: 39px;
-    margin-bottom: 4px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: 16px;
-    background-color: rgba(0, 0, 0, 0.2);
+		.header {
+			color: #fff;
+			height: 33px !important;
+			line-height: 33px !important;
+			background-color: rgba(0, 163, 255, 0.3) !important;
+			color: #61dbff;
+			margin-top: 15px;
+			margin-bottom: 6px;
+		}
 
-    .time,
-    .num,
-    .person,
-    .result {
-      flex: 0.33;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      // 超出隐藏
-      display: inline-block;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
+		.row,
+		li,
+		a {
+			display: block;
+			height: 39px;
+			line-height: 39px;
+			margin-bottom: 4px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			font-size: 16px;
+			background-color: rgba(0, 0, 0, 0.2);
 
-    .num {
-      flex: 0.15;
-    }
-  }
-}
+			.time,
+			.num,
+			.person,
+			.result {
+				flex: 0.33;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				// 超出隐藏
+				display: inline-block;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
 
-/deep/.el-input__inner {
-  background-color: #184254;
-  width: 120px;
-  height: 30px;
-  margin-bottom: 5px;
-}
+			.num {
+				flex: 0.15;
+			}
+		}
+	}
 
-/deep/.el-button {
-  width: 80px;
-  height: 32px;
-  font-size: 14px;
-  line-height: 2px;
-  background: #184254;
-  margin: 0 5px 0 30px;
-  color: #fff;
-  border-radius: 5px;
-  border: none;
-}
+	/deep/.el-input__inner {
+		background-color: #184254;
+		width: 120px;
+		height: 30px;
+		margin-bottom: 5px;
+	}
 
-// /deep/.el-select-dropdown{
+	/deep/.el-button {
+		width: 80px;
+		height: 32px;
+		font-size: 14px;
+		line-height: 2px;
+		background: #184254;
+		margin: 0 5px 0 30px;
+		color: #fff;
+		border-radius: 5px;
+		border: none;
+	}
 
-//     background-color:#184254 !important;
-//     position: fixed;
+	// /deep/.el-select-dropdown{
 
-//   }
-/deep/.select_btn {
-  position: absolute;
-  top: 225px;
-  right: 320px;
-  //下拉框
-}
+	//     background-color:#184254 !important;
+	//     position: fixed;
 
-// /deep/.el-select-dropdown{
-//      border: none;
-//      background-color: #184254 ;
-//  }
-//输入框
-//  /deep/.el-input__inner{
-//      color:#eee;
-//      border-color: #00fff6;
-//      background-color: rgba(1, 28, 82, 0.8);
-//  }
-//  //聚焦时的样式
-//  /deep/.el-select .el-input.is-focus .el-input__inner{
-//      border-color: #0B61AA;
-//      background-color: rgba(1, 28, 82, 0.8);
-//      color:#00D3E9;
-//  }
-//  //下拉框选中
-//  /deep/.el-select-dropdown__item{
-//      color: #eee;
-//  }
-//  //鼠标经过下拉框
-//  /deep/.el-select-dropdown__item.hover,
-//  /deep/.el-select-dropdown__item:hover{
-//      color:#00D3E9;
-//      background-color: #0F3360;
-//  }
+	//   }
+	/deep/.select_btn {
+		position: absolute;
+		top: 225px;
+		right: 320px;
+		//下拉框
+	}
+
+	// /deep/.el-select-dropdown{
+	//      border: none;
+	//      background-color: #184254 ;
+	//  }
+	//输入框
+	//  /deep/.el-input__inner{
+	//      color:#eee;
+	//      border-color: #00fff6;
+	//      background-color: rgba(1, 28, 82, 0.8);
+	//  }
+	//  //聚焦时的样式
+	//  /deep/.el-select .el-input.is-focus .el-input__inner{
+	//      border-color: #0B61AA;
+	//      background-color: rgba(1, 28, 82, 0.8);
+	//      color:#00D3E9;
+	//  }
+	//  //下拉框选中
+	//  /deep/.el-select-dropdown__item{
+	//      color: #eee;
+	//  }
+	//  //鼠标经过下拉框
+	//  /deep/.el-select-dropdown__item.hover,
+	//  /deep/.el-select-dropdown__item:hover{
+	//      color:#00D3E9;
+	//      background-color: #0F3360;
+	//  }
 </style>
 
 <style>
-.el-select-dropdown.el-popper {
-  background-color: #4167a0;
-  color: #fff;
-}
+	.el-select-dropdown.el-popper {
+		background-color: #4167a0;
+		color: #fff;
+	}
 
-.el-popper[x-placement^="bottom"] .popper__arrow::after {
-  border-bottom-color: #4167a0 !important;
-}
+	.el-popper[x-placement^="bottom"] .popper__arrow::after {
+		border-bottom-color: #4167a0 !important;
+	}
 
-.el-select-dropdown.el-popper {
-  border: 1px solid rgba(0, 213, 255, 0.6) !important;
-}
+	.el-select-dropdown.el-popper {
+		border: 1px solid rgba(0, 213, 255, 0.6) !important;
+	}
 
-.el-select-dropdown.el-popper li.el-select-dropdown__item span {
-  color: #fff;
-}
+	.el-select-dropdown.el-popper li.el-select-dropdown__item span {
+		color: #fff;
+	}
 
-.el-select-dropdown.el-popper li.el-select-dropdown__item.selected span {
-  color: #2f7df2;
-}
+	.el-select-dropdown.el-popper li.el-select-dropdown__item.selected span {
+		color: #2f7df2;
+	}
 
-.el-select-dropdown.el-popper .el-select-dropdown__item.hover {
-  background-color: #2f7df2;
-}
+	.el-select-dropdown.el-popper .el-select-dropdown__item.hover {
+		background-color: #2f7df2;
+	}
 
-.el-select-dropdown.el-popper li.el-select-dropdown__item.hover.selected span {
-  color: #fff !important;
-}
-</style>
+	.el-select-dropdown.el-popper li.el-select-dropdown__item.hover.selected span {
+		color: #fff !important;
+	}
+</style>

+ 412 - 469
app/src/views/Fire/components/higthList.vue

@@ -1,480 +1,423 @@
 <script>
-import { area } from "@/api/area";
-import punishmentMixin from "@/mixin/unit.js";
-import { getglxsxz, getwbxsxz, getglztxz } from "@/api/management.js";
-export default {
-  name: "BasicInfoModalContent",
-  mixins: [punishmentMixin],
-  props: {
-    flag: Number,
-    qx: String,
-  },
-  watch: {
-    flag: {
-      handler(val) {
-        this.showFlag = val;
-      },
-      immediate: true,
-      deep: true,
-    },
-    qx: {
-      handler(val) {
-        this.value = val;
-      },
-      immediate: true,
-      deep: true,
-    },
-  },
-  data() {
-    return {
-      options: [],
-      fxdjList: [],
-      tableData: [],
-      unitList: [],
-      value: "全市",
-      params: {
-        pageSize: 10,
-        pageNum: 1,
-      },
-      params1: {
-        pageSize: 10,
-        pageNum: 1,
-      },
-      params2: {
-        pageSize: 10,
-        pageNum: 1,
-      },
-      total: 0,
-      total1: 0,
-      total2: 0,
-      showFlag: 1,
-      wbxsList: [],
-      glxsList: [],
-    };
-  },
-  methods: {
-    rowClickHandler(val) {
-      this.$router.push(`/detail?id=${val.id}`);
-    },
-    // 管理主体
-    funUnitList() {
-      getglztxz({
-        ...this.params,
-        jzszqx: this.value === "重庆市" ? "" : this.value,
-      }).then((res) => {
-        this.tableData = res.data.rows;
-        this.total = res.data.total;
-      });
-    },
-    handleSizeChange(val) {
-      this.params.pageSize = val;
-      this.funUnitList();
-    },
-    handleCurrentChange(val) {
-      this.params.pageNum = val;
-      this.funUnitList();
-    },
-    // 管理形式
-    handleSizeChange1(val) {
-      this.params1.pageSize = val;
-      this.getGlztList();
-    },
-    handleCurrentChange1(val) {
-      this.params1.pageNum = val;
-      this.getGlztList();
-    },
-    // 维保形式
-    getWbztList() {
-      getwbxsxz({
-        ...this.params2,
-        qx: this.value === "重庆市" ? "" : this.value,
-      }).then((res) => {
-        this.wbxsList = res.data.rows;
-        this.total2 = res.data.total;
-      });
-    },
-    // 维保形式
-    handleSizeChange2(val) {
-      this.params2.pageSize = val;
-      this.getWbztList();
-    },
-    handleCurrentChange2(val) {
-      this.params2.pageNum = val;
-      this.getWbztList();
-    },
-    resetForm() {
-      this.value = "";
-      this.params.pageNum = 1;
-      this.params1.pageNum = 1;
-      this.params2.pageNum = 1;
-      this.search()
-    },
-    // 搜索
-    search() {
-      if (this.showFlag == 1) {
-        this.params1.pageNum = 1;
-        this.getGlztList();
-      }
-      if (this.showFlag == 2) {
-        this.params2.pageNum = 1;
-        this.getWbztList();
-      }
-      if (this.showFlag == 3) {
-        this.params.pageNum = 1;
-        this.funUnitList();
-      }
-    },
-    changeList(val) {
-      this.showFlag = val;
-      this.search();
-    },
-    addClass(i) {
-      return this.showFlag === i ? "active" : "tab-item";
-    },
-    //请求管理形式
-    getGlztList() {
-      getglxsxz({
-        ...this.params1,
-        qx: this.value === "重庆市" ? "" : this.value,
-      }).then((res) => {
-        console.log(res.data.rows);
-        this.glxsList = res.data.rows;
-        this.total1 = res.data.total;
-      });
-    },
-  },
+	import {
+		area
+	} from "@/api/area";
+	import punishmentMixin from "@/mixin/unit.js";
+	import {
+		getglxsxz,
+		getwbxsxz,
+		getglztxz
+	} from "@/api/management.js";
+	export default {
+		name: "BasicInfoModalContent",
+		mixins: [punishmentMixin],
+		props: {
+			flag: Number,
+			qx: String,
+		},
+		watch: {
+			flag: {
+				handler(val) {
+					this.showFlag = val;
+				},
+				immediate: true,
+				deep: true,
+			},
+			qx: {
+				handler(val) {
+					this.value = val;
+				},
+				immediate: true,
+				deep: true,
+			},
+		},
+		data() {
+			return {
+				options: [],
+				fxdjList: [],
+				tableData: [],
+				unitList: [],
+				value: "全市",
+				params: {
+					pageSize: 10,
+					pageNum: 1,
+				},
+				params1: {
+					pageSize: 10,
+					pageNum: 1,
+				},
+				params2: {
+					pageSize: 10,
+					pageNum: 1,
+				},
+				total: 0,
+				total1: 0,
+				total2: 0,
+				showFlag: 1,
+				wbxsList: [],
+				glxsList: [],
+			};
+		},
+		methods: {
+			rowClickHandler(val) {
+				this.$router.push(`/detail?id=${val.id}`);
+			},
+			// 管理主体
+			funUnitList() {
+				getglztxz({
+					...this.params,
+					jzszqx: this.value === "重庆市" ? "" : this.value,
+				}).then((res) => {
+					this.tableData = res.data.rows;
+					this.total = res.data.total;
+				});
+			},
+			handleSizeChange(val) {
+				this.params.pageSize = val;
+				this.funUnitList();
+			},
+			handleCurrentChange(val) {
+				this.params.pageNum = val;
+				this.funUnitList();
+			},
+			// 管理形式
+			handleSizeChange1(val) {
+				this.params1.pageSize = val;
+				this.getGlztList();
+			},
+			handleCurrentChange1(val) {
+				this.params1.pageNum = val;
+				this.getGlztList();
+			},
+			// 维保形式
+			getWbztList() {
+				getwbxsxz({
+					...this.params2,
+					qx: this.value === "重庆市" ? "" : this.value,
+				}).then((res) => {
+					this.wbxsList = res.data.rows;
+					this.total2 = res.data.total;
+				});
+			},
+			// 维保形式
+			handleSizeChange2(val) {
+				this.params2.pageSize = val;
+				this.getWbztList();
+			},
+			handleCurrentChange2(val) {
+				this.params2.pageNum = val;
+				this.getWbztList();
+			},
+			resetForm() {
+				this.value = "";
+				this.params.pageNum = 1;
+				this.params1.pageNum = 1;
+				this.params2.pageNum = 1;
+				this.search()
+			},
+			// 搜索
+			search() {
+				if (this.showFlag == 1) {
+					this.params1.pageNum = 1;
+					this.getGlztList();
+				}
+				if (this.showFlag == 2) {
+					this.params2.pageNum = 1;
+					this.getWbztList();
+				}
+				if (this.showFlag == 3) {
+					this.params.pageNum = 1;
+					this.funUnitList();
+				}
+			},
+			changeList(val) {
+				this.showFlag = val;
+				this.search();
+			},
+			addClass(i) {
+				return this.showFlag === i ? "active" : "tab-item";
+			},
+			//请求管理形式
+			getGlztList() {
+				getglxsxz({
+					...this.params1,
+					qx: this.value === "重庆市" ? "" : this.value,
+				}).then((res) => {
+					console.log(res.data.rows);
+					this.glxsList = res.data.rows;
+					this.total1 = res.data.total;
+				});
+			},
+		},
 
-  created() {
-    this.funUnitList();
-    this.getGlztList();
-    this.getWbztList();
-    area({
-      pageNum: 1,
-      pageSize: 100,
-    }).then((res) => {
-      this.options = res.data.rows;
-    });
-  },
-};
+		created() {
+			this.funUnitList();
+			this.getGlztList();
+			this.getWbztList();
+			area({
+				pageNum: 1,
+				pageSize: 100,
+			}).then((res) => {
+				this.options = res.data.rows;
+			});
+		},
+	};
 </script>
 
 <template>
-  <div>
-    <!-- 搜索 -->
-    <div class="maintenance-supervision">
-      <div class="tab">
-        <span class="tab-item" @click="changeList(1)" :class="addClass(1)"
-          >管理形式</span
-        >
-        <span class="tab-item" @click="changeList(2)" :class="addClass(2)"
-          >维保形式</span
-        >
-        <span class="tab-item" @click="changeList(3)" :class="addClass(3)"
-          >管理主体</span
-        >
-      </div>
-      <div class="maintenance-supervision_header">
-        <div class="select-item">
-          <el-select v-model="value" placeholder="请选择">
-            <el-option
-              :value="item.areaTitle"
-              :label="item.areaTitle"
-              v-for="(item, index) in options"
-              :key="index"
-            >
-            </el-option>
-          </el-select>
-        </div>
-      </div>
-      <div class="btn-item">
-        <el-button @click="search">搜索</el-button>
-        <el-button @click="resetForm">重置</el-button>
-      </div>
-    </div>
+	<div>
+		<!-- 搜索 -->
+		<div class="maintenance-supervision">
+			<div class="tab">
+				<span class="tab-item" @click="changeList(1)" :class="addClass(1)">管理形式</span>
+				<span class="tab-item" @click="changeList(2)" :class="addClass(2)">维保形式</span>
+				<!-- <span class="tab-item" @click="changeList(3)" :class="addClass(3)">管理主体</span> -->
+			</div>
+			<div class="maintenance-supervision_header">
+				<div class="select-item">
+					<el-select v-model="value" placeholder="请选择">
+						<el-option :value="item.areaTitle" :label="item.areaTitle" v-for="(item, index) in options"
+							:key="index">
+						</el-option>
+					</el-select>
+				</div>
+			</div>
+			<div class="btn-item">
+				<el-button @click="search">搜索</el-button>
+				<el-button @click="resetForm">重置</el-button>
+			</div>
+		</div>
 
-    <div v-if="showFlag === 3">
-      <basic-table
-        :data="tableData"
-        @row-click="rowClickHandler"
-        style="text-align: center"
-      >
-        <el-table-column type="index" label="序号" width="180">
-        </el-table-column>
-        <el-table-column
-          prop="jzszqx"
-          label="区县"
-          width="180"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column prop="zddw" label="重点单位(家)" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column
-          prop="ybdw"
-          label="一般单位(家)"
-          width="180"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-      </basic-table>
-    </div>
-    <div v-if="showFlag === 1">
-      <basic-table
-        :data="glxsList"
-        @row-click="rowClickHandler"
-        style="text-align: center"
-      >
-        <el-table-column type="index" label="序号"> </el-table-column>
-        <el-table-column prop="qx" label="区县" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column
-          prop="ygldwwy"
-          label="有管理单位(物业)(栋)"
-          width="240"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column
-          prop="ygldwfwy"
-          label="有管理单位(非物业)(栋)"
-          width="240"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column
-          prop="jmzggl"
-          label="居民自主管理(栋)"
-          width="220"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column prop="jdsqdg" label="街道社区代管" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="qtglxs" label="其他" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="wglzt" label="无管理主体" show-overflow-tooltip>
-        </el-table-column>
-      </basic-table>
-    </div>
-    <div v-if="showFlag === 2">
-      <basic-table
-        :data="wbxsList"
-        @row-click="rowClickHandler"
-        style="text-align: center"
-      >
-        <el-table-column type="index" label="序号"> </el-table-column>
-        <el-table-column prop="qx" label="区县" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column
-          prop="zywb"
-          label="专业维保(栋)"
-          width="240"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column
-          prop="zzwb"
-          label="自主维保(栋)"
-          width="240"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column
-          prop="w"
-          label="无维保(栋)"
-          width="220"
-          show-overflow-tooltip
-        >
-        </el-table-column>
-        <el-table-column prop="jxhs" label="仅消火栓" show-overflow-tooltip>
-        </el-table-column>
-      </basic-table>
-    </div>
-    <br />
-    <div v-if="showFlag == 3">
-      <basic-pagination
-        layout="->,prev, pager, next, sizes,jumper"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="params.pageSize"
-        :current-page="params.PageNum"
-        :total="total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
-    <div v-if="showFlag == 1">
-      <basic-pagination
-        layout="->,prev, pager, next, sizes,jumper"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="params1.pageSize"
-        :current-page="params1.PageNum"
-        :total="total"
-        @size-change="handleSizeChange1"
-        @current-change="handleCurrentChange1"
-      />
-    </div>
-    <div v-if="showFlag == 2">
-      <basic-pagination
-        layout="->,prev, pager, next, sizes,jumper"
-        :page-sizes="[10, 20, 50, 100]"
-        :page-size="params2.pageSize"
-        :current-page="params2.PageNum"
-        :total="total"
-        @size-change="handleSizeChange2"
-        @current-change="handleCurrentChange2"
-      />
-    </div>
-  </div>
+		<div v-if="showFlag === 3">
+			<basic-table :data="tableData" @row-click="rowClickHandler" style="text-align: center">
+				<el-table-column type="index" label="序号" width="180">
+				</el-table-column>
+				<el-table-column prop="jzszqx" label="区县" width="180" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="zddw" label="重点单位(家)" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="ybdw" label="一般单位(家)" width="180" show-overflow-tooltip>
+				</el-table-column>
+			</basic-table>
+		</div>
+		<div v-if="showFlag === 1">
+			<basic-table :data="glxsList" @row-click="rowClickHandler" style="text-align: center">
+				<el-table-column type="index" label="序号"> </el-table-column>
+				<el-table-column prop="qx" label="区县" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="ygldwwy" label="有管理单位(物业)(栋)" width="240" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="ygldwfwy" label="有管理单位(非物业)(栋)" width="240" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="jmzggl" label="居民自主管理(栋)" width="220" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="jdsqdg" label="街道社区代管" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="qtglxs" label="其他" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="wglzt" label="无管理主体" show-overflow-tooltip>
+				</el-table-column>
+			</basic-table>
+		</div>
+		<div v-if="showFlag === 2">
+			<basic-table :data="wbxsList" @row-click="rowClickHandler" style="text-align: center">
+				<el-table-column type="index" label="序号"> </el-table-column>
+				<el-table-column prop="qx" label="区县" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="zywb" label="专业维保(栋)" width="240" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="zzwb" label="自主维保(栋)" width="240" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="w" label="无维保(栋)" width="220" show-overflow-tooltip>
+				</el-table-column>
+				<el-table-column prop="jxhs" label="仅消火栓" show-overflow-tooltip>
+				</el-table-column>
+			</basic-table>
+		</div>
+		<br />
+		<div v-if="showFlag == 3">
+			<basic-pagination layout="->,prev, pager, next, sizes,jumper" :page-sizes="[10, 20, 50, 100]"
+				:page-size="params.pageSize" :current-page="params.PageNum" :total="total"
+				@size-change="handleSizeChange" @current-change="handleCurrentChange" />
+		</div>
+		<div v-if="showFlag == 1">
+			<basic-pagination layout="->,prev, pager, next, sizes,jumper" :page-sizes="[10, 20, 50, 100]"
+				:page-size="params1.pageSize" :current-page="params1.PageNum" :total="total"
+				@size-change="handleSizeChange1" @current-change="handleCurrentChange1" />
+		</div>
+		<div v-if="showFlag == 2">
+			<basic-pagination layout="->,prev, pager, next, sizes,jumper" :page-sizes="[10, 20, 50, 100]"
+				:page-size="params2.pageSize" :current-page="params2.PageNum" :total="total"
+				@size-change="handleSizeChange2" @current-change="handleCurrentChange2" />
+		</div>
+	</div>
 </template>
 
 <style scoped lang="less">
-.maintenance-supervision {
-  display: flex;
-  align-items: center;
-  // padding: 10px 10px 0px 20px;
-  ::v-deep(.el-input__inner) {
-    border: none;
-    background: linear-gradient(
-      360deg,
-      rgba(0, 148, 255, 0.5) 0%,
-      rgba(0, 148, 255, 0.31) 100%
-    );
-    color: #fff;
-  }
-  ::v-deep(.el-button) {
-    border: none;
-    background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
-    color: #fff;
-  }
-  .maintenance-supervision_header {
-    display: flex;
-    // flex-wrap: wrap;
-    justify-content: space-around;
-    // border-bottom: 1px solid #154956;
-    padding-bottom: 10px;
-    font-size: 12px;
-    color: rgb(79, 149, 186);
-    // .select-item{
-    //   margin-right: 20px;
-    // }
-  }
-  .btn-item {
-    margin-bottom: 10px;
-  }
+	.maintenance-supervision {
+		display: flex;
+		align-items: center;
 
-  .warp {
-    height: 520px;
-    margin: 0 auto;
-    overflow: hidden;
-    .item {
-      list-style: none;
-      padding: 0;
-      margin: 0 auto;
-      cursor: pointer;
-    }
-  }
-  /deep/.el-input__inner {
-    background-color: #184254;
-    width: 150px;
-    height: 30px;
-    margin-bottom: 5px;
-  }
-  /deep/.el-button {
-    width: 100px;
-    height: 32px;
-    font-size: 14px;
-    line-height: 2px;
-    // margin: 0 20px 0 30px;
-    color: #fff;
-    border-radius: 5px;
-    border: none;
-    margin-left: 20px;
-  }
-  /deep/.el-button:hover {
-    color: rgb(80, 147, 224);
-  }
-  /deep/.select_btn {
-    position: absolute;
-    top: 225px;
-    right: 320px;
-    //下拉框
-  }
-  /deep/.el-input {
-    width: 150px;
-    // margin-left: 20px;
-  }
-  .header {
-    color: #fff;
-    height: 33px !important;
-    line-height: 33px !important;
-    background-color: rgba(0, 163, 255, 0.3) !important;
-    color: #61dbff;
-    margin-top: 15px;
-    margin-bottom: 6px;
-  }
+		// padding: 10px 10px 0px 20px;
+		::v-deep(.el-input__inner) {
+			border: none;
+			background: linear-gradient(360deg,
+					rgba(0, 148, 255, 0.5) 0%,
+					rgba(0, 148, 255, 0.31) 100%);
+			color: #fff;
+		}
 
-  .row,
-  li,
-  a {
-    display: block;
-    height: 39px;
-    line-height: 39px;
-    margin-bottom: 4px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    font-size: 16px;
-    background-color: rgba(0, 0, 0, 0.2);
-    .time,
-    .num,
-    .person,
-    .result {
-      flex: 0.33;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-    .num {
-      flex: 0.15;
-    }
-  }
-  .inp {
-    margin-left: 20px;
-  }
-}
-.unit-bulid {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 20px;
-  font-size: 18px;
-}
-.unit-num {
-  width: 200px;
-  height: 109px;
-  border: 1px solid #0463a7;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-items: center;
-  line-height: 59px;
-}
-.tab {
-  display: flex;
-}
-.active {
-  background: #0463a7 !important;
-}
-.tab-item {
-  display: inline-block;
-  width: 120px;
-  height: 40px;
-  text-align: center;
-  line-height: 40px;
-  font-size: 16px;
-  color: #fff;
-  border: 1px solid #fff;
-  border-radius: 5px;
-  margin-right: 15px;
-  margin-bottom: 15px;
-}
-</style>
+		::v-deep(.el-button) {
+			border: none;
+			background: linear-gradient(360deg, #0094ff90 0%, #0094ff10 100%);
+			color: #fff;
+		}
+
+		.maintenance-supervision_header {
+			display: flex;
+			// flex-wrap: wrap;
+			justify-content: space-around;
+			// border-bottom: 1px solid #154956;
+			padding-bottom: 10px;
+			font-size: 12px;
+			color: rgb(79, 149, 186);
+			// .select-item{
+			//   margin-right: 20px;
+			// }
+		}
+
+		.btn-item {
+			margin-bottom: 10px;
+		}
+
+		.warp {
+			height: 520px;
+			margin: 0 auto;
+			overflow: hidden;
+
+			.item {
+				list-style: none;
+				padding: 0;
+				margin: 0 auto;
+				cursor: pointer;
+			}
+		}
+
+		/deep/.el-input__inner {
+			background-color: #184254;
+			width: 150px;
+			height: 30px;
+			margin-bottom: 5px;
+		}
+
+		/deep/.el-button {
+			width: 100px;
+			height: 32px;
+			font-size: 14px;
+			line-height: 2px;
+			// margin: 0 20px 0 30px;
+			color: #fff;
+			border-radius: 5px;
+			border: none;
+			margin-left: 20px;
+		}
+
+		/deep/.el-button:hover {
+			color: rgb(80, 147, 224);
+		}
+
+		/deep/.select_btn {
+			position: absolute;
+			top: 225px;
+			right: 320px;
+			//下拉框
+		}
+
+		/deep/.el-input {
+			width: 150px;
+			// margin-left: 20px;
+		}
+
+		.header {
+			color: #fff;
+			height: 33px !important;
+			line-height: 33px !important;
+			background-color: rgba(0, 163, 255, 0.3) !important;
+			color: #61dbff;
+			margin-top: 15px;
+			margin-bottom: 6px;
+		}
+
+		.row,
+		li,
+		a {
+			display: block;
+			height: 39px;
+			line-height: 39px;
+			margin-bottom: 4px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			font-size: 16px;
+			background-color: rgba(0, 0, 0, 0.2);
+
+			.time,
+			.num,
+			.person,
+			.result {
+				flex: 0.33;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+
+			.num {
+				flex: 0.15;
+			}
+		}
+
+		.inp {
+			margin-left: 20px;
+		}
+	}
+
+	.unit-bulid {
+		display: flex;
+		justify-content: space-between;
+		margin-bottom: 20px;
+		font-size: 18px;
+	}
+
+	.unit-num {
+		width: 200px;
+		height: 109px;
+		border: 1px solid #0463a7;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-items: center;
+		line-height: 59px;
+	}
+
+	.tab {
+		display: flex;
+	}
+
+	.active {
+		background: #0463a7 !important;
+	}
+
+	.tab-item {
+		display: inline-block;
+		width: 120px;
+		height: 40px;
+		text-align: center;
+		line-height: 40px;
+		font-size: 16px;
+		color: #fff;
+		border: 1px solid #fff;
+		border-radius: 5px;
+		margin-right: 15px;
+		margin-bottom: 15px;
+	}
+</style>