xiangpei
2024-08-09 923446fa3ce8fe19be88c710b52a84b522973492
src/views/screen/newPage/index.vue
@@ -3,7 +3,7 @@
    <div style="display: flex; justify-content: center">
      <div class="header_box">
        <div class="tabs-box">
          <el-tabs v-model="activeName" @tab-click="handleClick">
          <el-tabs v-model="activeName" @tab-click="tabChange">
            <el-tab-pane
              v-for="item in testData1"
              :label="item.name"
@@ -22,7 +22,7 @@
        </div>
        <div class="card" style="height: 622px">
          <div class="card_header"><div class="title">工单数据</div></div>
          <div><ScreenData></ScreenData></div>
          <div><ScreenData :workOrderData="workOrderData"></ScreenData></div>
        </div>
      </div>
      <div class="large_screen_box">
@@ -35,89 +35,35 @@
            <div class="title">设备数据</div>
          </div>
          <div>
            <div class="device_data">
            <div
              class="device_data"
              v-for="(item, index) in deviceList"
              :key="index"
            >
              <img
                src="../../../assets/images/screen/lxicon.png"
                alt=""
                style="height: 25px"
              />
              <div style="margin: 0 10px">人脸</div>
              <div style="margin: 0 10px">{{ item.type }}</div>
              <div class="data-info">
                <div class="data-lable">设备总数</div>
                <div class="data-num type1">
                  <span v-roll>{{ 1123 }}</span
                  <span v-roll>{{ item.totalNum }}</span
                  ><i class="el-icon-top"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备正常数</div>
                <div class="data-num type2">
                  <span v-roll>{{ 1123 }}</span
                  <span v-roll>{{ item.normalNum }}</span
                  ><i class="el-icon-top"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备异常数</div>
                <div class="data-num type3">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
            </div>
            <div class="device_data">
              <img
                src="../../../assets/images/screen/lxicon.png"
                alt=""
                style="height: 25px"
              />
              <div style="margin: 0 10px">车辆</div>
              <div class="data-info">
                <div class="data-lable">设备总数</div>
                <div class="data-num type1">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备正常数</div>
                <div class="data-num type2">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备异常数</div>
                <div class="data-num type3">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
            </div>
            <div class="device_data">
              <img
                src="../../../assets/images/screen/lxicon.png"
                alt=""
                style="height: 25px"
              />
              <div style="margin: 0 10px">视频</div>
              <div class="data-info">
                <div class="data-lable">设备总数</div>
                <div class="data-num type1">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备正常数</div>
                <div class="data-num type2">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备异常数</div>
                <div class="data-num type3">
                  <span v-roll>{{ 1123 }}</span
                  <span v-roll>{{ item.errorNum }}</span
                  ><i class="el-icon-bottom"></i>
                </div>
              </div>
@@ -128,7 +74,7 @@
          <div class="card_header">
            <div class="title">设备正常率</div>
            <div style="margin: 10px 10px">
              <ScreenTable></ScreenTable>
              <ScreenTable :tableData="tableData"></ScreenTable>
            </div>
          </div>
        </div>
@@ -179,6 +125,7 @@
import ExamineChart from "../components/screen-examine/components/examine-chart.vue";
import ScreenData from "../components/screen-data/index.vue";
import NewMap from "./components/newMap.vue";
import { getDeviceData, getWorkOrderData, getNormalRate } from "@/api/newpage";
export default {
  name: "Newpage",
  components: {
@@ -199,7 +146,7 @@
          value: "1",
        },
        {
          name: "市局数据",
          name: "区县数据",
          value: "2",
        },
        {
@@ -207,9 +154,37 @@
          value: "3",
        },
      ],
      deviceList: [],
      workOrderData: {
        workOrderRegion: {
          create_time: "2024-03-05T19:04:24",
          deleted: 0,
          error_type: "网络故障,无光",
          id: 1,
          serial_number: 0,
          source: "中山大道与宝善巷交叉口东",
          status: "DISTRIBUTED",
          unit_id: 2,
          update_time: "2024-04-15T17:07:54",
          work_order_no: "202403051212",
          yw_check_result: "/profile/upload/2024/03/26/20240326100819A001.jpg",
          yw_condition: "修复完成",
          yw_handle_time: "2024-03-05T19:04:06",
          yw_people_id: 1,
          yw_result: "OK",
        },
        workOrderTotal: {
          doneNum: 8,
          todoNum: 20,
          totalNum: 28,
        },
      },
      tableData: [],
    };
  },
  mounted() {},
  mounted() {
    this.getData();
  },
  methods: {
    returnPath() {
      this.$router.push("/index");
@@ -217,6 +192,29 @@
    handleClick(tab, event) {
      console.log(tab, event);
    },
    getData() {
      getDeviceData()
        .then((res) => {
          this.deviceList = res.data;
        })
        .catch((err) => {});
      getWorkOrderData()
        .then((res) => {
          this.workOrderData = res.data;
        })
        .catch((err) => {});
      this.getTableList();
    },
    getTableList() {
      getNormalRate(this.activeName)
        .then((res) => {
          this.tableData = res.data;
        })
        .catch((err) => {});
    },
    tabChange(){
      this. getTableList()
    }
  },
};
</script>