单位活跃数统计

src/api/backend/statistics.js

@@ -1,9 +1,10 @@
 import request from "@/utils/request";
 //获取所有大队列表
-export function getDdlist() {
+export function getDdlist(data) {
     return request({
       url: "/backend/tongji/ddlist",
       method: "get",
+      params: data,
     });
   }
   export function getPoliceId(data) {
@@ -14,46 +15,52 @@ export function getDdlist() {
     })
   }
   // 发现隐患-整改隐患数
-  export function tongjiBroad() {
+  export function tongjiBroad(data) {
     return request({
       url: '/backend/tongji-broad/page',
       method: "get",
+      params: data,
     })
   }
   //设备扫码量排行
-  export function tongjiDevscanorder() {
+  export function tongjiDevscanorder(data) {
     return request({
       url: '/backend/devscan-order/page',
       method: "get",
+      params: data,
     })
   }
   //设备隐患排行
-  export function tongjiDengertypeorder() {
+  export function tongjiDengertypeorder(data) {
     return request({
       url: '/backend/dengertype-order/page',
       method: "get",
+      params: data,
     })
   }
   //监督员统计
-  export function watcherPage() {
+  export function watcherPage(data) {
     return request({
       url: '/backend/watcher/page',
       method: "get",
+      params: data,
     })
   }
 
   //监督员
-  export function watcherorglist() {
+  export function watcherorglist(data) {
     return request({
       url: '/backend/tongji/watcherorglist',
       method: "get",
+      params: data,
     })
   }
     //实时统计
-  export function activetimeTongji() {
+  export function activetimeTongji(data) {
     return request({
       url:'/backend/activetime-tongji/page',
       method: "get",
+      params: data,
     })
   }
     

src/views/backend/actdateTongji/index.vue

@@ -130,7 +130,7 @@
             clearable
             v-model="form.actdate"
             type="date"
-            value-format="timestamp"
+            value-format="yyyy-MM-dd"
             placeholder="选择统计日期"
           />
         </el-form-item>

src/views/backend/realTime/index.vue

@@ -47,7 +47,7 @@ export default {
   },
   methods: {
     navList() {
-      activetimeTongji({ pageNo: 1, pageSize: 9999, deptid: this.deptid }).then(
+      activetimeTongji({ pageNo: 1, pageSize: 99, deptid: this.deptid }).then(
         (response) => {
           if (response.data) {
             const tongjiData = response.data.list.filter((item) => {

src/views/backend/statisticsFire/component/barChart.vue

@@ -8,6 +8,10 @@
       marginRight: '16px',
     }"
   >
+    <!-- <div style="width: 100%;" v-if="people.length == 0">
+      <div style="font-size:18px;margin:20px">监督员质态统计</div>
+      <div style="text-align: center;margin-top:100px;color:#909399;font-size:16px">暂无数据</div>
+    </div> -->
     <div ref="chart" class="chart"></div>
   </div>
 </template>
@@ -51,6 +55,8 @@ export default {
   watch: {
     watcherList: function (newData, oldData) {
       if (newData !== oldData) {
+        this.people = [];
+        this.quality =[];
         this.initChart();
       }
     },

src/views/backend/statisticsFire/component/unitActive.vue

@@ -30,7 +30,7 @@ export default {
       type: String,
       default: "#fff",
     },
-    reportData: {
+    actList: {
       type: Object,
       default: {},
     },
@@ -38,19 +38,26 @@ export default {
   data() {
     return {
       chart: null,
+      actdate:[],
+      actorgs:[]
     };
   },
   mounted() {},
   watch: {
-    reportData: function (newData, oldData) {
+    actList: function (newData, oldData) {
       if (newData !== oldData) {
+        this.actdate = [];
+        this.actorgs =[];
         this.initChart();
       }
     },
   },
   methods: {
     initChart() {
-      console.log(this.reportData, "-================");
+      this.actList.forEach((item) => {
+        this.actdate.push(item.actdate);
+        this.actorgs.push(item.actorgs);
+      });
       this.chart = echarts.init(this.$refs.chart, "macarons");
       this.chart.setOption({
         tooltip: {
@@ -65,7 +72,7 @@ export default {
         // },
         xAxis: {
           type: "category",
-        data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+        data: this.actdate,
         axisLabel: {
           rotate: 45, // 设置标签倾斜角度，单位为度
         },
@@ -76,7 +83,7 @@ export default {
         },
         series: [
         {
-          data: [120, 200, 150, 80, 70, 110, 130],
+          data: this.actorgs,
           type: "bar",
           barWidth: "16px",
           itemStyle: {

src/views/backend/statisticsFire/component/unitbartChart.vue

@@ -7,6 +7,20 @@
       background: background,
     }"
   >
+   
+    <!-- <div v-if="people.length == 0" style="width: 100%">
+      <div style="font-size: 18px; margin: 20px">监督员质态统计</div>
+      <div
+        style="
+          text-align: center;
+          margin-top: 100px;
+          color: #909399;
+          font-size: 16px;
+        "
+      >
+        暂无数据
+      </div>
+    </div> -->
     <div ref="chart" class="chart"></div>
   </div>
 </template>
@@ -43,36 +57,37 @@ export default {
   data() {
     return {
       chart: null,
-      people:[],
-      servorg:[]
+      people: [],
+      servorg: [],
     };
   },
   watch: {
     watcherList: function (newData, oldData) {
       if (newData !== oldData) {
+        this.servorg = [];
+        this.people = [];
         this.initChart();
       }
     },
   },
   methods: {
-
-    initChart(){
-      this.watcherList.forEach(item=>{
-      this.servorg.push(item.servorg);
-      this.people.push(item.watcher);
-    });
+    initChart() {
+      this.watcherList.forEach((item) => {
+        this.servorg.push(item.servorg);
+        this.people.push(item.watcher);
+      });
       this.chart = echarts.init(this.$refs.chart, "macarons");
-    this.chart.setOption({
+      this.chart.setOption({
         title: {
-        text: "监督员分管单位统计",
-        textStyle: {
-          color: '#0F2B4C',
-          top:20
+          text: "监督员分管单位统计",
+          textStyle: {
+            color: "#0F2B4C",
+            top: 20,
+          },
+          top: 10,
+          left: 5,
         },
-        top:10,
-        left:5
-      },
-      tooltip: {
+        tooltip: {
           trigger: "axis",
           axisPointer: {
             type: "shadow",
@@ -84,29 +99,28 @@ export default {
             );
           },
         },
-      xAxis: {
-        type: "category",
-        data:this.people,
-        axisLabel: {
-          rotate: 45, // 设置标签倾斜角度，单位为度
-        },
-      },
-      yAxis: {
-        type: "value",
-      },
-      series: [
-        {
-          data:this.servorg,
-          type: "bar",
-          barWidth: "16px",
-          itemStyle: {
-            color: "#01BCEB",
+        xAxis: {
+          type: "category",
+          data: this.people,
+          axisLabel: {
+            rotate: 45, // 设置标签倾斜角度，单位为度
           },
         },
-      ],
-    })
-    }
- 
+        yAxis: {
+          type: "value",
+        },
+        series: [
+          {
+            data: this.servorg,
+            type: "bar",
+            barWidth: "16px",
+            itemStyle: {
+              color: "#01BCEB",
+            },
+          },
+        ],
+      });
+    },
   },
   beforeDestroy() {
     if (!this.chart) {

src/views/backend/statisticsFire/index.vue

@@ -55,16 +55,15 @@
               position: absolute;
               top: 0;
               right: 16px;
-              z-index: 999;
+              z-index: 99;
               margin-top: 10px;
             "
           >
             <el-date-picker
               v-model="selectedMonths"
-              type="month"
-              placeholder="选择月份"
-              format="M"
-              value-format="M"
+              type="daterange"
+              placeholder="选择日期"
+              value-format="yyyy-MM-dd"
               @change="handleChange"
             >
             </el-date-picker>
@@ -74,10 +73,10 @@
               <div class="imgs">
                 <img src="../../../assets/images/fire11.png" alt="" />
               </div>
-              <div class="count">3218</div>
+              <div class="count">{{ hotorgdatetotal }}</div>
               <div>当前活跃单位数</div>
             </div>
-            <unit-active :reportData="reportData"> </unit-active>
+            <unit-active :actList="actList"> </unit-active>
           </div>
         </div>
       </div>
@@ -193,7 +192,7 @@ export default {
     return {
       brigade: [],
       selectedTab: 0,
-      selectedMonths: "",
+      selectedMonths:[],
       reportData: {},
       list: [], //单位质态列表
       navData: [
@@ -267,18 +266,18 @@ export default {
       watcherOrgData: null, //监督员
       actList: null, //单位活跃数
       actdate: [],
+      start: "",
+      beforeDate:'',//前7天的日期
+      hotorgdatetotal:0,//当前活跃单位数
     };
   },
   // 监听 Element UI 中的筛选月份变化
-  watch: {
-    //选择月份
-    selectedMonths: function (newVal) {
-      this.fetchData();
-    },
-  },
   created() {
+    this.start = this.parseTime(new Date().getTime(), "{y}-{m}-{d}");
+    this.beforeDate=this.getPreviousDate(7);
+    this.actdate=[this.beforeDate,this.start];
+    this.selectedMonths=[this.beforeDate,this.start];
     this.getList();
-    this.fetchData();
     this.getData();
     this.navList();
     this.Devscanorder();
@@ -290,18 +289,16 @@ export default {
   methods: {
     //得到所有的数字数据
     navList() {
-      tongjiBroad({ pageNo: 1, pageSize: 9999 }).then((response) => {
+      tongjiBroad({ pageNo: 1, pageSize: 99 }).then((response) => {
         if (response.data) {
           this.allNumber = response.data.list;
           this.tongjiData = this.allNumber.filter((item) => {
             return item.deptid == this.deptId;
           });
-          console.log(" this.tongjiData", this.tongjiData);
           if (this.tongjiData.length > 0) {
+            this.hotorgdatetotal=this.tongjiData[0].hotorgdatetotal
             this.detaulData();
-            console.log("111", 111);
           } else {
-            console.log("222", 222);
             this.navData.forEach((item) => {
               item.count = 0;
             });
@@ -383,7 +380,6 @@ export default {
         }
       });
 
-      console.log("this.threeChart", this.threeChart);
     },
     getList() {
       // 执行查询
@@ -395,6 +391,7 @@ export default {
     //切换tab
     clickTab(e) {
       this.deptId = e.name;
+      this.watcherList = [];
       this.navList();
       this.Devscanorder();
       this.Dengertypeorder();
@@ -403,18 +400,20 @@ export default {
       this.getActdateTong();
       this.$forceUpdate();
     },
-    async fetchData() {
-      const time = this.selectedMonths;
-      const month = this.selectedMonths
-        ? this.selectedMonths
-        : new Date().getMonth() + 1; // 如果已选择月份使用已选择的月份，否则默认为当前月份
-      const res = await currentReport({ month: month });
-      this.reportData = res.data;
-    },
     handleChange(val) {
+      const [d1, d2] = val ?? [];
+      const startDate = new Date(d1);
+      const endDate = new Date(d2);
+      if (endDate - startDate > 7 * 24 * 60 * 60 * 1000) {
+        this.$message.warning("选择时间范围不能超过7天");
+        this.selectedMonths = [this.beforeDate, this.start];
+        this.actdate = [this.beforeDate, this.start];
+        return;
+      }
       //选择月份
       this.selectedMonths = val;
-      this.selectedMonth = val;
+      this.actdate = val;
+      this.getActdateTong()
     },
     //质态表格
     getData() {
@@ -427,7 +426,7 @@ export default {
     Devscanorder() {
       tongjiDevscanorder({
         pageNo: 1,
-        pageSize: 999,
+        pageSize: 99,
         deptId: this.deptId,
       }).then((response) => {
         this.devscanorderList = response.data.list;
@@ -445,7 +444,7 @@ export default {
     Dengertypeorder() {
       tongjiDengertypeorder({
         pageNo: 1,
-        pageSize: 999,
+        pageSize: 99,
         deptId: this.deptId,
       }).then((response) => {
         this.dengertypeorderList = response.data.list;
@@ -461,7 +460,7 @@ export default {
     },
     //监督员质态统计
     getWatcher() {
-      watcherPage({ pageNo: 1, pageSize: 99, deptId: this.deptId }).then(
+      watcherPage({ pageNo: 1, pageSize: 99, deptid: this.deptId }).then(
         (response) => {
           this.watcherList = response.data.list;
         }
@@ -475,6 +474,18 @@ export default {
         }
       );
     },
+    // 获取前*天的日期
+    getPreviousDate(numOfDays) {
+      var date = new Date();
+      date.setDate(date.getDate() - numOfDays);
+      var year = date.getFullYear();
+      var month =
+        date.getMonth() + 1 < 10
+          ? "0" + (date.getMonth() + 1)
+          : date.getMonth() + 1;
+      var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
+      return year + "-" + month + "-" + day;
+    },
     //单位活跃数
     getActdateTong() {
       getActdateTongjiPage({
@@ -625,9 +636,9 @@ export default {
         color: #0f2b4c;
         padding: 10px 0 0 10px;
       }
-      ::v-deep .el-date-editor.el-input__inner {
-        width: 121px !important;
-      }
+      //   ::v-deep .el-date-editor.el-input__inner {
+      //     width: 121px !important;
+      //   }
 
       ::v-deep .el-input__prefix {
         color: #0147eb;

src/views/unitorg/microStation/index.vue

@@ -1,654 +1,654 @@
-<template>
-  <div class="app-container">
-    <div ref="sousuH">
-      <!-- 搜索工作栏 -->
-      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
-        <el-form-item label="区县" prop="county">
-          <el-input v-model="queryParams.county" placeholder="请输入区县" clearable @keyup.enter.native="handleQuery" />
-        </el-form-item>
-        <el-form-item label="社区/单位名称" prop="microName">
-          <el-input v-model="queryParams.microName" placeholder="请输入社区/单位名称" clearable
-            @keyup.enter.native="handleQuery" />
-        </el-form-item>
-        <el-form-item label="建站日期" prop="builtOn">
-          <el-date-picker unlink-panels  v-model="queryParams.builtOn" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
-            range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
-            :default-time="['00:00:00', '23:59:59']" />
-          <!-- <el-date-picker clearable v-model="queryParams.builtOn" type="date" value-format="yyyy-MM-dd"
-            placeholder="建站日期" /> -->
-          <!-- <el-input v-model="queryParams.builtOn" placeholder="请输入建站日期" clearable @keyup.enter.native="handleQuery" /> -->
-        </el-form-item>
-        <el-form-item label="负责人（站长）" prop="charger">
-          <el-input v-model="queryParams.charger" placeholder="请输入负责人（站长）" clearable @keyup.enter.native="handleQuery" />
-        </el-form-item>
-        <el-form-item label="报警电话" prop="alarmTel">
-          <el-input v-model="queryParams.alarmTel" placeholder="请输入报警电话" clearable @keyup.enter.native="handleQuery" />
-        </el-form-item>
-        <el-form-item label="详细地址" prop="addr">
-          <el-input v-model="queryParams.addr" placeholder="请输入详细地址" clearable @keyup.enter.native="handleQuery" />
-        </el-form-item>
-        <!-- <el-form-item label="状态" prop="status">
-          <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
-            <el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="dict.value" :label="dict.label"
-              :value="dict.value" />
-          </el-select>
-        </el-form-item> -->
-        <el-form-item>
-          <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
-        </el-form-item>
-      </el-form>
-      <!-- 操作工具栏 -->
-      <el-row :gutter="10" class="mb8">
-        <!-- <el-col :span="1.5">
-          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
-            v-hasPermi="['backend:micro-station:create']">新增</el-button>
-        </el-col>
-        <el-col :span="1.5">
-          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
-            :loading="exportLoading" v-hasPermi="['backend:micro-station:export']">导出</el-button>
-        </el-col> -->
-        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-      </el-row>
-    </div>
-    <!-- 列表 -->
-    <!-- <el-table v-loading="loading" :data="list" :height="list.length ? tableHeight : 'auto'"> -->
-    <el-table v-loading="loading" :data="list">
-      <el-table-column label="ID" align="center" prop="id" />
-      <el-table-column label="区县" align="center" prop="county" />
-      <el-table-column label="社区/单位名称" align="center" prop="microName" width="200">
-        <template v-slot="scope">
-          <span style="color: forestgreen" @click="showOpentabs(scope.row)">{{ scope.row.microName }}</span>
-        </template>
-      </el-table-column>
-      <!-- <el-table-column label="社区/单位名称" align="center" prop="microName" width="120"/> -->
-      <el-table-column label="详细地址" align="center" prop="addr" />
-      <el-table-column label="建站日期" align="center" prop="builtOn" width="180">
-        <template v-slot="scope">
-          <!-- <span>{{ parseTime(scope.row.builtOn) }}</span> -->
-          <span>{{ scope.row.builtOn }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="负责人（站长）" align="center" prop="charger" width="120" />
-      <el-table-column label="报警电话" align="center" prop="alarmTel" />
-      <el-table-column label="队员数" align="center" prop="members" />
-      <el-table-column label="控制室值班人员" align="center" prop="dutyer" width="130" />
-      <el-table-column label="水罐车" align="center" prop="waterTanker" />
-      <el-table-column label="泡沫车" align="center" prop="foamCar" />
-      <el-table-column label="消防摩托" align="center" prop="fireMoto" />
-      <el-table-column label="其它" align="center" prop="others" />
-      <!-- <el-table-column label="状态" align="center" prop="status">
-        <template v-slot="scope">
-          <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
-        </template>
-      </el-table-column> -->
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
-        <template v-slot="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-            v-hasPermi="['backend:micro-station:update']">修改</el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
-            v-hasPermi="['backend:micro-station:delete']">删除</el-button>
-          <el-button type="text" size="mini" @click="searchAllPeople(scope.row)">查看现有人员</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页组件 -->
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
-    <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="title" :visible.sync="open" width="60%" v-dialogDrag append-to-body class="details">
-      <el-form ref="form" :model="form" :rules="rules" label-width="auto">
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="区县" prop="county">
-              <el-input v-model="form.county" placeholder="请输入区县" />
-            </el-form-item></el-col>
-          <el-col :span="11">
-            <el-form-item label="社区/单位名称" prop="microName">
-              <el-input v-model="form.microName" placeholder="请输入社区/单位名称" />
-            </el-form-item></el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="详细地址" prop="addr">
-              <el-input v-model="form.addr" placeholder="请输入详细地址" />
-            </el-form-item></el-col>
-          <el-col :span="11">
-            <el-form-item label="建站日期" prop="builtOn">
-              <el-date-picker clearable v-model="form.builtOn" type="date" value-format="yyyy-MM-dd" placeholder="建站日期"
-                style="width: 100%;" />
-            </el-form-item></el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="负责人（站长）" prop="charger">
-              <el-input v-model="form.charger" placeholder="请输入负责人（站长）" />
-            </el-form-item>
-          </el-col>
-          <!-- <el-col :span="5"> -->
-          <!-- <el-button type="primary" size="small" @click="addNewPeople">新增人员</el-button> -->
-          <!-- <el-button type="primary" size="small" @click="submitFormBut">提交新人员</el-button> -->
-          <!-- </el-col> -->
-          <el-col :span="11">
-            <el-form-item label="报警电话" prop="alarmTel">
-              <el-input v-model="form.alarmTel" placeholder="请输入报警电话" />
-            </el-form-item></el-col>
-        </el-row>
-        <el-row v-for="(item, index) in formItems" :key="index" :gutter="20">
-          <el-col :span="11">
-            <el-form-item :label="item.label" :prop="item.prop">
-              <el-input v-model="item.value" :placeholder="item.placeholder" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="队员数" prop="members">
-              <el-input v-model="form.members" placeholder="请输入队员数" />
-            </el-form-item></el-col>
-          <el-col :span="11">
-            <el-form-item label="控制室值班人员" prop="dutyer">
-              <el-input v-model="form.dutyer" placeholder="请输入控制室值班人员" />
-            </el-form-item></el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="水罐车" prop="waterTanker">
-              <el-input v-model="form.waterTanker" placeholder="请输入水罐车" />
-            </el-form-item></el-col>
-          <el-col :span="11">
-            <el-form-item label="泡沫车" prop="foamCar">
-              <el-input v-model="form.foamCar" placeholder="请输入泡沫车" />
-            </el-form-item></el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="11">
-            <el-form-item label="消防摩托" prop="fireMoto">
-              <el-input v-model="form.fireMoto" placeholder="请输入消防摩托" />
-            </el-form-item></el-col>
-          <el-col :span="11">
-            <el-form-item label="其它" prop="others">
-              <el-input v-model="form.others" placeholder="请输入其它" />
-            </el-form-item></el-col>
-        </el-row>
-        <!-- <el-row>
-          <el-col :span="12">
-            <el-form-item label="状态" prop="status">
-              <el-radio-group v-model="form.status" style="width: 100%;">
-                <el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
-                  :label="parseInt(dict.value)">{{ dict.label }}</el-radio>
-              </el-radio-group>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12"></el-col>
-        </el-row> -->
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-    <el-dialog :visible.sync="opentabs" width="85vw" append-to-body v-if="opentabs" :title="`单位名称:${opentabsTitle}`">
-      <microStationEvent :microId="microId"></microStationEvent>
-    </el-dialog>
-    <!-- 查看人员的模态框 -->
-    <el-dialog title="现有人员" append-to-body :visible.sync="lookFirePeople" width="50%">
-      <el-table :data="firePeople" border style="width: 100%">
-        <el-table-column prop="empName" label="姓名" width="120">
-        </el-table-column>
-        <el-table-column label="人员类型" width="120">
-          <template slot-scope="scope">
-            <!-- <span>{{ countType || scope.row.empType }}</span> -->
-            <!-- <el-tag>{{ countType || scope.row.empType }}</el-tag> -->
-            <dict-tag :type="DICT_TYPE.MICRO_EMP_TYPE" :value="scope.row.empType" />
-          </template>
-        </el-table-column>
-        <el-table-column prop="idcardno" label="身份证" width="220">
-        </el-table-column>
-        <el-table-column prop="mobile" label="电话号" width="180">
-        </el-table-column>
-        <el-table-column fixed="right" label="操作" width="180">
-          <template slot-scope="scope">
-            <el-button @click="editPeople(scope.row)" type="text" size="small">编辑</el-button>
-            <el-button type="text" size="small" @click="delPeople(scope.row)">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="lookFirePeople = false">取 消</el-button>
-        <el-button type="primary" @click="makeSureFire">确 定</el-button>
-      </span>
-    </el-dialog>
-    <!-- 内层修改模态框 -->
-    <el-dialog title="编辑人员" append-to-body  :visible.sync="insideModal" width="50%">
-      <el-form ref="form" :model="insideForm" label-width="80px">
-        <el-form-item label="姓名">
-          <el-input v-model="insideForm.name" @blur="nameBlur"></el-input>
-          <span v-if="nameRule" style="color: red;font-size: 12px;">名字不能为空</span>
-        </el-form-item>
-        <el-form-item label="人员类型">
-          <!-- <el-input v-model="insideForm.type"></el-input> -->
-          <!-- <el-select v-model="insideForm.type" placeholder="请选择">
-            <el-option key="0" label="普通人员" value="0" />
-            <el-option key="1" label="值班人员" value="1" />
-            <el-option key="2" label="站长" value="2" />
-          </el-select> -->
-          <el-select v-model="insideForm.type" placeholder="请选择处理方式" style="width: 100%">
-            <el-option v-for="dict in this.getDictDatas(DICT_TYPE.MICRO_EMP_TYPE)" :key="dict.value" :label="dict.label"
-              :value="dict.value" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="身份证">
-          <el-input v-model="insideForm.idcard" @blur="idcardBlur"></el-input>
-          <span v-if="idcardRule" style="color: red;font-size: 12px;">身份证号有误</span>
-        </el-form-item>
-        <el-form-item label="电话号">
-          <el-input v-model="insideForm.phone" @blur="phoneBlur"></el-input>
-          <span v-if="phoneRule" style="color: red;font-size: 12px;">电话号有误</span>
-        </el-form-item>
-      </el-form>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="insideModal = false">取 消</el-button>
-        <el-button type="primary" @click="insideSure">确 定</el-button>
-      </span>
-    </el-dialog>
-    <!-- 确认删除对话框 -->
-    <el-dialog title="提示" :visible.sync="delModals" width="30%">
-      <i class="el-icon-warning" style="color: orange;"></i>
-      <span>确认删除该段信息？</span>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="delModals = false">取 消</el-button>
-        <el-button type="primary" @click="makeDelThis">确 定</el-button>
-      </span>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import { createMicroStation, updateMicroStation, deleteMicroStation, getMicroStation, getMicroStationPage, exportMicroStationExcel } from "@/api/backend/microStation"
-import { getTableHeight } from "@/utils/ruoyi.js";
-import { getAllPeople, delFirePeople, editFirePeople } from '@/api/miniFirestation/index'
-import microStationEvent from "@/views/backend/microStationEvent/index";
-import { DICT_TYPE, getDictDatas } from "@/utils/dict";
-export default {
-  name: "MicroStation",
-  components: {
-    microStationEvent
-  },
-  data() {
-    return {
-      microId: '',
-      opentabs: false,
-      opentabsTitle: '',
-      // 遮罩层
-      loading: true,
-      // 导出遮罩层
-      exportLoading: false,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 微型消防站列表
-      list: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNo: 1,
-        pageSize: 10,
-        county: null,
-        microName: null,
-        builtOn: undefined,
-        charger: null,
-        alarmTel: null,
-        status: null,
-      },
-      // 表单参数
-      form: {
-        status: 0
-      },
-      // 表单校验
-      rules: {
-        status: [{ required: true, message: "状态不能为空", trigger: "blur" }],
-      },
-      tableHeight: "",
-      formItems: [], // 存储表单项的数据
-      lookFirePeople: false,
-      firePeople: [],
-      insideModal: false,
-      insideForm: {
-        name: "",
-        type: "",
-        idcard: "",
-        phone: ""
-      },
-      insideUpdateId: '',
-      nameRule: false,
-      idcardRule: false,
-      phoneRule: false,
-      firestationid: "",
-      delPeopleId: "",
-      delModals: false,//确认删除模态框
-    }
-  },
-  props: ["orgId"],
-  watch: {
-    orgId: { //深度监听，可监听到对象、数组的变化
-      handler(newV, oldV) {
-        this.getList()
-      },
-      deep: true
-    }
-  },
-  mounted() {
-    //挂载window.onresize事件(动态设置table高度)
-    window.addEventListener('resize', () => {
-      this.$nextTick(() => {
-        if (this.$refs['sousuH']) {
-          this.tableHeight = getTableHeight(this.$refs['sousuH'].clientHeight + 200)
-        }
-      })
-    })
-  },
-  created() {
-    this.getList()
-    this.$nextTick(() => {
-      this.tableHeight = getTableHeight(this.$refs['sousuH'].clientHeight + 200)
-    })
-  },
-  computed: {
-    countType(num) {
-      // return '456'
-      if (num === '1') {
-        return '值班人员'
-      } else if (num === '2') {
-        return '站长'
-      } else {
-        return '普通人员'
-      }
-    }
-  },
-  methods: {
-    showOpentabs(micro) {
-      this.microId = micro.id
-      this.opentabs = true
-      this.opentabsTitle = micro.microName
-    },
-    /** 查询列表 */
-    getList() {
-      this.loading = true
-      // 执行查询
-      // if(this.queryParams.builtOn){
-      //   this.$set(this.queryParams,'builtOn',toString(this.queryParams.builtOn))
-      // }
-      this.queryParams.orgId = this.orgId
-      // console.log('params',this.queryParams);
-      getMicroStationPage(this.queryParams).then(response => {
-        this.list = response.data.list
-        this.total = response.data.total
-        this.loading = false
-      })
-    },
-    /** 取消按钮 */
-    cancel() {
-      this.open = false
-      this.reset()
-    },
-    /** 表单重置 */
-    reset() {
-      this.form = {
-        id: undefined,
-        county: undefined,
-        microName: undefined,
-        addr: undefined,
-        builtOn: undefined,
-        charger: undefined,
-        alarmTel: undefined,
-        members: undefined,
-        dutyer: undefined,
-        waterTanker: undefined,
-        foamCar: undefined,
-        fireMoto: undefined,
-        others: undefined,
-        status: 0,
-      }
-      this.resetForm("form")
-      this.form.orgId = this.orgId
-      this.queryParams.orgId=this.orgId?this.orgId:''
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNo = 1
-      this.getList()
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm")
-      this.handleQuery()
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset()
-      this.open = true
-      this.title = "添加微型消防站"
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.formItems = []
-      this.reset()
-      const id = row.id
-      getMicroStation(id).then(response => {
-        this.form = response.data
-        this.open = true
-        this.title = "修改微型消防站"
-      })
-    },
-    /** 提交按钮 */
-    submitForm() {
-      const antherForm = this.formItems.map((item) => item.value);
-      this.$refs["form"].validate((valid) => {
-        if (!valid) {
-          return
-        }
-        // 修改的提交
-        if (this.form.id != null) {
-          updateMicroStation(this.form).then((response) => {
-            this.$modal.msgSuccess("修改成功")
-            this.open = false
-            this.getList()
-          })
-          return
-        }
-        // 添加的提交
-        createMicroStation(this.form).then((response) => {
-          this.$modal.msgSuccess("新增成功")
-          this.open = false
-          this.getList()
-        })
-      })
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const id = row.id
-      this.$modal
-        .confirm('是否确认删除商品分类编号为"' + id + '"的数据项?')
-        .then(function () {
-          return deleteMicroStation(id)
-        })
-        .then(() => {
-          this.getList()
-          this.$modal.msgSuccess("删除成功")
-        })
-        .catch(() => { })
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      // 处理查询参数
-      let params = { ...this.queryParams }
-      params.pageNo = undefined
-      params.pageSize = undefined
-      // 执行导出
-      this.$modal
-        .confirm("是否确认导出所有数据项?")
-        .then(() => {
-          this.exportLoading = true
-          return exportMicroStationExcel(params)
-        })
-        .then((response) => {
-          this.$download.excel(response, "微型消防站列表.xls")
-          this.exportLoading = false
-        })
-        .catch(() => { })
-    },
-    addNewPeople() {
-      // if (this.formItems.length < 24) {
-      const newItem = [
-        {
-          label: `名字`,
-          prop: `custom_${this.formItems.length + 1}`,
-          value: '',
-          placeholder: '请输入名字',
-        },
-        {
-          label: '身份证号',
-          prop: `custom_${this.formItems.length + 1}`,
-          value: '',
-          placeholder: '请输入身份证号',
-        },
-        {
-          label: '电话',
-          prop: `custom_${this.formItems.length + 1}`,
-          value: '',
-          placeholder: '请输入电话号码',
-        },
-        {
-          label: '职务',
-          prop: `custom_${this.formItems.length + 1}`,
-          value: '',
-          placeholder: '请输入职务',
-        },
-      ];
-      this.formItems = this.formItems.concat(newItem);
-      // } else {
-      //   // 达到最大数量，给出提示或执行其他操作
-      //   console.log('已达到最大数量');
-      //   console.log(this.formItems.length);
-      // }
-    },
-    submitFormBut() {
-      // 获取所有新增表单项的值
-      const values = this.formItems.map((item) => item.value);
-      console.log(values);
-      // 执行其他操作，如提交表单
-    },
-    searchAllPeople(row) {
-      this.firestationid = row.id
-      getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
-        this.firePeople = res.data.list
-      })
-      this.lookFirePeople = true
-    },
-    makeSureFire() {
-      this.lookFirePeople = false
-    },
-    delPeople(row) {
-      this.delPeopleId = row.id
-      this.delModals = true
-      // this.lookFirePeople = false
-    },
-    makeDelThis() {
-      delFirePeople(this.delPeopleId).then(res => {
-        if (res.data) {
-          this.$message({
-            message: '删除成功',
-            type: 'success'
-          });
-          getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
-            this.firePeople = res.data.list
-          })
-          this.delModals = false
-        }
-      })
-    },
-    editPeople(row) {
-      this.insideForm.name = row.empName
-      this.insideForm.idcard = row.idcardno
-      this.insideForm.phone = row.mobile
-      this.insideForm.type = row.empType
-      this.insideUpdateId = row.id
-      this.insideModal = true
-    },
-    insideSure() {
-      if (!(this.nameRule || this.phoneRule || this.idcardRule)) {
-        // 当 nameRule、phoneRule 和 idcardRule 都为 false 时，执行这里的代码
-        editFirePeople({ id: this.insideUpdateId, empName: this.insideForm.name, empType: this.insideForm.type, idcardno: this.insideForm.idcard, mobile: this.insideForm.phone }).then(res => {
-          // console.log(res,'update');
-          if (res.data) {
-            this.$message({
-              message: '修改成功',
-              type: 'success'
-            });
-            this.insideModal = false
-            getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
-        this.firePeople = res.data.list
-      })
-            // this.lookFirePeople = false
-          }
-        })
-      } else {
-        this.$message({
-          message: '请检查表单项',
-          type: 'error'
-        });
-      }
-
-
-
-    },
-
-    nameBlur() {
-      if (this.insideForm.name === '') {
-        this.nameRule = true
-      } else {
-        this.nameRule = false
-      }
-    },
-    idcardBlur() {
-      const idCardRegex = /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}[\dXx]$/;
-      if (idCardRegex.test(this.insideForm.idcard)) {
-        this.idcardRule = false
-      } else {
-        this.idcardRule = true
-      }
-    },
-    phoneBlur() {
-      console.log(211);
-      const phoneRegex = /^1[3456789]\d{9}$/;
-      if (phoneRegex.test(this.insideForm.phone)) {
-        this.phoneRule = false
-      } else {
-        this.phoneRule = true
-      }
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.details {
-
-  ::v-deep .el-form-item__label,
-  ::v-deep .el-form-item__content {
-    font-size: 16px;
-    color: #86909C;
-    font-weight: 500;
-  }
-
-  ::v-deep .el-form-item__content {
-    font-size: 14px;
-    color: #444444 !important;
-  }
-}
+<template>
+  <div class="app-container">
+    <div ref="sousuH">
+      <!-- 搜索工作栏 -->
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
+        <el-form-item label="区县" prop="county">
+          <el-input v-model="queryParams.county" placeholder="请输入区县" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="社区/单位名称" prop="microName">
+          <el-input v-model="queryParams.microName" placeholder="请输入社区/单位名称" clearable
+            @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="建站日期" prop="builtOn">
+          <el-date-picker unlink-panels  v-model="queryParams.builtOn" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
+            range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
+            :default-time="['00:00:00', '23:59:59']" />
+          <!-- <el-date-picker clearable v-model="queryParams.builtOn" type="date" value-format="yyyy-MM-dd"
+            placeholder="建站日期" /> -->
+          <!-- <el-input v-model="queryParams.builtOn" placeholder="请输入建站日期" clearable @keyup.enter.native="handleQuery" /> -->
+        </el-form-item>
+        <el-form-item label="负责人（站长）" prop="charger">
+          <el-input v-model="queryParams.charger" placeholder="请输入负责人（站长）" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="报警电话" prop="alarmTel">
+          <el-input v-model="queryParams.alarmTel" placeholder="请输入报警电话" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="详细地址" prop="addr">
+          <el-input v-model="queryParams.addr" placeholder="请输入详细地址" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <!-- <el-form-item label="状态" prop="status">
+          <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
+            <el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="dict.value" :label="dict.label"
+              :value="dict.value" />
+          </el-select>
+        </el-form-item> -->
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <!-- 操作工具栏 -->
+      <el-row :gutter="10" class="mb8">
+        <!-- <el-col :span="1.5">
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
+            v-hasPermi="['backend:micro-station:create']">新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
+            :loading="exportLoading" v-hasPermi="['backend:micro-station:export']">导出</el-button>
+        </el-col> -->
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+    </div>
+    <!-- 列表 -->
+    <!-- <el-table v-loading="loading" :data="list" :height="list.length ? tableHeight : 'auto'"> -->
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="ID" align="center" prop="id" />
+      <el-table-column label="区县" align="center" prop="county" />
+      <el-table-column label="社区/单位名称" align="center" prop="microName" width="200">
+        <template v-slot="scope">
+          <span style="color: forestgreen" @click="showOpentabs(scope.row)">{{ scope.row.microName }}</span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="社区/单位名称" align="center" prop="microName" width="120"/> -->
+      <el-table-column label="详细地址" align="center" prop="addr" />
+      <el-table-column label="建站日期" align="center" prop="builtOn" width="180">
+        <template v-slot="scope">
+          <!-- <span>{{ parseTime(scope.row.builtOn) }}</span> -->
+          <span>{{ scope.row.builtOn }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="负责人（站长）" align="center" prop="charger" width="120" />
+      <el-table-column label="报警电话" align="center" prop="alarmTel" />
+      <el-table-column label="队员数" align="center" prop="members" />
+      <el-table-column label="控制室值班人员" align="center" prop="dutyer" width="130" />
+      <el-table-column label="水罐车" align="center" prop="waterTanker" />
+      <el-table-column label="泡沫车" align="center" prop="foamCar" />
+      <el-table-column label="消防摩托" align="center" prop="fireMoto" />
+      <el-table-column label="其它" align="center" prop="others" />
+      <!-- <el-table-column label="状态" align="center" prop="status">
+        <template v-slot="scope">
+          <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
+        </template>
+      </el-table-column> -->
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
+        <template v-slot="scope">
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+            v-hasPermi="['backend:micro-station:update']">修改</el-button>
+          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+            v-hasPermi="['backend:micro-station:delete']">删除</el-button>
+          <el-button type="text" size="mini" @click="searchAllPeople(scope.row)">查看现有人员</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页组件 -->
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
+      @pagination="getList" />
+    <!-- 对话框(添加 / 修改) -->
+    <el-dialog :title="title" :visible.sync="open" width="60%" v-dialogDrag append-to-body class="details">
+      <el-form ref="form" :model="form" :rules="rules" label-width="auto">
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="区县" prop="county">
+              <el-input v-model="form.county" placeholder="请输入区县" />
+            </el-form-item></el-col>
+          <el-col :span="11">
+            <el-form-item label="社区/单位名称" prop="microName">
+              <el-input v-model="form.microName" placeholder="请输入社区/单位名称" />
+            </el-form-item></el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="详细地址" prop="addr">
+              <el-input v-model="form.addr" placeholder="请输入详细地址" />
+            </el-form-item></el-col>
+          <el-col :span="11">
+            <el-form-item label="建站日期" prop="builtOn">
+              <el-date-picker clearable v-model="form.builtOn" type="date" value-format="yyyy-MM-dd" placeholder="建站日期"
+                style="width: 100%;" />
+            </el-form-item></el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="负责人（站长）" prop="charger">
+              <el-input v-model="form.charger" placeholder="请输入负责人（站长）" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="5"> -->
+          <!-- <el-button type="primary" size="small" @click="addNewPeople">新增人员</el-button> -->
+          <!-- <el-button type="primary" size="small" @click="submitFormBut">提交新人员</el-button> -->
+          <!-- </el-col> -->
+          <el-col :span="11">
+            <el-form-item label="报警电话" prop="alarmTel">
+              <el-input v-model="form.alarmTel" placeholder="请输入报警电话" />
+            </el-form-item></el-col>
+        </el-row>
+        <el-row v-for="(item, index) in formItems" :key="index" :gutter="20">
+          <el-col :span="11">
+            <el-form-item :label="item.label" :prop="item.prop">
+              <el-input v-model="item.value" :placeholder="item.placeholder" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="队员数" prop="members">
+              <el-input v-model="form.members" placeholder="请输入队员数" />
+            </el-form-item></el-col>
+          <el-col :span="11">
+            <el-form-item label="控制室值班人员" prop="dutyer">
+              <el-input v-model="form.dutyer" placeholder="请输入控制室值班人员" />
+            </el-form-item></el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="水罐车" prop="waterTanker">
+              <el-input v-model="form.waterTanker" placeholder="请输入水罐车" />
+            </el-form-item></el-col>
+          <el-col :span="11">
+            <el-form-item label="泡沫车" prop="foamCar">
+              <el-input v-model="form.foamCar" placeholder="请输入泡沫车" />
+            </el-form-item></el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="11">
+            <el-form-item label="消防摩托" prop="fireMoto">
+              <el-input v-model="form.fireMoto" placeholder="请输入消防摩托" />
+            </el-form-item></el-col>
+          <el-col :span="11">
+            <el-form-item label="其它" prop="others">
+              <el-input v-model="form.others" placeholder="请输入其它" />
+            </el-form-item></el-col>
+        </el-row>
+        <!-- <el-row>
+          <el-col :span="12">
+            <el-form-item label="状态" prop="status">
+              <el-radio-group v-model="form.status" style="width: 100%;">
+                <el-radio v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
+                  :label="parseInt(dict.value)">{{ dict.label }}</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12"></el-col>
+        </el-row> -->
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog :visible.sync="opentabs" width="85vw" append-to-body v-if="opentabs" :title="`单位名称:${opentabsTitle}`">
+      <microStationEvent :microId="microId"></microStationEvent>
+    </el-dialog>
+    <!-- 查看人员的模态框 -->
+    <el-dialog title="现有人员" append-to-body :visible.sync="lookFirePeople" width="50%">
+      <el-table :data="firePeople" border style="width: 100%">
+        <el-table-column prop="empName" label="姓名" width="120">
+        </el-table-column>
+        <el-table-column label="人员类型" width="120">
+          <template slot-scope="scope">
+            <!-- <span>{{ countType || scope.row.empType }}</span> -->
+            <!-- <el-tag>{{ countType || scope.row.empType }}</el-tag> -->
+            <dict-tag :type="DICT_TYPE.MICRO_EMP_TYPE" :value="scope.row.empType" />
+          </template>
+        </el-table-column>
+        <el-table-column prop="idcardno" label="身份证" width="220">
+        </el-table-column>
+        <el-table-column prop="mobile" label="电话号" width="180">
+        </el-table-column>
+        <el-table-column fixed="right" label="操作" width="180">
+          <template slot-scope="scope">
+            <el-button @click="editPeople(scope.row)" type="text" size="small">编辑</el-button>
+            <el-button type="text" size="small" @click="delPeople(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="lookFirePeople = false">取 消</el-button>
+        <el-button type="primary" @click="makeSureFire">确 定</el-button>
+      </span>
+    </el-dialog>
+    <!-- 内层修改模态框 -->
+    <el-dialog title="编辑人员" append-to-body  :visible.sync="insideModal" width="50%">
+      <el-form ref="form" :model="insideForm" label-width="80px">
+        <el-form-item label="姓名">
+          <el-input v-model="insideForm.name" @blur="nameBlur"></el-input>
+          <span v-if="nameRule" style="color: red;font-size: 12px;">名字不能为空</span>
+        </el-form-item>
+        <el-form-item label="人员类型">
+          <!-- <el-input v-model="insideForm.type"></el-input> -->
+          <!-- <el-select v-model="insideForm.type" placeholder="请选择">
+            <el-option key="0" label="普通人员" value="0" />
+            <el-option key="1" label="值班人员" value="1" />
+            <el-option key="2" label="站长" value="2" />
+          </el-select> -->
+          <el-select v-model="insideForm.type" placeholder="请选择处理方式" style="width: 100%">
+            <el-option v-for="dict in this.getDictDatas(DICT_TYPE.MICRO_EMP_TYPE)" :key="dict.value" :label="dict.label"
+              :value="dict.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="身份证">
+          <el-input v-model="insideForm.idcard" @blur="idcardBlur"></el-input>
+          <span v-if="idcardRule" style="color: red;font-size: 12px;">身份证号有误</span>
+        </el-form-item>
+        <el-form-item label="电话号">
+          <el-input v-model="insideForm.phone" @blur="phoneBlur"></el-input>
+          <span v-if="phoneRule" style="color: red;font-size: 12px;">电话号有误</span>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="insideModal = false">取 消</el-button>
+        <el-button type="primary" @click="insideSure">确 定</el-button>
+      </span>
+    </el-dialog>
+    <!-- 确认删除对话框 -->
+    <el-dialog title="提示" :visible.sync="delModals" width="30%">
+      <i class="el-icon-warning" style="color: orange;"></i>
+      <span>确认删除该段信息？</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="delModals = false">取 消</el-button>
+        <el-button type="primary" @click="makeDelThis">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { createMicroStation, updateMicroStation, deleteMicroStation, getMicroStation, getMicroStationPage, exportMicroStationExcel } from "@/api/backend/microStation"
+import { getTableHeight } from "@/utils/ruoyi.js";
+import { getAllPeople, delFirePeople, editFirePeople } from '@/api/miniFirestation/index'
+import microStationEvent from "@/views/backend/microStationEvent/index";
+import { DICT_TYPE, getDictDatas } from "@/utils/dict";
+export default {
+  name: "MicroStation",
+  components: {
+    microStationEvent
+  },
+  data() {
+    return {
+      microId: '',
+      opentabs: false,
+      opentabsTitle: '',
+      // 遮罩层
+      loading: true,
+      // 导出遮罩层
+      exportLoading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 微型消防站列表
+      list: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10,
+        county: null,
+        microName: null,
+        builtOn: undefined,
+        charger: null,
+        alarmTel: null,
+        status: null,
+      },
+      // 表单参数
+      form: {
+        status: 0
+      },
+      // 表单校验
+      rules: {
+        status: [{ required: true, message: "状态不能为空", trigger: "blur" }],
+      },
+      tableHeight: "",
+      formItems: [], // 存储表单项的数据
+      lookFirePeople: false,
+      firePeople: [],
+      insideModal: false,
+      insideForm: {
+        name: "",
+        type: "",
+        idcard: "",
+        phone: ""
+      },
+      insideUpdateId: '',
+      nameRule: false,
+      idcardRule: false,
+      phoneRule: false,
+      firestationid: "",
+      delPeopleId: "",
+      delModals: false,//确认删除模态框
+    }
+  },
+  props: ["orgId"],
+  watch: {
+    orgId: { //深度监听，可监听到对象、数组的变化
+      handler(newV, oldV) {
+        this.getList()
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    //挂载window.onresize事件(动态设置table高度)
+    window.addEventListener('resize', () => {
+      this.$nextTick(() => {
+        if (this.$refs['sousuH']) {
+          this.tableHeight = getTableHeight(this.$refs['sousuH'].clientHeight + 200)
+        }
+      })
+    })
+  },
+  created() {
+    this.getList()
+    this.$nextTick(() => {
+      this.tableHeight = getTableHeight(this.$refs['sousuH'].clientHeight + 200)
+    })
+  },
+  computed: {
+    countType(num) {
+      // return '456'
+      if (num === '1') {
+        return '值班人员'
+      } else if (num === '2') {
+        return '站长'
+      } else {
+        return '普通人员'
+      }
+    }
+  },
+  methods: {
+    showOpentabs(micro) {
+      this.microId = micro.id
+      this.opentabs = true
+      this.opentabsTitle = micro.microName
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true
+      // 执行查询
+      // if(this.queryParams.builtOn){
+      //   this.$set(this.queryParams,'builtOn',toString(this.queryParams.builtOn))
+      // }
+      this.queryParams.orgId = this.orgId
+      // console.log('params',this.queryParams);
+      getMicroStationPage(this.queryParams).then(response => {
+        this.list = response.data.list
+        this.total = response.data.total
+        this.loading = false
+      })
+    },
+    /** 取消按钮 */
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    /** 表单重置 */
+    reset() {
+      this.form = {
+        id: undefined,
+        county: undefined,
+        microName: undefined,
+        addr: undefined,
+        builtOn: undefined,
+        charger: undefined,
+        alarmTel: undefined,
+        members: undefined,
+        dutyer: undefined,
+        waterTanker: undefined,
+        foamCar: undefined,
+        fireMoto: undefined,
+        others: undefined,
+        status: 0,
+      }
+      this.resetForm("form")
+      this.form.orgId = this.orgId
+      this.queryParams.orgId=this.orgId?this.orgId:''
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm")
+      this.handleQuery()
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = "添加微型消防站"
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.formItems = []
+      this.reset()
+      const id = row.id
+      getMicroStation(id).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = "修改微型消防站"
+      })
+    },
+    /** 提交按钮 */
+    submitForm() {
+      const antherForm = this.formItems.map((item) => item.value);
+      this.$refs["form"].validate((valid) => {
+        if (!valid) {
+          return
+        }
+        // 修改的提交
+        if (this.form.id != null) {
+          updateMicroStation(this.form).then((response) => {
+            this.$modal.msgSuccess("修改成功")
+            this.open = false
+            this.getList()
+          })
+          return
+        }
+        // 添加的提交
+        createMicroStation(this.form).then((response) => {
+          this.$modal.msgSuccess("新增成功")
+          this.open = false
+          this.getList()
+        })
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const id = row.id
+      this.$modal
+        .confirm('是否确认删除商品分类编号为"' + id + '"的数据项?')
+        .then(function () {
+          return deleteMicroStation(id)
+        })
+        .then(() => {
+          this.getList()
+          this.$modal.msgSuccess("删除成功")
+        })
+        .catch(() => { })
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams }
+      params.pageNo = undefined
+      params.pageSize = undefined
+      // 执行导出
+      this.$modal
+        .confirm("是否确认导出所有数据项?")
+        .then(() => {
+          this.exportLoading = true
+          return exportMicroStationExcel(params)
+        })
+        .then((response) => {
+          this.$download.excel(response, "微型消防站列表.xls")
+          this.exportLoading = false
+        })
+        .catch(() => { })
+    },
+    addNewPeople() {
+      // if (this.formItems.length < 24) {
+      const newItem = [
+        {
+          label: `名字`,
+          prop: `custom_${this.formItems.length + 1}`,
+          value: '',
+          placeholder: '请输入名字',
+        },
+        {
+          label: '身份证号',
+          prop: `custom_${this.formItems.length + 1}`,
+          value: '',
+          placeholder: '请输入身份证号',
+        },
+        {
+          label: '电话',
+          prop: `custom_${this.formItems.length + 1}`,
+          value: '',
+          placeholder: '请输入电话号码',
+        },
+        {
+          label: '职务',
+          prop: `custom_${this.formItems.length + 1}`,
+          value: '',
+          placeholder: '请输入职务',
+        },
+      ];
+      this.formItems = this.formItems.concat(newItem);
+      // } else {
+      //   // 达到最大数量，给出提示或执行其他操作
+      //   console.log('已达到最大数量');
+      //   console.log(this.formItems.length);
+      // }
+    },
+    submitFormBut() {
+      // 获取所有新增表单项的值
+      const values = this.formItems.map((item) => item.value);
+      console.log(values);
+      // 执行其他操作，如提交表单
+    },
+    searchAllPeople(row) {
+      this.firestationid = row.id
+      getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
+        this.firePeople = res.data.list
+      })
+      this.lookFirePeople = true
+    },
+    makeSureFire() {
+      this.lookFirePeople = false
+    },
+    delPeople(row) {
+      this.delPeopleId = row.id
+      this.delModals = true
+      // this.lookFirePeople = false
+    },
+    makeDelThis() {
+      delFirePeople(this.delPeopleId).then(res => {
+        if (res.data) {
+          this.$message({
+            message: '删除成功',
+            type: 'success'
+          });
+          getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
+            this.firePeople = res.data.list
+          })
+          this.delModals = false
+        }
+      })
+    },
+    editPeople(row) {
+      this.insideForm.name = row.empName
+      this.insideForm.idcard = row.idcardno
+      this.insideForm.phone = row.mobile
+      this.insideForm.type = row.empType
+      this.insideUpdateId = row.id
+      this.insideModal = true
+    },
+    insideSure() {
+      if (!(this.nameRule || this.phoneRule || this.idcardRule)) {
+        // 当 nameRule、phoneRule 和 idcardRule 都为 false 时，执行这里的代码
+        editFirePeople({ id: this.insideUpdateId, empName: this.insideForm.name, empType: this.insideForm.type, idcardno: this.insideForm.idcard, mobile: this.insideForm.phone }).then(res => {
+          // console.log(res,'update');
+          if (res.data) {
+            this.$message({
+              message: '修改成功',
+              type: 'success'
+            });
+            this.insideModal = false
+            getAllPeople({ pageNo: 1, pageSize: 10, microstationid: this.firestationid }).then(res => {
+        this.firePeople = res.data.list
+      })
+            // this.lookFirePeople = false
+          }
+        })
+      } else {
+        this.$message({
+          message: '请检查表单项',
+          type: 'error'
+        });
+      }
+
+
+
+    },
+
+    nameBlur() {
+      if (this.insideForm.name === '') {
+        this.nameRule = true
+      } else {
+        this.nameRule = false
+      }
+    },
+    idcardBlur() {
+      const idCardRegex = /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}[\dXx]$/;
+      if (idCardRegex.test(this.insideForm.idcard)) {
+        this.idcardRule = false
+      } else {
+        this.idcardRule = true
+      }
+    },
+    phoneBlur() {
+      console.log(211);
+      const phoneRegex = /^1[3456789]\d{9}$/;
+      if (phoneRegex.test(this.insideForm.phone)) {
+        this.phoneRule = false
+      } else {
+        this.phoneRule = true
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.details {
+
+  ::v-deep .el-form-item__label,
+  ::v-deep .el-form-item__content {
+    font-size: 16px;
+    color: #86909C;
+    font-weight: 500;
+  }
+
+  ::v-deep .el-form-item__content {
+    font-size: 14px;
+    color: #444444 !important;
+  }
+}
 </style>