From d0f98ad8e1047e3161a458399ad3005404ed87b8 Mon Sep 17 00:00:00 2001
From: whychdw <496960745@qq.com>
Date: 星期五, 06 六月 2025 15:52:15 +0800
Subject: [PATCH] 标准参数管理
---
src/views/alarm/battHisAlarm.vue | 602 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 602 insertions(+), 0 deletions(-)
diff --git a/src/views/alarm/battHisAlarm.vue b/src/views/alarm/battHisAlarm.vue
new file mode 100644
index 0000000..91d32a6
--- /dev/null
+++ b/src/views/alarm/battHisAlarm.vue
@@ -0,0 +1,602 @@
+<script setup name="battHisAlarm">
+ import { ref, reactive, onMounted, computed, nextTick, watch, } from "vue";
+ import { storeToRefs } from "pinia";
+ import { Search, Plus } from "@element-plus/icons-vue";
+ import ycCard from "@/components/ycCard/index.vue";
+ // import addEdit from "./addEdit.vue";
+ import { ElMessage } from "element-plus";
+ import useElement from "@/hooks/useElement.js";
+ import { useUserStore } from '@/store/user';
+
+ import useStation from "@/hooks/useStationList.js";
+ const { provice, city, country, stationName,
+ proviceList, cityList, countryList, stationList,
+ } = useStation();
+
+ import powerTypes from '@/utils/const/const_powerType.js';
+ import { ExportFile } from '@/utils/exportFile.js';
+ import { useRouter } from "vue-router";
+ const router = useRouter();
+
+ const userStore = useUserStore();
+ const { uid, uname } = storeToRefs(userStore);
+ import moment from 'moment';
+
+
+ import {
+ confirmBattAlm,
+ getBattAlmHis,
+ } from "@/api/alarm.js";
+
+ import {
+ getBattAlarmIdType,
+ } from "@/api/station.js";
+
+
+ const { $loading, $message, $confirm } = useElement();
+
+ const alarmLevel = ref();
+ const alarmLevels = [
+ {
+ label: '涓�绾у憡璀�',
+ value: 1,
+ },
+ {
+ label: '浜岀骇鍛婅',
+ value: 2,
+ },
+ {
+ label: '涓夌骇鍛婅',
+ value: 3,
+ },
+ {
+ label: '鍥涚骇鍛婅',
+ value: 4,
+ },
+ ];
+
+const headers = [
+ // {
+ // prop: "provice",
+ // label: "鐪�",
+ // width: "80",
+ // },
+ // {
+ // prop: "city",
+ // label: "甯�",
+ // width: "80",
+ // },
+ // {
+ // prop: "country",
+ // label: "鍖哄幙",
+ // width: "80",
+ // },
+ {
+ prop: "stationName",
+ label: "鏈烘埧鍚嶇О",
+ width: "160",
+ },
+ // {
+ // prop: "stationType",
+ // label: "鐢靛帇绛夌骇",
+ // width: "80",
+ // },
+ {
+ prop: "battgroupName",
+ label: "鐢垫睜缁勫悕绉�",
+ width: "120",
+ },
+ {
+ prop: "almName",
+ label: "鍛婅绫诲瀷",
+ width: "120",
+ },
+ {
+ prop: "almValue",
+ label: "鍛婅鍊�",
+ width: "120",
+ },
+ {
+ prop: "monNum",
+ label: "鍗曚綋缂栧彿",
+ width: "120",
+ },
+ {
+ prop: "almLevelStr",
+ label: "鍛婅绛夌骇",
+ width: "120",
+ },
+ {
+ prop: "almStartTime",
+ label: "鍛婅寮�濮嬫椂闂�",
+ width: "120",
+ },
+ {
+ prop: "almIsConfirmed",
+ label: "鍛婅鏄惁纭",
+ width: "120",
+ },
+ {
+ prop: "almConfirmedTime",
+ label: "鍛婅纭鏃堕棿",
+ width: "120",
+ },
+ ];
+
+ const background = ref(true);
+ const disabled = ref(false);
+ const pageCurr = ref(1);
+ const pageSize = ref(10);
+ const total = ref(0);
+ const addEditVisible = ref(false);
+ const dialogTitle = ref("");
+ const currentAreaId = ref();
+ const currentAreaIds = ref([]);
+ const datas = reactive({
+ tableData: [],
+ rowData: {},
+ });
+
+ const almIds = ref([]);
+ const alarmTypeList = ref([]);
+
+ 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
+ }
+
+ const _startDate = '2025-01-01 00:00:00';
+ const _endDate = moment().format('YYYY-MM-DD');
+ const almStartTime = ref(moment().subtract(30, 'day').format('YYYY-MM-DD'));
+ const almEndTime = ref(_endDate);
+
+ const startDisabledDate = (time) => almEndTime.value ? moment(almEndTime.value).isBefore(time) || moment().isBefore(time) : moment().isBefore(time);
+
+ const endDisabledDate = (time) => almStartTime.value ? moment(time).isBefore(almStartTime.value) || moment().isBefore(time) : moment().isBefore(time);
+ // almIds: [119001],
+ // almLevel: "1",
+ // city: "姝︽眽甯�",
+ // country: "涓滆タ婀栧尯",
+ // pageNum: 1,
+ // pageSize: 10,
+ // provice: "婀栧寳鐪�",
+ // stationName: "娴嬭瘯鏈烘埧6",
+ function getList() {
+ let params = {
+ almIds: almIds.value,
+ almLevel: alarmLevel.value || undefined,
+ provice: provice.value || undefined,
+ city: city.value || undefined,
+ country: country.value || undefined,
+ stationName: stationName.value || undefined,
+ almStartTime: almStartTime.value ? almStartTime.value + ' 00:00:00' : _startDate,
+ almEndTime: almEndTime.value ? almEndTime.value + ' 23:59:59' : _endDate + ' 23:59:59',
+ pageNum: pageCurr.value,
+ pageSize: pageSize.value,
+ };
+
+ getBattAlmHis(params).then((res) => {
+ let { code, data, data2 } = res;
+ let list = [];
+ let _total = 0;
+ if (code && data) {
+ // console.log(data);
+ list = data2.list.map(v => ({
+ ...v,
+ almLevelStr: ['', '涓�绾у憡璀�', '浜岀骇鍛婅', '涓夌骇鍛婅', '鍥涚骇鍛婅'][v.almLevel],
+ almIsConfirmedStr: ['鏈‘璁�', '宸茬‘璁�'][v.almIsConfirmed],
+ // roleName: roles[v.role],
+ }));
+ _total = data2.total;
+ }
+ datas.tableData = list;
+ total.value = _total;
+ })
+ .catch((err) => {
+ console.log(err);
+ });
+ }
+
+ function selectChange() {
+ nextTick(() => {
+ getList();
+ });
+ }
+
+ // 鏌ヨ鍛婅绫诲瀷
+ 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);
+ }
+
+
+ // 灞曠ず鏁版嵁鏁伴噺
+ function handleSizeChange(val) {
+ pageSize.value = val;
+ getList();
+ }
+ // 缈婚〉
+ function handleCurrentChange(val) {
+ pageCurr.value = val;
+ getList();
+ }
+
+ function confirmAlarm(record) {
+ $confirm("纭鍛婅", () => {
+ let loading = $loading();
+ confirmBattAlm(record.num)
+ .then((res) => {
+ let { code, data } = res;
+ loading.close();
+ if (code && data) {
+ $message.success("鎿嶄綔鎴愬姛");
+ getList();
+ } else {
+ $message.success("鎿嶄綔澶辫触");
+ }
+ })
+ .catch((err) => {
+ loading.close();
+ console.log(err);
+ });
+ });
+ }
+
+ function onOk() {
+ addEditVisible.value = false;
+ handleCurrentChange(1);
+ }
+ function onCanel() {
+ addEditVisible.value = false;
+ }
+
+ function exportExcel() {
+ let _headers = headers.map(v => {
+ let prop = v.prop;
+ let label = v.label;
+ if (prop == 'almIsConfirmed') {
+ prop = 'almIsConfirmedStr';
+ }
+ return {
+ prop,
+ label
+ };
+ });
+ ExportFile(_headers, datas.tableData, "鐢垫睜瀹炴椂鍛婅");
+ }
+
+ function goRt (row) {
+ router.push({
+ path: '/datas/realtime',
+ query: {
+ id: row.battgroupId
+ }
+ });
+ }
+
+
+ onMounted(async () => {
+ await getAlarmType();
+ getList();
+ });
+</script>
+
+<template>
+ <div class="page-wrapper">
+ <!-- <div class="page-header">
+ </div> -->
+ <div class="page-content">
+ <yc-card is-full>
+ <div class="page-content-wrapper">
+ <div class="page-content-tools page-filter">
+ <div class="grid-container" :style="{'--counter': 8}">
+ <div class="grid-item">
+ <div class="label">鐪�</div>
+ <div class="value">
+ <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"
+ >
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">甯�</div>
+ <div class="value">
+ <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"
+ >
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">鍖哄幙</div>
+ <div class="value">
+ <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"
+ >
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">绔欑偣</div>
+ <div class="value">
+ <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"
+ >
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">鍛婅绛夌骇</div>
+ <div class="value">
+ <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"
+ >
+ </el-option>
+ </el-select>
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">娴嬭瘯寮�濮嬫椂闂�</div>
+ <div class="value" style="grid-column: span 5;">
+ <el-date-picker
+ v-model="almStartTime"
+ type="date"
+ size="small"
+ placeholder="閫夋嫨鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ @change="selectChange"
+ :disabled-date="startDisabledDate"
+ />
+ -
+ <el-date-picker
+ v-model="almEndTime"
+ size="small"
+ type="date"
+ placeholder="閫夋嫨鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ @change="selectChange"
+ :disabled-date="endDisabledDate"
+ />
+ </div>
+ </div>
+ <div class="grid-item">
+ <div class="label">鍛婅绫诲瀷</div>
+ <div class="value flex-row" style="grid-column: span 15;">
+ <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>
+ <div class="page-content-table">
+ <div class="pos-rel">
+ <div class="pos-abs">
+ <el-table class="yc-table" stripe height="100%" size="small" :data="datas.tableData" style="width: 100%">
+ <el-table-column type="index" fixed="left" label="搴忓彿" width="60"></el-table-column>
+ <el-table-column v-for="header in headers" :key="header.prop" :prop="header.prop" :label="header.label"
+ :min-width="header.width" align="center">
+ <template #default="scope">
+ <template v-if="header.prop == 'almIsConfirmed'">
+ <el-checkbox disabled :checked="scope.row[header.prop] == 1"></el-checkbox>
+ </template>
+ <template v-else>
+ {{ scope.row[header.prop] || '--' }}
+ </template>
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" fixed="right" width="240" align="center">
+ <template #default="scope">
+ <el-button type="primary" size="small" v-if="!scope.row.almIsConfirmed"
+ @click="confirmAlarm(scope.row)">纭鍛婅</el-button>
+ <el-button type="warning" size="small" @click="goRt(scope.row)">瀹炴椂鐩戞祴</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ </div>
+ <div class="page-content-page">
+ <div class="page-tool">
+ <el-button type="primary" round size="small" @click="getList" :icon="Search">鏌ヨ</el-button>
+ </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"
+ @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+ </div>
+ <div class="page-tool">
+ <el-button type="primary" round size="small" @click="exportExcel" >瀵煎嚭</el-button>
+ </div>
+ </div>
+ </div>
+ </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="860px" center>
+ <add-edit v-if="addEditVisible" @success="onOk" :info="datas.rowData" @cancel="onCanel"></add-edit>
+ </el-dialog> -->
+ </div>
+</template>
+
+<style scoped lang="less">
+.page-wrapper {
+ display: flex;
+ flex-direction: row;
+ // padding: 8px;
+ height: 100%;
+
+ .page-content {
+ flex: 1;
+ }
+}
+
+.page-content-wrapper {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+
+ .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 {
+ // border-top: 1px solid var(--border-light-color);
+ box-sizing: border-box;
+ flex: 1;
+ margin-left: 26px;
+ margin-right: 26px;
+ }
+
+ .page-content-page {
+ padding: 8px 8px 0 8px;
+ text-align: center;
+
+ .el-page-container {
+ display: inline-block;
+ padding: 0 16px;
+ }
+
+ .page-tool {
+ display: inline-block;
+ }
+ }
+}
+
+.hdw-card-container {
+ width: 240px;
+ padding-right: 8px;
+ height: 100%;
+}
+
+.pos-rel {
+ position: relative;
+ width: 100%;
+ height: 100%;
+
+ .pos-abs {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ width: 100%;
+ height: 100%;
+ }
+}
+
+.tools-filter {
+ display: inline-block;
+ font-size: 14px;
+
+ .tools-filter-item {
+ display: inline-block;
+ margin-right: 8px;
+
+ .filter-label {
+ display: inline-block;
+ }
+
+ .filter-content {
+ display: inline-block;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.1