添加快捷分类查询

src/views/erp/purchase/in/index.vue

@@ -17,6 +17,30 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -409,9 +433,40 @@ onActivated(() => {
     getList()
   }
 })
+
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
 .mobile-purchase-in {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/purchase/inquiry/index.vue

@@ -11,6 +11,37 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待询价
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        询价中
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 30 }"
+        @click="handleQuickFilter(30)"
+      >
+        已完成
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -233,9 +264,41 @@ onMounted(async () => {
   productList.value = await ProductApi.getProductSimpleList()
   userList.value = await UserApi.getSimpleUserList()
 })
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
+
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
+
 .mobile-purchase-inquiry {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/purchase/order/index.vue

@@ -23,6 +23,30 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -361,9 +385,41 @@ onMounted(async () => {
   supplierList.value = await SupplierApi.getSupplierSimpleList()
   userList.value = await UserApi.getSimpleUserList()
 })
+
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
+
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
 .mobile-purchase-order {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/purchase/return/index.vue

@@ -11,6 +11,30 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -251,9 +275,41 @@ onMounted(async () => {
   warehouseList.value = await WarehouseApi.getWarehouseSimpleList()
   accountList.value = await AccountApi.getAccountSimpleList()
 })
+
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
+
 .mobile-purchase-return {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/purchaserequisition/index.vue

@@ -11,6 +11,51 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 1 }"
+        @click="handleQuickFilter(1)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 2 }"
+        @click="handleQuickFilter(2)"
+      >
+        已审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 3 }"
+        @click="handleQuickFilter(3)"
+      >
+        已驳回
+      </div>
+<!--      <div-->
+<!--        class="quick-filter-item"-->
+<!--        :class="{ active: queryParams.status === 4 }"-->
+<!--        @click="handleQuickFilter(4)"-->
+<!--      >-->
+<!--        已取消-->
+<!--      </div>-->
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 5 }"
+        @click="handleQuickFilter(5)"
+      >
+        已采购
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -403,9 +448,40 @@ const handleUpdateStatus = async (id: number, status: number) => {
 onMounted(() => {
   getList()
 })
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 </script>
 
 <style lang="scss" scoped>
+
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
 .mobile-requisition {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/sale/order/index.vue

@@ -23,6 +23,30 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -350,9 +374,41 @@ onMounted(async () => {
   customerList.value = await CustomerApi.getCustomerSimpleList()
   userList.value = await UserApi.getSimpleUserList()
 })
+
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 </script>
 
 <style lang="scss" scoped>
+
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
 .mobile-sale-order {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/sale/out/index.vue

@@ -23,6 +23,32 @@
       </div>
     </div>
 
+
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -486,11 +512,41 @@ onActivated(() => {
     getList()
   }
 })
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 // TODO 芋艿：可优化功能：列表界面，支持导入
 // TODO 芋艿：可优化功能：详情界面，支持打印
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
 .mobile-sale-out {
   padding: 12px;
   background: #f5f5f5;

src/views/erp/sale/return/index.vue

@@ -23,6 +23,30 @@
       </div>
     </div>
 
+    <div class="mobile-header__quick-filter">
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === undefined }"
+        @click="handleQuickFilter(undefined)"
+      >
+        全部订单
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 10 }"
+        @click="handleQuickFilter(10)"
+      >
+        待审核
+      </div>
+      <div
+        class="quick-filter-item"
+        :class="{ active: queryParams.status === 20 }"
+        @click="handleQuickFilter(20)"
+      >
+        已审核
+      </div>
+    </div>
+
     <!-- 卡片列表 -->
     <div class="mobile-list" v-loading="loading">
       <div v-if="list.length === 0 && !loading" class="mobile-empty">
@@ -297,11 +321,42 @@ onMounted(async () => {
   warehouseList.value = await WarehouseApi.getWarehouseSimpleList()
   accountList.value = await AccountApi.getAccountSimpleList()
 })
+
+/** 快捷分类筛选 */
+const handleQuickFilter = (status: number | undefined) => {
+  queryParams.status = status
+  queryParams.pageNo = 1
+  getList()
+}
 // TODO 芋艿：可优化功能：列表界面，支持导入
 // TODO 芋艿：可优化功能：详情界面，支持打印
 </script>
 
 <style lang="scss" scoped>
+
+.mobile-header__quick-filter {
+  display: flex;
+  gap: 12px;
+  margin: 8px 0;
+  justify-content: flex-start;
+
+  .quick-filter-item {
+    padding: 4px 12px;
+    font-size: 14px;
+    border-radius: 20px;
+    cursor: pointer;
+    color: #909399;
+    background: transparent;
+    transition: all 0.2s;
+
+    &.active {
+      color: #fff;
+      background: #409eff;
+    }
+  }
+}
+
+
 .mobile-sale-return {
   padding: 12px;
   background: #f5f5f5;