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

2023-08-23 18:28:36 +08:00
parent 083bcaf0a2
commit a8f350e6d7
7 changed files with 227 additions and 62 deletions
@@ -130,16 +130,44 @@
              <template v-slot:fileName="{text}" :title="text">
                  {{ text }}
              </template>
+<!--              v-has="'externalReport:download'"-->
+<!--              v-has="'externalReport:edit'"-->
+<!--              v-has="'externalReport:delete'"-->
+<!--              v-if="authmanage"-->
+<!--              <template v-slot:operation="{text, record}">-->
+<!--                <a class="text-operation"-->
+<!--                   @click="download(record)">{{$t('download')}}</a>-->
+<!--                <a-divider type="vertical"/>-->
+<!--                <a-dropdown v-if="authmanage">-->
+<!--                  <a class="ant-dropdown-link">-->
+<!--                    {{ $t('more') }} <a-icon type="down"/>-->
+<!--                  </a>-->
+<!--                  <a-menu slot="overlay">-->
+<!--                    <a-menu-item>-->
+<!--                      <a class="text-operation"-->
+<!--                         @click="handleEdit(record)">{{$t('edit')}}</a>-->
+<!--                    </a-menu-item>-->
+<!--                    <a-menu-item>-->
+<!--                      <a class="text-operation"-->
+<!--                         @click="batchDel(record)">{{$t('delete')}}</a>-->
+<!--                    </a-menu-item>-->
+<!--                  </a-menu>-->
+<!--                </a-dropdown>-->
+<!--              </template>-->
              <template v-slot:operation="{text, record}">
-                <a class="text-operation"
-                   v-has="'externalReport:download'"
-                   @click="download(record)">{{$t('download')}}</a>
-                <a class="text-operation"
-                   v-has="'externalReport:edit'"
-                   @click="handleEdit(record)" v-if='authmanage'>{{$t('edit')}}</a>
-                <a class="text-operation"
-                   v-has="'externalReport:delete'"
-                   @click="batchDel(record)" v-if='authmanage'>{{$t('delete')}}</a>
+                <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" class="text-operation"
+                   @click="operationClick(record)">{{operation.text}}</a>
+<!--                authmanage &&-->
+                <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">
+<!--                      v-if="authmanage"-->
+                      <a class="text-operation" @click="operationClick(record)">{{operation.text}}</a>
+                    </a-menu-item>
+                  </a-menu>
+                </a-dropdown>
              </template>
            </j-table>
          </div>
@@ -172,12 +200,31 @@ export default {
  mixins: [JeroListMixin],
  data () {
    return {
+      operationList: [
+        {
+          text: this.$t('download'),
+          clickEvent: 'download',
+          has: 'externalReport:download'
+        },
+        {
+          text: this.$t('edit'),
+          clickEvent: 'handleEdit',
+          has: 'externalReport:edit'
+        },
+        {
+          text: this.$t('delete'),
+          clickEvent: 'batchDel',
+          has: 'externalReport:delete'
+        }
+      ],
      labelCol: { span: 6 },
      wrapperCol: { span: 16 },
      disabled: false,
      manager: false, // 是否有树右键菜单
      addSub: true,
-      dataSource: [],
+      dataSource: [
+        { id: 1 }
+      ],
      expandedKeys: [],
      searchValue: '',
      autoExpandParent: true,
@@ -225,7 +272,7 @@ export default {
        },
        {
          title: this.$t('operation'),
-          align: 'left',
+          align: 'center',
          fixed: 'right',
          ellipsis: true,
          width: 240,
@@ -233,7 +280,7 @@ export default {
        }
      ],
      url: {
-        list: 'com.jero.modules.extRepo/extRepoData/page',
+        list: '/extRepo/extRepoData/page',
        getSysCategoryTree: '/sys/category/getSysCategoryTree'
      },
      // upAccept:'.zip',  //导入文件类型
@@ -47,24 +47,45 @@
        :pagination="ipagination"
        :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 v-if="operation.text === $t('docLibrary.cancelCollection')" class="text">
+        <!--   在混入里已经过滤过没有权限的按钮了  -->
+        <template v-slot:operation="{text, record}">
+          <a v-for="(operation, index) in operationList.slice(0, operateMaxNum)" :key="index" @click="operationClick(operation,record)">
+            <template v-if="operation.text === $t('docLibrary.cancelCollection')">
              {{ !record.collectFlag || record.collectFlag === '0' ? $t('docLibrary.collection') : $t('docLibrary.cancelCollection')
              }}
-            </span>
-            <!--            v-has="operation.has"-->
-            <span v-else-if="operation.text === $t('docLibrary.cancelSubscribe')" class="text">
+            </template>
+            <template v-else-if="operation.text === $t('docLibrary.cancelSubscribe')">
              {{ !record.subscribeFlag || record.subscribeFlag === '0' ? $t('docLibrary.subscribe') : $t('docLibrary.cancelSubscribe')
              }}
-            </span>
-            <!--            v-has="operation.has"-->
-            <span v-else class="text">
+            </template>
+            <template v-else>
              {{ operation.text }}
-            </span>
+            </template>
          </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)">
+                  <span v-if="operation.text === $t('docLibrary.cancelCollection')" class="text">
+                    {{ !record.collectFlag || record.collectFlag === '0' ? $t('docLibrary.collection') : $t('docLibrary.cancelCollection')
+                          }}
+                  </span>
+                  <span v-else-if="operation.text === $t('docLibrary.cancelSubscribe')" class="text">
+                    {{ !record.subscribeFlag || record.subscribeFlag === '0' ? $t('docLibrary.subscribe') : $t('docLibrary.cancelSubscribe')
+                          }}
+                  </span>
+                  <span v-else class="text">
+                    {{ operation.text }}
+                  </span>
+                </a>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
        </template>

        <!--        详情-->
@@ -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' }
@@ -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'
    }