优化

pages/kotra/brand/brandComponent.vue

@@ -17,12 +17,16 @@
                   mode="aspectFill"
                   :src="x.BannerList[0]"
                 />
-                <view class="imgNum" style="">
-                  <span class="imgN" style="display: flex;margin-bottom: 10rpx;">
-                    <span v-if="x.AreaRequirement>0">
+                <view class="imgNum" v-if="x.AreaRequirement>0||x.EndAreaRequirement>0||x.ShopNum>0">
+                  <span class="imgN" style="margin-bottom: 10rpx;"
+                  :style="{'text-align':!x.ShopNum||x.ShopNum==''?'right':'left'}">
+                    <span v-if="x.AreaRequirement>0||x.EndAreaRequirement>0">
                       面积： {{x.AreaRequirement}}
                     </span>
-                    <span v-if="x.EndAreaRequirement>0&&u.MallBaseId==18">-{{x.EndAreaRequirement }}</span>㎡
+                    <span v-if="x.EndAreaRequirement>0&&u.MallBaseId==18">-{{x.EndAreaRequirement }}</span>
+                    <template v-if="x.AreaRequirement>0||x.EndAreaRequirement>0">
+                      ㎡
+                    </template>
                   </span>
                   <span class="imgN" v-if="x.ShopNum>0">
                     店铺： {{x.ShopNum}}个
@@ -86,23 +90,19 @@
 .imgNum{
   width: 100%;
   position: absolute;
-  bottom: 25rpx;
-  padding: 0 27rpx;
+  bottom: 0;
+  padding: 15rpx 27rpx 5rpx 27rpx;
   z-index: 2;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   color: #fff;
   font-size: 20rpx;
+  background: rgba(23,23,23,0.4);
 }
 .imgN{
   flex: 1;
 }
-.imgN span.active{
-  width: 100%;
-  display: inline-block;
-  text-align: right;
-}
 .imgN:nth-child(2){
   text-align: right;
 }