历史指令

src/pages/analysis/fault/pie3.vue

-<template lang='pug'>
+<template lang="pug">
 #pie3(:style="{ width: '100%', height: '90%'}")
 </template>
 
 <script>
 export default {
-    mounted() {
-        this.pie()
-    },
-    methods: {
-        pie() {
-            let dom = document.getElementById('pie3')
-            if (!dom) return
-            let myCharts = this.$echarts.init(dom)
-            let option = {
-
-                tooltip: {
-                    trigger: 'item'
-                },
-                legend: {
-                    orient: 'horizontal',
-                    top: '1%'
-                },
-                series: [
-                    {
-                        type: 'pie',
-                        radius: '50%',
-                        data: [
-                            { value: 1048, name: '搜索引擎', itemStyle: { color: 'skyblue' } },
-                            { value: 735, name: '直接访问', itemStyle: { color: '#F2637B' } },
-                            { value: 580, name: '邮件营销', itemStyle: { color: '#8EE0E0' } },
-                            { value: 484, name: '联盟广告', itemStyle: { color: '#4ECB74' } },
-                            { value: 300, name: '视频广告', itemStyle: { color: '#FFCC00' } }
-                        ]
-
-                    }
-                ]
-            }
-            myCharts.setOption(option)
-        }
+  mounted() {
+    this.pie()
+  },
+  methods: {
+    pie() {
+      let dom = document.getElementById('pie3')
+      if (!dom) return
+      let myCharts = this.$echarts.init(dom)
+      let option = {
+        tooltip: {
+          trigger: 'item'
+        },
+        legend: {
+          orient: 'horizontal',
+          top: '1%'
+        },
+        series: [
+          {
+            type: 'pie',
+            radius: '50%',
+            data: [
+              {
+                value: 1048,
+                name: '风冷热泵机组',
+                itemStyle: { color: 'skyblue' }
+              },
+              {
+                value: 735,
+                name: '室内机风柜',
+                itemStyle: { color: '#F2637B' }
+              },
+              { value: 580, name: '水泵', itemStyle: { color: '#8EE0E0' } },
+              {
+                value: 484,
+                name: '多联室内机',
+                itemStyle: { color: '#4ECB74' }
+              },
+              { value: 300, name: '排风机', itemStyle: { color: '#FFCC00' } }
+            ]
+          }
+        ]
+      }
+      myCharts.setOption(option)
     }
+  }
 }
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

src/pages/analysis/fault/pie4.vue

-<template lang='pug'>
+<template lang="pug">
 #pie4(:style="{ width: '100%', height: '90%' }")
 </template>
 
@@ -118,5 +118,4 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

src/pages/sys/commandlog/index.vue

+<template lang='pug'>
+    el-container(style="padding:0px;height:77.6vh;")
+        el-header(style='height:42px;line-height:42px;border: 1px solid rgba(195, 195, 195, 1);background: #f4f4f4;')
+            span.title-bold.title-left-color() 历史指令
+            <el-popover placement="bottom" width="150" >
+                    <el-button slot="reference" size='mini' type="primary" icon="el-icon-s-tools" style='float:right;transform:translateY(6px)'> 筛选</el-button>
+                    <el-checkbox-group v-model="checkList">
+                        <el-col :span="24">
+                            <el-checkbox v-for="(item,index) in tableHeader" :label="item" :key="index"  >
+                              span {{item.label}}
+                            </el-checkbox>
+                        </el-col>
+                    </el-checkbox-group>
+            </el-popover>
+        el-main.box_main
+            el-card()
+                div.tableCard()
+                    el-form( :inline="true" :model="dataForm" size="mini" @keyup.enter.native="getDataList()" )
+                        el-form-item( label="关键词:")
+                            el-input(  v-model="dataForm.comMark" placeholder="" clearable)
+                        el-form-item( label="指令类型:")
+                            el-select( v-model="dataForm.comType" placeholder="请选择" clearable)
+                                el-option( label="自动" value="1")
+                                el-option( label="人工" value="2")
+                        el-form-item( label="操作时间:")
+                            el-date-picker(type="datetime" value-format="yyyy-MM-dd HH:mm:ss" style="width:175px;" v-model="dataForm.startTime" placeholder="选择开始时间"  clearable)
+                        el-form-item( label="至")
+                            el-date-picker( type="datetime" value-format="yyyy-MM-dd HH:mm:ss" style="width:175px;" v-model="dataForm.endTime" placeholder="选择结束时间" clearable)
+                        el-button( type="primary" size='mini' icon="el-icon-search" @click="getDataList()") 查询
+                        el-button(@click="reSet()" size='mini' type="primary" icon="el-icon-refresh-right") 重置
+                //- <drag-table :data="dataList" :header="checkList" :option="tableOption"  @getDataList="getDataList" v-loading="dataListLoading"  :operationNum="3"  :isShowOperate="true">
+                <drag-table :data="dataList" :header="checkList" :option="tableOption"  @getDataList="getDataList" v-loading="dataListLoading"  >
+
+                  //- -- 插槽
+                  <el-table-column slot="fixed"  fixed  prop=""  label="序号"  width="80"  header-align="center" align="center" >
+                      <template slot-scope="scope">
+                        span   {{scope.$index+(pageIndex - 1) * pageSize + 1}}
+                      </template>
+                  </el-table-column>
+
+                  //- 操作项
+                  <template slot-scope="scope">
+                    <el-button  class="el-table-btn" type="text">编辑</el-button>
+                    <el-button  class="el-table-btn" type="text">查看</el-button>
+                    <el-button  class="el-table-btn" type="text">相关用户</el-button>
+                  </template>
+
+                </drag-table>
+        el-footer.box_footer
+            el-pagination(@size-change="sizeChangeHandle" background  @current-change="currentChangeHandle" :current-page="pageIndex" :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" layout="total, sizes, prev, pager, next, jumper")
+</template>
+
+<script>
+import Sortable from 'sortablejs'
+import dragTable from '../../components/tab'
+let that
+export default {
+  filters: {
+    ellipsis (value) {
+      if (!value) return ''
+      if (value.length > 12) {
+        return value.slice(0, 12) + '...'
+      }
+      return value
+    }
+  },
+  data () {
+    return {
+      checkList: [], //筛选数据
+      tableHeader: [
+        { label: '操作员', prop: 'username' }, //是否插槽
+        { label: '来源', prop: 'ip' },
+        { label: '指令类型', prop: 'operation' },
+        { label: '操作时间', prop: 'createDate' },
+        { label: '指令内容', prop: 'detail' }
+        // {label:'操作',prop:''},
+      ],
+      tableOption: {
+        border: false, //是否边框
+        maxHeight: 500 //高度
+      },
+      dataForm: {
+        comMark: '',
+        comType: null,
+        startTime: '',
+        endTime: ''
+      },
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false
+    }
+  },
+    components: {
+    dragTable
+  },
+  watch: {
+    totalPage() { //注意这个函数的名字必须和你监听data中的属性的名字一样，这样才能当你data中的属性发生变化时，触发这个函数
+      let pages = Math.ceil(this.totalPage / this.pageSize)//新数据总页数
+      //总页数小于当前页数则重新加载列表数据
+      if (pages < this.pageIndex) {
+          this.pageIndex = pages || 1
+          this.getDataList()//获取表格数据的方法
+      }
+    }
+  },
+  created () {
+    that = this
+    this.pageIndex = 1
+    this.getDataList()
+  },
+  mounted() {
+    this.checkList = [...this.tableHeader]
+  },
+  methods: {
+    toLine(name) {
+      return name.replace(/([A-Z])/g, '_$1').toLowerCase()
+    },
+    //重置
+    reSet() {
+        this.dataForm = {}
+        this.pageIndex = 1
+        this.getDataList()
+    },
+    // 获取数据列表
+    getDataList (sort, order) {
+      // console.log(sort,'---',order)
+      this.dataListLoading = true
+      this.$http({
+        url: this.$http.adornUrl('/sysCommandLog/pageList'),
+        method: 'post',
+        data: {
+          comMark: this.dataForm.comMark,
+          comType: this.dataForm.comType,
+          startTime: this.dataForm.startTime,
+          endTime: this.dataForm.endTime
+        }
+      }).then(data => {
+        //console.log('data', data)
+        if (data && data.code === 0) {
+          this.dataList = data.page.rows
+          // console.log(this.dataList)
+          this.totalPage = data.page.total
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+        }
+        this.dataListLoading = false
+      })
+    },
+    //排序
+    sortChange (column) {
+      if (column.order === 'descending') {
+        this.order = 'desc'
+      } else {
+        this.order = 'asc'
+      }
+      if (column.column.columnKey) {
+        this.sort = column.column.columnKey
+      } else {
+        this.sort = column.prop
+      }
+      this.getDataList()
+    },
+    // 每页数
+    sizeChangeHandle (val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 当前页
+    currentChangeHandle (val) {
+      this.pageIndex = val
+      this.getDataList()
+    }
+  }
+}
+</script>

src/router/routes.js

@@ -73,6 +73,7 @@ const frameIn = [
     { path: 'admin', name: `${pre}admin`, component: () => import('@/pages/sys/user'), meta: { ...meta, title: '用户管理' } },
     { path: 'role', name: `${pre}role`, component: () => import('@/pages/sys/role'), meta: { ...meta, title: '角色管理' } },
     { path: 'logs', name: `${pre}logs`, component: () => import('@/pages/sys/logs'), meta: { ...meta, title: '系统日志' } },
+    { path: 'commandlog', name: `${pre}commandlog`, component: () => import('@/pages/sys/commandlog'), meta: { ...meta, title: '历史指令' } },
     { path: 'point', name: `${pre}point`, component: () => import('@/pages/sys/point'), meta: { ...meta, title: '资源点管理' } },
     { path: 'road', name: `${pre}road`, component: () => import('@/pages/sys/road'), meta: { ...meta, title: '线路站点管理' } },
     { path: 'parameter', name: `${pre}parameter`, component: () => import('@/pages/sys/parameter'), meta: { ...meta, title: '系统参数设置' } },