表格

src/views/study/Growth.vue

@@ -145,9 +145,9 @@
           <span>其他路径（无权限）</span>
         </div>
       </span>
-      <el-table :data="gridData" border :span-method="objectSpanMethod">
+      <el-table :data="gridData" border :span-method="arraySpanMethod" style="width: 100%">
-        <el-table-column align="center" property="name" label=""></el-table-column>
+        <el-table-column fixed align="center" property="name" width="120" label=""></el-table-column>
-        <el-table-column align="center" label="市场企划岗">
+        <el-table-column align="center" label="band1">
           <template slot-scope="scope">
             <span v-if="scope.row.marketStatus === 0"><img src="../../assets/images/growth/CurrentPath.png" alt=""></span>
             <span v-else-if="scope.row.marketStatus === 1">
@@ -156,7 +156,7 @@
             <span v-else><img src="../../assets/images/growth/NoPermissionPath.png" alt=""></span>
           </template>
         </el-table-column>
-        <el-table-column align="center" label="销售岗">
+        <el-table-column align="center" label="band2">
           <template slot-scope="scope">
             <span v-if="scope.row.saleStatus === 0"><img src="../../assets/images/growth/CurrentPath.png" alt=""></span>
             <span v-else-if="scope.row.saleStatus === 1">
@@ -165,7 +165,7 @@
             <span v-else><img src="../../assets/images/growth/NoPermissionPath.png" alt=""></span>
           </template>
         </el-table-column>
-        <el-table-column align="center" label="产品企划岗">
+        <el-table-column align="center" label="band3">
           <template slot-scope="scope">
             <span v-if="scope.row.productStatus === 0"><img src="../../assets/images/growth/CurrentPath.png"
                 alt=""></span>
@@ -175,7 +175,7 @@
             <span v-else><img src="../../assets/images/growth/NoPermissionPath.png" alt=""></span>
           </template>
         </el-table-column>
-        <el-table-column align="center" label="FAE岗">
+        <el-table-column align="center" label="band4">
           <template slot-scope="scope">
             <span v-if="scope.row.FAEStatusL === 0"><img src="../../assets/images/growth/CurrentPath.png" alt=""></span>
             <span v-else-if="scope.row.FAEStatusL === 1">
@@ -184,7 +184,7 @@
             <span v-else><img src="../../assets/images/growth/NoPermissionPath.png" alt=""></span>
           </template>
         </el-table-column>
-        <el-table-column align="center" label="销售管理岗位">
+        <el-table-column align="center" label="band5">
           <template slot-scope="scope">
             <span v-if="scope.row.salesManagement === 0"><img src="../../assets/images/growth/CurrentPath.png"
                 alt=""></span>
@@ -295,47 +295,40 @@ export default {
       }],
       dialogTableVisible: false,
       gridData: [{
-        name: 'Band10+',
+        name: '市场企划岗',
         marketStatus: 0,
         saleStatus: 1,
         productStatus: 2,
         FAEStatusL: 0,
         salesManagement: 1
       }, {
-        name: 'Band10',
+        name: '销售岗',
         marketStatus: 1,
         saleStatus: 2,
         productStatus: 1,
         FAEStatusL: 0,
         salesManagement: 1
       }, {
-        name: 'Band9',
+        name: '产品企划岗',
         marketStatus: 2,
         saleStatus: 0,
         productStatus: 0,
         FAEStatusL: 0,
         salesManagement: 1
       }, {
-        name: 'Band8',
+        name: 'FAE岗',
         marketStatus: 0,
         saleStatus: 1,
         productStatus: 2,
         FAEStatusL: 0,
         salesManagement: 1
       }, {
-        name: 'Band7',
+        name: '销售管理岗位',
         marketStatus: 1,
         saleStatus: 2,
         productStatus: 0,
         FAEStatusL: 0,
         salesManagement: 1
-      }, {
-        name: 'Band6',
-        marketStatus: 2,
-        saleStatus: 0,
-        productStatus: 1,
-        FAEStatusL: 0,
-        salesManagement: 1
       }],
       drawer: false,
       activeName: 'first'
@@ -348,20 +341,11 @@ export default {
     handleClick(tab, event) {
       console.log(tab, event);
     },
-    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
-      if (columnIndex !== 0) {
+      if (columnIndex === 1) {
-        if (rowIndex <= 1) { return false }
+        return [1, 2];
-        if (rowIndex % 2 === 0) {
+      } else if (columnIndex === 2) {
-          return {
+        return [0, 0];
-            rowspan: 2,
-            colspan: 1
-          };
-        } else {
-          return {
-            rowspan: 0,
-            colspan: 0
-          };
-        }
       }
     },
     switchInfo(num) {