rtu数据

src/views/rtudata/rtudata/index.vue

@@ -0,0 +1,133 @@
+<template>
+  <div class="app-container rtudatacls">
+    <el-tabs v-model="queryParams.itemCode" @tab-click="handleClick" type="border-card">
+      <el-tab-pane v-for="data in tabsList"  :label="data.item" :name="data.itemCode">
+            <el-table v-loading="loading" :data="rtudataList" border>
+              <el-table-column label="序号"  align="center">
+                 <template slot-scope="scope">
+                   {{ scope.$index + (queryParams.page - 1) * queryParams.limit + 1 }}
+                 </template>
+              </el-table-column>
+              <el-table-column label="遥测站地址" align="center" prop="sid" />
+              <el-table-column label="遥测站分类码" align="center" prop="type" />
+              <el-table-column label="监测项" align="center" prop="item" />
+              <el-table-column label="监测码" align="center" prop="itemCode" />
+              <el-table-column label="监测值" align="center" prop="val" />
+              <el-table-column label="单位" align="center" prop="unit" />
+              <el-table-column label="观测时间" align="center" prop="dt" width="180">
+                <template slot-scope="scope">
+                  <span>{{ parseTime(scope.row.dt, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="上报时间" align="center" prop="updDt" width="180">
+                <template slot-scope="scope">
+                  <span>{{ parseTime(scope.row.updDt, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
+                </template>
+              </el-table-column>
+            </el-table>
+
+            <pagination
+              v-show="total>0"
+              :total="total"
+              :page.sync="queryParams.page"
+              :limit.sync="queryParams.limit"
+              @pagination="getList"
+            />
+      </el-tab-pane>
+    </el-tabs>
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Rtudata",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 数据列表表格数据
+      rtudataList: [],
+      tabsList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        page: 1,
+        limit: 10,
+        itemCode: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getTabsList();
+  },
+  methods: {
+    handleClick() {
+      this.getList();
+    },
+    /** 查询标签列表 */
+    async getTabsList() {
+      let res = await this.$axiosGet('/rtudata/rtudata/tabsList');
+      if(res.code === 0){
+        this.tabsList = res.data;
+        this.queryParams.itemCode = this.tabsList[0].itemCode
+        this.getList();
+      }
+    },
+
+    /** 查询数据列表列表 */
+    async getList() {
+      this.loading = true;
+      let res = await this.$axiosGet('/rtudata/rtudata/list',this.queryParams);
+      if(res.code === 0){
+          this.rtudataList = res.data;
+          this.total = res.count;
+      }
+      this.loading = false;
+    },
+
+
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.page = 1;
+      this.getList();
+    },
+
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('rtudata/rtudata/export', {
+        ...this.queryParams
+      }, `rtudata_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>
+<style lang="scss">
+.rtudatacls{
+  padding: 0;
+  .el-tabs--border-card {
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+  }
+}
+
+</style>