css

src/view/tiip/receive/index.vue

@@ -13,26 +13,35 @@
                 height: 200px;
                 overflow-y: scroll;
                 height: calc(100vh - 160px);
+                >div{
+                    background: #fff;
+                    border-radius: 5px;
+                    margin: 5px;
+                    box-shadow: 0 1px 3px #bababa;
+                    overflow: hidden;
                     >tr{
-                    height:30px;
                         &.user{
                             background:#fff;
                             >td{
                                 color:#5E9AFE;
                                 text-align: left;
-                            padding-left:20px;
+                                padding: 6px 15px;
                             }
                         }
                         &.addr{
+                            background:#eef4fe;
                             >td{
                                 color:#068FCA;
                                 text-align: left;
-                            padding-left:20px;
+                                padding: 4px 20px;
                             }
                         }
                         &.num{
-                        height:35px;
                             background:#fff;
+                            >td{
+                                padding:4px 0;
+                            }
+                        }
                     }
                 }
             }
@@ -73,52 +82,53 @@
             </thead>
             <tbody>
                 <template v-for="(v,k) in list">
-                    <tr class="user" :key="k+'_user'">
+                    <div :key="k">
+                        <tr class="user">
                             <td @click="toDetail(v.sProviderName)" style="text-decoration: underline;">{{v.sProviderName}}</td>
                             <td/>
                             <td/>
                         </tr>
-                    <tr class="addr"  :key="k+'_addr1'">
+                        <tr class="addr">
                             <td colspan="5">期初库存</td>
                         </tr>
-                    <tr class="num" :key="k+'_num1'">
+                        <tr class="num">
                             <td></td>
                             <td>{{v.nOldPieceQty||0}}</td>
                             <td style="color:#64B18B;">{{v.nOldLengthM||0}}</td>
                             <td style="color:#64B18B;">{{v.nOldLengthYD||0}}</td>
                             <td>{{v.nOldWeight||0}}</td>
                         </tr>
-                    <tr class="addr"  :key="k+'_addr2'">
+                        <tr class="addr">
                             <td colspan="5">本期入库</td>
                         </tr>
-                    <tr class="num" :key="k+'_num2'">
+                        <tr class="num">
                             <td></td>
                             <td>{{v.nInPieceQty||0}}</td>
                             <td style="color:#64B18B;">{{v.nInLengthM||0}}</td>
                             <td style="color:#64B18B;">{{v.nInLengthYD||0}}</td>
                             <td>{{v.nInWeight||0}}</td>
                         </tr>
-                    <tr class="addr"  :key="k+'_addr3'">
+                        <tr class="addr" >
                             <td colspan="5">本期出库</td>
                         </tr>
-                    <tr class="num" :key="k+'_num3'">
+                        <tr class="num">
                             <td></td>
                             <td>{{v.nOutPieceQty||0}}</td>
                             <td style="color:#64B18B;">{{v.nOutLengthM||0}}</td>
                             <td style="color:#64B18B;">{{v.nOutLengthYD||0}}</td>
                             <td>{{v.nOutWeight||0}}</td>
                         </tr>
-                    <tr class="addr"  :key="k+'_addr4'">
+                        <tr class="addr">
                             <td colspan="5">本期库存</td>
                         </tr>
-                    <tr class="num" :key="k+'_num4'">
+                        <tr class="num">
                             <td></td>
                             <td>{{v.nStockPieceQty||0}}</td>
                             <td style="color:#64B18B;">{{v.nStockLengthM||0}}</td>
                             <td style="color:#64B18B;">{{v.nStockLengthYD||0}}</td>
                             <td>{{v.nStockWeight||0}}</td>
                         </tr>
-                    <tr :key="k+'_5'" style="height:10px;background:transparent;"/>
+                    </div>
                 </template>
             </tbody>
         </table>