导出添加导出当前页功能

src/layout/components/Navbar.vue

@@ -339,8 +339,8 @@
           <div style="color: #33c2ac;cursor: pointer;font-size: 16px;font-weight: 600;" v-if="isEdit" @click="isEdit=false">确定</div>
         </div>
         <div class="myCollect-box-zhineng">
-          <div class="myCollect-box-zhineng-title">职能菜单</div>
+          <div class="myCollect-box-zhineng-title">收藏菜单</div>
-          <div style="width: 100%;overflow-y: auto;max-height: 340px;">
+          <div style="width: 100%;overflow-y: auto;max-height: 78vh;">
             <div v-for="(item,index) in zhinengList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover==index }" @mouseover="isHover=index" @mouseleave="isHover = -1">
               <div style="display: flex;align-items: center;" @click="gotoPage(item)"><img src="../../assets/images/catchIcon.png" style="width: 16px;height: 16px;margin-right: 5px;" alt=""> <span>{{ item.name }}</span> </div>
               <div style="color: #33c2ac;" v-show="isEdit==true">取消</div>
@@ -353,7 +353,7 @@
             </div>
           </div>
         </div>
-        <div class="myCollect-box-zhineng">
+        <!-- <div class="myCollect-box-zhineng">
           <div class="myCollect-box-zhineng-title">项目菜单</div>
           <div style="width: 100%;overflow-y: auto;max-height: 340px;">
             <div v-for="(item,index) in xiangmuList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover2==index }" @mouseover="isHover2=index" @mouseleave="isHover2 = -1">
@@ -367,7 +367,7 @@
               </div> 
             </div>
           </div>
-        </div>
+        </div> -->
 
       </div> 
     </el-drawer>
