|
@@ -1,10 +1,10 @@
|
|
|
<template>
|
|
|
<div class="layout-pd">
|
|
|
<el-row>
|
|
|
-<!--操作-->
|
|
|
- <el-col :xs="24" >
|
|
|
- <el-card class="mt8" shadow="hover" >
|
|
|
-<el-form :model="state.filter" :inline="true" @submit.stop.prevent style="margin-bottom:-20px;">
|
|
|
+ <!-- 操作区域 -->
|
|
|
+ <el-col :xs="24">
|
|
|
+ <el-card class="mt8" shadow="hover">
|
|
|
+ <el-form :model="state.filter" :inline="true" @submit.stop.prevent style="margin-bottom:-20px;">
|
|
|
<el-form-item prop="name" style="width: 100%">
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
|
|
|
<el-form-item label="推送用户">
|
|
@@ -17,7 +17,6 @@
|
|
|
<el-option label="所有" :value="undefined"></el-option>
|
|
|
<el-option v-for="(value, key) in FuelDispenserEnum" :key="key" :label="value" :value="key" />
|
|
|
</el-select>
|
|
|
- <!-- <el-input v-model="state.filter.isPushed" placeholder="单行输入" clearable></el-input> -->
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :xs="24" :sm="12" :md="8" :lg="8" :xl="6" class="mb20">
|
|
@@ -32,171 +31,155 @@
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
-</el-form-item>
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
|
|
|
<hr>
|
|
|
|
|
|
<el-row justify="space-between" class="submit-button" style="margin-bottom:-6px;">
|
|
|
<el-row>
|
|
|
-<el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
|
|
|
-<el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
|
|
|
-<el-button v-auth="'api:admin:file:upload-file'" type="primary" icon="ele-Upload"> 立即推送
|
|
|
-</el-button>
|
|
|
+ <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
|
|
|
+ <el-button type="primary" icon="ele-RefreshRight" @click="onReset"> 重置 </el-button>
|
|
|
+ <el-button
|
|
|
+ v-auth="'api:admin:file:upload-file'"
|
|
|
+ type="primary"
|
|
|
+ icon="ele-Upload"
|
|
|
+ @click="handlePush"
|
|
|
+ >
|
|
|
+ 立即推送
|
|
|
+ </el-button>
|
|
|
+ </el-row>
|
|
|
</el-row>
|
|
|
- </el-row>
|
|
|
-</el-card>
|
|
|
+ </el-card>
|
|
|
</el-col>
|
|
|
-<!--表格-->
|
|
|
- <el-col :xs="24" >
|
|
|
+
|
|
|
+ <!-- 表格区域 -->
|
|
|
+ <el-col :xs="24">
|
|
|
<el-card style="height: 70vh" class="my-fill mt8" shadow="hover">
|
|
|
-<el-table v-loading="state.loading" stripe :data="state.tableModel" row-key="id" style="width: 100%">
|
|
|
- <el-table-column type="selection" width="55" fixed="left"></el-table-column>
|
|
|
- <el-table-column v-for="column in state.dynamicColumns" :key="column.prop" :prop="column.prop" :label="column.label" >
|
|
|
- </el-table-column>
|
|
|
-<!-- <el-table-column label="操作" fixed="right" header-align="center" align="center" class="right-operation" width="140">
|
|
|
- <template #default="{ row }" >
|
|
|
-<el-link v-if="row.isPushed === '未推送'"
|
|
|
- class="my-el-link mr12 ml12"
|
|
|
- type="primary"
|
|
|
- icon="ele-Upload"
|
|
|
- @click="onDateUpdate(row)"
|
|
|
- :underline="false"
|
|
|
- target="_blank"
|
|
|
- >立即推送</el-link>
|
|
|
-</template>
|
|
|
- </el-table-column> -->
|
|
|
-</el-table>
|
|
|
-<div class="my-flex my-flex-end" style="margin-top: 20px">
|
|
|
- <el-pagination v-model:currentPage="state.pageInput.currentPage"
|
|
|
- v-model:page-size="state.pageInput.pageSize" :total="state.total" :page-sizes="[10, 15, 20, 50, 100]"
|
|
|
- small background @size-change="onSizeChange" @current-change="onCurrentChange"
|
|
|
- layout="total, sizes, prev, pager, next, jumper" />
|
|
|
+ <el-table
|
|
|
+ v-loading="state.loading"
|
|
|
+ stripe
|
|
|
+ :data="state.tableModel"
|
|
|
+ row-key="id"
|
|
|
+ style="width: 100%"
|
|
|
+ ref="tableRef"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" width="55" fixed="left"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ v-for="column in state.dynamicColumns"
|
|
|
+ :key="column.prop"
|
|
|
+ :prop="column.prop"
|
|
|
+ :label="column.label"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="my-flex my-flex-end" style="margin-top: 20px">
|
|
|
+ <el-pagination
|
|
|
+ v-model:currentPage="state.pageInput.currentPage"
|
|
|
+ v-model:page-size="state.pageInput.pageSize"
|
|
|
+ :total="state.total"
|
|
|
+ :page-sizes="[10, 15, 20, 50, 100]"
|
|
|
+ small
|
|
|
+ background
|
|
|
+ @size-change="onSizeChange"
|
|
|
+ @current-change="onCurrentChange"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ />
|
|
|
</div>
|
|
|
-</el-card>
|
|
|
+ </el-card>
|
|
|
</el-col>
|
|
|
-</el-row>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <script setup lang="ts">
|
|
|
- import {onBeforeMount, onMounted, reactive, ref, watch} from "vue";
|
|
|
- import eventBus from "/@/utils/mitt";
|
|
|
- import {Api} from "/@/api/admin/AlarmService/alarmQueryApi";
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import { onBeforeMount, onMounted, reactive, ref, watch } from "vue";
|
|
|
+import eventBus from "/@/utils/mitt";
|
|
|
+import { Api } from "/@/api/admin/AlarmService/alarmQueryApi";
|
|
|
import { PushDto } from "/@/api/admin/AlarmService/alarmQueryDto";
|
|
|
import { PageInputAlarmFilterModel } from "/@/api/admin/reportManagement/alarm/alarmDto";
|
|
|
-import { useDynamicPageSize } from "/@/composables/useDynamicPageSize";
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-import { all } from "axios";
|
|
|
+import { ElMessage, ElTable } from "element-plus";
|
|
|
import { useRoute } from 'vue-router';
|
|
|
|
|
|
const route = useRoute();
|
|
|
const alarmHistoryID = ref<string | undefined>(route.query.alarmHistoryID as string);
|
|
|
+const tableRef = ref<InstanceType<typeof ElTable>>();
|
|
|
|
|
|
-
|
|
|
-// 使用组合式函数获取分页状态
|
|
|
-// const pageState = useDynamicPageSize(10, 15);
|
|
|
-
|
|
|
-
|
|
|
-/**数据对象*/
|
|
|
- const state = reactive({
|
|
|
- /**加载显示 */
|
|
|
- loading: false,
|
|
|
- /**条件查询模块 */
|
|
|
- filter: {
|
|
|
-/**推送用户 */
|
|
|
- pushUser: "",
|
|
|
-/**是否推送 */
|
|
|
- pushed: "",
|
|
|
-/**推送时间 */
|
|
|
- pushTime: "",
|
|
|
- ispushed:undefined,
|
|
|
- alarmHistoryID: ""
|
|
|
- },
|
|
|
- /**表格信息 */
|
|
|
-tableModel: [] as PushDto[],
|
|
|
- /**动态表头 */
|
|
|
- dynamicColumns: [
|
|
|
-{ prop: 'ruleName', label: '规则名称' },
|
|
|
-// { prop: 'pushUserid', label: '推送用户id' },
|
|
|
-{ prop: 'pushUser', label: '推送用户' },
|
|
|
-{ prop: 'content', label: '推送内容' },
|
|
|
-{ prop: 'pushed', label: '是否推送' },
|
|
|
-{ prop: 'pushTime', label: '推送时间' },
|
|
|
-// { prop: 'alarmhistoryID', label: '报警ID' },
|
|
|
-// { prop: 'taskPriority', label: '优先级' },
|
|
|
-],
|
|
|
- /**分页标识 */
|
|
|
+/** 数据对象 */
|
|
|
+const state = reactive({
|
|
|
+ loading: false,
|
|
|
+ filter: {
|
|
|
+ pushUser: "",
|
|
|
+ pushed: "",
|
|
|
+ pushTime: "",
|
|
|
+ ispushed: undefined,
|
|
|
+ alarmHistoryID: ""
|
|
|
+ },
|
|
|
+ tableModel: [] as PushDto[],
|
|
|
+ dynamicColumns: [
|
|
|
+ { prop: 'ruleName', label: '规则名称' },
|
|
|
+ { prop: 'pushUser', label: '推送用户' },
|
|
|
+ { prop: 'content', label: '推送内容' },
|
|
|
+ { prop: 'pushed', label: '是否推送' },
|
|
|
+ { prop: 'pushTime', label: '推送时间' },
|
|
|
+ ],
|
|
|
pageInput: {
|
|
|
currentPage: 1,
|
|
|
pageSize: 15,
|
|
|
} as PageInputAlarmFilterModel,
|
|
|
- /**分页总数 */
|
|
|
total: 0,
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
-/**设备状态*/
|
|
|
+/** 设备状态枚举 */
|
|
|
enum FuelDispenserEnum {
|
|
|
true = "已推送",
|
|
|
false = "未推送",
|
|
|
}
|
|
|
|
|
|
- onMounted(async () => {
|
|
|
- if (alarmHistoryID.value) {
|
|
|
- state.filter.alarmHistoryID = alarmHistoryID.value; // 将参数赋值给筛选条件
|
|
|
- }
|
|
|
- await onQuery()
|
|
|
- init()
|
|
|
- eventBus.off('refreshView')
|
|
|
- eventBus.on('refreshView', async () => {
|
|
|
- await init()
|
|
|
- })
|
|
|
- console.log()
|
|
|
- })
|
|
|
- onBeforeMount(() => {
|
|
|
- eventBus.off('refreshView')
|
|
|
- })
|
|
|
+/** API实例 */
|
|
|
+const api = new Api();
|
|
|
|
|
|
-/**
|
|
|
-* 页条变化
|
|
|
-* @param val
|
|
|
-*/
|
|
|
-const onSizeChange = (val: number) => {
|
|
|
- state.pageInput.pageSize = val
|
|
|
- init()
|
|
|
-}
|
|
|
-
|
|
|
-/**
|
|
|
- * 页数 变化
|
|
|
- * @param val
|
|
|
- */
|
|
|
-const onCurrentChange = (val: number) => {
|
|
|
- state.pageInput.currentPage = val
|
|
|
- init()
|
|
|
-}
|
|
|
+onMounted(async () => {
|
|
|
+ if (alarmHistoryID.value) {
|
|
|
+ state.filter.alarmHistoryID = alarmHistoryID.value;
|
|
|
+ }
|
|
|
+ await onQuery();
|
|
|
+ init();
|
|
|
+ eventBus.off('refreshView');
|
|
|
+ eventBus.on('refreshView', async () => {
|
|
|
+ await init();
|
|
|
+ });
|
|
|
+});
|
|
|
|
|
|
+onBeforeMount(() => {
|
|
|
+ eventBus.off('refreshView');
|
|
|
+});
|
|
|
|
|
|
- /**
|
|
|
- * 监听变换
|
|
|
- */
|
|
|
- watch(() => {})
|
|
|
+/** 分页相关方法 */
|
|
|
+const onSizeChange = (val: number) => {
|
|
|
+ state.pageInput.pageSize = val;
|
|
|
+ init();
|
|
|
+};
|
|
|
|
|
|
-/**条件查询 */
|
|
|
- const onQuery = () => {
|
|
|
- init()
|
|
|
- }
|
|
|
+const onCurrentChange = (val: number) => {
|
|
|
+ state.pageInput.currentPage = val;
|
|
|
+ init();
|
|
|
+};
|
|
|
|
|
|
+/** 查询方法 */
|
|
|
+const onQuery = () => {
|
|
|
+ init();
|
|
|
+};
|
|
|
|
|
|
-/**初始化 */
|
|
|
+/** 初始化数据 */
|
|
|
const init = async () => {
|
|
|
state.loading = true;
|
|
|
-
|
|
|
try {
|
|
|
- // 处理时间范围
|
|
|
let sdate = '';
|
|
|
let edate = '';
|
|
|
if (state.filter.pushTime && Array.isArray(state.filter.pushTime) && state.filter.pushTime.length === 2) {
|
|
|
- sdate = state.filter.pushTime[0]; // 开始时间
|
|
|
- edate = state.filter.pushTime[1]; // 结束时间
|
|
|
+ sdate = state.filter.pushTime[0];
|
|
|
+ edate = state.filter.pushTime[1];
|
|
|
}
|
|
|
|
|
|
const params = {
|
|
@@ -205,11 +188,11 @@ const init = async () => {
|
|
|
...state.filter,
|
|
|
sdate,
|
|
|
edate,
|
|
|
- pushTime: undefined, // 避免传到后端去
|
|
|
+ pushTime: undefined,
|
|
|
},
|
|
|
};
|
|
|
|
|
|
- const res = await new Api().getList(params);
|
|
|
+ const res = await api.getList(params);
|
|
|
state.tableModel = res?.data?.list ?? [];
|
|
|
state.total = res?.data?.total ?? 0;
|
|
|
} catch (error) {
|
|
@@ -220,42 +203,73 @@ const init = async () => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
-
|
|
|
-
|
|
|
-/**重置 */
|
|
|
- const onReset=()=>{
|
|
|
- // 重置查询条件
|
|
|
+/** 重置方法 */
|
|
|
+const onReset = () => {
|
|
|
state.filter = {
|
|
|
pushUser: "",
|
|
|
pushed: "",
|
|
|
pushTime: "",
|
|
|
- ispushed:undefined,
|
|
|
- alarmHistoryID:""
|
|
|
+ ispushed: undefined,
|
|
|
+ alarmHistoryID: ""
|
|
|
};
|
|
|
-
|
|
|
- // 重新加载数据
|
|
|
+ state.pageInput.currentPage = 1;
|
|
|
init();
|
|
|
- }
|
|
|
-/**编辑 */
|
|
|
- const onDateUpdate=(row: any)=>{
|
|
|
- console.log("编辑行数据:", row);
|
|
|
- }
|
|
|
+};
|
|
|
+
|
|
|
+/** 处理推送逻辑 */
|
|
|
+const handlePush = async () => {
|
|
|
+ // 获取选中的行
|
|
|
+ const selectedRows = tableRef.value?.getSelectionRows() as PushDto[];
|
|
|
+ if (!selectedRows || selectedRows.length === 0) {
|
|
|
+ ElMessage.warning('请先选择需要推送的记录');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 验证是否已推送
|
|
|
+ const alreadyPushed = selectedRows.some(row => row.pushed === '已推送');
|
|
|
+ if (alreadyPushed) {
|
|
|
+ ElMessage.warning('选中的记录中包含已推送项,请重新选择');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ try {
|
|
|
+ state.loading = true;
|
|
|
+ // 调用推送接口,传递筛选条件和选中的ID
|
|
|
+ const response = await api.templateSend({
|
|
|
+ filter: state.filter,
|
|
|
+ selectedIds: selectedRows.map(row => row.ruleId) // 假设用ruleId作为标识
|
|
|
+ });
|
|
|
+
|
|
|
+ if (response.success) {
|
|
|
+ ElMessage.success('推送成功');
|
|
|
+ // 刷新列表
|
|
|
+ await init();
|
|
|
+ // 取消选中状态
|
|
|
+ tableRef.value?.clearSelection();
|
|
|
+ } else {
|
|
|
+ ElMessage.error(`推送失败: ${response.msg || '未知错误'}`);
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('推送接口调用失败:', error);
|
|
|
+ ElMessage.error('推送失败,请重试');
|
|
|
+ } finally {
|
|
|
+ state.loading = false;
|
|
|
+ }
|
|
|
+};
|
|
|
</script>
|
|
|
+
|
|
|
<style scoped lang="scss">
|
|
|
.el-input,
|
|
|
.el-select {
|
|
|
width: 240px;
|
|
|
}
|
|
|
|
|
|
-/* 输入框标签固定四个字符宽度 */
|
|
|
::v-deep .el-form-item__label {
|
|
|
- // 字体大小14,4个字符,12px右间距
|
|
|
width: 14*4px+12px;
|
|
|
justify-content: start;
|
|
|
}
|
|
|
|
|
|
-/* 数据表头 设置灰色样式 */
|
|
|
::v-deep .el-table th.el-table__cell {
|
|
|
background-color: #F6F6F6;
|
|
|
}
|
|
|
- </style>
|
|
|
+</style>
|