同城分销店拆分、分销店对应多个经销商

src/views/componentsTarget/createStoreBJ.vue

@@ -13,13 +13,13 @@
     </van-col>
     <van-col span="12">
       <p>
-        可控店点数：
+        <span class="colLabel colLabel_KK">可控店</span>
         <span class="colorbalck">{{ Micrometer(reportTargetAll.controlledShopMonthAct) }}</span>
       </p>
     </van-col>
     <van-col span="12">
       <p>
-        可控店点数：
+        <span class="colLabel colLabel_KK">可控店</span>
         <span class="colorbalck">{{ Micrometer(reportTargetAll.controlledShopYearAct) }}</span>
         <span class="colorbalck" v-if="reportTargetAll.controlledShopYearRate"
           >({{ reportTargetAll.controlledShopYearRate }}%)</span
@@ -29,13 +29,13 @@
     </van-col>
     <van-col span="12">
       <p>
-        分销店点数：
+        <span class="colLabel colLabel_FX">分销店</span>
         <span class="colorbalck">{{ Micrometer(reportTargetAll.allShopMonthAct) }}</span>
       </p>
     </van-col>
     <van-col span="12">
       <p>
-        分销店点数：
+        <span class="colLabel colLabel_FX">分销店</span>
         <span class="colorbalck">{{ Micrometer(reportTargetAll.allShopYearAct) }}</span>
         <span class="colorbalck" v-if="reportTargetAll.allShopYearRate"
           >({{ reportTargetAll.allShopYearRate }}%)</span
@@ -43,75 +43,79 @@
         <span class="colorbalck" v-else>({{ '-' }})</span>
       </p>
     </van-col>
-    <div class="colBack">
+    <div>
       <div class="backLeft back"></div>
       <div class="backRight back"></div>
       <van-col span="12">
         <p>
-          金牌店点数：
+          <span class="colLabel colLabel_JP">金牌店</span>
           <span class="colorbalck">{{ Micrometer(reportTargetAll.goldShopMonthAct) }}</span>
         </p>
       </van-col>
       <van-col span="12">
         <p>
-          金牌店点数：<span class="colorbalck">{{
-            Micrometer(reportTargetAll.goldShopYearAct)
-          }}</span
-          ><span class="colorbalck" v-if="reportTargetAll.goldShopYearRate"
-            >({{ reportTargetAll.goldShopYearRate }}%)</span
-          >
+          <span class="colLabel colLabel_JP">金牌店</span>
+          <span class="colorbalck">{{ Micrometer(reportTargetAll.goldShopYearAct) }}</span>
+          <span class="colorbalck" v-if="reportTargetAll.goldShopYearRate">
+            ({{ reportTargetAll.goldShopYearRate }}%)
+          </span>
           <span class="colorbalck" v-else>({{ '-' }})</span>
         </p>
       </van-col>
-      <van-col span="12"
-        ><p>
-          金牌店布机：<span class="colorbalck">{{
-            Micrometer(reportTargetAll.goldShopBjMonthAct)
-          }}</span>
-        </p></van-col
-      >
       <van-col span="12">
         <p>
-          金牌店布机：<span class="colorbalck">{{
-            Micrometer(reportTargetAll.goldShopBjYearAct)
-          }}</span
-          ><span class="colorbalck" v-if="reportTargetAll.goldShopBjYearRate"
-            >({{ reportTargetAll.goldShopBjYearRate }}%)</span
-          >
+          <span class="colLabel colLabel_JPBJ">金牌店布机</span>
+          <span class="colorbalck">{{ Micrometer(reportTargetAll.goldShopBjMonthAct) }}</span>
+        </p>
+      </van-col>
+      <van-col span="12">
+        <p>
+          <span class="colLabel colLabel_JPBJ">金牌店布机</span>
+          <span class="colorbalck">{{ Micrometer(reportTargetAll.goldShopBjYearAct) }}</span>
+          <span class="colorbalck" v-if="reportTargetAll.goldShopBjYearRate">
+            ({{ reportTargetAll.goldShopBjYearRate }}%)
+          </span>
           <span class="colorbalck" v-else>({{ '-' }})</span>
         </p>
       </van-col>
-
-      <van-col span="12"
-        ><p>
-          同A店点数：<span class="colorbalck">{{
-            Micrometer(reportTargetAll.tcAShopMonthAct)
-          }}</span>
-        </p></van-col
-      >
       <van-col span="12">
         <p>
-          同A店点数：<span class="colorbalck">{{ Micrometer(reportTargetAll.tcAShopYearAct) }}</span
-          ><span class="colorbalck" v-if="reportTargetAll.tcAShopYearRate"
-            >({{ reportTargetAll.tcAShopYearRate }}%)</span
-          >
+          <span class="colLabel colLabel_TCFX">同城分销</span>
+        </p>
+      </van-col>
+      <van-col span="12">
+        <p>
+          <span class="colLabel colLabel_TCFX">同城分销</span>
+        </p>
+      </van-col>
+      <van-col span="12">
+        <p>
+          涂料店：<span class="colorbalck">{{ Micrometer(reportTargetAll.tcAShopMonthAct) }}</span>
+        </p>
+      </van-col>
+      <van-col span="12">
+        <p>
+          涂料店：<span class="colorbalck">{{ Micrometer(reportTargetAll.tcAShopYearAct) }}</span>
+          <span class="colorbalck" v-if="reportTargetAll.tcAShopYearRate">
+            ({{ reportTargetAll.tcAShopYearRate }}%)
+          </span>
           <span class="colorbalck" v-else>({{ '-' }})</span>
         </p>
       </van-col>
 
-      <van-col span="12"
-        ><p>
-          同B店点数：<span class="colorbalck">{{
-            Micrometer(reportTargetAll.tcBShopMonthAct)
-          }}</span>
-        </p></van-col
-      >
       <van-col span="12">
         <p>
-          同B店点数：<span class="colorbalck">{{ Micrometer(reportTargetAll.tcBShopYearAct) }}</span
-          ><span class="colorbalck" v-if="reportTargetAll.tcBShopYearRate"
-            >({{ reportTargetAll.tcBShopYearRate }}%)</span
-          >
+          其他店：
+          <span class="colorbalck">{{ Micrometer(reportTargetAll.tcBShopMonthAct) }}</span>
+        </p>
+      </van-col>
+      <van-col span="12">
+        <p>
+          其他店：
+          <span class="colorbalck">{{ Micrometer(reportTargetAll.tcBShopYearAct) }}</span>
+          <span class="colorbalck" v-if="reportTargetAll.tcBShopYearRate">
+            ({{ reportTargetAll.tcBShopYearRate }}%)
+          </span>
           <span class="colorbalck" v-else>({{ '-' }})</span>
         </p>
       </van-col>

src/views/componentsTarget/index.css

@@ -66,6 +66,9 @@ p{
 .colLabel_JP{
     background: rgb(241, 183, 137);
 }
+.colLabel_JPBJ{
+    background: rgb(248 215 189);
+}
 .colLabel_TCFX{
     background: rgb(131 204 202);
 }