<template>
|
<div class="app-container">
|
<el-form :model="queryParams" ref="queryFormRef" :inline="true" v-show="showSearch" label-width="68px">
|
<el-form-item label="空调ID" prop="airConditionerId">
|
<el-select v-model="queryParams.airConditionerId" placeholder="请选择空调" clearable>
|
<el-option
|
v-for="item in airConditionerOptions"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="操作类型" prop="operationType">
|
<el-select v-model="queryParams.operationType" placeholder="请选择操作类型" clearable>
|
<el-option
|
v-for="dict in operationTypeOptions"
|
:key="dict.value"
|
:label="dict.label"
|
:value="dict.value"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="时间范围" prop="timeRange">
|
<el-date-picker
|
v-model="queryParams.timeRange"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" :icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button :icon="Refresh" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
|
<el-table
|
v-loading="loading"
|
:data="logList"
|
style="width: 100%"
|
>
|
<el-table-column type="index" width="50" align="center" />
|
<el-table-column label="操作时间" align="center" prop="operateTime" width="160">
|
<template #default="scope">
|
<span>{{ parseTime(scope.row.operateTime) }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="空调信息" align="center" prop="airConditionerName" />
|
<el-table-column label="操作类型" align="center" prop="operateType">
|
<template #default="scope">
|
<dict-tag :options="operationTypeOptions" :value="scope.row.operateType"/>
|
</template>
|
</el-table-column>
|
<el-table-column label="工作模式" align="center" prop="operateMode" >
|
<template #default="scope">
|
<dict-tag :options="operationModeOptions" :value="scope.row.operateMode"/>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作结果" align="center" prop="operateResult">
|
<template #default="scope">
|
<el-tag :type="scope.row.operateResult === '1' ? 'success' : 'danger'">
|
{{ scope.row.operateResult === '1' ? '成功' : '失败' }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作人员" align="center" prop="createBy" />
|
</el-table>
|
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
v-model:page="queryParams.pageNum"
|
v-model:limit="queryParams.pageSize"
|
@pagination="getList"
|
/>
|
</div>
|
</template>
|
|
<script setup name="AirConditionerLog">
|
import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
|
import { Search, Refresh } from '@element-plus/icons-vue'
|
import { parseTime } from '@/utils/ruoyi'
|
import { listAirConditioner } from '@/api/airconditioner/airconditioner'
|
import { listLog } from '@/api/airconditioner/log'
|
|
// 获取父组件实例
|
const { proxy } = getCurrentInstance()
|
|
// 遮罩层
|
const loading = ref(false)
|
// 显示搜索条件
|
const showSearch = ref(true)
|
// 总条数
|
const total = ref(0)
|
// 日志表格数据
|
const logList = ref([])
|
// 空调选项
|
const airConditionerOptions = ref([])
|
// 操作类型选项
|
const operationTypeOptions = ref([
|
{ label: '手动', value: '0' },
|
{ label: '自动', value: '1' }
|
])
|
|
const operationModeOptions = ref([
|
{ label: '制冷', value: '0' },
|
{ label: '制热', value: '1' },
|
{ label: '关机', value: '2' },
|
])
|
// 表单ref
|
const queryFormRef = ref()
|
|
// 查询参数
|
const queryParams = ref({
|
pageNum: 1,
|
pageSize: 10,
|
airConditionerId: undefined,
|
operationType: undefined,
|
timeRange: []
|
})
|
|
/** 查询日志列表 */
|
function getList() {
|
loading.value = true
|
listLog(queryParams.value).then(response => {
|
logList.value = response.rows
|
total.value = response.total
|
loading.value = false
|
})
|
}
|
|
/** 查询空调列表 */
|
function getAirConditioners() {
|
listAirConditioner().then(response => {
|
airConditionerOptions.value = response.rows
|
})
|
}
|
|
/** 搜索按钮操作 */
|
function handleQuery() {
|
queryParams.value.pageNum = 1
|
getList()
|
}
|
|
/** 重置按钮操作 */
|
function resetQuery() {
|
queryFormRef.value.resetFields()
|
handleQuery()
|
}
|
|
onMounted(() => {
|
getList()
|
getAirConditioners()
|
// 获取字典数据
|
// proxy.getDicts('airconditioner_operation_type').then(response => {
|
// operationTypeOptions.value = response.data
|
// })
|
})
|
|
// 暴露方法给父组件调用
|
defineExpose({
|
getList
|
})
|
</script>
|
