diff --git a/src/views/pictureOnMap/page/DrainageSystem/YSIndex_right.vue b/src/views/pictureOnMap/page/DrainageSystem/YSIndex_right.vue
index 4a48606..1bbe6c6 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/YSIndex_right.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/YSIndex_right.vue
@@ -5,12 +5,12 @@
     </div>
     <div class="canalList">
       <div class="list flex" v-for="i in allList" :key="i">
-        <div class="name flex flex-justcontent-center flex-align-center"><div>{{i.waterRegionName}}<br/>({{i.lengthSum}})</div></div>
+        <div class="name flex flex-justcontent-center flex-align-center"><div>{{i.waterRegionName}}<br/><span>{{i.lengthSum}}km</span></div></div>
         <div class="info flex-1">
           <div class="ditch flex flex-justcontent-center" v-for="e in i.portChannelList" :key="e">
             <div class="one">{{e.name}}</div>
             <div class="two flex-1 flex flex-align-center"><div class="inBra" :style="{width:`${e.length/8*100}%`}"><span :style="{right:e.length<2?'-24px':''}">{{e.length}}</span></div></div>
-            <div class="tre">目标：<span :class="`color${e.targetQuality}`">{{getChineseFun(level,'label', e.targetQuality,'value')}}</span></div>
+            <div class="tre">目标：<span :class="`color${e.targetQuality}`">{{getChineseFun(level,'label', e.targetQuality,'value')||'--'}}</span></div>
           </div>
         </div>
       </div>
@@ -150,6 +150,9 @@
     line-height:22px;
     text-align: center;
     padding: 0 12px;
+    span{
+      white-space: nowrap;
+    }
   }
   .ditch{
     height: 24px;