@@ -464,7 +464,7 @@ export default {
       isHover:-1,
       isHover2:-1,
       zhinengList:[],//{name:"入库申请",url:'/all/stockManagement/entryApply'},{name:"出库申请",url:'/all/business/outbound/addApply'}
-      xiangmuList:[],
+      // xiangmuList:[],
     }
   },
   computed: {

src/views/EquipmentLedger/index.vue

@@ -363,7 +363,16 @@
                 @queryTable="getDeviceList"
                 :columns="columns2" style="margin-left: 20px;margin-right: 20px;"
               ></right-toolbar>
-              <span>
+              <el-dropdown size="mini" style="float: right;" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
+                <el-button plain size="mini" class="el-dropdown-link">
+                  导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i> 
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
+                  <el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item> 
+                </el-dropdown-menu>
+              </el-dropdown>
+                <!-- <span>
                   <el-button
                     style="float: right;background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)"
                     type="primary"
@@ -372,7 +381,7 @@
                   >
                     <svg-icon icon-class="download"/> 导出
                   </el-button>
-                </span>
+                </span> -->
             </el-col>
 
           </el-row>
@@ -1041,7 +1050,8 @@ export default {
         { dictLabel: '检测证书', type: '3' },
         { dictLabel: '采购发票', type: '4' },
         { dictLabel: '装备二维码', type: '5' }
-      ]
+      ],
+      isDropdownOpen: false,
     }
   },
   computed: {
@@ -1249,10 +1259,41 @@ export default {
       this.$router.push('/equipment/equStore')
     },
 
+    // 导出按钮下拉菜单触发
+    handleCommand(command) {
+      switch (command) {  
+        case 'handleDownloadAll':
+          this.exportData()
+          break
+        case 'handleDownloadPage':
+          this.exportDataPage()
+          break
+        default:
+          break
+      }
+    },
+    handleVisibleChange(visible) {
+      this.isDropdownOpen = visible;
+    },
     /**
      * 导出数据
      */
     exportData() {
+      this.$message.info('正在导出数据，请稍候...')
+      // 导出逻辑实现
+      try {
+        let fileName = `装备台账_${new Date().getTime()}.xLsx`
+        let url = '/material-mall/device/export'
+        const params = { ...this.queryParams }
+        params.pageNum=null
+        params.pageSize=null
+        console.log('🚀 ~ 导出 ~ params:', params)
+        this.download(url, params, fileName)
+      } catch (error) {
+        console.log('导出数据失败', error)
+      }
+    },
+    exportDataPage() {
       this.$message.info('正在导出数据，请稍候...')
       // 导出逻辑实现
       try {
@@ -2303,5 +2344,10 @@ export default {
   vertical-align: top;
   color: rgba(0,0,0,.65);
 }
-
+.el-icon-arrow-up {
+  transition: transform 0.3s ease;
+}
+.el-icon-arrow-up.rotate {
+  transform: rotate(180deg);
+}
 </style>

src/views/toolsManage/codeToolsLedger/index.vue

@@ -98,9 +98,19 @@
           <div style="font-size: 20px; font-weight: 800">编码工具台账列表</div>
         </el-col>
         <el-col :span="16" style="text-align: right;">
-             <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
+             <!-- <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
                <svg-icon icon-class="download"/> 导出
+            </el-button> -->
+            <el-dropdown size="mini" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
+              <el-button plain size="mini" class="el-dropdown-link">
+                导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i> 
               </el-button>
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
+                <el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item> 
+              </el-dropdown-menu>
+            </el-dropdown>
+
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"/>
         </el-col>
       </el-row>
@@ -513,6 +523,7 @@ export default {
       fileType: ['doc', 'docx', 'xls', 'xlsx', 'pdf', 'jpg', 'jpeg', 'png'], // 允许上传的文件类型
       showTip: true, // 是否显示上传提示
       number: 0, // 上传文件计数
+      isDropdownOpen: false,
     }
   },
   async created() {
@@ -648,10 +659,26 @@ export default {
       this.getSelectList()
     },
 
+    // 导出按钮下拉菜单触发
+    handleCommand(command) {
+      switch (command) {  
+        case 'handleDownloadAll':
+          this.handleExport()
+          break
+        case 'handleDownloadPage':
+          this.handleExportPage()
+          break
+        default:
+          break
+      }
+    },
+    handleVisibleChange(visible) {
+      this.isDropdownOpen = visible;
+    },
     /**
      * 导出数据
      */
-    handleExport() {
+    handleExportPage() {
       this.download(
         '/material-mall/toolLedger/export',
         {
@@ -660,6 +687,15 @@ export default {
         `编码工具台账_${new Date().getTime()}.xlsx`,
       )
     },
+     handleExport() {
+      const params = { ...this.queryParams }
+      params.pageNum=null
+      params.pageSize=null
+      this.download(
+        '/material-mall/toolLedger/export',params,
+        `编码工具台账_${new Date().getTime()}.xlsx`,
+      )
+    },
 
     // 获取厂家
     async getManufacturerSelect() {
@@ -1036,4 +1072,10 @@ export default {
     display: none;
   }
 }
+.el-icon-arrow-up {
+  transition: transform 0.3s ease;
+}
+.el-icon-arrow-up.rotate {
+  transform: rotate(180deg);
+}
 </style>

src/views/toolsManage/toolsLedger/index.vue

@@ -110,9 +110,18 @@
           <div style="font-size: 20px; font-weight: 800">数量工具台账列表</div>
         </el-col>
         <el-col :span="16" style="text-align: right;">
-             <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
+            <!-- <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
                <svg-icon icon-class="download"/> 导出
+            </el-button> -->
+            <el-dropdown size="mini" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
+              <el-button plain size="mini" class="el-dropdown-link">
+                导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i> 
               </el-button>
+              <el-dropdown-menu slot="dropdown">
+                <el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
+                <el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item> 
+              </el-dropdown-menu>
+            </el-dropdown>
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"/>
         </el-col>
       </el-row>
@@ -391,7 +400,8 @@ export default {
         },
         { label: '所在工程', prop: 'proName' }
       ],
-      dialogList: []
+      dialogList: [],
+      isDropdownOpen: false,
     }
   },
   async created() {
@@ -577,11 +587,35 @@ export default {
     //     console.log('导出数据失败', error)
     //   }
     // },
-
+    // 导出按钮下拉菜单触发
+    handleCommand(command) {
+      switch (command) {  
+        case 'handleDownloadAll':
+          this.handleExport()
+          break
+        case 'handleDownloadPage':
+          this.handleExportPage()
+          break
+        default:
+          break
+      }
+    },
+    handleVisibleChange(visible) {
+      this.isDropdownOpen = visible;
+    },
     /**
      * 导出数据
      */
     handleExport() {
+      const params = { ...this.queryParams }
+      params.pageNum=null
+      params.pageSize=null
+      this.download(
+        '/material-mall/toolLedger/exportAll',params,
+        `工具台账_${new Date().getTime()}.xlsx`
+      )
+    },
+    handleExportPage() {
       this.download(
         '/material-mall/toolLedger/exportAll',
         {
@@ -684,5 +718,10 @@ export default {
     display: none;
   }
 }
-
+.el-icon-arrow-up {
+  transition: transform 0.3s ease;
+}
+.el-icon-arrow-up.rotate {
+  transform: rotate(180deg);
+}
 </style>