fea(设备状态): 静态开发完成

src/lang/zh/route.js

@@ -22,6 +22,7 @@ export default {
     DeviceRunning: '设备运行状况',
     DeviceRunningTime: '设备运行时间',
     DeviceFaultRecord: '设备故障/报警记录',
+    DeviceStatus: '设备状态',
     // 基础数据
     Basic: '基础数据',
     WorkshopBasic: '车间基础数据',

src/router/modules/deviceRunning.js

@@ -19,6 +19,12 @@ export default {
             component: () => import('@/views/DeviceRunning/DeviceFaultRecord/list'),
             name: 'DeviceFaultRecord',
             meta: { title: 'DeviceFaultRecord', icon: 'repairApplication', noCache: false, mark: '/deviceRunning/deviceFaultRecord/list' }
+        },
+        {
+            path: 'deviceStatus',
+            component: () => import('@/views/DeviceRunning/DeviceStatus/list'),
+            name: 'DeviceStatus',
+            meta: { title: 'DeviceStatus', icon: 'repairApplication', noCache: false }
         }
     ]
 }

src/views/DeviceRunning/DeviceStatus/list.vue

+<template>
+    <div class="page-pack">
+        <div class="title-pack clear-float pl-15 pr-15">
+            <div class="float-left">
+                <span class="page-title-text">设备状态</span>
+            </div>
+            <div class="float-right page-refresh">
+                <span @click="doRefreshClick" class="pointer">
+                    <svg-icon icon-class="refresh"></svg-icon>
+                    <span class="ml-10">刷新</span>
+                </span>
+            </div>
+        </div>
+        <div class="tool-pack clear-float pl-15 pr-15">
+            <Search
+                searchCode="PASS_INFO"
+                @search="doSearchClick"
+                @reset="doResetClick">
+            </Search>
+        </div>
+        <div class="general-list-main-pack pl-15 pr-15 pb-15">
+            <div>
+                <Table
+                    :tableConfig="tableConfig"
+                    @onPageSizeChange="onPageSizeChange"
+                    @onCurrentPageChange="onCurrentPageChange">
+                </Table>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import Moment from 'moment';
+    import Table from '@/components/Table/index.vue';
+    import Search from '@/components/Search';
+
+    export default {
+        components: {
+            Table,
+            Search
+        },
+        data () {
+            return {
+                // 精准搜索关键字列表
+                searchList: {},
+                // 表格配置项
+                tableConfig: {
+                    height: 0,
+                    data: [],
+                    fieldList: [
+                        { label: '车间', value: 'vin' },
+                        { label: '设备名称', value: 'stationName' },
+                        { label: '设备编码', value: 'stationNo' },
+                        { label: '设备状态', value: 'passTime' }
+                    ],
+                    paginationToggle: true,
+                    paginationConfig: {
+                        total: 0,
+                        currentPage: 1,
+                        pageSize: 20
+                    }
+                }
+            }
+        },
+        methods: {
+            // 点击刷新按钮
+            doRefreshClick () {},
+            // 点击搜索按钮
+            doSearchClick (searchValue) {},
+            // 点击重置按钮
+            doResetClick (searchValue) {},
+            // 触发表格数量改变事件
+            onPageSizeChange (pageSize) {},
+            // 触发表格分页改变事件
+            onCurrentPageChange (currentPage) {}
+        },
+        mounted () {
+            setTimeout(() => {
+                this.tableConfig.height = document.querySelector('.page-pack').offsetHeight - 178;
+            }, 0);
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+    .page-pack {
+        position: relative;
+        min-height: 100%;
+        width: 100%;
+        border: 1px solid #d2d3d5;
+        background-color: #fff;
+        overflow-y: auto;
+
+        .title-pack {
+            height: 38px;
+            line-height: 38px;
+            border-bottom: 1px solid #d2d3d5;
+        }
+
+        .tool-pack {
+            padding-top: 16px;
+            padding-bottom: 16px;
+            .tool-tag {
+                height: 32px;
+                line-height: 32px;
+                font-size: 14px;
+            }
+        }
+
+        .edit-button {
+            color: #538FFD;
+        }
+
+        .status-circle {
+            display: inline-block;
+            width: 6px;
+            height: 6px;
+            border-radius: 6px;
+            margin-right: 5px;
+            vertical-align: middle;
+        }
+        .delete-button {
+            color: #F47476;
+        }
+
+        .view-span {
+            color: #1284fa;
+            border-bottom: 1px solid #1284fa;
+            &:hover {
+                cursor: pointer;
+            }
+        }
+        .el-dialog__body {
+            padding: 30px 30px 10px 20px!important;
+            .el-row {
+
+                .el-col {
+                    line-height: 35px;
+
+                    .el-form-item {
+                        width: 100%;
+
+                        .el-form-item__content {
+                            width: 100%;
+
+                            .el-input {
+                                font-size: 12px;
+                                height: 32px;
+                            }
+                            .el-input__inner {
+                                height: 32px;
+                            }
+                            .el-select {
+                                width: 100%!important;
+                                font-size: 12px;
+                                height: 32px;
+                            }
+                            .el-date-editor {
+                                width: 100%!important;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+</style>
\ No newline at end of file