[update] 封装表格操作列，有特殊判断

src/components/jero/JTable.vue

@@ -23,6 +23,69 @@
       </a-tooltip>
     </template>
 
+    <!--  操作栏  -->
+    <template slot="action" slot-scope="text, record, index">
+      <slot name="action" v-bind="{text, record, index}">
+        <div class="action-span-cell">
+          <!--  传了operSpecialJudgeField，需要特殊判断操作列是否显示更多  -->
+          <template v-if="operSpecialJudgeField">
+            <template v-if="operSpecialJudge(record).length > operateMaxNum + 1">
+              <!--  需要更多按钮  -->
+              <a @click="operationClick(operSpecialJudge(record)[0],record)">{{ operSpecialJudge(record)[0].text }}</a>
+              <template v-if="operSpecialJudge(record).length > operateMaxNum">
+                <a-divider type="vertical" />
+                <a-dropdown placement="bottomCenter">
+                  <a-icon type="more" class="operate-icon-btn operate-icon-more" />
+                  <a-menu slot="overlay">
+                    <a-menu-item v-for="(operation, index) in operSpecialJudge(record).slice(operateMaxNum)" :key="index">
+                      <a @click="operationClick(operation,record)">
+                        <div class="operate-btn">
+                          {{ operation.text }}
+                        </div>
+                      </a>
+                    </a-menu-item>
+                  </a-menu>
+                </a-dropdown>
+              </template>
+            </template>
+            <template v-else>
+              <!--  不需要更多按钮  -->
+              <template v-for="(operation, index) in operSpecialJudge(record)">
+                <a :key="index" @click="operationClick(operation,record)">{{ operation.text }}</a>
+              </template>
+            </template>
+          </template>
+          <template v-else>
+            <!--  没有特殊判断，直接渲染operationList  -->
+            <!--  需要更多按钮的情况  -->
+            <template v-if="operationList.length > operateMaxNum + 1">
+              <a @click="operationClick(operationList[0],record)">{{ operationList[0].text }}</a>
+              <template v-if="operationList.length > operateMaxNum">
+                <a-divider type="vertical" />
+                <a-dropdown placement="bottomCenter">
+                  <a-icon type="more" class="operate-icon-btn operate-icon-more" />
+                  <a-menu slot="overlay">
+                    <a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
+                      <a @click="operationClick(operation,record)">
+                        <div class="operate-btn">
+                          {{ operation.text }}
+                        </div>
+                      </a>
+                    </a-menu-item>
+                  </a-menu>
+                </a-dropdown>
+              </template>
+            </template>
+            <template v-else-if="operationList.length > 0">
+              <template v-for="(operation, index) in operationList">
+                <a :key="index" @click="operationClick(operation,record)">{{ operation.text }}</a>
+              </template>
+            </template>
+          </template>
+        </div>
+      </slot>
+    </template>
+
     <div slot="settingDropdown">
       <a-card v-if="needSettingColumnHideOrFreeze">
         <a-table
@@ -57,6 +120,7 @@
 import Vue from 'vue'
 import { cloneDeep } from 'lodash'
 import VueDraggableResizable from 'vue-draggable-resizable'
+import { isHasPermission } from '@/utils/hasPermission'
 
 Vue.component('vue-draggable-resizable', VueDraggableResizable)
 
