elkers
2025-01-16 0b62eca817d6c40c188dc72c3034835a61a30a35
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<script setup >
import {facilityMaintainRecordApi} from "@/api/maintain/record/index.js";
import setPostParams from "../../../utils/searchParams.js";
 
const {proxy} = getCurrentInstance();
/**
 * 搜索
 */
const queryParams = ref({
    name:''
})
function handleQuery() {
    getList({keywords:queryParams.value.name})
}
/**
 * 重置
 */
const resetQuery = () =>{
    queryParams.value.name = ''
    getList()
}
/** 列表 */
const tableData = ref([]); //初始化列表
const loading = ref(false); //加载状态
const total = ref(0);
/** 表头 */
let tableHeader = ref({
    maintainCode:'计划编号',
    maintainType: '维护类型',
    periodType: '维护周期',
    facilityName: '设备名称',
    content: '维护内容',
    url: '维护图片',
    resultType: '执行结果',
    inspectUserName: '巡检人员',
    createTimeView: '创建时间',
})
//分页
const pageParam = ref({
    total:0,
    limit:10,
    page:1,
})
/** 获取列表 */
const getList = async (val) => {
    loading.value = true;
    let postParam = setPostParams(val)
    let res = await facilityMaintainRecordApi().search(postParam)
    if (res.code == 200) {
        loading.value = false;
        tableData.value = res.data.list;
        tableData.value.forEach((item) => {
            if (item.resultType == 1) {
                item.resultType = '待执行'
            } else if (item.resultType == 2) {
                item.resultType = '正常'
            } else if (item.resultType == 3) {
                item.resultType = '异常'
            }
        })
        pageParam.value.total = res.data.total;
        pageParam.value.page = res.data.page;
        pageParam.value.limit = res.data.limit;
    }
}
getList();
 
</script>
<template>
    <div class="app-container">
        <!--搜索框-->
        <el-form :model="queryParams" ref="queryRef" :inline="true">
 
            <el-form-item label="" prop="name">
                <el-input
                        v-model="queryParams.name"
                        placeholder="请输入计划名称"
                        clearable
                        style="width: 200px"
                        @keyup.enter="handleQuery"
                />
            </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="tableData" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center"/>
            <el-table-column
                    v-for="(item, key, index) of tableHeader"
                    :prop="key.toString()"
                    :label="item"
                    :key="index"
                    align="center"
            >
                <template #default="scope">
                    <div v-if="key.toString() === 'url'"> <img :src="scope.row.url" alt="" style="width:50px;height: 50px"></div>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width">
                <template #default="scope">
                    <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
                    <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination
                v-show="pageParam.total > 0"
                :total="pageParamtotal"
                v-model:page="pageParam.page"
                v-model:limit="pageParam.limit"
                @pagination="getList"
        />
    </div>
</template>
<style scoped lang="scss">
</style>