soc_web/src/views/iot/sensorData/dialog.detail.vue

<template>
  <DialogCom
    title="上报历史"
    :visible.sync="isShow"
    class="g-dialog-select-safe-check"
    :close-on-click-modal="false"
    width="55%"
    top="10vh"
    append-to-body
  >
    <div class="el-dialog-div" style="margin-bottom:20px">
      <g-search-table
        ref="st"
        url="/iot/sensor/data/log"
        method="post"
        :search-data="search"
        :pageable="true"
        :select="true"
        :select-default="selectList"
        :drag="false"
        @select="onSelect"
      >
        <!-- 搜索 -->
        <template slot="searchs">
          <el-form-item class="searchTitle" label="上报时间">
            <DataRangePicker
              v-model="search.dateRange"
              key="daterange"
              type="daterange"
              :clearable="timeClearable"
            />
          </el-form-item>
        </template>

        <!-- 表格 -->
        <template slot="columns">
          <el-table-column label="设备名称" align="center" prop="deviceName" width="300"/>
          <el-table-column label="上报时间" prop="createTime" width="300"/>
          <el-table-column label="上报内容" prop="info" width="300"/>
        </template>
      </g-search-table>
    </div>

    <div slot="footer" class="dialog-footer">
      <el-button @click="onHide">关 闭</el-button>
    </div>
  </DialogCom>
</template>
<script>
import GSearchTable from "@/components/table/gx.search.table.vue";
import DataRangePicker from "@/components/dateTime/daterange.picker.vue";

export default {
  components: {GSearchTable, DataRangePicker},
  data() {
    return {
      isShow: false,
      selectList: [],
      search: null,
      timeClearable: true,
    };
  },
  computed: {},
  watch: {
    orgId(newval) {
      this.search.orgId = newval;
    },
    dateRange(newval) {
      this.search.dateRange = newval;
    },
  },
  props: {
    defaultSelect: {
      type: Array
    },
    orgId: {},
    dateRange: [],
  },
  methods: {
    show(row) {
      this.search = this.initSearchData(row);
      this.isShow = true;
      this.selectList = this.defaultSelect;
    },
    onHide() {
      this.isShow = false;
    },
    onSelect(item) {
      this.selectList = item;
    },
    initSearchData(row) {
      let data = {"deviceStatusId": row.deviceStatusId, "orgId": row.orgId, "dateRange": []};
      return data;
    },
    emptySearch() {
      return {
        deviceCode: null,
        orgId: this.$store.getters.orgId,
      };
    },

  },
  mounted() {

  },
};
</script>
<style lang="scss" scoped>
.el-dialog-div {
  overflow: auto;
}
</style>