修改订单样式

src/views/platmanag/order/parts/detail/parts/card-1.vue

@@ -2,18 +2,14 @@
   <div id="card-1">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="11" class="main_one">
+        <el-col :span="12" class="main_one">
           <el-col :span="24" class="add">
             <el-col :span="2">
               <i class="el-icon-location"></i>
             </el-col>
             <el-col :span="22">
-              <el-col>
-                <p>{{ address.name }},{{ address.phone }}</p>
-              </el-col>
-              <el-col>
-                <p>{{ address.province }} , {{ address.city }} , {{ address.area }} , {{ address.address }}</p>
-              </el-col>
+              <el-col :span="24"> {{ address.name }},{{ address.phone }} </el-col>
+              <el-col :span="24"> {{ address.province }} , {{ address.city }} , {{ address.area }} , {{ address.address }} </el-col>
             </el-col>
           </el-col>
           <el-col :span="24" class="shop"> <i class="el-icon-s-shop"></i>{{ shop.name }}</el-col>
@@ -22,12 +18,8 @@
               <el-col :span="6"><el-image :src="item.goods.file[0].url"></el-image></el-col>
               <el-col :span="18">
                 <el-col :span="12">
-                  <el-col :span="24">
-                    <p>{{ item.goods.name }}</p>
-                  </el-col>
-                  <el-col :span="24">
-                    <p>规格：{{ item.name }}</p>
-                  </el-col>
+                  <el-col :span="24"> {{ item.goods.name }} </el-col>
+                  <el-col :span="24"> 规格：{{ item.name }} </el-col>
                 </el-col>
                 <el-col :span="12" class="money">
                   <el-col :span="24" style="color: red; font-size: 20px">
@@ -35,18 +27,12 @@
                     <p v-else-if="form.type == '0' && !item.price">￥{{ item.sell_money }}</p>
                     <p v-else-if="form.type == '1'">￥{{ item.group_config.money }}</p>
                   </el-col>
-                  <el-col :span="24">
-                    <p>X{{ item.buy_num }}</p>
-                  </el-col>
+                  <el-col :span="24"> X{{ item.buy_num }} </el-col>
                   <el-col :span="24">
                     <span class="spanfour" style="color: blue" @click="toUrl(item.goods.url)"> 查看商品来源:{{ item.goods.source }}</span>
                   </el-col>
-                  <el-col :span="24">
-                    <p>{{ item.is_afterSale == true ? '已申请售后' : '未申请售后' }}</p>
-                  </el-col>
-                  <el-col :span="24">
-                    <p>{{ item.is_rate == true ? '已评价' : '未评价' }}</p>
-                  </el-col>
+                  <el-col :span="24"> {{ item.is_afterSale == true ? '已申请售后' : '未申请售后' }} </el-col>
+                  <el-col :span="24">{{ item.is_rate == true ? '已评价' : '未评价' }}</el-col>
                 </el-col>
               </el-col>
             </el-col>
@@ -55,15 +41,63 @@
               <el-col :span="18" class="other" v-if="!item.goods.freight == '0'">{{ item.goods.freight }}</el-col>
               <el-col :span="18" class="other" v-else>包邮</el-col>
             </el-col>
