样式修改

src/view/Learning.vue

@@ -46,7 +46,7 @@
       return {
         colConfigs: [
           { prop: 'title', label: '标题', align: 'left' },
-          { prop: 'isFavorite', label: '是否收藏', align: 'center', format: v => v === '0' ? '否' : '是' },
+          { prop: 'createTime', label: '发布时间', align: 'center' },
         ],
         tableData: [],
         total: 0,

src/view/NormalSendGoods.vue

@@ -23,16 +23,17 @@
           :isShowPagination="false"
           style="margin-top: 8px;"
           @getList="getList">center
-          <el-table-column slot="productName" width="480px" label="商品信息" show-overflow-tooltip align="center">
+          <el-table-column slot="productName" width="480px" label="商品信息" align="center">
             <template slot-scope="scope">
-              <div class="order-manage_productInfo__1pD83">
+              <div class="product">
                 <img :src="scope.row.productSkcPicture">
-                <div class="right">
-
-                <div>备货母单号: {{ scope.row.originalPurchaseOrderSn }}</div>
-                <div>{{ scope.row.productName }}</div>
-                <div>SKC: {{ scope.row.productSkcId }}</div>
-                <div>货号: {{ scope.row.productSn }}</div>
+                  <div class="right">
+                    <div>备货母单号: {{ scope.row.originalPurchaseOrderSn }}</div>
+                    <el-tooltip effect="dark" :content="scope.row.productName" placement="top-start">
+                      <div class="textoverflow">{{ scope.row.productName }}</div>
+                    </el-tooltip>
+                    <div>SKC: {{ scope.row.productSkcId }}</div>
+                    <div>货号: {{ scope.row.productSn }}</div>
                 </div>
               </div>
             </template>
@@ -53,7 +54,8 @@
                   </div>
                 </div>
                 <div class="order-manage_contentInfo__1Cjd6" style="max-width: 150px;">
-                  <div class="order-manage_title__1VTO5">属性：{{ item.className }}，下单数量：{{ item.purchaseQuantity }}</div>
+                  <div class="order-manage_title__1VTO5">属性：{{ item.className }}</div>
+                  <div>下单数量：{{ item.purchaseQuantity }}</div>
                   <div>SKU ID： {{ item.productSkuId }}</div>
                   <div class="order-manage_productSku__XP_ke">SKU 货号： {{ item.extCode }}</div>
                 </div>
@@ -100,21 +102,22 @@
             style="margin-top: 8px;"
             @selection-change="onChooseChange"
             @getList="getList">
-            <el-table-column slot="productName" width="400px" label="商品信息" show-overflow-tooltip align="center">
+            <el-table-column slot="productName" width="400px" label="商品信息" align="center">
               <template slot-scope="scope">
-                <div class="order-manage_productInfo__1pD83">
+                <div class="product">
                   <img :src="scope.row.productSkcPicture">
                   <div class="right">
-
-                  <div>备货母单号: {{ scope.row.originalPurchaseOrderSn }}</div>
-                  <div>{{ scope.row.productName }}</div>
-                  <div>SKC: {{ scope.row.productSkcId }}</div>
-                  <div>货号: {{ scope.row.productSn }}</div>
+                    <div>备货母单号: {{ scope.row.originalPurchaseOrderSn }}</div>
+                    <el-tooltip effect="dark" :content="scope.row.productName" placement="top-start">
+                      <div class="textoverflow">{{ scope.row.productName }}</div>
+                    </el-tooltip>
+                    <div>SKC: {{ scope.row.productSkcId }}</div>
+                    <div>货号: {{ scope.row.productSn }}</div>
                   </div>
                 </div>
               </template>
             </el-table-column>
-            <el-table-column slot="className" label="SKU信息" width="400px" show-overflow-tooltip align="center">
+            <el-table-column slot="className" label="SKU信息" width="440px" show-overflow-tooltip align="center">
               <template slot-scope="scope">
                 <div class="order-manage_skuInfo__FW-Nd" v-for="(item, index) in scope.row.detailList" :key="index">
                   <div>
@@ -122,8 +125,9 @@
                       <div class="index-module__img___p3B1N" :style="getStyle(item.thumbUrlList[0])"></div>
                     </div>
                   </div>
-                  <div class="order-manage_contentInfo__1Cjd6" style="max-width: 150px;">
-                    <div class="order-manage_title__1VTO5">属性：{{ item.className }}，下单数量：{{ item.purchaseQuantity }}</div>
+                  <div class="order-manage_contentInfo__1Cjd6">
+                    <div>属性：{{ item.className }}</div>
+                    <div>下单数量：{{ item.purchaseQuantity }}</div>
                     <div>SKU ID： {{ item.productSkuId }}</div>
                     <div class="order-manage_productSku__XP_ke">SKU 货号： {{ item.extCode }}</div>
                   </div>
@@ -160,9 +164,9 @@
           { slot: 'status' }
         ],
         robColConfigs: [
-          { prop: 'subPurchaseOrderSn', width: '180px', label: '备货单号', align: 'left' },
+          { prop: 'subPurchaseOrderSn', label: '备货单号', align: 'left' },
           { slot: 'productName' },
-          { prop: 'mallName', label: '店铺来源', width: '120px', align: 'center' },
+          { prop: 'mallName', label: '店铺来源', align: 'center' },
           { slot: 'className'},
           { slot: 'robInfo'},
           { slot: 'status' }
@@ -331,7 +335,7 @@
             "subPurchaseOrderSn": sn
           }}).then((res) => {
             if (res.errorCode == 1000000) {
-              
+
 
               let t = this.timer.filter((item) => {
                 return item.id == sn;
@@ -377,13 +381,22 @@
 </script>
 
 <style scoped lang="scss">
-.order-manage_productInfo__1pD83 {
+.product {
   display: flex;
   align-items: center;
   justify-content: center;
 
   .right {
+    flex: 1;
     text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  img {
+    width: 60px;
+    margin-right: 10px;
   }
 }
 .order-manage_productInfo__1pD83>img {
@@ -414,8 +427,8 @@
 }
 
 .dot-module__dot___M-RuH {
-    display: inline-flex;
-    align-items: center;
+  display: inline-flex;
+  align-items: center;
 }
 
 .index-module__image-preview___2fiZX .index-module__img___p3B1N {
@@ -433,27 +446,35 @@
     position: relative;
 }
 
-.order-manage_skuInfo__FW-Nd, .order-manage_skuInfo__FW-Nd .order-manage_contentInfo__1Cjd6 {
-    display: -webkit-flex;
-    display: -moz-box;
-    display: -ms-flexbox;
-    display: flex;
-    justify-content: center;
+.textoverflow {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  cursor: pointer;
 }
 
-.order-manage_skuInfo__FW-Nd .order-manage_contentInfo__1Cjd6 {
-    -webkit-flex-direction: column;
-    -moz-box-orient: vertical;
-    -moz-box-direction: normal;
-    -ms-flex-direction: column;
+.order-manage_skuInfo__FW-Nd {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 10px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+
+  .order-manage_contentInfo__1Cjd6 {
+    display: flex;
     flex-direction: column;
-    color: rgba(0,0,0,.4);
-    -webkit-flex: 1 0 auto;
-    -moz-box-flex: 1;
-    -ms-flex: 1 0 auto;
-    flex: 1 0 auto;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    width: 240px;
+  }
 }
 
+
 .order-manage_skuInfo__FW-Nd .order-manage_contentInfo__1Cjd6 .order-manage_title__1VTO5 {
     -webkit-flex-wrap: wrap;
     -ms-flex-wrap: wrap;