U

he wei

6 天以前 4c558f4254bf66fc23f471f9e0a34972cd2cc1ab

 src/views/alarm/battAlarm.vue

@@ -29,6 +29,11 @@
    confirmBattAlm,
  } from "@/api/alarm.js";

  import {
    getBattAlarmIdType,
  } from "@/api/station.js";
  

   const { $loading, $message, $confirm } = useElement();

  const alarmLevel = ref();
@@ -83,7 +88,7 @@
         width: "120",
      },
    {
         prop: "almId",
         prop: "almName",
         label: "告警类型",
         width: "120",
      },
@@ -129,15 +134,26 @@
   const currentAreaId = ref();
   const currentAreaIds = ref([]);
   const datas = reactive({
      tableData: [],
    tableData: [],
      rowData: {},
   });

   // const tableData = reactive([]);
   // const rowData = reactive({});
  const almIds = ref([]);
  const alarmTypeList = ref([]);

   // const userStore = useUserStore();
   // const { uid, uname } = storeToRefs(userStore);
  const checkAll = ref(true);
  const isIndeterminate = ref(false);

  function handleCheckAllChange (val) {
    almIds.value = val ? alarmTypeList.value.map(v => v.value) : []
    isIndeterminate.value = false
  }
  function handleCheckedChange (value) {
    const checkedCount = value.length
    checkAll.value = checkedCount === alarmTypeList.value.length
    isIndeterminate.value = checkedCount > 0 && checkedCount < alarmTypeList.value.length
  }


  // almIds: [119001],
  // almLevel: "1",
@@ -149,7 +165,7 @@
  // stationName: "测试机房6",
  function sendMessage() {
    let params = {
      // almIds: [119001],
      almIds: almIds.value,
      almLevel: alarmLevel.value || undefined,
      provice: provice.value || undefined,
      city: city.value || undefined,
@@ -165,6 +181,18 @@
    nextTick(() => {
      sendMessage();
    });
  }

  // 查询告警类型
  async function getAlarmType() {
    let res = await getBattAlarmIdType();
    let { code, data, data2 } = res;
    let list = [];
    if (code && data) {
      list = Object.keys(data2).map((key) => ({value: key, label: data2[key]}));
    }
    alarmTypeList.value = list;
    almIds.value = list.map(v => v.value);
  }

  watch(
@@ -256,7 +284,8 @@
  }


   onMounted(() => {
   onMounted(async () => {
    await getAlarmType();
      sendMessage();
   });
</script>
@@ -269,96 +298,125 @@
      <yc-card is-full>
        <div class="page-content-wrapper">
          <div class="page-content-tools page-filter">
            <div class="table-row">
              <div class="table-cell text-right">省：</div>
              <div class="table-cell">
                <el-select
                  v-model="provice"
                  size="small"
                  clearable
                  placeholder="请选择省"
                  @change="selectChange"
                >
                  <el-option
                    v-for="item in proviceList"
                    :key="'l0_' + item"
                    :label="item"
                    :value="item"
            <div class="grid-container" :style="{'--counter': 5}">
              <div class="grid-item">
                <div class="label">省</div>
                <div class="value">
                  <el-select
                    v-model="provice"
                    size="small"
                    clearable
                    placeholder="请选择省"
                    @change="selectChange"
                  >
                  </el-option>
                </el-select>
                    <el-option
                      v-for="item in proviceList"
                      :key="'l0_' + item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="table-cell text-right">市：</div>
              <div class="table-cell">
                <el-select
                  v-model="city"
                  size="small"
                  clearable
                  placeholder="请选择市"
                  @change="selectChange"
                >
                  <el-option
                    v-for="item in cityList"
                    :key="'l1_' + item"
                    :label="item"
                    :value="item"
              <div class="grid-item">
                <div class="label">市</div>
                <div class="value">
                  <el-select
                    v-model="city"
                    size="small"
                    clearable
                    placeholder="请选择市"
                    @change="selectChange"
                  >
                  </el-option>
                </el-select>
                    <el-option
                      v-for="item in cityList"
                      :key="'l1_' + item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="table-cell text-right">区县:</div>
              <div class="table-cell">
                <el-select
                  v-model="country"
                  clearable
                  size="small"
                  placeholder="请选择区县"
                  @change="selectChange"
                >
                  <el-option
                    v-for="item in countryList"
                    :key="'l2_' + item"
                    :label="item"
                    :value="item"
              <div class="grid-item">
                <div class="label">区县</div>
                <div class="value">
                  <el-select
                    v-model="country"
                    clearable
                    size="small"
                    placeholder="请选择区县"
                    @change="selectChange"
                  >
                  </el-option>
                </el-select>
                    <el-option
                      v-for="item in countryList"
                      :key="'l2_' + item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="table-cell text-right">站点:</div>
              <div class="table-cell">
                <el-select
                  v-model="stationName"
                  clearable
                  size="small"
                  placeholder="请选择站点"
                  @change="selectChange"
                >
                  <el-option
                    v-for="item in stationList"
                    :key="'l3_' + item.stationId"
                    :label="item.stationName"
                    :value="item.stationName"
              <div class="grid-item">
                <div class="label">站点</div>
                <div class="value">
                  <el-select
                    v-model="stationName"
                    clearable
                    size="small"
                    placeholder="请选择站点"
                    @change="selectChange"
                  >
                  </el-option>
                </el-select>
                    <el-option
                      v-for="item in stationList"
                      :key="'l3_' + item.stationId"
                      :label="item.stationName"
                      :value="item.stationName"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="table-cell text-right">告警等级:</div>
              <div class="table-cell">
                <el-select
                  v-model="alarmLevel"
                  clearable
                  size="small"
                  placeholder="请选择告警等级"
                  @change="selectChange"
                >
                  <el-option
                    v-for="item in alarmLevels"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
              <div class="grid-item">
                <div class="label">告警等级</div>
                <div class="value">
                  <el-select
                    v-model="alarmLevel"
                    clearable
                    size="small"
                    placeholder="请选择告警等级"
                    @change="selectChange"
                  >
                  </el-option>
                </el-select>
                    <el-option
                      v-for="item in alarmLevels"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="grid-item">
                <div class="label">告警类型</div>
                <div class="value flex-row" style="grid-column: span 9;">
                  <el-checkbox
                    v-model="checkAll"
                    :indeterminate="isIndeterminate"
                    @change="handleCheckAllChange"
                  >全选
                  </el-checkbox>
                  <el-checkbox-group
                    class="group"
                    v-model="almIds"
                    @change="handleCheckedChange"
                  >
                    <el-checkbox v-for="(item, idx) in alarmTypeList" :key="'list0_' + idx" :label="item.label" :value="item.value">
                    </el-checkbox>
                  </el-checkbox-group>
                </div>
              </div>
            </div>
          </div>
@@ -395,8 +453,7 @@
            </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">
@@ -434,6 +491,17 @@

  .page-content-tools {
    padding-bottom: 8px;

    .flex-row {
      display: flex;
      align-items: center;
      :deep(.el-checkbox) {
        color: #fff;
      }
      .group {
        margin-left: 30px;
      }
    }
  }

  .page-content-table {