Ver Fonte

fix: 库存变动日志页面 — 清理空壳实现,接入真实API

1. 重写 logs/index.vue:移除写死空数据的内联 onSearch,
   改用 useInventoryLogs() hook 调用真实 /inventory/logs 接口
2. logs hook 新增 deviceOptions/productOptions,
   启动时从 getDeviceList/getProductList 加载
3. 设备选择器 label 统一为「deviceId — shopName」格式
4. 新增变动类型筛选下拉框(上货增加/销售减少/调整增加/调整减少/盘点调整)
5. 表格列使用 hook 中已有的 JSX 渲染:变动类型彩色标签、变动数量正负色

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
skyline há 2 semanas atrás
pai
commit
0777416a95

+ 46 - 88
haha-admin-web/src/views/inventory/logs/index.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import { useInventoryLogs } from "./utils/hook";
 import { PureTableBar } from "@/components/RePureTableBar";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
 import Refresh from "~icons/ep/refresh";
@@ -11,87 +12,19 @@ defineOptions({
 const formRef = ref();
 const tableRef = ref();
 
-const loading = ref(false);
-const dataList = ref([]);
-const pagination = ref({
-  total: 0,
-  pageSize: 10,
-  currentPage: 1
-});
-
-const form = ref({
-  deviceId: "",
-  productId: ""
-});
-
-const columns = [
-  {
-    label: "设备名称",
-    prop: "deviceName",
-    minWidth: 120
-  },
-  {
-    label: "商品名称",
-    prop: "productName",
-    minWidth: 120
-  },
-  {
-    label: "变动类型",
-    prop: "changeType",
-    minWidth: 100
-  },
-  {
-    label: "变动数量",
-    prop: "quantity",
-    minWidth: 100
-  },
-  {
-    label: "变动前库存",
-    prop: "beforeStock",
-    minWidth: 100
-  },
-  {
-    label: "变动后库存",
-    prop: "afterStock",
-    minWidth: 100
-  },
-  {
-    label: "操作人",
-    prop: "operator",
-    minWidth: 100
-  },
-  {
-    label: "变动时间",
-    prop: "createTime",
-    minWidth: 160
-  }
-];
-
-const onSearch = () => {
-  loading.value = true;
-  setTimeout(() => {
-    dataList.value = [];
-    loading.value = false;
-  }, 500);
-};
-
-const resetForm = (formEl: any) => {
-  if (!formEl) return;
-  formEl.resetFields();
-  onSearch();
-};
-
-const handleSizeChange = (val: number) => {
-  pagination.value.pageSize = val;
-  onSearch();
-};
-
-const handleCurrentChange = (val: number) => {
-  pagination.value.currentPage = val;
-  onSearch();
-};
-
-onSearch();
+const {
+  form,
+  loading,
+  columns,
+  dataList,
+  pagination,
+  deviceOptions,
+  productOptions,
+  onSearch,
+  resetForm,
+  handleSizeChange,
+  handleCurrentChange
+} = useInventoryLogs();
 </script>
 
 <template>
@@ -108,8 +41,14 @@ onSearch();
           placeholder="请选择设备"
           clearable
           filterable
-          class="w-[180px]!"
+          class="w-[220px]!"
         >
+          <el-option
+            v-for="item in deviceOptions"
+            :key="item.deviceId"
+            :label="item.shopName ? `${item.deviceId} — ${item.shopName}` : item.deviceId"
+            :value="item.deviceId"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="商品:" prop="productId">
@@ -118,8 +57,28 @@ onSearch();
           placeholder="请选择商品"
           clearable
           filterable
-          class="w-[180px]!"
+          class="w-[200px]!"
+        >
+          <el-option
+            v-for="item in productOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="变动类型:" prop="changeType">
+        <el-select
+          v-model="form.changeType"
+          placeholder="全部"
+          clearable
+          class="w-[130px]!"
         >
+          <el-option label="上货增加" :value="1" />
+          <el-option label="销售减少" :value="2" />
+          <el-option label="调整增加" :value="3" />
+          <el-option label="调整减少" :value="4" />
+          <el-option label="盘点调整" :value="5" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -138,11 +97,11 @@ onSearch();
     </el-form>
 
     <PureTableBar
-      title="库存变动"
+      title="库存变动日志"
       :columns="columns"
       @refresh="onSearch"
     >
-      <template v-slot="{ size, dynamic_columns }">
+      <template v-slot="{ size, dynamicColumns }">
         <pure-table
           ref="tableRef"
           row-key="id"
@@ -153,7 +112,7 @@ onSearch();
           :loading="loading"
           :size="size"
           :data="dataList"
-          :columns="dynamic_columns"
+          :columns="dynamicColumns"
           :pagination="{ ...pagination, size }"
           :header-cell-style="{
             background: 'var(--el-fill-color-light)',
@@ -161,8 +120,7 @@ onSearch();
           }"
           @page-size-change="handleSizeChange"
           @page-current-change="handleCurrentChange"
-        >
-        </pure-table>
+        />
       </template>
     </PureTableBar>
   </div>

+ 26 - 1
haha-admin-web/src/views/inventory/logs/utils/hook.tsx

@@ -1,6 +1,8 @@
 import dayjs from "dayjs";
 import { message } from "@/utils/message";
 import { getInventoryLogs } from "@/api/inventory";
+import { getDeviceList } from "@/api/device";
+import { getProductList } from "@/api/product";
 import type { PaginationProps } from "@pureadmin/table";
 import type { SearchFormProps } from "./types";
 import { onMounted, reactive, ref, toRaw } from "vue";
@@ -13,6 +15,8 @@ export function useInventoryLogs() {
   });
   const loading = ref(true);
   const dataList = ref([]);
+  const deviceOptions = ref<any[]>([]);
+  const productOptions = ref<any[]>([]);
   const pagination = reactive<PaginationProps>({
     total: 0,
     pageSize: 10,
@@ -131,7 +135,26 @@ export function useInventoryLogs() {
     onSearch();
   }
 
-  onMounted(() => {
+  async function fetchDeviceOptions() {
+    try {
+      const { data } = await getDeviceList({ page: 1, pageSize: 1000 });
+      deviceOptions.value = data.list || [];
+    } catch (error) {
+      console.error("获取设备列表失败:", error);
+    }
+  }
+
+  async function fetchProductOptions() {
+    try {
+      const { data } = await getProductList({ page: 1, pageSize: 1000 });
+      productOptions.value = data.list || [];
+    } catch (error) {
+      console.error("获取商品列表失败:", error);
+    }
+  }
+
+  onMounted(async () => {
+    await Promise.all([fetchDeviceOptions(), fetchProductOptions()]);
     onSearch();
   });
 
@@ -141,6 +164,8 @@ export function useInventoryLogs() {
     columns,
     dataList,
     pagination,
+    deviceOptions,
+    productOptions,
     onSearch,
     resetForm,
     handleSizeChange,