Merge remote-tracking branch 'origin/develop' into develop

4 weeks ago · 8e18dbbd70
3 changed files with 291 additions and 1 deletions
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue
@ -7,6 +7,9 @@
      <el-tab-pane label="交通流统计" name="second" class="tab_con">
        <TrafficFlowStatistics />
      </el-tab-pane>
+      <el-tab-pane label="一类交调站" name="survey" class="tab_con">
+        <TrafficSurvey />
+      </el-tab-pane>
    </el-tabs>
  </div>
 </template>
@ -14,12 +17,14 @@
 <script>
 import TrafficFlowAnalysis from "./analysis/index.vue";
 import TrafficFlowStatistics from "./statistics/index.vue";
+import TrafficSurvey from "./survey/index.vue";

 export default {
  name: "TrafficFlow",
  components: {
    TrafficFlowAnalysis,
-    TrafficFlowStatistics
+    TrafficFlowStatistics,
+    TrafficSurvey
  },
  data() {
    return {
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/survey/data.js
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/survey/data.js
@ -0,0 +1,73 @@
+import moment from "moment";
+export const searchFormList = [
+  {
+    label: "时间类型:",
+    key: "type",
+    type: "select",
+    default: "day",
+    options: {
+      clearable: true,
+      options: [
+        {
+          key: "day",
+          label: "天",
+        },
+        {
+          key: "month",
+          label: "月",
+        },
+        {
+          key: "year",
+          label: "年",
+        },
+      ],
+    },
+  },
+  {
+    label: "日期:",
+    key: "startTime",
+    required: true,
+    type: "datePicker",
+    options: {
+      valueFormat: "yyyy-MM-dd",
+    },
+    default: moment().format("YYYY-MM-DD"),
+    visible: (data) => {
+      if (data.type == "day") {
+        return true;
+      }
+    },
+  },
+  {
+    label: "日期:",
+    key: "startTime",
+    required: true,
+    type: "datePicker",
+    options: {
+      type: "month",
+      valueFormat: "yyyy-MM-dd",
+    },
+    default: moment().format("YYYY-MM-DD"),
+    visible: (data) => {
+      if (data.type == "month") {
+        return true;
+      }
+    },
+  },
+  {
+    label: "日期:",
+    key: "startTime",
+    required: true,
+    type: "datePicker",
+    options: {
+      type: "year",
+      valueFormat: "yyyy-MM-dd",
+    },
+    default: moment().format("YYYY-MM-DD"),
+    visible: (data) => {
+      if (data.type == "year") {
+        return true;
+      }
+    },
+  }
+];
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/survey/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/survey/index.vue
@ -0,0 +1,212 @@
+<template>
+  <div class='board_record'>
+    <!-- 搜索栏 -->
+    <div class="filter">
+      <div>
+         <ButtonGradient @click.native="handleExport">
+          <template #prefix>
+            <img src="@screen/images/export.svg" />
+          </template>
+          导出
+        </ButtonGradient>
+        <ButtonGradient @click="onRefreshForm" class="refresh-btn">
+        <template #prefix>
+          <img src="@screen/images/refresh.svg" />
+        </template>
+        刷新
+      </ButtonGradient>
+      </div>
+
+      <InputSearch ref="searchComp" style="width: 400px" :formList="searchFormList" @handleSearch="handleSearch" />
+    </div>
+    <!-- 内容 -->
+    <div class="body">
+      <Table :data="tableData" :span-method="mergeRow" >
+
+        <ElTableColumn label="设备名称" prop="stakeMark" width="200"  align="center" header-align="center" >
+          <template slot-scope="scope">
+            <span>一类交调站{{scope.row.stakeMark}}</span>
+          </template>
+        </ElTableColumn>
+        <ElTableColumn label="方向" prop="direction"  align="center" header-align="center" width="120">
+          <template slot-scope="scope">
+            <span v-if="scope.row.direction == '1'">菏泽</span>
+            <span v-if="scope.row.direction == '3'">济南</span>
+          </template>
+        </ElTableColumn>
+        <ElTableColumn v-for="item in columnList" :label="item.label" :prop="item.key" min-width="80" align="center" header-align="center" />
+        <ElTableColumn label="合计" prop="total" width="150" align="center" header-align="center" />
+      </Table>
+    </div>
+
+
+  </div>
+</template>
+
+<script>
+import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue';
+import Pagination from '@screen/components/Pagination.vue';
+import Table from '@screen/components/Table.vue';
+import request from "@/utils/request";
+import BoardRecordPreview from '@screen/components/infoBoard/BoardRecordPreview.vue'
+import InputSearch from "@screen/components/InputSearch/index.vue";
+import { searchFormList } from "./data";
+import { delay, exportFile, confirm } from "@screen/utils/common";
+import Button from "@screen/components/Buttons/Button.vue";
+import Form from "@screen/components/FormConfig";
+import Dialog from "@screen/components/Dialog/index.vue";
+import {  mapState } from "vuex";
+import moment from 'moment';
+
+export default {
+  name: 'survey',
+  components: {
+    ButtonGradient,
+    Pagination,
+    Table,
+    Button,
+    Form,
+    Dialog,
+    BoardRecordPreview,
+    InputSearch
+  },
+  data() {
+    return {
+      tableData: [],
+      searchFormList,
+      total: 20,
+      searchData: {
+      },
+      columnList:[],
+    }
+  },
+  computed: {
+    ...mapState(["menu"]),
+  },
+  created() {
+    this.initData();
+  },
+  mounted(){
+  },
+  methods: {
+
+    mergeRow({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) {
+        const start = this.tableData.findIndex(data => data.stakeMark === row.stakeMark);
+        if (start !== -1) {
+          const count = this.tableData.filter((data, index) => index >= start && data.stakeMark === row.stakeMark).length;
+          if (rowIndex === start) {
+            return [count, 1]; // 返回要合并的行数和列数
+          } else {
+            return [0, 0]; // 不合并
+          }
+        }
+      }
+      return [1, 1];
+    },
+
+    onRefreshForm(){
+      this.searchData.pageNum = 1;
+      this.$refs.searchComp.handleResetForm();
+    },
+    handleSearch(data) {
+      data.timestamp = data.startTime + " 00:00:01";
+      this.searchData = { ...data };
+      this.initData();
+    },
+    indexMethod(index) {
+        return this.searchData.pageSize*(this.searchData.pageNum-1) + index + 1;
+    },
+    //
+    /** 导出按钮操作 */
+    handleExport() {
+      exportFile({
+        url: "/trafficSurveyData/dcTrafficSurveyData/export",
+        filename: "一类交调站",
+        data: this.searchData,
+      });
+    },
+    initData() {
+      if(!this.searchData.timestamp){
+        this.searchData.timestamp = moment().format('YYYY-MM-DD') + " 00:00:01"
+      }
+      if(!this.searchData.type){
+        this.searchData.type = 'day'
+      }
+      request({
+        url: `/trafficSurveyData/dcTrafficSurveyData/list`,
+        method: "get",
+        params: this.searchData,
+      }).then((result) => {
+        this.columnList = result.data.columnList
+        this.tableData = result.data.rowList
+      });
+    },
+    onSizeChange(pageSize) {
+      this.tableData = [];
+      this.searchData.pageSize = pageSize;
+      this.searchData.pageNum = 1;
+      this.initData();
+    }
+  }
+}
+</script>
+
+<style lang='scss' scoped>
+.board_record {
+  width:100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .filter {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 20px;
+    >div {
+      display: flex;
+      gap: 6px;
+    }
+  }
+
+  .body {
+    flex: 1;
+    height: 0;
+  }
+
+  .footer {
+    margin-top: 15px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .board_shower{
+    margin: 4px;
+  }
+  ::v-deep .el-carousel__indicators--horizontal{
+    line-height: 0; height: 16px;
+    .el-carousel__indicator--horizontal{
+      padding: 7px 4px;
+    }
+  }
+  ::v-deep .el-table__cell div.cell {
+    padding: 0 10px !important;
+  }
+}
+.upload-file{
+  position: absolute;
+  width: 120px;
+  height: 120px;
+  margin-left: 55%;
+  bottom: 210px;
+  z-index: 9999;
+}
+::v-deep .el-upload-dragger{
+    background-color: #104c66 !important;
+    border: 1px solid #359cbc !important;
+
+}
+</style>