fix: 柱状体3D效果优化调整

src/views/pageMonitor/bottomLeft/OpHistogram.vue

@@ -166,6 +166,7 @@ export default {
           height: "80%",
           top: "8%",
           right: 0,
+
           // bottom: "5%",
         },
         xAxis: {
@@ -270,6 +271,10 @@ export default {
                 that.colors[index]
               );
             },
+            shadowBlur: 8,
+            shadowColor: "rgba(255,255,255,.4)",
+            borderColor: "rgba(255,255,255,.6)",
+            borderWidth: 0.4,
           },
         });
       });

src/views/pageMonitor/bottomLeft/index.vue

@@ -47,11 +47,8 @@
 </template>
 
 <script>
-// import { GetMonitorOperationNumber } from "@/api/monitor";
 import { GetMonitorOperationDept } from "@/api/monitor";
 import dayjs from "dayjs";
-// import Histogram from "./OpHistogram.vue";
-// import Histogram from "@/views/pageMonitor/bottomLeft/OpHistogram.vue";
 import Histogram from "@/views/pageMonitor/bottomRight/DepHistogram.vue";
 export default {
   data() {

src/views/pageMonitor/bottomRight/DepHistogram.vue

@@ -273,6 +273,10 @@ export default {
                 that.colors[index]
               );
             },
+            shadowBlur: 8,
+            shadowColor: 'rgba(255,255,255,.4)',
+            borderColor: "rgba(255,255,255,.6)",
+            borderWidth: 0.4,
           },
         });
       });

src/views/pageMonitor/bottomRight/index.vue

@@ -9,8 +9,8 @@
       <img src="@/assets/svg/Monitor/Triangle.svg" />
       <span class="text-[2.03vh] youshe leading-none">手术量统计</span>
     </div>
-    <div class="w-[35.46vh] h-[28.05vh] ml-[2.4vh] my-[3.7vh]">
+    <div class="w-[35.46vh] h-[28.05vh] ml-[2.4vh] opBody">
-      <!-- <div ref="echartsContainer"></div> -->
+      <div class="h-[30vh] w-full">
         <Histogram
           v-if="getDataList.length"
           :getDataList="getDataList"
@@ -23,6 +23,7 @@
           <span>暂无数据</span>
         </div>
       </div>
+    </div>
     <div
       class="absolute right-0 top-1/4 w-[3.51vh] h-[12.6vh]"
       :class="sliderClass"
@@ -46,8 +47,6 @@
 <script>
 import { GetMonitorOperationNumber } from "@/api/monitor";
 import dayjs from "dayjs";
-// import Histogram from "./DepHistogram.vue";
-// import Histogram from "@/views/pageMonitor/bottomRight/DepHistogram.vue"
 import Histogram from "@/views/pageMonitor/bottomLeft/OpHistogram.vue";
 
 export default {
@@ -126,4 +125,10 @@ export default {
 .bgMonthBox {
   background-image: url("@/assets/svg/Monitor/BottomLeft/MonthActive.svg");
 }
+.opBody{
+  height: calc(100% - 5.07vh);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 </style>