样式调整

src/pages/index/components/berth_peration_nalysis.vue

@@ -2,15 +2,16 @@
   <div class="body-wrapper">
     <div class="page-container">
       <h2 style="color: #3498db;">泊位运营分析</h2>
-      <div style="width: 99%; height: 350px">
+      <div style="width: 99%; height: 480px">
         <linechart
           :autoStop="false"
           :top="30"
-          :bottom="30"
+          :bottom="180"
           :left="40"
           :legendTop="0"
           yAxisName="(停车数)"
           :dataset="linedata"
+          :xlabelFormat="taskFinishXFormat"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
               { x: 'month', y: 'lastAmount', seriesName: '泊位盈余情况',bool:'true' },
@@ -18,13 +19,14 @@
           id="sxcyfzqk"
         />
       </div>
-      <div style="width: 99%; height: 350px">
+      <div style="width: 99%; height: 480px">
         <linechart
           :autoStop="false"
           :top="30"
-          :bottom="30"
+          :bottom="180"
           :left="40"
           :legendTop="0"
+          :xlabelFormat="taskFinishXFormat"
           yAxisName="(平均周转次数)"
           :dataset="linedata1"
           :tooltipFormat="lineTooltipFormat1"
@@ -62,6 +64,10 @@ export default {
 
   },
   methods: {
+    taskFinishXFormat(name) {
+      var str = name.split("");
+      return str.join("\n");
+    },
     getLinedata1Data(){
       api.queryBerthPerationNalysis_Bwzzlfx().then(res=>{
         this.linedata1=res.data;