仓库选择

src/api/warehouse.js

@@ -0,0 +1,6 @@
+import { createAPI } from "@/utils/httpRequest.js";
+
+/**
+ * 根据当前用户获取授权的仓库列表
+ */
+export const getUserAuthorizedWarehouses = data => createAPI(`warehouse/getUserAuthorizedWarehouses`, 'post', data)

src/views/main.vue

@@ -2,8 +2,27 @@
   <div class="pda-container">
     <!-- 头部栏 -->
     <div class="header-bar">
-      <div class="header-left">
-        <div style="font-size: 18px">{{username}}</div>
+      <div class="warehouse-selector" @click="toggleWarehouseDropdown">
+        <span class="warehouse-text">{{ selectedWarehouseName || '选择仓库' }}</span>
+        <i class="el-icon-arrow-down" :class="{ 'rotate': showWarehouseDropdown }"></i>
+        <div class="warehouse-dropdown" v-show="showWarehouseDropdown">
+          <div class="dropdown-item loading" v-if="warehouseLoading">
+            <i class="el-icon-loading"></i>
+            加载中...
+          </div>
+          <div
+            v-else
+            v-for="item in warehouseList"
+            :key="item.warehouseid"
+            class="dropdown-item"
+            :class="{ 'active': selectedWarehouse === item.warehouseid }"
+            @click.stop="selectWarehouse(item)">
+            {{ item.warehousename }}
+          </div>
+          <div class="dropdown-item empty" v-if="!warehouseLoading && warehouseList.length === 0">
+            暂无可用仓库
+          </div>
+        </div>
       </div>
       <div class="logout-button" @click="logoutHandle()">
         <i class="el-icon-close"></i>
@@ -20,25 +39,25 @@
           <span class="section-title">收货入库</span>
         </div>
         <div class="button-grid">
-          <div class="menu-item" @click="$router.push('porecv')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('porecv')">
             <div class="menu-icon purchase">
               <van-icon name="shopping-cart-o" size="24" />
             </div>
             <div class="menu-text">采购入库</div>
           </div>
-          <div class="menu-item" @click="$router.push('productionreturn')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('productionreturn')">
             <div class="menu-icon production-return">
               <van-icon name="revoke" size="24" />
             </div>
             <div class="menu-text">生产退仓</div>
           </div>
-          <div class="menu-item" @click="$router.push('productionInboundProduction')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('productionInboundProduction')">
             <div class="menu-icon production-inbound">
               <van-icon name="cart" size="24" />
             </div>
             <div class="menu-text">生产入库</div>
           </div>
-          <div class="menu-item" @click="$router.push('salereturn')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('salereturn')">
             <div class="menu-icon sales-return">
               <van-icon name="revoke" size="24" />
             </div>
@@ -54,25 +73,25 @@
           <span class="section-title">拣货出库</span>
         </div>
         <div class="button-grid">
-          <div class="menu-item" @click="$router.push('purchaseReturn')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('purchaseReturn')">
             <div class="menu-icon purchase-return">
               <van-icon name="shopping-cart-o" size="24" />
             </div>
             <div class="menu-text">采购退库</div>
           </div>
-          <div class="menu-item" @click="$router.push('productionissue')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('productionissue')">
             <div class="menu-icon production-issue">
               <van-icon name="send-gift-o" size="24" />
             </div>
             <div class="menu-text">生产领料</div>
           </div>
-          <div class="menu-item" @click="$router.push('mrissue')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('mrissue')">
             <div class="menu-icon mr">
               <van-icon name="orders-o" size="24" />
             </div>
             <div class="menu-text">MR发料</div>
           </div>
-          <div class="menu-item" @click="$router.push('outsource')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('outsource')">
             <div class="menu-icon outsourcing">
               <van-icon name="logistics" size="24" />
             </div>
@@ -80,13 +99,13 @@
           </div>
         </div>
         <div class="button-grid" style="margin-top: 8px;">
-          <div class="menu-item" @click="$router.push('saleshipping')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('saleshipping')">
             <div class="menu-icon sales-delivery">
               <van-icon name="logistics" size="24" />
             </div>
             <div class="menu-text">销售出库</div>
           </div>
-          <div class="menu-item" @click="$router.push('transportation')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('transportation')">
             <div class="menu-icon transport">
               <van-icon name="guide-o" size="24" />
             </div>
@@ -102,25 +121,25 @@
           <span class="section-title">库内管理</span>
         </div>
         <div class="button-grid">
-          <div class="menu-item" @click="$router.push('attributechange')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('attributechange')">
             <div class="menu-icon attribute">
               <van-icon name="setting-o" size="24" />
             </div>
             <div class="menu-text">属性变动</div>
           </div>
-          <div class="menu-item" @click="$router.push('stocktaking')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('stocktaking')">
             <div class="menu-icon inventory">
               <van-icon name="records" size="24" />
             </div>
             <div class="menu-text">库内盘点</div>
           </div>
-          <div class="menu-item" @click="$router.push('otherinout')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('otherinout')">
             <div class="menu-icon other">
               <van-icon name="exchange" size="24" />
             </div>
             <div class="menu-text">其他出入库</div>
           </div>
-          <div class="menu-item" @click="$router.push('handlingunit')">
+          <div class="menu-item" @click="navigateWithWarehouseCheck('handlingunit')">
             <div class="menu-icon hu">
               <van-icon name="cluster-o" size="24" />
             </div>
@@ -133,10 +152,17 @@
 </template>
 
 <script>
