| | |
| | | <template> |
| | | <div class="wcsAlarmLog-container"> |
| | | <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> |
| | | <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> |
| | | <el-form :model="queryParams" ref="queryForm" labelWidth="90"> |
| | | <el-row> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10"> |
| | | <el-form-item label="关键字"> |
| | | <el-input v-model="queryParams.searchKey" clearable="" placeholder="请输入模糊查询关键字"/> |
| | | |
| | | <el-input v-model="queryParams.searchKey" clearable="" placeholder="请输入模糊查询关键字" /> |
| | | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> |
| | | <el-form-item label="PLCIP地址"> |
| | | <el-input v-model="queryParams.plcIP" clearable="" placeholder="请输入PLCIP地址"/> |
| | | |
| | | <el-input v-model="queryParams.plcIP" clearable="" placeholder="请输入PLCIP地址" /> |
| | | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> |
| | | <el-form-item label="报警编号"> |
| | | <el-input v-model="queryParams.alarmCode" clearable="" placeholder="请输入报警编号"/> |
| | | |
| | | <el-input v-model="queryParams.alarmCode" clearable="" placeholder="请输入报警编号" /> |
| | | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> |
| | | <el-form-item label="设备类型"> |
| | | <el-input v-model="queryParams.type" clearable="" placeholder="请输入设备类型"/> |
| | | |
| | | <el-input v-model="queryParams.type" clearable="" placeholder="请输入设备类型" /> |
| | | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI"> |
| | | <el-form-item label="报警日期"> |
| | | <el-date-picker type="daterange" v-model="queryParams.alarmTimeRange" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" /> |
| | | |
| | | <el-date-picker type="daterange" v-model="queryParams.alarmTimeRange" value-format="YYYY-MM-DD HH:mm:ss" |
| | | start-placeholder="开始日期" end-placeholder="结束日期" |
| | | :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" /> |
| | | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10"> |
| | | <el-form-item > |
| | | <el-form-item> |
| | | <el-button-group style="display: flex; align-items: center;"> |
| | | <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'wcsAlarmLog:page'"> 查询 </el-button> |
| | | <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 重置 </el-button> |
| | | <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI" style="margin-left:5px;"> 高级查询 </el-button> |
| | | <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI" style="margin-left:5px;"> 隐藏 </el-button> |
| | | <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'wcsAlarmLog:page'"> 查询 |
| | | </el-button> |
| | | <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 重置 </el-button> |
| | | <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI" |
| | | style="margin-left:5px;"> 高级查询 </el-button> |
| | | <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI" |
| | | style="margin-left:5px;"> 隐藏 </el-button> |
| | | </el-button-group> |
| | | </el-form-item> |
| | | |
| | | |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </el-card> |
| | | <el-card class="full-table" shadow="hover" style="margin-top: 5px"> |
| | | <el-table |
| | | :data="tableData" |
| | | style="width: 100%" |
| | | v-loading="loading" |
| | | tooltip-effect="light" |
| | | row-key="id" |
| | | @sort-change="sortChange" |
| | | border=""> |
| | | <el-table-column type="index" label="序号" width="55" align="center"/> |
| | | <el-table-column prop="plcIP" label="PLCIP地址" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmCode" label="报警编号" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmName" label="报警描述" show-overflow-tooltip="" /> |
| | | <el-table-column prop="type" label="设备类型" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmTime" label="报警日期" show-overflow-tooltip="" /> |
| | | <el-table :data="tableData" style="width: 100%" v-loading="loading" tooltip-effect="light" row-key="id" |
| | | @sort-change="sortChange" border=""> |
| | | <el-table-column type="index" label="序号" width="55" align="center" /> |
| | | <el-table-column prop="plcIP" label="PLCIP地址" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmCode" label="报警编号" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmName" label="报警描述" show-overflow-tooltip="" /> |
| | | <el-table-column prop="type" label="设备类型" show-overflow-tooltip="" /> |
| | | <el-table-column prop="alarmTime" label="报警日期" show-overflow-tooltip="" /> |
| | | <el-table-column label="修改记录" width="80" align="center" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <ModifyRecord :data="scope.row" /> |
| | | </template> |
| | | </el-table-column> |
| | | <template #default="scope"> |
| | | <ModifyRecord :data="scope.row" /> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | v-model:currentPage="tableParams.page" |
| | | v-model:page-size="tableParams.pageSize" |
| | | :total="tableParams.total" |
| | | :page-sizes="[10, 20, 50, 100, 200, 500]" |
| | | size="small" |
| | | background="" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | /> |
| | | <printDialog |
| | | ref="printDialogRef" |
| | | :title="printWcsAlarmLogTitle" |
| | | @reloadTable="handleQuery" /> |
| | | <el-pagination v-model:currentPage="tableParams.page" v-model:page-size="tableParams.pageSize" |
| | | :total="tableParams.total" :page-sizes="[10, 20, 50, 100, 200, 500]" size="small" background="" |
| | | @size-change="handleSizeChange" @current-change="handleCurrentChange" |
| | | layout="total, sizes, prev, pager, next, jumper" /> |
| | | <printDialog ref="printDialogRef" :title="printWcsAlarmLogTitle" @reloadTable="handleQuery" /> |
| | | </el-card> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts" setup="" name="wcsAlarmLog"> |
| | | import { ref } from "vue"; |
| | | import { ElMessageBox, ElMessage } from "element-plus"; |
| | | import { auth } from '/@/utils/authFunction'; |
| | | import { ref } from "vue"; |
| | | import { ElMessageBox, ElMessage } from "element-plus"; |
| | | import { auth } from '/@/utils/authFunction'; |
| | | |
| | | import ModifyRecord from '/@/components/table/modifyRecord.vue'; |
| | | import { formatDate } from '/@/utils/formatTime'; |
| | | import ModifyRecord from '/@/components/table/modifyRecord.vue'; |
| | | import { formatDate } from '/@/utils/formatTime'; |
| | | |
| | | |
| | | import printDialog from '/@/views/system/print/component/hiprint/preview.vue' |
| | | import { pageWcsAlarmLog, deleteWcsAlarmLog } from '/@/api/log/wcsAlarmLog'; |
| | | import printDialog from '/@/views/system/print/component/hiprint/preview.vue' |
| | | import { pageWcsAlarmLog, deleteWcsAlarmLog } from '/@/api/log/wcsAlarmLog'; |
| | | |
| | | const showAdvanceQueryUI = ref(false); |
| | | const printDialogRef = ref(); |
| | | const editDialogRef = ref(); |
| | | const loading = ref(false); |
| | | const tableData = ref<any>([]); |
| | | const queryParams = ref<any>({}); |
| | | const tableParams = ref({ |
| | | page: 1, |
| | | pageSize: 10, |
| | | total: 0, |
| | | }); |
| | | const showAdvanceQueryUI = ref(false); |
| | | const printDialogRef = ref(); |
| | | const editDialogRef = ref(); |
| | | const loading = ref(false); |
| | | const tableData = ref<any>([]); |
| | | const queryParams = ref<any>({}); |
| | | const tableParams = ref({ |
| | | page: 1, |
| | | pageSize: 20, |
| | | total: 0, |
| | | }); |
| | | |
| | | const printWcsAlarmLogTitle = ref(""); |
| | | const editWcsAlarmLogTitle = ref(""); |
| | | const printWcsAlarmLogTitle = ref(""); |
| | | const editWcsAlarmLogTitle = ref(""); |
| | | |
| | | // 改变高级查询的控件显示状态 |
| | | const changeAdvanceQueryUI = () => { |
| | | showAdvanceQueryUI.value = !showAdvanceQueryUI.value; |
| | | } |
| | | // 改变高级查询的控件显示状态 |
| | | const changeAdvanceQueryUI = () => { |
| | | showAdvanceQueryUI.value = !showAdvanceQueryUI.value; |
| | | } |
| | | |
| | | // 查询操作 |
| | | const handleQuery = async () => { |
| | | loading.value = true; |
| | | var res = await pageWcsAlarmLog(Object.assign(queryParams.value, tableParams.value)); |
| | | tableData.value = res.data.result?.items ?? []; |
| | | tableParams.value.total = res.data.result?.total; |
| | | loading.value = false; |
| | | }; |
| | | // 查询操作 |
| | | const handleQuery = async () => { |
| | | loading.value = true; |
| | | var res = await pageWcsAlarmLog(Object.assign(queryParams.value, tableParams.value)); |
| | | tableData.value = res.data.result?.items ?? []; |
| | | tableParams.value.total = res.data.result?.total; |
| | | loading.value = false; |
| | | }; |
| | | |
| | | // 列排序 |
| | | const sortChange = async (column: any) => { |
| | | queryParams.value.field = column.prop; |
| | | queryParams.value.order = column.order; |
| | | await handleQuery(); |
| | | }; |
| | | // 列排序 |
| | | const sortChange = async (column: any) => { |
| | | queryParams.value.field = column.prop; |
| | | queryParams.value.order = column.order; |
| | | await handleQuery(); |
| | | }; |
| | | |
| | | // 打开新增页面 |
| | | const openAddWcsAlarmLog = () => { |
| | | editWcsAlarmLogTitle.value = '添加报警日志'; |
| | | editDialogRef.value.openDialog({}); |
| | | }; |
| | | // 打开新增页面 |
| | | const openAddWcsAlarmLog = () => { |
| | | editWcsAlarmLogTitle.value = '添加报警日志'; |
| | | editDialogRef.value.openDialog({}); |
| | | }; |
| | | |
| | | // 打开打印页面 |
| | | const openPrintWcsAlarmLog = async (row: any) => { |
| | | printWcsAlarmLogTitle.value = '打印报警日志'; |
| | | } |
| | | |
| | | // 打开打印页面 |
| | | const openPrintWcsAlarmLog = async (row: any) => { |
| | | printWcsAlarmLogTitle.value = '打印报警日志'; |
| | | } |
| | | |
| | | // 改变页面容量 |
| | | const handleSizeChange = (val: number) => { |
| | | tableParams.value.pageSize = val; |
| | | handleQuery(); |
| | | }; |
| | | |
| | | // 改变页码序号 |
| | | const handleCurrentChange = (val: number) => { |
| | | tableParams.value.page = val; |
| | | handleQuery(); |
| | | }; |
| | | |
| | | // 改变页面容量 |
| | | const handleSizeChange = (val: number) => { |
| | | tableParams.value.pageSize = val; |
| | | handleQuery(); |
| | | }; |
| | | |
| | | // 改变页码序号 |
| | | const handleCurrentChange = (val: number) => { |
| | | tableParams.value.page = val; |
| | | handleQuery(); |
| | | }; |
| | | |
| | | handleQuery(); |
| | | </script> |
| | | <style scoped> |
| | | :deep(.el-input), |
| | | :deep(.el-select), |
| | | :deep(.el-input-number) { |
| | | width: 100%; |
| | | width: 100%; |
| | | } |
| | | </style> |
| | | |