@@ -124,6 +188,38 @@ export default {
       type: Boolean,
       required: false,
       default: false
+    },
+    // 操作列数据
+    operationList: {
+      type: Array,
+      required: false,
+      default: () => {
+        return []
+      }
+    },
+    // 操作列显示更多前的最大个数
+    operateMaxNum: {
+      type: Number,
+      required: false,
+      default: 1
+    },
+    // 操作列对于哪个字段有特殊判断
+    operSpecialJudgeField: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    // 操作列需要特殊判断的字段是哪些值时，过滤不符合条件按钮
+    operSpecialJudgeValue: {
+      type: [Array, String, Boolean],
+      required: false,
+      default: true
+    },
+    // 操作列特殊判断时需要删掉的按钮
+    operSpecialJudgeDelBtn: {
+      type: [String, Array],
+      required: false,
+      default: ''
     }
   },
   data () {
@@ -193,6 +289,51 @@ export default {
     }
   },
   methods: {
+    isHasPermission,
+    // 操作列特殊判断，返回经过特殊判断后的操作列数据
+    operSpecialJudge (record) {
+      let operationList = []
+      if (typeof this.operSpecialJudgeValue === 'boolean' || typeof this.operSpecialJudgeValue === 'string') {
+        // 只需要判断某个字段是否符合某一个值
+        if (record[this.operSpecialJudgeField] === this.operSpecialJudgeValue) {
+          // 符合特殊条件，需要过滤操作按钮
+          if (this.operSpecialJudgeDelBtn && typeof this.operSpecialJudgeDelBtn === 'string') {
+            // 是字符串类型，只需要过滤掉一个操作按钮
+            operationList = this.operationList.filter(item => item.text !== this.operSpecialJudgeDelBtn)
+          } else if (this.operSpecialJudgeDelBtn && typeof this.operSpecialJudgeDelBtn === 'object') {
+            // 是数组类型需要过滤掉多个操作按钮
+            operationList = this.operationList.filter(item => !this.operSpecialJudgeDelBtn.includes(item.text))
+          } else {
+            operationList = this.operationList
+          }
+        } else {
+          // 不符合条件，不需要过滤
+          operationList = this.operationList
+        }
+      } else if (typeof this.operSpecialJudgeValue === 'object') {
+        // 需要判断某个字段是否符合某些值
+        if (this.operSpecialJudgeValue.includes(record[this.operSpecialJudgeField])) {
+          // 符合特殊条件，需要过滤操作按钮
+          if (this.operSpecialJudgeDelBtn && typeof this.operSpecialJudgeDelBtn === 'string') {
+            // 是字符串类型，只需要过滤掉一个操作按钮
+            operationList = this.operationList.filter(item => item.text !== this.operSpecialJudgeDelBtn)
+          } else if (this.operSpecialJudgeDelBtn && typeof this.operSpecialJudgeDelBtn === 'object') {
+            // 师叔祖类型需要过滤掉多个操作按钮
+            operationList = this.operationList.filter(item => !this.operSpecialJudgeDelBtn.includes(item.text))
+          } else {
+            operationList = this.operationList
+          }
+        } else {
+          // 不符合条件，不需要过滤
+          operationList = this.operationList
+        }
+      }
+      return operationList
+    },
+    // 操作栏按钮点击
+    operationClick (operation, record) {
+      this.$emit('operationClick', operation, record)
+    },
     // 将父组件的columns进行处理：增加设置列按钮
     setResultColumns (columns) {
       // 深度克隆，防止直接修改父组件数据

src/views/enterpriseStandardLibrary/check/CheckList.vue

@@ -105,6 +105,12 @@
         :pagination="ipagination"
         :loading="loading"
         :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        operSpecialJudgeField="delayFlag"
+        :operSpecialJudgeValue="false"
+        :operSpecialJudgeDelBtn="$t('enterpriseStandardLibrary.check.deferredCheck')"
+        :operationList="operationList"
+        :operateMaxNum="operateMaxNum"
+        @operationClick="operationClick"
         @change="handleTableChange">
 
         <!--   企标编号/企标名称  -->
@@ -125,31 +131,31 @@
         </template>
 
         <!--    操作栏   -->
-        <div slot="action" slot-scope="{text, record}" class="action-span-cell">
-          <template v-if="record.delayFlag && isHasPermission(operationList[0].has)">
-            <a @click="operationClick(operationList[0],record)">{{ operationList[0].text }}</a>
-            <template v-if="operationList.length > operateMaxNum">
-              <a-divider type="vertical" />
-              <a-dropdown placement="bottomCenter">
-                <a-icon type="more" class="operate-icon-btn operate-icon-more" />
-                <a-menu slot="overlay">
-                  <a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
-                    <a @click="operationClick(operation,record)">
-                      <div class="operate-btn">
-                        {{ operation.text }}
-                      </div>
-                    </a>
-                  </a-menu-item>
-                </a-menu>
-              </a-dropdown>
-            </template>
-          </template>
-          <template v-else-if="operationList.length > 0">
-            <template v-for="(operation, index) in operationList.slice(1)">
-              <a :key="index" @click="operationClick(operation,record)">{{ operation.text }}</a>
-            </template>
-          </template>
-        </div>
+        <!--<div slot="action" slot-scope="{text, record}" class="action-span-cell">-->
+        <!--  <template v-if="record.delayFlag && isHasPermission(operationList[0].has)">-->
+        <!--    <a @click="operationClick(operationList[0],record)">{{ operationList[0].text }}</a>-->
+        <!--    <template v-if="operationList.length > operateMaxNum">-->
+        <!--      <a-divider type="vertical" />-->
+        <!--      <a-dropdown placement="bottomCenter">-->
+        <!--        <a-icon type="more" class="operate-icon-btn operate-icon-more" />-->
+        <!--        <a-menu slot="overlay">-->
+        <!--          <a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">-->
+        <!--            <a @click="operationClick(operation,record)">-->
+        <!--              <div class="operate-btn">-->
+        <!--                {{ operation.text }}-->
+        <!--              </div>-->
+        <!--            </a>-->
+        <!--          </a-menu-item>-->
+        <!--        </a-menu>-->
+        <!--      </a-dropdown>-->
+        <!--    </template>-->
+        <!--  </template>-->
+        <!--  <template v-else-if="operationList.length > 0">-->
+        <!--    <template v-for="(operation, index) in operationList.slice(1)">-->
+        <!--      <a :key="index" @click="operationClick(operation,record)">{{ operation.text }}</a>-->
+        <!--    </template>-->
+        <!--  </template>-->
+        <!--</div>-->
 
       </j-table>
     </div>
@@ -288,6 +294,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 200
         }
       ],

