独栋下砖

app/src/mixin/unit.js

@@ -132,6 +132,17 @@ const punishmentMixin = {
             value: "低风险",
             label: "低风险",
           },
+      ],
+      //起火原因
+      qhyyList:[
+        {
+          value: "不排除原因",
+          label: "不排除原因",
+        },
+        {
+          value: "电器火灾",
+          label: "电器火灾",
+        }
       ]
       };
     },

app/src/views/Detail/components/GementUnit.vue

@@ -2,7 +2,7 @@
   <div class="unit">
     <!-- 管理单位 -->
     <div>
-      <div class="building-info" v-if="detail">
+      <div class="building-info c" v-if="detail" @click="openModal">
         <el-row class="row">
           <el-col :span="24">
             <span>管理形式：</span>
@@ -126,6 +126,9 @@ export default {
     },
   },
   methods: {
+    openModal() {
+      this.$emit('openModal', { name: 'gldwModal', params: { gcjzmc: this.detail.gcjzmc } });
+    },
     getList() {
       getRzdw({
         pageNum: 1,
@@ -176,6 +179,9 @@ export default {
       font-size: 12px;
     }
   }
+  .building-info.c {
+    cursor: pointer;
+  }
 }
 
 .title {

app/src/views/Detail/components/GldwModalContent.vue

@@ -0,0 +1,351 @@
+<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,
+  },
+  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,
+    },
+  },
+  methods: {
+    funRzdwList() {
+      getRzdw({
+        ...this.params,
+      }).then((res) => {
+        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();
+    },
+  },
+  created() {
+    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 {
+    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-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;
+  }
+  /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;
+  width: 80%;
+  display: flex;
+}
+</style>

app/src/views/Detail/components/Risklevel.vue

@@ -2,13 +2,21 @@
   <div class="level">
     <!-- 风险等级 -->
     <div class="row">
-      <div style="font-size: 18px" class="label">主要风险点</div>
+      <div
+        style="font-size: 18px; cursor: pointer"
+        class="label"
+        @click="openModal('whFxModal')"
+      >
+        主要风险点
+      </div>
       <div class="level-btn">
         <span v-for="(item, i) in fxd" :key="i">{{ item }}</span>
       </div>
     </div>
     <div class="row">
-      <div style="font-size: 18px" class="label">存在隐患数:</div>
+      <div style="font-size: 18px; cursor: pointer" class="label" @click="openModal('whYhModal')">
+        存在隐患数:
+      </div>
       <div class="level-btn2">{{ yhList.length }} <span>个</span></div>
     </div>
     <div class="level_bottom">
@@ -88,12 +96,15 @@ export default {
       fxd: [],
       yhList: [],
       hzs: [],
-      qrcode: null
+      qrcode: null,
     };
   },
   props: ["detail"],
   components: {},
   methods: {
+    openModal(name) {
+      this.$emit("openModal", { name });
+    },
     rowClickHandler() {
       this.$router.push(`/h5?id=${"72042"}`);
     },
@@ -138,10 +149,12 @@ export default {
 
       console.log(window.location.origin);
 
-      getQrcode({ url: window.location.origin + '/h5?id=' + this.detail.id }).then((res) => {
+      getQrcode({
+        url: window.location.origin + "/h5?id=" + this.detail.id,
+      }).then((res) => {
         const data = JSON.parse(res.data.data);
         this.qrcode = data.qr_code;
-      })
+      });
     },
   },
   created() {

app/src/views/Detail/index.vue

@@ -3,9 +3,14 @@
     <div>
       <border-panel height="360px" style="margin-bottom: 6px" title="建筑信息">
         <BuildingInfo :detail="detail" v-if="detail" />
+        <div slot="ext-header">
+          <div class="float-btn" @click="openModal({ name: 'qtModal' })">
+            其他
+          </div>
+        </div>
       </border-panel>
       <border-panel height="585px" style="margin-bottom: 6px" title="管理单位">
-        <GementUnit :detail="detail" v-if="detail" />
+        <GementUnit :detail="detail" v-if="detail" @openModal="openModal" />
       </border-panel>
     </div>
     <div style="width: 1000px; position: relative">
@@ -28,7 +33,7 @@
         style="margin: 7px"
         title='火灾风险"一楼一码"'
       >
-        <Risklevel :detail="detail" v-if="detail" />
+        <Risklevel :detail="detail" v-if="detail" @openModal="openModal" />
       </border-panel>
       <div
         class="m-btn d"
@@ -63,6 +68,26 @@
         <maintenance-supervision :detail="detail" v-if="detail" />
       </border-panel>
     </div>
+
+    <!-- 管理单位弹窗 -->
+    <basic-modal top="120px" ref="gldwModal" name="管理单位" width="90%">
+      <GldwModalContent :default="params.gldwModal" />
+    </basic-modal>
+
+    <!-- 其他 -->
+    <basic-modal top="120px" ref="qtModal" name="其他">
+      <BasicInfoModalContent />
+    </basic-modal>
+
+    <!-- 风险问号弹窗 -->
+    <basic-modal top="120px" ref="whFxModal" name="安全风险分级预警">
+      <img src="../../assets/images/dd-exp-fx.png" />
+    </basic-modal>
+
+    <!-- 隐患问号弹窗 -->
+    <basic-modal top="120px" ref="whYhModal" name="隐患">
+      <img src="../../assets/images/dd-exp-yh.png" />
+    </basic-modal>
   </div>
 </template>
 <script>
@@ -75,6 +100,8 @@ import HistoricalFire from "./components/HistoricalFire.vue";
 import HiddenDanger from "./components/HiddenDanger.vue";
 import { getBuildDetail } from "@/api/detail.js";
 import Map from "@/components/Map.vue";
+import GldwModalContent from "./components/GldwModalContent.vue";
+import BasicInfoModalContent from "../Home/components/BasicInfoModalContent.vue";
 export default {
   name: "BasicInfoPage",
   components: {
@@ -86,6 +113,8 @@ export default {
     HistoricalFire,
     HiddenDanger,
     Map,
+    GldwModalContent,
+    BasicInfoModalContent,
   },
   data() {
     return {
@@ -93,9 +122,16 @@ export default {
       detail: null,
       middleType: "720",
       mapData: null,
+      params: {
+        gldwModal: null,
+      },
     };
   },
   methods: {
+    openModal(data) {
+      this.params[data.name] = data.params;
+      this.showModal(data.name);
+    },
     changeMiddleType() {
       if (this.middleType === "720") {
         this.getMapData();
@@ -112,7 +148,7 @@ export default {
         wd: this.detail.wd,
         zl: null,
         jzmc: this.detail.gcjzmc,
-        showzhd: false
+        showzhd: false,
       };
     },
     getQueryString(name) {
@@ -168,4 +204,28 @@ export default {
     no-repeat;
   background-size: 78px 72px;
 }
+.float-btn {
+  width: 55px;
+  height: 22px;
+  left: 392px;
+  top: 127px;
+
+  background: linear-gradient(
+    180deg,
+    rgba(0, 209, 255, 0.245) 0%,
+    rgba(0, 255, 224, 0.435) 100%
+  );
+  border: 1px solid rgba(0, 213, 255, 0.22);
+  border-radius: 2px;
+  font-family: "Abel";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 24px;
+  align-items: center;
+
+  color: #ffffff;
+  text-align: center;
+  cursor: pointer;
+}
 </style>

app/src/views/Home/components/BasicInfoModalContent.vue

@@ -43,7 +43,8 @@ export default {
   },
   methods: {
     rowClickHandler(val) {
-      this.$router.push(`/detail?id=${val.id}`);
+      // this.$router.push(`/detail?id=${val.id}`);
+      window.location.href = `/detail?id=${val.id}`;
     },
     funUnitList() {
       getJdjcUnit({