表格滚动条

src/views/shop/Index.vue

@@ -33,12 +33,22 @@
       :columns="columns"
       :data="loadData"
       :pagination="pagination"
+      :scroll="{ x: 1450 }"
     >
       <span slot="logoImage" slot-scope="text, item">
         <a v-if="item.logoImage" title="点击查看原图" :href="item.logoImage.external_url" target="_blank">
           <img width="50" height="50" :src="item.logoImage.external_url" alt="商户logo" />
         </a>
       </span>
+      <span slot="shop_name" slot-scope="text, item" style="white-space: pre-line;">
+        {{ item.shop_name }}
+      </span>
+      <span slot="shop_label" slot-scope="text, item" style="white-space: pre-line;">
+        {{ item.shop_label }}
+      </span>
+      <span slot="company_name" slot-scope="text, item" style="white-space: pre-line;">
+        {{ item.company_name }}
+      </span>
       <span slot="is_select_mechant" slot-scope="text, item">
         {{ item.is_select_mechant ? '是' : '否' }}
       </span>
@@ -90,11 +100,15 @@ export default {
         },
         {
           title: '商户名称',
-          dataIndex: 'shop_name'
+          width: '150px',
+          dataIndex: 'shop_name',
+          scopedSlots: { customRender: 'shop_name' }
         },
         {
           title: '商户标签',
-          dataIndex: 'shop_label'
+          width: '150px',
+          dataIndex: 'shop_label',
+          scopedSlots: { customRender: 'shop_label' }
         },
         {
           title: '账号名称',
@@ -111,7 +125,9 @@ export default {
         },
         {
           title: '公司名称',
-          dataIndex: 'company_name'
+          width: '150px',
+          dataIndex: 'company_name',
+          scopedSlots: { customRender: 'company_name' }
         },
         {
           title: '法人名字',
@@ -119,7 +135,8 @@ export default {
         },
         {
           title: '手机号',
-          dataIndex: 'phone'
+          dataIndex: 'phone',
+          width: '120px'
         },
         {
           title: '是否展示营业执照',
@@ -136,12 +153,13 @@ export default {
         },
         {
           title: '添加时间',
+          width: '150px',
           dataIndex: 'create_time'
         },
         {
           title: '操作',
           dataIndex: 'action',
-          width: '180px',
+          width: '120px',
           scopedSlots: { customRender: 'action' }
         }
       ]