Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

src/components/mapView/descriptionsInfo.vue

@@ -0,0 +1,39 @@
+<template>
+    <div class="detailsInfo">
+      <el-descriptions :column="1" border :title="title" size="mini">
+        <el-descriptions-item v-for="(row, index) in config" :key="index" :label="row.label">
+          <slot v-if="row.isslot" :name="row.value"></slot>
+          <span v-else class="information">
+            {{ model[row.value] }}
+            <span v-if="model[row.value]">{{ row.unit }}</span>
+          </span>
+        </el-descriptions-item>
+      </el-descriptions>
+  
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    props: {
+      model: Object,
+      config: Array,
+      // column:Number,
+      title: String,
+    },
+    data() {
+      return {
+  
+      };
+    },
+    mounted() {
+      console.log(this.config);
+    },
+    methods: {},
+  };
+  </script>
+  
+  <style lang="less" scoped>
+  .detailsInfo {}
+  </style>
+  

src/views/geologyDisaster/config.js

@@ -0,0 +1,228 @@
+
+export const zzForm = [
+  [
+    {
+      label: '',
+      prop: 'type',
+      span: 10
+    },
+    {
+      label: '',
+      prop: 'xmmc',
+      span: 10,
+      component: 'ElInput',
+      componentProps: {
+        placeholder: '项目名称'
+      }
+    },
+
+    {
+      prop: 'action',
+      span: 4
+    }
+  ]
+]
+
+export const TableHeader = [
+  { label: "隐患点名称", prop: "xmmc", align: 'center' },
+  { label: "所在行政村", prop: "zgbm", width: '120px' },// slot: "mj"
+  { label: "规模等级", prop: "gm", width: '80px ', slot: "mj", align: 'center' },
+  { label: "操作", slot: "action", width: '80px', align: 'center' },
+]
+
+
+// 基本信息详情
+export const jbxxInfos = [
+  [[
+    { flag: 'label', value: '地质灾害隐患点名称', span: 8, align: 'center' },
+    { flag: 'value', value: 'tbbh', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '所在辖区', span: 8 },
+    { flag: 'value', value: 'dlbm', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '所在行政村', span: 8 },
+    { flag: 'value', value: 'dlmc', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '规模等级', span: 8 },
+    { flag: 'value', value: 'qsxz', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '经度', span: 8 },
+    { flag: 'value', value: 'tbmj', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '纬度', span: 8 },
+    { flag: 'value', value: 'kcdlbm', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '威胁人数(人)', span: 8 },
+    { flag: 'value', value: 'kcxs', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '防灾责任划分', span: 8 },
+    { flag: 'value', value: 'kcmj', span: 12 },
+  ]],
+  [[
+    { flag: 'label', value: '事权划分', span: 8 },
+    { flag: 'value', value: 'tbdlmj', span: 12 },
+  ]],
+]
+export const zgdwInfos = [[[
+  { flag: 'label', value: '主管单位名称', span: 6 },
+  { flag: 'value', value: 'gdlx', span: 14 },
+]],
+[[
+  { flag: 'label', value: '责任领导/职务/电话', span: 6 },
+  { flag: 'value', value: 'gdpdjb', span: 14 },
+]],
+[[
+  { flag: 'label', value: '直接责任人/职务/电话', span: 6 },
+  { flag: 'value', value: 'frdbs', span: 14 },
+]],
+]
+export const qcqfInfos = [
+  [[
+    { flag: 'label', value: '群测群防员', span: 6 },
+    { flag: 'value', value: 'czcsxm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '联系电话', span: 6 },
+    { flag: 'value', value: 'sjnf', span: 14 },
+  ]],
+]
+// 检测资料
+// 隐患排查与整改情况
+export const yhpcInfos = [
+  [[
+    { flag: 'label', value: '排查责任单位', span: 6 },
+    { flag: 'value', value: 'bz', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '排查负责人/联系电话', span: 6 },
+    { flag: 'value', value: 'bsm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '警示标志', span: 6 },
+    { flag: 'value', value: 'ysdm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '群测群防员配备', span: 6 },
+    { flag: 'value', value: '项目类型', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '隔离防护设施', span: 6, },
+    { flag: 'value', value: 'xmmc', span: 14, isslot: true },
+  ]],
+  [[
+    { flag: 'label', value: '其他问题隐患', span: 6 },
+    { flag: 'value', value: 'zzhdlmc', span: 14 },
+  ]],
+]
+
+export const yhzgInfos = [
+  [[
+    { flag: 'label', value: '整改责任单位', span: 6 },
+    { flag: 'value', value: 'zzhdlbm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '整改负责人/联系电话', span: 6 },
+    { flag: 'value', value: 'qsdwdm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '整改措施', span: 6 },
+    { flag: 'value', value: 'qsdwmc', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '整改进展情况', span: 6 },
+    { flag: 'value', value: 'zldwmc', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '整改完成/预计整改完成时间', span: 6 },
+    { flag: 'value', value: 'zldwdm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '下一步防治整改计划', span: 6 },
+    { flag: 'value', value: 'xzgdlydlbm', span: 14 },
+  ]],]
+
+//应急预案
+export const yjyaInfos = [
+  [[
+    { flag: 'label', value: '地点', span: 6 },
+    { flag: 'value', value: 'xzgdlydlmc', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '基本情况', span: 6 },
+    { flag: 'value', value: 'xzgdmj', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '引发因素', span: 6 },
+    { flag: 'value', value: 'xzgddb', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '危害对象', span: 6 },
+    { flag: 'value', value: 'xzgdlyxm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '预警等级', span: 6 },
+    { flag: 'value', value: 'xzgdlydlmc', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '预警方法', span: 6 },
+    { flag: 'value', value: 'xzgdmj', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '应急等级', span: 6 },
+    { flag: 'value', value: 'xzgddb', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '应急方法', span: 6 },
+    { flag: 'value', value: 'xzgdlyxm', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '撤离路线', span: 6 },
+    { flag: 'value', value: 'xzgddb', span: 14 },
+  ]],
+  [[
+    { flag: 'label', value: '避灾地点', span: 6 },
+    { flag: 'value', value: 'xzgdlyxm', span: 14 },
+  ]],
+]
+
+export const jslist = [{
+  id: "QHBH",
+  label: "整治前后土地利用结构变化",
+  dataList: [],
+  iseyes: false,
+  isshow: true,
+  scxstyle: 2,
+},
+{
+  id: "XZGD",
+  label: "新增耕地",
+  dataList: [{}],
+  iseyes: false,
+  isshow: true,
+  scxstyle: 3,
+},
+{
+  id: "SQSX",
+  label: "三线分析",
+  dataList: [],
+  iseyes: false,
+  isshow: true,
+  scxstyle: 0,
+},
+{
+  id: "GHDK",
+  label: "详细规划分析",
+  dataList: [],
+  iseyes: false,
+  isshow: true,
+  scxstyle: 0,
+},]
+
+

src/views/geologyDisaster/details.vue

@@ -0,0 +1,124 @@
+<template>
+  <div class="conViews">
+    <div class="sm-panel sm-function-module-query" v-drag v-if="isShallow">
+      <div class="sm-panel-header">
+        <span> 详细信息 </span>
+        <i class="el-icon-close" @click="closeInster"></i>
+      </div>
+      <el-tabs type="border-card" class="xz_box" v-model="activeTabs" stretch>
+        <el-tab-pane label="基本信息" name="jbxx">
+          <div class="xxdiv">
+            <!-- <Info :data="jbxxData"></Info> -->
+            <!-- <div class="echars">
+              <div class="echartTitle">
+                <div class="block-title">基本信息</div>
+              </div>
+            </div>
+            <CustomDetails :model="formData" :config="jbxxInfos">
+            </CustomDetails> -->
+            <DesInfo title="基本信息" :model="formData" :config="jbxxInfos" ></DesInfo>
+            <!-- <template #jg>
+                <span> {{ stateMap[formData.state].name }}</span>
+              </template> -->
+          </div>
+
+        </el-tab-pane>
+        <el-tab-pane label="隐患排查与整改情况" name="yhpcyzg">
+
+        </el-tab-pane>
+        <el-tab-pane label="应急预案" name="yjya">
+
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+  </div>
+</template>
+<script>
+// import Info from "../../Idleland/components/info.vue";
+// import CustomDetails from "@/components/mapView/custom-detailsInfo.vue";
+import DesInfo from "@/components/mapView/descriptionsInfo.vue";
+import { getXm } from "@/api/stxf/tdzz.js";
+import { jbxxInfos } from "./config.js";
+export default {
+  props: {
+    interObj: {
+      type: Object,
+    },
+  },
+  // components: { Info, Wrjxx },
+  components: { DesInfo, },
+  data() {
+    return {
+      activeTabs: "jbxx",
+      isShallow: false,
+      formData: { tbbh: 'skmdslcmdrvnfjkvn就是当你发觉的女第就是当你发觉的三次多少地方' },
+      jbxxData: [],
+      rdData: [],
+      type: "",
+      jbxxInfos: jbxxInfos,
+    };
+  },
+  mounted() {
+    // this.init();
+  },
+  methods: {
+    //关闭详情
+    closeInster() {
+      this.isShallow = false;
+      this.$nextTick(() => {
+        viewer.entities.removeAll();
+      });
+    },
+    handleView({ parts, queryData, geoms, e }, type) {
+      this.type = type;
+      this.activeTabs = "jbxx";
+      this.jbxxData = [];
+      this.isShallow = true;
+      // if (!e.features[0].fieldNames) {
+      //   this.$message({
+      //     message: "查询结果为空！",
+      //     type: "warning",
+      //     customClass: "messageIndex",
+      //   });
+      // } else if (e && e.totalCount > 0) {
+      //   this.isShallow = true;
+      //   this.jbxxData = queryData[0];
+      //   viewer.entities.removeAll();
+      //   addGeomParts(false, geoms, parts);
+      // }
+    },
+  },
+  mounted() { },
+  watch: {},
+};
+</script>
+
+<style lang="scss" scoped>
+.sm-panel {
+  width: 460px;
+  max-width: 460px;
+
+  /deep/ .el-icon-close:before {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    font-size: larger;
+    font-weight: bold;
+
+    &:hover {
+      color: aqua;
+    }
+  }
+
+  .xxdiv {
+    height: 695px;
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
+}
+
+.sm-function-module-query {
+  max-height: 800px !important;
+  top: 28px !important;
+}
+</style>

src/views/geologyDisaster/index.vue

@@ -3,28 +3,30 @@
     <div class="innerContainer leftPane" v-drag>
       <h2 class="Pangetitle darg-div">
         <span class="pange_text"> 地质灾害隐患点 </span>
-        <div>共：{{ total }}个</div>
+        <div class="totalnum">共：{{ total }}个</div>
       </h2>
       <div class="xz_box">
         <div class="el-col headerSelect">
           <el-input
             clearable
             v-model="pageObj.LA"
-            @input="searchFun"
+            @input="searchFun()"
             class="search"
             placeholder="请输入查询内容"
+            size="mini"
           ></el-input>
           <el-cascader
             v-model="pageObj.xzqh"
             :show-all-levels="false"
             :options="store.state.region_tree"
+            @change="searchFun()"
             placeholder="行政区"
+            size="mini"
             :props="{
               checkStrictly: true,
               expandTrigger: 'hover',
               emitPath: false,
             }"
-            @change="searchFun"
           ></el-cascader>
         </div>
         <tablePage
@@ -32,7 +34,7 @@
           :cloumn="cloumn"
           :table="table"
           :indexed="false"
-          layout="total, sizes, prev, next, jumper"
+          layout=""
           ref="tableDialogRef"
           @currentChange="searchFun"
         >
@@ -44,82 +46,17 @@
             <span class="usable" @click="handle(row)"> 对比 </span>
           </template>
         </tablePage>
-        <!-- <el-table
-        :row-class-name="tableRowClassName"
-        ref="singleTable"
-        :data="active_dableData"
-        style="width: 100%"
-        height="670"
-        :header-cell-style="{
-          background: 'rgba(10, 25, 38, 0.6)',
-          color: '#66b1ff',
-          fontSize: '14px',
-          fontFamily: 'Microsoft YaHei',
-          fontWeight: '400',
-        }"
-      >
-        <el-table-column
-          show-overflow-tooltip="true"
-          v-for="(item, index) in store.state.cockpit_vector.columns"
-          :key="index"
-          :width="index ? 100 : cockpit_vector.columns.length > 2 ? 150 : 230"
-          :prop="item"
-          :label="item"
-        >
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          :width="cockpit_vector.action ? 100 : 50"
-        >
-          <template slot-scope="scope">
-           
-            <el-button @click="go(scope.row)" type="text" size="small"
-              >定位</el-button
-            >
-            <el-button
-              v-if="cockpit_vector.action"
-              @click="start(scope.row)"
-              type="text"
-              size="small"
-              >开工</el-button
-            >
-          </template>
-        </el-table-column>
-      </el-table> -->
       </div>
-
-      <!-- <slot name="all"></slot> -->
     </div>
-    <div class="sm-panel sm-function-module-query" v-if="isShallow" v-drag>
-      <div class="sm-panel-header">
-        <span>详情</span>
-        <i class="el-icon-close" @click="closeIsShallow"></i>
-      </div>
-      <el-tabs
-        type="border-card"
-        class="xz_box info"
-        v-model="activeTabs"
-        stretch
-      >
-        <el-tab-pane label="基本信息" name="base">
-          <!-- <CockpitVector :baseData="details"></CockpitVector> -->
-        </el-tab-pane>
 
-        <el-tab-pane
-          label="全过程管理信息"
-          name="qgc"
-          v-if="title.includes('山水工程')"
-        >
-        </el-tab-pane>
-      </el-tabs>
-    </div>
+    <Details ref="detailModal"></Details>
   </div>
 </template>
 
 <script>
 import tablePage from "@/components/mapView/tablePage.vue";
 import customForm from "@/components/mapView/custom-form.vue";
+import Details from "./details.vue";
 import { QueryList } from "@/api/cockpitNew";
 import { getXmList } from "@/api/stxf/tdzz.js";
 import { zzForm, TableHeader, reasonList } from "./config";
@@ -129,6 +66,7 @@ export default {
   components: {
     tablePage,
     customForm,
+    Details,
   },
   props: {
     type: {
@@ -237,8 +175,7 @@ export default {
       removeGeoJSON("zzxmhig");
     },
     detail(row) {
-      this.flyTo(row);
-      this.bus.$emit("handleView", row, "整治项目");
+      this.$refs.detailModal.handleView(row);
     },
     async handle(row) {
       removeGeoJSON("zzxm");
@@ -273,17 +210,25 @@ export default {
 .geologyDisaster {
   width: 100%;
   height: 100%;
+  .totalnum {
+    margin-left: 20px;
+  }
 
   .headerSelect {
     width: 100%;
     height: 26px;
     //   background: #00ffff;
-    margin: 5px 0px;
+    margin: 10px 0px;
     display: flex;
     justify-content: space-between;
+
+    .el-cascader--mini {
+      margin-left: 10px;
+      top: 0px !important;
+    }
   }
   .tablePage {
-    height: calc(100% - 120px);
+    height: calc(100% - 20px);
   }
 }
 </style>