[update] 修改操作列只显示一个按钮，其他显示在更多

src/views/documentTool/DocumentComparison.vue

@@ -54,23 +54,35 @@
         :can-drag="true"
         :loading="loading"
         :pagination="ipagination"
-        :scroll="{x: '100%',y:'calc(100vh - 280px)'}"
+        :scroll="{x: '100%', y:'calc(100vh - 280px)'}"
         :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
         @change="handleTableChange"
       >
         <template v-slot:operation="{text,record}">
-           <a class="text-operation" @click="comparisonResultsClick(record)">{{$t('docTool.comparison.comparisonResults')}}</a>
-           <a class="text-operation"
-              v-if="record.createBy === userInfoQuery.username || administrators"
-              @click="subscribe(record)">
-            {{!record.releaseState || record.releaseState === 'draft' ? $t('release') :$t('withdraw')}}
-           </a>
-          <a class="text-operation"
-             v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
-             @click="edit(record)">{{$t('edit')}}</a>
-          <a class="text-operation"
-             v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
-             @click="deleteData(record)">{{$t('delete')}}</a>
+          <a class="text-operation" @click="comparisonResultsClick(record)">{{$t('docTool.comparison.comparisonResults')}}</a>
+
+          <a-divider type="vertical" v-if="record.createBy === userInfoQuery.username || administrators" />
+
+          <a-dropdown v-if="record.createBy === userInfoQuery.username || administrators">
+            <a class="ant-dropdown-link">
+              {{ $t('more') }} <a-icon type="down"/>
+            </a>
+            <a-menu slot="overlay">
+              <a-menu-item>
+                <a v-if="record.createBy === userInfoQuery.username || administrators" @click="subscribe(record)">
+                  {{!record.releaseState || record.releaseState === 'draft' ? $t('release') :$t('withdraw')}}
+                 </a>
+              </a-menu-item>
+              <a-menu-item>
+                <a v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
+                   @click="edit(record)">{{$t('edit')}}</a>
+              </a-menu-item>
+              <a-menu-item>
+                <a v-if="(record.createBy === userInfoQuery.username || administrators) && record.releaseState === 'draft'"
+                   @click="deleteData(record)">{{$t('delete')}}</a>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
         </template>
         <template v-slot:serialNumberRight="{text,record}">
           <a @click="serialNumberRightClick(record)" :title="text">{{text}}</a>
@@ -102,7 +114,9 @@ export default {
         deleteBatch: '/compare/sarFileCompareInfo/deleteBatch'
       },
       loading: false,
-      dataSource: [],
+      dataSource: [
+        {id: 1}
+      ],
       selectedRowKeys: [],
       selectionRows: [],
       downLoadFileUrl: window._CONFIG.domianPreviewURL + '/sys/common/download',
@@ -192,7 +206,7 @@ export default {
         },
         {
           title: this.$t('operation'),
-          align: 'left',
+          align: 'center',
           fixed: 'right',
           width: 310,
           scopedSlots: { customRender: 'operation' }

src/views/documentTool/DocumentSplit.vue

@@ -32,13 +32,23 @@
         :scroll="{x: '100%'}"
         @change="tableOnChange">
 
-        <template slot="operation" slot-scope="{text, record}">
-          <a v-for="(operation, index) in operationList" :key="index" @click="operationClick(operation,record)">
-            <!--            v-has="operation.has"-->
-            <span class="text">
-              {{ operation.text }}
-            </span>
+        <template v-slot:operation="{text, record}">
+          <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
+            {{ operation.text }}
           </a>
+          <a-divider v-if="operationList.length >= operateMaxNum" type="vertical" />
+          <a-dropdown v-if="operationList.length >= operateMaxNum">
+            <a class="ant-dropdown-link">
+              {{ $t('more') }} <a-icon type="down"/>
+            </a>
+            <a-menu slot="overlay">
+              <a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
+                <a @click="operationClick(operation,record)">
+                  {{ operation.text }}
+                </a>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
         </template>
 
         <!--        详情-->
@@ -49,19 +59,7 @@
             <div class="table-text" v-else>{{ global.emptyLine }}</div>
           </a-tooltip>
         </template>
-
       </j-table>
-<!--      <table-data-->
-<!--        :url="url"-->
-<!--        :flag="'3'"-->
-<!--        :operationList="operationList"-->
-<!--        showAction-->
-<!--        ref="tableData"-->
-<!--        @onSelectChange="onSelectChange"-->
-<!--        @backDocument="backDocument"-->
-<!--        @deleteDetail="deleteDetail"-->
-<!--        @detailClick="detailClick"-->
-<!--      ></table-data>-->
     </div>
     <split-text ref="splitText" @visible="splitTextVisible"></split-text>
     <import-result ref="importResult" @visible="importResultVisible"></import-result>
@@ -103,13 +101,16 @@ export default {
         }
       ],
       url: {
-        tableHeader: 'split/sarFileSplitInfo/getHeader', // 表格头部字段
-        searchList: 'split/sarFileSplitInfo/queryCondition', // 搜索字段
-        list: 'split/sarFileSplitInfo/page', // 表格数据
+        // tableHeader: '/split/sarFileSplitInfo/getHeader', // 表格头部字段
+        searchList: '/split/sarFileSplitInfo/queryCondition', // 搜索字段
+        // list: '/split/sarFileSplitInfo/page', // 表格数据
         deleteBatch: '', // 批量删除
         deleteUrl: '',
         backDocument: '' // 回传至文档库
       },
+      dataSource: [
+        { id: 1 }
+      ],
       showAction: true,
       flag: '3'
     }