he wei
2025-04-23 b9bd29a1a81f6f7de479e3cc3fdfe3d85fc660bf
src/views/general/alarm/alarmHis.vue
@@ -1,14 +1,17 @@
<script setup name="alarmHis">
   import { ref, reactive, onMounted, watchEffect, } from "vue";
   import { ref, reactive, onMounted, watchEffect, nextTick } from "vue";
   import useWebSocket from "@/hooks/useWebsocket.js";
   import useElement from "@/hooks/useElement.js";
   import { getAreaTreeApi } from "@/api/area";
   import { formatAreaTree } from "@/utils/tree";
   import { confirmAlm, cancelAlm, delAlm } from '@/api/alarm.js';
   import {
      getLinfById,
      getLockAlmHis,
   } from '@/api/lockManager.js';
      import useStation from "@/hooks/useStationList.js";
const { stationName1, stationName2, stationName3, stationName4,
   stationList1, stationList2, stationList3, stationList4, lockList
} = useStation();
   import { Search } from '@element-plus/icons-vue';
@@ -18,13 +21,10 @@
   const pageCurr = ref(1);
   const pageSize = ref(10);
   const total = ref(0);
   const areaId = ref();
   const lockId = ref();
   const areaList = ref([]);
   const lockList = ref([]);
   const confirmFlag = ref(0);
   const startTime = ref('2020-01-01');
   const endTime = ref('');
  const lockName = ref('');
   const datas = reactive({
      tableData: [],
      keyInfo: {},
@@ -65,14 +65,20 @@
   }
   async function getList() {
      let _almIds = checkedTypes.value?.length ? checkedTypes.value.join(',') : 0;
      let _areaId = areaId.value?.length ? areaId.value[areaId.value.length - 1] : undefined;
      let _startTime = startTime.value + ' 00:00:00';
      let _endTime = endTime.value + ' 23:59:59';
      let _pageNum = pageCurr.value;
      let _pageSize = pageSize.value;
    let params = {
      stationName1: stationName1.value || undefined,
      stationName2: stationName2.value || undefined,
      stationName3: stationName3.value || undefined,
      stationName4: stationName4.value || undefined,
      lockName: lockName.value || undefined,
      pageNum: pageCurr.value,
      pageSize: pageSize.value,
      endTime: endTime.value ? endTime.value + ' 23:59:59' : undefined,
      startTime: startTime.value ? startTime.value + ' 00:00:00' : undefined,
      almIdList: checkedTypes.value?.length ? checkedTypes.value : []
    }
      let res = await getLockAlmHis(_areaId, _startTime, _endTime, _pageNum, _pageSize, _almIds);
      let res = await getLockAlmHis(params);
      if (res.code && res.data) {
         let {
            total: _total,
@@ -81,8 +87,8 @@
         // 告警来源[1-平台触发  2-手机APP触发  3-锁具触发]
         datas.tableData = list.map(v => ({
            ...v,
            areaPath: v.linf.areaPath,
            lockName: v.linf.lockName,
        stationName: v.linf.stationName,
            almName: types.find(t => t.value == v.almId).label,
            alarmSource: v.almSource == 1 ? '平台触发' : v.almSource == 2 ? '手机APP触发' : '锁具触发',
            almConfirmedTime: v.almIsConfirmed ? v.almConfirmedTime : '--',
@@ -92,22 +98,6 @@
         total.value = _total;
      }
   }
   async function getLocks() {
      if (!areaId.value.length) {
         $message.error('请选择区域');
         return false;
      }
      let res = await getLinfById(areaId.value[areaId.value.length - 1]);
      let { code, data, data2 } = res;
      let _list = [];
      if (code && data) {
         _list = data2;
      }
      lockList.value = _list;
   }
   function confirmAlarm(scope) {
      $confirm('确认告警', () => {
@@ -156,31 +146,8 @@
   function areaChange() {
      getList();
      // if (!areaId.value.length) {
      //   return false;
      // }
      // getLocks();
   }
   async function getAreaTree() {
      try {
         const res = await getAreaTreeApi();
         let _data = [];
         if (res.code === 1 && res.data) {
            _data = res.data2;
         }
         const treeList = [];
         let ids = _data.map((v) => v.id);
         for (let i = 0; i < _data.length; i++) {
            formatAreaTree(_data[i], ids, treeList);
         }
         // console.log(_data, 'data');
         // console.log(treeList, 'treeList');
         areaList.value = treeList;
      } catch (e) {
         console.log(e);
      }
   }
   function delAlarm(scope) {
      $confirm('删除告警', () => {
@@ -206,7 +173,6 @@
   onMounted(() => {
      endTime.value = moment().format('YYYY-MM-DD');
      getAreaTree();
      getList();
   });
</script>
@@ -216,29 +182,56 @@
    <div class="page-header">
    </div>
    <div class="page-content">
      <hdw-card is-full>
      <yc-card is-full>
        <div class="page-content-wrapper">
          <div class="page-content-tools">
            <div class="tools-filter">
              <div class="tools-filter-item">
                <div class="filter-label">区域</div>
                <div class="filter-label">省:</div>
                <div class="filter-content">
                  <el-cascader class="select" filterable clearable v-model="areaId" @change="areaChange"
                    :props="{ value: 'id', checkStrictly: true }" :options="areaList"><template #default="{ node, data }">
                      <span>{{ data.label }}</span>
                      <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
                    </template></el-cascader>
                </div>
              </div>
              <!-- <div class="tools-filter-item">
                        <div class="filter-label">锁具</div>
                        <div class="filter-content">
                          <el-select v-model="lockId" clearable filterable @change="getList" :placeholder="!areaId?.length ? '请选择区域' : '请选择锁具'">
                            <el-option v-for="item in lockList" :key="'lock_' + item.lockId" :label="item.lockName"
                              :value="item.lockId" />
                  <el-select v-model="stationName1" clearable  placeholder="请选择" @change="() => nextTick(() => sendMessage())" size="small"
                    style="width: 180px">
                    <el-option v-for="(item, idx) in stationList1" :key="'province_' + idx" :label="item" :value="item" />
                          </el-select>
                        </div>
                      </div> -->
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">市:</div>
                <div class="filter-content">
                  <el-select v-model="stationName2" clearable  placeholder="请选择" @change="() => nextTick(() => sendMessage())" size="small"
                    style="width: 180px">
                    <el-option v-for="(item, idx) in stationList2" :key="'city_' + idx" :label="item" :value="item" />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">区县:</div>
                <div class="filter-content">
                  <el-select v-model="stationName3" clearable placeholder="请选择" @change="() => nextTick(() => sendMessage())" size="small"
                    style="width: 180px">
                    <el-option v-for="(item, idx) in stationList3" :key="'list2_' + idx" :label="item" :value="item" />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">机房:</div>
                <div class="filter-content">
                  <el-select v-model="stationName4" clearable placeholder="请选择" @change="() => nextTick(() => sendMessage())" size="small"
                    style="width: 180px">
                    <el-option v-for="(item, idx) in stationList4" :key="'list3_' + idx" :label="item" :value="item" />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">锁具名称:</div>
                <div class="filter-content">
                  <el-select v-model="lockName" clearable filterable placeholder="请选择" @change="() => nextTick(() => sendMessage())" size="small"
                    style="width: 180px">
                    <el-option v-for="(item, idx) in lockList" :key="'list3_' + idx" :label="item.lockName" :value="item.lockName" />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item flex-row">
                <div class="filter-label">告警类型</div>
                <el-checkbox class="select-all" v-model="checkAll" :indeterminate="isIndeterminate"
@@ -262,19 +255,19 @@
              <div class="tools-filter-item">
                <div class="filter-label">起始时间</div>
                <div class="filter-content">
                  <el-date-picker v-model="startTime" @change="getList" value-format="YYYY-MM-DD" type="date"
                  <el-date-picker v-model="startTime" size="small" @change="getList" value-format="YYYY-MM-DD" type="date"
                    placeholder="" />
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">截止时间</div>
                <div class="filter-content">
                  <el-date-picker v-model="endTime" type="date" value-format="YYYY-MM-DD" @change="getList"
                  <el-date-picker v-model="endTime" size="small" type="date" value-format="YYYY-MM-DD" @change="getList"
                    placeholder="" />
                </div>
              </div>
              <div class="tools-filter-item">
                <el-button type="primary" :icon="Search" @click="getList">查询</el-button>
                <el-button type="primary" :icon="Search" size="small" @click="getList">查询</el-button>
              </div>
            </div>
          </div>
@@ -282,10 +275,8 @@
            <div class="pos-rel">
              <div class="pos-abs">
                <el-table :data="datas.tableData" border style="width: 100%; height: 100%">
                  <el-table-column type="index" width="50" />
                  <el-table-column prop="lockId" align="center" label="钥匙ID" width="120" />
                  <el-table-column prop="lockName" align="center" label="钥匙名称" width="140" />
                  <el-table-column prop="areaPath" align="center" label="所属区域" min-width="180" />
                  <el-table-column type="index" fixed="left" width="50" />                  <el-table-column prop="lockName" align="center" label="锁具名称" width="140" />
                  <el-table-column prop="stationName" align="center" label="机房" min-width="180" />
                  <el-table-column prop="almName" align="center" label="告警名称" width="180" />
                  <el-table-column prop="alarmSource" align="center" label="告警来源" width="180" />
                  <!-- <el-table-column prop="almIsConfirmedStr" align="center" label="是否确认" width="180" /> -->
@@ -308,21 +299,16 @@
            <div class="page-tool"></div>
            <div class="el-page-container">
              <el-pagination v-model:current-page="pageCurr" v-model:page-size="pageSize"
                :page-sizes="[20, 40, 60, 80, 100, 200, 300, 400]" size="small" :disabled="disabled"
                :background="background" layout="total, sizes, prev, pager, next, jumper" :total="total"
                :page-sizes="[20, 40, 60, 80, 100, 200, 300, 400]" size="small"
                 layout="total, sizes, prev, pager, next, jumper" :total="total"
                @size-change="handleSizeChange" @current-change="handleCurrentChange" />
            </div>
            <div class="page-tool"></div>
          </div>
        </div>
      </hdw-card>
      </yc-card>
    </div>
    <div class="page-footer"></div>
    <!-- 弹窗 -->
    <el-dialog :title="dialogTitle" v-model="addEditVisible" top="0" :close-on-click-modal="false" class="dialog-center"
      width="700px" center>
      <add-edit v-if="addEditVisible" @success="onOk" :info="datas.keyInfo" @cancel="onCanel"></add-edit>
    </el-dialog>
  </div>
</template>
@@ -397,6 +383,7 @@
  .tools-filter-item {
    display: inline-block;
    margin-right: 8px;
    margin-bottom: 8px;
    &.flex-row {
      display: inline-flex;