hailu
2023-12-17 7bf7f4969afaa8ccc57cb161427b800d7c3f7c2e
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<template>
    <div id="" style="padding:6px;">
        <el-card style="margin-bottom:6px;">
            <el-form ref="queryForm" :inline="true">
                <el-form-item label="状态" prop="status">
                    <el-select v-model="state" placeholder="菜单状态" size="mini">
                        <el-option label="全部" :value="-1" />
                        <el-option label="制水超时" :value="0" />
                        <el-option label="设备漏水" :value="1" />
                        <el-option label="缺水停机" :value="2" />
                        <el-option label="TDS超标" :value="3" />
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button size="mini" type="primary" icon="el-icon-search">搜索</el-button></el-form-item>
            </el-form>
            <el-table :data="faultList" style="width: 100%">
                <el-table-column prop="deviceId" label="设备编号" width="80">
                </el-table-column>
                <el-table-column prop="deviceName" label="设备名称">
                </el-table-column>
                <el-table-column prop="userName" label="客户名" width="100">
                </el-table-column>
                <el-table-column prop="userPhone" label="客户电话" width="100">
                </el-table-column>
                <el-table-column prop="userPhone" label="设备故障描述">
                    <template slot-scope="scope">
                        <div v-if="scope.row.sysStatus == 0">
                            正常空闲状态
                        </div>
                        <div v-if="scope.row.sysStatus == 1">
                            缺水停机状态
                        </div>
                        <div v-if="scope.row.sysStatus == 2">
                            制水中
                        </div>
                        <div v-if="scope.row.sysStatus == 3">
                            冲洗中
                        </div>
                        <div v-if="scope.row.sysStatus == 4">
                            维护中
                        </div>
                        <div v-if="scope.row.sysStatus == 5">
                            未激活
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination background :current-page="pageIndex" @current-change="changePage" :page-size="pageSize"
                layout="prev, pager, next" :total="total" style="margin-top: 12px;">
            </el-pagination>
        </el-card>
 
 
    </div>
</template>
 
<script>
import request from '@/utils/request'
import {
    getToken
} from "@/utils/auth";
 
 
export default {
    components: {
 
    },
    data() {
        return {
            state: -1,
            faultList: [],
            pageIndex: 1,
            pageSize: 10,
            total: 0,
        }
    },
 
    mounted() {
        this.getList()
    },
    methods: {
        changePage(e) {
            this.pageIndex = e;
            this.getList();
        },
        getList() {
            let data = {
                pageNum: 1,//页码
                pageSize: 5,//每页条数
                userId: localStorage.getItem('userID'),//用户id
                roleKey: this.roleKey,//角色
                //
            }
            request({
                // url: `/iot/device/faultList/${localStorage.getItem('userID')}`,
                url: `/iot/device/deviceMalfunction`,//接口方式
                method: "get",
                // params:data,  //如果需要传参就放开
            }).then((res) => {
                if (res.code == 200) {
                    this.faultList = res.rows
                } else {
                    this.faultList = []
                }
            }).catch((res) => {
                this.faultList = []
            })
        }
 
    },
    watch: {
 
    }
}
</script>
<style lang="scss" scoped>
.title {
    display: flex;
}
 
.el-select .el-input {
    width: 130px;
}
 
.input-with-select .el-input-group__prepend {
    background-color: #fff;
}
 
.azmodal {
    max-height: 600px;
    overflow-y: auto !important;
}
</style>