+            <el-col :span="24" class="bode" v-if="item.act">
+              <el-col :span="24">平台活动优惠</el-col>
+              <el-col :span="24" v-for="(item, index) in item.act" :key="index">
+                <el-col :span="8">
+                  {{
+                    item.platform_act_type == '0'
+                      ? '优惠商品合集'
+                      : item.platform_act_type == '1'
+                      ? '按单返现'
+                      : item.platform_act_type == '2'
+                      ? '买赠'
+                      : item.platform_act_type == '3'
+                      ? '特价'
+                      : item.platform_act_type == '4'
+                      ? ''
+                      : item.platform_act_type == '5'
+                      ? '满减'
+                      : item.platform_act_type == '6'
+                      ? '满减折扣'
+                      : '套装促销'
+                  }}
+                </el-col>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '4'">加价购 </el-col>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '3'">
+                  <p>{{ item.sp_price }} 元</p>
+                </el-col>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '5' || item.platform_act_type == '6'">
+                  <p>{{ item.discount }} 元</p>
+                </el-col>
+                <el-col :span="24" class="other" v-if="item.platform_act_type == '2'">
+                  <el-table :data="item.gift" border style="width: 100%">
+                    <el-table-column prop="goods_name" label="商品" width="180"> </el-table-column>
+                    <el-table-column prop="spec_name" label="规格" width="180"> </el-table-column>
+                    <el-table-column prop="num" label="数量"> </el-table-column>
+                    <el-table-column prop="desc" label="备注"> </el-table-column>
+                  </el-table>
+                </el-col>
+              </el-col>
+            </el-col>
+          </el-col>
+        </el-col>
+        <el-col :span="12" class="main_one">
+          <el-col :span="24" class="bode">
+            <el-col :span="6">下单时间</el-col>
+            <el-col :span="18" class="other">{{ form.buy_time }}</el-col>
+          </el-col>
+          <el-col :span="24" class="bode">
+            <el-col :span="6">支付时间</el-col>
+            <el-col :span="18" class="other">{{ form.pay_time }}</el-col>
           </el-col>
           <el-col :span="24" class="bode">
             <el-col :span="6">订单备注</el-col>
-            <el-col :span="18" class="other" v-if="form.remarks">{{ form.remarks }}</el-col>
-            <el-col :span="18" class="other" v-else>暂无备注</el-col>
+            <el-col :span="18" class="other">{{ form.remarks || '' }}</el-col>
           </el-col>
           <el-col :span="24" class="bode">
             <el-col :span="6">配送方式</el-col>
-            <el-col :span="18" class="other">{{ form.transport_type_name || '暂无' }}</el-col>
+            <el-col :span="18" class="other">{{ form.transport_type_name || '' }}</el-col>
           </el-col>
           <el-col :span="24" class="goods_total bode">
             <el-col :span="8">商品总额</el-col>
@@ -71,29 +105,44 @@
               <p>￥{{ total_detail.goods_total }}</p>
             </el-col>
           </el-col>
-          <el-col :span="24" class="goods_total bode">
-            <el-col :span="8">平台活动优惠</el-col>
-            <el-col :span="16" class="other"> <p></p> </el-col>
-          </el-col>
-          <el-col :span="24" class="goods_total bode">
-            <el-col :span="8">优惠后实付金额</el-col>
-            <el-col :span="16" class="other">
-              <p>￥{{ pay.pay_money }}</p>
-            </el-col>
-          </el-col>
           <el-col :span="24" class="goods_total bode">
             <el-col :span="6">快递费</el-col>
             <el-col :span="18" class="other">
               <p>￥{{ total_detail.freight_total }}</p>
             </el-col>
           </el-col>
-          <el-col :span="24" class="bode">
-            <el-col :span="6">下单时间</el-col>
-            <el-col :span="18" class="other">{{ form.buy_time }}</el-col>
+          <el-col :span="24" class="goods_total bode" v-if="getActLength() != '0' && getActLength()">
+            <el-col :span="24">平台活动优惠</el-col>
+            <el-col :span="24" v-for="(item, index) in total_detail.act" :key="index">
+              <el-col :span="8">
+                {{
+                  item.platform_act_type == '0'
+                    ? '优惠商品合集'
+                    : item.platform_act_type == '1'
+                    ? '按单返现'
+                    : item.platform_act_type == '2'
+                    ? '买赠'
+                    : item.platform_act_type == '3'
+                    ? '特价'
+                    : item.platform_act_type == '4'
+                    ? '加价购'
+                    : item.platform_act_type == '5'
+                    ? '满减'
+                    : item.platform_act_type == '6'
+                    ? '满减折扣'
+                    : '套装促销'
+                }}
+              </el-col>
+              <el-col :span="16" class="other">
+                <p>{{ item.discount }} 元</p>
+              </el-col>
+            </el-col>
           </el-col>
-          <el-col :span="24" class="bode">
-            <el-col :span="6">支付时间</el-col>
-            <el-col :span="18" class="other">{{ form.pay_time }}</el-col>
+          <el-col :span="24" class="goods_total bode">
+            <el-col :span="8">优惠后实付金额</el-col>
+            <el-col :span="16" class="other">
+              <p>￥{{ pay.pay_money }} 元</p>
+            </el-col>
           </el-col>
         </el-col>
       </el-col>
