feat: 增加vue2版本的边框组件，添加vueuse依赖 样式微调

刘嘉威

2023-07-10 58f406ecca89ca7027392d97e28a906c476515f3

 src/views/index/index.vue

@@ -2,7 +2,12 @@
import ItemWrap from "@/components/item-wrap";

import LeftTop from "./left-top.vue";

import LeftCenter from "./left-center.vue";



import LeftBottom from "./left-bottom.vue";

import CenterMap from "./center-map.vue";

import CenterBottom from "./center-bottom.vue";

import RightTop from "./right-top.vue";

import RightCenter from "./right-center.vue";

import RightBottom from "./right-bottom.vue";

</script>



<template>

@@ -23,17 +28,17 @@
        title="设备提醒"

        style="padding: 0 10px 16px 10px"

      >

        <!-- <LeftBottom /> -->

        <LeftBottom />

      </ItemWrap>

    </div>

    <div class="contetn_center">

      <!-- <CenterMap class="contetn_center_top" />

      <CenterMap class="contetn_center_top" title="设备分布图" />

      <ItemWrap class="contetn_center-bottom" title="安装计划">

        <CenterBottom />

      </ItemWrap> -->

      </ItemWrap>

    </div>

    <div class="contetn_right">

      <!-- <ItemWrap class="contetn_left-bottom contetn_lr-item" title="报警次数">

      <ItemWrap class="contetn_left-bottom contetn_lr-item" title="报警次数">

        <RightTop />

      </ItemWrap>

      <ItemWrap

@@ -45,7 +50,7 @@
      </ItemWrap>

      <ItemWrap class="contetn_left-bottom contetn_lr-item" title="数据统计图 ">

        <RightBottom />

      </ItemWrap> -->

      </ItemWrap>

    </div>

  </div>

</template>

@@ -71,6 +76,12 @@
.contetn_center {

  flex: 1;

  margin: 0 54px;

  display: flex;

  flex-direction: column;

  justify-content: space-around;

  .contetn_center-bottom {

    height: 315px;

  }

}



.contetn_lr-item {