温湿度计

src/api/temp.js

@@ -0,0 +1,9 @@
+import request from '@/utils/httpRequest'
+
+// 获取温湿度计详情
+export function getTempDetail (id) {
+  return request({
+    url: request.adornUrl(`/iot-platform/temp/info/${id}`),
+    method: 'get'
+  })
+}

src/views/modules/device/temp-add-or-update.vue

@@ -0,0 +1,129 @@
+<template>
+  <div>
+      <div class="my-title">{{ !id ? '新增': '修改' }}</div>
+      <!-- 表单 -->
+      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="auto">
+        <el-form-item label="设备编号" prop="code">
+          <el-input v-model="dataForm.code" :disabled="id" placeholder="设备编号"></el-input>
+        </el-form-item>
+        <el-form-item label="设备型号" prop="model">
+          <el-select
+            v-model="dataForm.model"
+            remote
+            placeholder="请选择">
+            <el-option
+              v-for="item in optionsModel"
+              :key="item.code"
+              :label="item.value"
+              :value="item.code">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所属部门" prop="orgId">
+          <org-component v-model="dataForm.orgId"/>
+        </el-form-item>
+        <el-form-item label="设备维护人" prop="maintainerId">
+          <user-component v-model="dataForm.maintainerId"/>
+        </el-form-item>
+        <el-form-item label="备注说明" prop="notes">
+          <el-input type="textarea" v-model="dataForm.notes" placeholder="备注说明"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+          <el-button @click="onChose">取消</el-button>
+          <el-button v-if="!display" type="primary" @click="dataFormSubmit()">确定</el-button>
+      </span>
+  </div>
+</template>
+
+<script>
+  import { getDictList } from '@/api/dict'
+  import { getTempDetail } from '@/api/temp'
+  import OrgComponent from '../common/org-component'
+  import UserComponent from '../common/user-component'
+
+  export default {
+    name: 'temp-add-or-update',
+    components: {UserComponent, OrgComponent},
+    computed: {
+      orgId: {
+        get () { return this.$store.state.user.orgId }
+      }
+    },
+    data () {
+      return {
+        visible: false,
+        id: 0,
+        optionsModel: [],
+        dataForm: {},
+        dataRule: {
+          code: [{ required: true, message: '设备编码不能为空', trigger: 'blur' }],
+          model: [{ required: true, message: '设备型号不能为空', trigger: 'change' }],
+          maintainerId: [{ required: true, message: '所属部门不能为空', trigger: 'change' }],
+          orgId: [{ required: true, message: '设备维护人不能为空', trigger: 'change' }]
+        }
+      }
+    },
+    methods: {
+      onChose () {
+        this.$emit('onChose')
+      },
+      async init (id) {
+        this.dataForm = {
+          orgId: this.orgId
+        }
+        this.optionsModel = []
+        this.getModelList()
+        this.visible = true
+        this.id = id || 0
+        if (!id) return
+        await getTempDetail(this.id).then(({data}) => {
+          if (data && data.code === '200') {
+            this.dataForm = data.data
+          }
+        })
+      },
+      // 获取温湿度计设备型号列表
+      getModelList () {
+        getDictList({type: 'temp_model'}).then(({data}) => {
+          if (data) {
+            this.optionsModel = data
+          }
+        })
+      },
+      validateField (type) {
+        this.$refs.dataForm.validateField(type)
+      },
+      // 表单提交
+      dataFormSubmit () {
+        this.$refs['dataForm'].validate((valid) => {
+          if (valid) {
+            this.$http({
+              url: this.$http.adornUrl(`/iot-platform/temp/${!this.dataForm.id ? 'save' : 'update'}`),
+              method: !this.dataForm.id ? 'post' : 'put',
+              data: this.$http.adornData({...this.dataForm})
+            }).then(({data}) => {
+              if (data && data.code === '200') {
+                this.$message({
+                  message: '操作成功',
+                  type: 'success',
+                  duration: 1500,
+                  onClose: () => {
+                    this.onChose()
+                    this.$emit('refreshDataList')
+                  }
+                })
+              } else {
+                this.$message.error(data.msg)
+              }
+            })
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

src/views/modules/device/temp-detail.vue

@@ -0,0 +1,68 @@
+<template>
+  <div>
+    <div class="my-title">查看</div>
+    <div style="margin-left: 20px;margin-right: 20px">
+      <e-desc title="基本信息" column="1" labelWidth="160px">
+        <e-desc-item label="设备编号">{{dataForm.code}}</e-desc-item>
+        <e-desc-item label="设备型号">{{dataForm.modelStr}}</e-desc-item>
+        <e-desc-item label="所属部门">{{dataForm.orgStr}}</e-desc-item>
+        <e-desc-item label="设备维护人">{{dataForm.maintainerStr}}</e-desc-item>
+        <e-desc-item label="最后一次上报时间">{{dataForm.lastReportTime}}</e-desc-item>
+        <e-desc-item label="温度（℃）">{{dataForm.temperature}}</e-desc-item>
+        <e-desc-item label="湿度（%）">{{dataForm.humidity}}</e-desc-item>
+        <e-desc-item label="最后一次报警时间">{{dataForm.lastAlarmTime}}</e-desc-item>
+        <e-desc-item label="备注说明" span="3">{{dataForm.notes}}</e-desc-item>
+      </e-desc>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="onChose">返回</el-button>
+    </span>
+  </div>
+</template>
+
+<script>
+  import EDesc from '../common/e-desc'
+  import EDescItem from '../common/e-desc-item'
+  import { getTempDetail } from '@/api/temp'
+  export default {
+    name: 'order-detail',
+    components: {
+      EDesc, EDescItem
+    },
+    data () {
+      return {
+        visible: false,
+        id: 0,
+        dataForm: {}
+      }
+    },
+    methods: {
+      onChose () {
+        this.$emit('onChose')
+      },
+      async init (id) {
+        this.visible = true
+        this.id = id || 0
+        this.dataForm = {}
+        this.getDetails()
+      },
+      getDetails () {
+        getTempDetail(this.id).then(({data}) => {
+          if (data && data.code === '200') {
+            this.dataForm = data.data
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+.my-line{
+  border-bottom: 1px solid #c0c4cc;
+  margin-bottom: 10px;
+}
+.title{
+  padding: 10px 0 ;
+}
+</style>

src/views/modules/device/temp-history.vue

@@ -0,0 +1,192 @@
+<template>
+  <div>
+    <div class="my-title">历史记录</div>
+    <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
+      <el-form-item label="上报时间">
+        <el-date-picker
+          v-model="dataForm.date"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          type="datetimerange"
+          range-separator="至"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="search()">查询</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      :data="dataList"
+      border
+      v-loading="dataListLoading"
+      style="width: 100%;">
+      <el-table-column
+        label="序号"
+        type="index"
+        width="50"
+        align="center">
+      </el-table-column>
+      <el-table-column
+        prop="deviceId"
+        header-align="center"
+        align="center"
+        min-width="120"
+        label="设备编号">
+      </el-table-column>
+      <el-table-column
+        prop="recordTime"
+        header-align="center"
+        align="center"
+        min-width="160"
+        :show-overflow-tooltip="true"
+        label="上报时间">
+      </el-table-column>
+      <el-table-column
+        prop="-"
+        header-align="center"
+        align="center"
+        min-width="160"
+        :show-overflow-tooltip="true"
+        label="系统接收时间">
+      </el-table-column>
+      <el-table-column
+        prop="tem"
+        header-align="center"
+        align="center"
+        min-width="100"
+        label="温度（℃）">
+      </el-table-column>
+      <el-table-column
+        prop="hum"
+        header-align="center"
+        align="center"
+        min-width="100"
+        label="湿度（%）">
+      </el-table-column>
+      <el-table-column
+        prop="-"
+        header-align="center"
+        align="center"
+        min-width="100"
+        label="剩余电量（%）">
+      </el-table-column>
+      <el-table-column
+        prop="-"
+        header-align="center"
+        align="center"
+        min-width="100"
+        :show-overflow-tooltip="true"
+        label="是否报警">
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="sizeChangeHandle"
+      @current-change="currentChangeHandle"
+      :current-page="pageIndex"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pageSize"
+      :total="totalPage"
+      layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="onChose">返回</el-button>
+    </span>
+  </div>
+</template>
+
+<script>
+import { getDictList } from '@/api/dict'
+export default {
+  name: 'temp-history',
+  components: {
+  },
+  data () {
+    return {
+      code: 0,
+      dataForm: {},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      optionsModel: []
+    }
+  },
+  methods: {
+    async init (code) {
+      this.code = code
+      this.search()
+    },
+    onChose () {
+      this.$emit('onChose')
+    },
+    // 获取温湿度计设备型号列表
+    getModelList () {
+      getDictList({type: 'temp_model'}).then(({data}) => {
+        if (data) {
+          this.optionsModel = data
+        }
+      })
+    },
+    // 查询
+    search () {
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 获取数据列表
+    getDataList () {
+      this.dataListLoading = true
+      this.addOrUpdateVisible = false
+      this.$http({
+        url: this.$http.adornUrl('/iot-platform/temp/history'),
+        method: 'get',
+        params: this.$http.adornParams({
+          'current': this.pageIndex,
+          'size': this.pageSize,
+          'code': this.code,
+          'timeStart': this.dataForm.date ? this.dataForm.date[0] : null,
+          'timeEnd': this.dataForm.date ? this.dataForm.date[1] : null
+        })
+      }).then(({data}) => {
+        if (data && data.code === '200') {
+          this.dataList = data.data.records
+          this.totalPage = Number(data.data.total)
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+        }
+        this.dataListLoading = false
+      })
+    },
+    // 每页数
+    sizeChangeHandle (val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 当前页
+    currentChangeHandle (val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+    // 多选
+    selectionChangeHandle (val) {
+      this.dataListSelections = val
+    },
+    // 转换属性“设备型号”
+    formatOptionsModel (row) {
+      for (let i = 0; i < this.optionsModel.length; i++) {
+        if (this.optionsModel[i].code === row.model) {
+          return this.optionsModel[i].value
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/modules/device/temp.vue

@@ -0,0 +1,314 @@
+<template>
+  <div class="stock">
+    <template v-if="!addOrUpdateVisible && !detailVisible && !historyVisible">
+      <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
+        <el-form-item label="所属部门">
+          <org-component v-model="dataForm.orgId"/>
+        </el-form-item>
+        <el-form-item label="设备维护人">
+          <user-component v-model="dataForm.maintainerId"/>
+        </el-form-item>
+        <el-form-item label="设备型号">
+          <el-select
+            v-model="dataForm.model"
+            remote
+            placeholder="请选择">
+            <el-option
+              v-for="item in optionsModel"
+              :key="item.code"
+              :label="item.value"
+              :value="item.code">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="设备编号">
+          <el-input v-model="dataForm.code" placeholder="设备编号" clearable/>
+        </el-form-item>
+        <el-form-item label="最后上报时间">
+          <el-date-picker
+            v-model="dataForm.date"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="search()">查询</el-button>
+          <el-button v-if="isAuth('device:temp:save')" type="primary" @click="addOrUpdateHandle(0)">新增</el-button>
+        </el-form-item>
+      </el-form>
+      <el-table
+        :data="dataList"
+        border
+        v-loading="dataListLoading"
+        style="width: 100%;">
+        <el-table-column
+          label="序号"
+          type="index"
+          width="50"
+          align="center">
+        </el-table-column>
+        <el-table-column
+          prop="code"
+          header-align="center"
+          align="center"
+          min-width="120"
+          label="设备编号">
+        </el-table-column>
+        <el-table-column
+          prop="model"
+          header-align="center"
+          align="center"
+          min-width="100"
+          :formatter="formatOptionsModel"
+          :show-overflow-tooltip="true"
+          label="设备型号">
+        </el-table-column>
+        <el-table-column
+          prop="orgStr"
+          header-align="center"
+          align="center"
+          min-width="160"
+          :show-overflow-tooltip="true"
+          label="所属部门">
+        </el-table-column>
+        <el-table-column
+          prop="maintainerStr"
+          header-align="center"
+          align="center"
+          min-width="100"
+          :show-overflow-tooltip="true"
+          label="设备维护人">
+        </el-table-column>
+        <el-table-column
+          prop="lastReportTime"
+          header-align="center"
+          align="center"
+          min-width="160"
+          :show-overflow-tooltip="true"
+          label="最后一次上报时间">
+        </el-table-column>
+        <el-table-column
+          prop="temperature"
+          header-align="center"
+          align="center"
+          min-width="100"
+          label="温度（℃）">
+        </el-table-column>
+        <el-table-column
+          prop="humidity"
+          header-align="center"
+          align="center"
+          min-width="100"
+          label="湿度（%）">
+        </el-table-column>
+        <el-table-column
+          prop="lastAlarmTime"
+          header-align="center"
+          align="center"
+          min-width="160"
+          :show-overflow-tooltip="true"
+          label="最后一次报警时间">
+        </el-table-column>
+        <el-table-column
+          prop="notes"
+          header-align="center"
+          align="center"
+          min-width="180"
+          :show-overflow-tooltip="true"
+          label="备注">
+        </el-table-column>
+        <el-table-column
+          fixed="right"
+          header-align="center"
+          align="center"
+          width="200"
+          label="操作">
+          <template slot-scope="scope">
+            <el-button v-if="isAuth('device:temp:info')" type="text" size="small" @click="detailHandle(scope.row.id)">查看</el-button>
+            <el-button v-if="isAuth('device:temp:edit')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">编辑</el-button>
+            <el-button v-if="isAuth('device:temp:list')" type="text" size="small" @click="historyHandle(scope.row)">历史数据</el-button>
+            <el-button v-if="isAuth('device:temp:delete')" style="color: red" type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        @size-change="sizeChangeHandle"
+        @current-change="currentChangeHandle"
+        :current-page="pageIndex"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="pageSize"
+        :total="totalPage"
+        layout="total, sizes, prev, pager, next, jumper">
+      </el-pagination>
+    </template>
+    <!-- 弹窗, 新增 / 修改 -->
+    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @onChose="onChose"></add-or-update>
+    <detail v-if="detailVisible" ref="detail" @onChose="onChose"/>
+    <history v-if="historyVisible" ref="history" @onChose="onChose"/>
+  </div>
+</template>
+
+<script>
+import { getDictList } from '@/api/dict'
+import AddOrUpdate from './temp-add-or-update'
+import Detail from './temp-detail'
+import History from './temp-history'
+import OrgComponent from '../common/org-component'
+import UserComponent from '../common/user-component'
+export default {
+  name: 'temp',
+  components: {
+    Detail,
+    History,
+    AddOrUpdate,
+    UserComponent,
+    OrgComponent
+  },
+  data () {
+    return {
+      addOrUpdateVisible: false,
+      detailVisible: false,
+      historyVisible: false,
+      dataForm: {},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      dataListSelections: [],
+      optionsModel: []
+    }
+  },
+  created () {
+    this.getModelList()
+    this.getDataList()
+  },
+  methods: {
+    onChose () {
+      this.addOrUpdateVisible = false
+      this.detailVisible = false
+      this.historyVisible = false
+    },
+    // 获取温湿度计设备型号列表
+    getModelList () {
+      getDictList({type: 'temp_model'}).then(({data}) => {
+        if (data) {
+          this.optionsModel = data
+        }
+      })
+    },
+    // 查询
+    search () {
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 获取数据列表
+    getDataList () {
+      this.dataListLoading = true
+      this.addOrUpdateVisible = false
+      this.$http({
+        url: this.$http.adornUrl('/iot-platform/temp/list'),
+        method: 'get',
+        params: this.$http.adornParams({
+          'current': this.pageIndex,
+          'size': this.pageSize,
+          'code': this.dataForm.code ? this.dataForm.code : null,
+          'model': this.dataForm.model ? this.dataForm.model : null,
+          'orgId': this.dataForm.orgId ? this.dataForm.orgId : null,
+          'maintainerId': this.dataForm.maintainerId ? this.dataForm.maintainerId : null,
+          'lastReportTimeStart': this.dataForm.date ? this.dataForm.date[0] : null,
+          'lastReportTimeEnd': this.dataForm.date ? this.dataForm.date[1] : null
+        })
+      }).then(({data}) => {
+        if (data && data.code === '200') {
+          this.dataList = data.data.records
+          this.totalPage = Number(data.data.total)
+        } else {
+          this.dataList = []
+          this.totalPage = 0
+        }
+        this.dataListLoading = false
+      })
+    },
+    // 每页数
+    sizeChangeHandle (val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getDataList()
+    },
+    // 当前页
+    currentChangeHandle (val) {
+      this.pageIndex = val
+      this.getDataList()
+    },
+    // 多选
+    selectionChangeHandle (val) {
+      this.dataListSelections = val
+    },
+    // 新增 / 修改
+    addOrUpdateHandle (id, disable) {
+      this.addOrUpdateVisible = true
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id, disable)
+      })
+    },
+    detailHandle (id) {
+      this.detailVisible = true
+      this.$nextTick(() => {
+        this.$refs.detail.init(id)
+      })
+    },
+    historyHandle (row) {
+      this.historyVisible = true
+      this.$nextTick(() => {
+        this.$refs.history.init(row.code)
+      })
+    },
+    // 转换属性“设备型号”
+    formatOptionsModel (row) {
+      for (let i = 0; i < this.optionsModel.length; i++) {
+        if (this.optionsModel[i].code === row.model) {
+          return this.optionsModel[i].value
+        }
+      }
+    },
+    // 删除
+    deleteHandle (id) {
+      if (!id) return
+      let ids = []
+      ids.push(id)
+      this.$confirm(`确定删除?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$http({
+          url: this.$http.adornUrl(`/iot-platform/temp/delete`),
+          method: 'DELETE',
+          data: ids
+        }).then(({data}) => {
+          if (data && data.code === '200') {
+            this.$message({
+              message: '操作成功',
+              type: 'success',
+              duration: 1500,
+              onClose: () => {
+                this.getDataList()
+              }
+            })
+          } else {
+            this.$message.error(data.msg)
+          }
+        })
+      }).catch(() => {})
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>