@@ -123,6 +172,9 @@ export default {
       if (url) window.open(url, '_blank');
       else this.$message.error('该商品还未添加来源网址，无法跳转');
     },
+    getActLength() {
+      return _.get(this.total_detail, 'act.length');
+    },
   },
   computed: {
     ...mapState(['user']),
@@ -142,9 +194,9 @@ export default {
 
 <style lang="less" scoped>
 .main {
-  padding: 0 5%;
+  // padding: 0 5%;
   .main_one {
-    margin: 0 30px;
+    padding: 0 5%;
   }
   .add {
     border-bottom: 2px dashed #ccc;

src/views/selfShop/order/parts/detail/parts/card-1.vue

@@ -2,95 +2,149 @@
   <div id="card-1">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="add">
-          <el-col :span="2">
-            <i class="el-icon-location"></i>
-          </el-col>
-          <el-col :span="22">
-            <el-col>
-              <p>{{ address.name }},{{ address.phone }}</p>
+        <el-col :span="12" class="main_one">
+          <el-col :span="24" class="add">
+            <el-col :span="2">
+              <i class="el-icon-location"></i>
             </el-col>
-            <el-col>
-              <p>{{ address.province }} , {{ address.city }} , {{ address.area }} , {{ address.address }}</p>
+            <el-col :span="22">
+              <el-col :span="24"> {{ address.name }},{{ address.phone }} </el-col>
+              <el-col :span="24"> {{ address.province }} , {{ address.city }} , {{ address.area }} , {{ address.address }} </el-col>
             </el-col>
           </el-col>
-        </el-col>
-        <el-col :span="24" class="shop"> <i class="el-icon-s-shop"></i>{{ shop.name }}</el-col>
-        <el-col :span="24" v-for="(item, index) in list" :key="index">
-          <el-col :span="24" class="goods bode">
-            <el-col :span="6"><el-image :src="item.goods.file[0].url"></el-image></el-col>
-            <el-col :span="18">
-              <el-col :span="12">
-                <el-col>
-                  <p>{{ item.goods.name }}</p>
+          <el-col :span="24" class="shop"> <i class="el-icon-s-shop"></i>{{ shop.name }}</el-col>
+          <el-col :span="24" v-for="(item, index) in list" :key="index">
+            <el-col :span="24" class="goods bode">
+              <el-col :span="6"><el-image :src="item.goods.file[0].url"></el-image></el-col>
+              <el-col :span="18">
+                <el-col :span="12">
+                  <el-col :span="24"> {{ item.goods.name }} </el-col>
+                  <el-col :span="24"> 规格：{{ item.name }} </el-col>
                 </el-col>
-                <el-col>
-                  <p>规格：{{ item.name }}</p>
+                <el-col :span="12" class="money">
+                  <el-col :span="24" style="color: red; font-size: 20px">
+                    <p v-if="form.type == '0' && item.price">￥{{ item.price }}</p>
+                    <p v-else-if="form.type == '0' && !item.price">￥{{ item.sell_money }}</p>
+                    <p v-else-if="form.type == '1'">￥{{ item.group_config.money }}</p>
+                  </el-col>
+                  <el-col :span="24"> X{{ item.buy_num }} </el-col>
+                  <el-col :span="24">
+                    <span class="spanfour" style="color: blue" @click="toUrl(item.goods.url)"> 查看商品来源:{{ item.goods.source }}</span>
+                  </el-col>
+                  <el-col :span="24"> {{ item.is_afterSale == true ? '已申请售后' : '未申请售后' }} </el-col>
+                  <el-col :span="24">{{ item.is_rate == true ? '已评价' : '未评价' }}</el-col>
                 </el-col>
               </el-col>
-              <el-col :span="12" class="money">
-                <el-col>
-                  <p v-if="form.type == '0'">￥{{ item.sell_money }}</p>
-                  <p v-else-if="form.type == '1'">￥{{ item.group_config.money }}</p>
-                </el-col>
-                <el-col>
-                  <p>X{{ item.buy_num }}</p>
+            </el-col>
+            <el-col :span="24" class="bode">
+              <el-col :span="6">运费</el-col>
+              <el-col :span="18" class="other" v-if="!item.goods.freight == '0'">{{ item.goods.freight }}</el-col>
+              <el-col :span="18" class="other" v-else>包邮</el-col>
+            </el-col>
+            <el-col :span="24" class="bode" v-if="item.act">
+              <el-col :span="24">平台活动优惠</el-col>
+              <el-col :span="24" v-for="(item, index) in item.act" :key="index">
+                <el-col :span="8">
+                  {{
+                    item.platform_act_type == '0'
+                      ? '优惠商品合集'
+                      : item.platform_act_type == '1'
+                      ? '按单返现'
+                      : item.platform_act_type == '2'
+                      ? '买赠'
+                      : item.platform_act_type == '3'
+                      ? '特价'
+                      : item.platform_act_type == '4'
+                      ? ''
+                      : item.platform_act_type == '5'
+                      ? '满减'
+                      : item.platform_act_type == '6'
+                      ? '满减折扣'
+                      : '套装促销'
+                  }}
                 </el-col>
-                <el-col>
-                  <span class="spanfour" style="color: blue" @click="toUrl(item.goods.url)"> 查看商品来源:{{ item.goods.source }}</span>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '4'">加价购 </el-col>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '3'">
+                  <p>{{ item.sp_price }} 元</p>
                 </el-col>
-                <el-col>
-                  <p>{{ item.is_afterSale == true ? '已申请售后' : '未申请售后' }}</p>
+                <el-col :span="16" class="other" v-if="item.platform_act_type == '5' || item.platform_act_type == '6'">
+                  <p>{{ item.discount }} 元</p>
                 </el-col>
-                <el-col>
-                  <p>{{ item.is_rate == true ? '已评价' : '未评价' }}</p>
+                <el-col :span="24" class="other" v-if="item.platform_act_type == '2'">
+                  <el-table :data="item.gift" border style="width: 100%">
+                    <el-table-column prop="goods_name" label="商品" width="180"> </el-table-column>
+                    <el-table-column prop="spec_name" label="规格" width="180"> </el-table-column>
+                    <el-table-column prop="num" label="数量"> </el-table-column>
+                    <el-table-column prop="desc" label="备注"> </el-table-column>
+                  </el-table>
                 </el-col>
               </el-col>
             </el-col>
           </el-col>
+        </el-col>
+        <el-col :span="12" class="main_one">
           <el-col :span="24" class="bode">
-            <el-col :span="6">运费</el-col>
-            <el-col :span="18" class="other" v-if="!item.goods.freight == '0'">{{ item.goods.freight }}</el-col>
-            <el-col :span="18" class="other" v-else>包邮</el-col>
+            <el-col :span="6">下单时间</el-col>
+            <el-col :span="18" class="other">{{ form.buy_time }}</el-col>
           </el-col>
-        </el-col>
-        <el-col :span="24" class="bode">
-          <el-col :span="6">订单备注</el-col>
-          <el-col :span="18" class="other" v-if="form.remarks">{{ form.remarks }}</el-col>
-          <el-col :span="18" class="other" v-else>暂无备注</el-col>
-        </el-col>
-        <el-col :span="24" class="bode">
-          <el-col :span="6">配送方式</el-col>
-          <el-col :span="18" class="other">{{ form.transport_type_name }}</el-col>
-        </el-col>
-        <el-col :span="24" class="goods_total bode">
-          <el-col :span="6">快递费</el-col>
-          <el-col :span="18" class="other">
-            <p>￥{{ total_detail.freight_total }}</p>
+          <el-col :span="24" class="bode">
+            <el-col :span="6">支付时间</el-col>
+            <el-col :span="18" class="other">{{ form.pay_time }}</el-col>
           </el-col>
-        </el-col>
-        <el-col :span="24" class="goods_total bode">
-          <el-col :span="8">优惠后实付金额</el-col>
-          <el-col :span="16" class="other">
-            <p>￥{{ pay.pay_money }}</p>
+          <el-col :span="24" class="bode">
+            <el-col :span="6">订单备注</el-col>
+            <el-col :span="18" class="other">{{ form.remarks || '' }}</el-col>
+          </el-col>
+          <el-col :span="24" class="bode">
+            <el-col :span="6">配送方式</el-col>
+            <el-col :span="18" class="other">{{ form.transport_type_name || '' }}</el-col>
+          </el-col>
+          <el-col :span="24" class="goods_total bode">
+            <el-col :span="8">商品总额</el-col>
+            <el-col :span="16" class="other">
+              <p>￥{{ total_detail.goods_total }}</p>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="goods_total bode">
+            <el-col :span="6">快递费</el-col>
+            <el-col :span="18" class="other">
+              <p>￥{{ total_detail.freight_total }}</p>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="goods_total bode" v-if="getActLength() != '0' && getActLength()">
+            <el-col :span="24">平台活动优惠</el-col>
+            <el-col :span="24" v-for="(item, index) in total_detail.act" :key="index">
+              <el-col :span="8">
+                {{
+                  item.platform_act_type == '0'
+                    ? '优惠商品合集'
+                    : item.platform_act_type == '1'
+                    ? '按单返现'
+                    : item.platform_act_type == '2'
+                    ? '买赠'
+                    : item.platform_act_type == '3'
+                    ? '特价'
+                    : item.platform_act_type == '4'
+                    ? '加价购'
+                    : item.platform_act_type == '5'
+                    ? '满减'
+                    : item.platform_act_type == '6'
+                    ? '满减折扣'
+                    : '套装促销'
+                }}
+              </el-col>
+              <el-col :span="16" class="other">
+                <p>{{ item.discount }} 元</p>
+              </el-col>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="goods_total bode">
+            <el-col :span="8">优惠后实付金额</el-col>
+            <el-col :span="16" class="other">
+              <p>￥{{ pay.pay_money }} 元</p>
+            </el-col>
           </el-col>
         </el-col>
-        <el-col :span="24" class="bode">
-          <el-col :span="6">下单时间</el-col>
-          <el-col :span="18" class="other">{{ form.buy_time }}</el-col>
-        </el-col>
-        <el-col :span="24" class="bode">
-          <el-col :span="6">支付时间</el-col>
-          <el-col :span="18" class="other">{{ form.pay_time }}</el-col>
-        </el-col>
-        <!-- <el-col :span="24" class="bode" v-if="form.status == '3'">
-          <el-col :span="6">寄出运单号</el-col>
-          <el-col :span="18" class="other">{{ transport.shop_transport_no || '暂无单号' }}</el-col>
-        </el-col>
-        <el-col :span="24" class="bode" v-if="form.status == '3'">
-          <el-col :span="6">寄出快递公司</el-col>
-          <el-col :span="18" class="other">{{ transport.shop_transport_name || '暂无快递信息' }}</el-col>
-        </el-col> -->
       </el-col>
     </el-row>
   </div>
@@ -115,11 +169,11 @@ export default {
   created() {},
   methods: {
     toUrl(url) {
-      if (url) {
-        window.open(url, '_blank');
-      } else {
-        this.$message.error('该商品还未添加来源网址，无法跳转');
-      }
+      if (url) window.open(url, '_blank');
+      else this.$message.error('该商品还未添加来源网址，无法跳转');
+    },
+    getActLength() {
+      return _.get(this.total_detail, 'act.length');
     },
   },
   computed: {
@@ -140,7 +194,10 @@ export default {
 
 <style lang="less" scoped>
 .main {
-  padding: 0 25%;
+  // padding: 0 5%;
+  .main_one {
+    padding: 0 5%;
+  }
   .add {
     border-bottom: 2px dashed #ccc;
     margin: 0 0 5px 0;
@@ -160,7 +217,6 @@ export default {
   .transport {
     margin: 50px;
     padding: 5px;
-    // margin: 0 0 0 40px;
     border: 1px solid rgb(254, 195, 195);
   }
   .other {
@@ -168,6 +224,7 @@ export default {
     word-break: break-all;
     p {
       color: red;
+      font-size: 20px;
     }
     .spanfour {
       color: blue;