src/views/enterpriseStandardLibrary/plan/PlanList.vue

@@ -176,7 +176,7 @@
         </template>
 
         <!--    操作栏   -->
-        <div slot="action" slot-scope="{text, record}" class="action-span-cell">
+        <div slot="action" slot-scope="{record}" class="action-span-cell">
           <a @click="handleDetail(record)" class="table-ope-btn" v-has="'enterpriseStandardLibrary:plan:detail'">{{ $t('view') }}</a>
           <a @click="handleDelete(record.id)" class="table-ope-btn" v-if="record.allowDel" v-has="'enterpriseStandardLibrary:plan:delete'">{{ $t('delete') }}</a>
         </div>
@@ -198,6 +198,18 @@ export default {
   mixins: [JeroListMixin],
   data () {
     return {
+      operationList: [
+        {
+          text: this.$t('view'),
+          clickEvent: 'handleDetail',
+          has: 'enterpriseStandardLibrary:plan:detail'
+        },
+        {
+          text: this.$t('delete'),
+          clickEvent: 'handleDelete',
+          has: 'enterpriseStandardLibrary:plan:delete'
+        }
+      ],
       categoryTreeList: [], // 组织机构下拉框数据
       labelCol: {
         span: 4
@@ -378,6 +390,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 200
         }
       ],

src/views/enterpriseStandardLibrary/reviewMeeting/ReviewMeetingList.vue

@@ -169,6 +169,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 170
         }
       ],

src/views/personalCenter/myCollection/MyCollection.vue

@@ -122,6 +122,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 200
         }
       ],

src/views/system/enterpriseLevelMapManage/EnterpriseLevelMapList.vue

@@ -69,6 +69,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 100
         }
       ],

src/views/system/firendshipLinkManage/FriendshipLinkList.vue

@@ -126,6 +126,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 170
         }
       ],

src/views/system/internalWorkGroup/WorkingGroupList.vue

@@ -227,6 +227,7 @@ export default {
           title: this.$t('operation'),
           scopedSlots: { customRender: 'action' },
           align: 'center',
+          fixed: 'right',
           width: 170
         }
       ],