+import { getUserAuthorizedWarehouses } from "@/api/warehouse.js"
+
 export default {
   data() {
     return {
-      username: localStorage.getItem('userName')
+      username: localStorage.getItem('userName'),
+      warehouseList: [],
+      selectedWarehouse: localStorage.getItem('selectedWarehouse') || '',
+      selectedWarehouseName: '',
+      warehouseLoading: false,
+      showWarehouseDropdown: false
     }
   },
   computed: {
@@ -194,10 +220,95 @@ export default {
       }
     },
   },
+  mounted() {
+    // 点击外部关闭下拉框
+    document.addEventListener('click', this.handleDocumentClick)
+  },
+  beforeDestroy() {
+    document.removeEventListener('click', this.handleDocumentClick)
+  },
   created() {
     this.getUserInfo()
+    this.getWarehouseList();
   },
   methods: {
+    // 处理点击事件
+    handleDocumentClick(event) {
+      // 检查点击是否在仓库选择器内部
+      const warehouseSelector = this.$el.querySelector('.warehouse-selector');
+      if (warehouseSelector && !warehouseSelector.contains(event.target)) {
+        this.showWarehouseDropdown = false;
+      }
+    },
+    // 获取仓库列表
+    getWarehouseList() {
+      const currentSite = localStorage.getItem('site');
+      if (!currentSite) {
+        this.$message.error('请先选择工厂');
+        this.$router.push({ name: 'login' });
+        return;
+      }
+
+      this.warehouseLoading = true;
+      getUserAuthorizedWarehouses({ site: currentSite }).then(({data}) => {
+        this.warehouseLoading = false;
+        if (data && data.code === 0) {
+          this.warehouseList = data.data || [];
+          // 如果只有一个仓库，自动选中
+          if (this.warehouseList.length === 1) {
+            this.selectWarehouse(this.warehouseList[0]);
+          }
+          // 如果之前有选择的仓库，检查是否还在列表中并设置名称
+          else if (this.selectedWarehouse) {
+            const warehouse = this.warehouseList.find(w => w.warehouseid === this.selectedWarehouse);
+            if (warehouse) {
+              this.selectedWarehouseName = warehouse.warehousename;
+            } else {
+              this.selectedWarehouse = '';
+              this.selectedWarehouseName = '';
+              localStorage.removeItem('selectedWarehouse');
+            }
+          }
+        } else {
+          this.$message.error(data.msg || '获取仓库列表失败');
+        }
+      }).catch(error => {
+        this.warehouseLoading = false;
+        console.error('获取仓库列表失败:', error);
+        this.$message.error('获取仓库列表失败');
+      })
+    },
+    // 切换下拉框显示
+    toggleWarehouseDropdown(event) {
+      event.stopPropagation(); // 阻止事件冒泡
+      this.showWarehouseDropdown = !this.showWarehouseDropdown;
+    },
+    // 关闭下拉框
+    closeWarehouseDropdown() {
+      this.showWarehouseDropdown = false;
+    },
+    // 选择仓库
+    selectWarehouse(warehouse) {
+      this.selectedWarehouse = warehouse.warehouseid;
+      this.selectedWarehouseName = warehouse.warehousename;
+      localStorage.setItem('selectedWarehouse', warehouse.warehouseid);
+      this.showWarehouseDropdown = false;
+      this.$message.success(`已切换到仓库：${warehouse.warehousename}`);
+    },
+    // 检查是否已选择仓库
+    checkWarehouseSelection() {
+      if (!this.selectedWarehouse) {
+        this.$message.warning('请先选择仓库');
+        return false;
+      }
+      return true;
+    },
+    // 带仓库检查的路由跳转
+    navigateWithWarehouseCheck(routeName) {
+      if (this.checkWarehouseSelection()) {
+        this.$router.push(routeName);
+      }
+    },
     // 退出
     logoutHandle() {
       this.$confirm('确定退出?', '提示', {
@@ -521,4 +632,93 @@ export default {
     grid-template-columns: repeat(4, 1fr);
   }
 }
+
+/* 仓库选择器样式 */
+.warehouse-selector {
+  position: relative;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  padding: 0;
+  user-select: none;
+}
+
+.warehouse-text {
+  color: white;
+  font-size: 16px;
+  font-weight: 500;
+  margin-right: 8px;
+}
+
+.warehouse-selector .el-icon-arrow-down {
+  color: white;
+  font-size: 14px;
+  transition: transform 0.2s ease;
+}
+
+.warehouse-selector .el-icon-arrow-down.rotate {
+  transform: rotate(180deg);
+}
+
+/* 下拉框样式 */
+.warehouse-dropdown {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  min-width: 120px;
+  background: white;
+  border-radius: 4px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  z-index: 9999;
+  margin-top: 4px;
+  overflow: hidden;
+  border: 1px solid #e0e0e0;
+}
+
+.dropdown-item {
+  padding: 12px 16px;
+  cursor: pointer;
+  font-size: 14px;
+  color: #333;
+  transition: background-color 0.2s ease;
+}
+
+.dropdown-item:hover {
+  background: #f5f5f5;
+}
+
+.dropdown-item.active {
+  //background: #17B3A3;
+  color: #17B3A3;
+}
+
+.dropdown-item.loading {
+  text-align: center;
+  color: #666;
+  cursor: default;
+}
+
+.dropdown-item.loading:hover {
+  background: white;
+}
+
+.dropdown-item.loading i {
+  margin-right: 6px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.dropdown-item.empty {
+  text-align: center;
+  color: #999;
+  cursor: default;
+}
+
+.dropdown-item.empty:hover {
+  background: white;
+}
 </style>