refactor: 四端完成 Options API → script setup + vuex → pinia 迁移

- buyer(95) / seller(169) / im(53) / manager(280) 共 597 个组件全部从 Options API 转换为 <script setup>
- 四端 vuex 全部移除，状态管理统一迁移至 pinia 4（stores/ 目录）
- util.js 等基础设施去除 vm 首参依赖；全局属性（$Message/$filters 等）在 script 内改为具名导入
- 被外部 ref 访问的公共组件均已补齐 defineExpose（清单见各端 MIGRATION-VUE3.md）
- 各端 eslint 启用 vue/component-api-style 防止新代码回退 Options API
- 四端 yarn build 全部通过；迁移约定与注意事项已更新至各端 MIGRATION-VUE3.md

manager/src/views/finance/payment-method.vue

@@ -24,39 +24,39 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-payment-method",
-  data() {
-    return { loading: false, dateRange: [], data: [] };
-  },
-  mounted() {
-    this.loadData();
-  },
-  methods: {
-    buildParams() {
-      const p = {};
-      if (this.dateRange?.length === 2) {
-        p.startDate = this.dateRange[0];
-        p.endDate = this.dateRange[1];
-      }
-      return p;
-    },
-    loadData() {
-      this.loading = true;
-      API_Finance.getPaymentMethodReport(this.buildParams()).then((res) => {
-        this.loading = false;
-        if (res.success) this.data = res.result || [];
-      });
-    },
-    handleExport() {
-      API_Finance.exportPaymentMethodReport(this.buildParams()).then((blob) => {
-        downloadBlob(blob, "支付方式汇总.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-payment-method" });
+
+const loading = ref(false);
+const dateRange = ref([]);
+const data = ref([]);
+
+onMounted(() => {
+  loadData();
+});
+
+function buildParams() {
+  const p = {};
+  if (dateRange.value?.length === 2) {
+    p.startDate = dateRange.value[0];
+    p.endDate = dateRange.value[1];
+  }
+  return p;
+}
+function loadData() {
+  loading.value = true;
+  API_Finance.getPaymentMethodReport(buildParams()).then((res) => {
+    loading.value = false;
+    if (res.success) data.value = res.result || [];
+  });
+}
+function handleExport() {
+  API_Finance.exportPaymentMethodReport(buildParams()).then((blob) => {
+    downloadBlob(blob, "支付方式汇总.xlsx");
+  });
+}
 </script>

manager/src/views/finance/platform-report.vue

@@ -39,44 +39,40 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-platform-report",
-  data() {
-    return {
-      loading: false,
-      dateRange: [],
-      params: { granularity: "DAY" },
-      data: [],
-    };
-  },
-  mounted() {
-    this.loadData();
-  },
-  methods: {
-    buildParams() {
-      const p = { ...this.params };
-      if (this.dateRange && this.dateRange.length === 2) {
-        p.startDate = this.dateRange[0];
-        p.endDate = this.dateRange[1];
-      }
-      return p;
-    },
-    loadData() {
-      this.loading = true;
-      API_Finance.getPlatformReport(this.buildParams()).then((res) => {
-        this.loading = false;
-        if (res.success) this.data = res.result || [];
-      });
-    },
-    handleExport() {
-      API_Finance.exportPlatformReport(this.buildParams()).then((blob) => {
-        downloadBlob(blob, "平台经营报表.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-platform-report" });
+
+const loading = ref(false);
+const dateRange = ref([]);
+const params = ref({ granularity: "DAY" });
+const data = ref([]);
+
+onMounted(() => {
+  loadData();
+});
+
+function buildParams() {
+  const p = { ...params.value };
+  if (dateRange.value && dateRange.value.length === 2) {
+    p.startDate = dateRange.value[0];
+    p.endDate = dateRange.value[1];
+  }
+  return p;
+}
+function loadData() {
+  loading.value = true;
+  API_Finance.getPlatformReport(buildParams()).then((res) => {
+    loading.value = false;
+    if (res.success) data.value = res.result || [];
+  });
+}
+function handleExport() {
+  API_Finance.exportPlatformReport(buildParams()).then((blob) => {
+    downloadBlob(blob, "平台经营报表.xlsx");
+  });
+}
 </script>

manager/src/views/finance/refundLog.vue

@@ -34,44 +34,40 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, reactive, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-refund-log",
-  data() {
-    return {
-      loading: false,
-      searchForm: { pageNumber: 1, pageSize: 20, orderSn: "" },
-      data: [],
-      total: 0,
-    };
-  },
-  mounted() {
-    this.getDataList();
-  },
-  methods: {
-    handleSearch() {
-      this.searchForm.pageNumber = 1;
-      this.getDataList();
-    },
-    getDataList() {
-      this.loading = true;
-      API_Finance.refundLogPage(this.searchForm).then((res) => {
-        this.loading = false;
-        if (res.success) {
-          this.data = res.result.records;
-          this.total = res.result.total;
-        }
-      });
-    },
-    handleExport() {
-      const { pageNumber, pageSize, ...rest } = this.searchForm;
-      API_Finance.exportRefundFlow(rest).then((blob) => {
-        downloadBlob(blob, "退款流水.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-refund-log" });
+
+const loading = ref(false);
+const searchForm = reactive({ pageNumber: 1, pageSize: 20, orderSn: "" });
+const data = ref([]);
+const total = ref(0);
+
+onMounted(() => {
+  getDataList();
+});
+
+function handleSearch() {
+  searchForm.pageNumber = 1;
+  getDataList();
+}
+function getDataList() {
+  loading.value = true;
+  API_Finance.refundLogPage(searchForm).then((res) => {
+    loading.value = false;
+    if (res.success) {
+      data.value = res.result.records;
+      total.value = res.result.total;
+    }
+  });
+}
+function handleExport() {
+  const { pageNumber, pageSize, ...rest } = searchForm;
+  API_Finance.exportRefundFlow(rest).then((blob) => {
+    downloadBlob(blob, "退款流水.xlsx");
+  });
+}
 </script>

manager/src/views/finance/settlement-ledger.vue

@@ -16,31 +16,30 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-settlement-ledger",
-  data() {
-    return { loading: false, data: [] };
-  },
-  mounted() {
-    this.loadData();
-  },
-  methods: {
-    loadData() {
-      this.loading = true;
-      API_Finance.getSettlementLedger({}).then((res) => {
-        this.loading = false;
-        if (res.success) this.data = res.result || [];
-      });
-    },
-    handleExport() {
-      API_Finance.exportSettlementLedger({}).then((blob) => {
-        downloadBlob(blob, "结算台账.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-settlement-ledger" });
+
+const loading = ref(false);
+const data = ref([]);
+
+onMounted(() => {
+  loadData();
+});
+
+function loadData() {
+  loading.value = true;
+  API_Finance.getSettlementLedger({}).then((res) => {
+    loading.value = false;
+    if (res.success) data.value = res.result || [];
+  });
+}
+function handleExport() {
+  API_Finance.exportSettlementLedger({}).then((blob) => {
+    downloadBlob(blob, "结算台账.xlsx");
+  });
+}
 </script>

manager/src/views/finance/store-settlement.vue

@@ -26,39 +26,39 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-store-settlement",
-  data() {
-    return { loading: false, dateRange: [], data: [] };
-  },
-  mounted() {
-    this.loadData();
-  },
-  methods: {
-    buildParams() {
-      const p = {};
-      if (this.dateRange?.length === 2) {
-        p.startDate = this.dateRange[0];
-        p.endDate = this.dateRange[1];
-      }
-      return p;
-    },
-    loadData() {
-      this.loading = true;
-      API_Finance.getStoreSettlementReport(this.buildParams()).then((res) => {
-        this.loading = false;
-        if (res.success) this.data = res.result || [];
-      });
-    },
-    handleExport() {
-      API_Finance.exportStoreSettlementReport(this.buildParams()).then((blob) => {
-        downloadBlob(blob, "店铺结算汇总.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-store-settlement" });
+
+const loading = ref(false);
+const dateRange = ref([]);
+const data = ref([]);
+
+onMounted(() => {
+  loadData();
+});
+
+function buildParams() {
+  const p = {};
+  if (dateRange.value?.length === 2) {
+    p.startDate = dateRange.value[0];
+    p.endDate = dateRange.value[1];
+  }
+  return p;
+}
+function loadData() {
+  loading.value = true;
+  API_Finance.getStoreSettlementReport(buildParams()).then((res) => {
+    loading.value = false;
+    if (res.success) data.value = res.result || [];
+  });
+}
+function handleExport() {
+  API_Finance.exportStoreSettlementReport(buildParams()).then((blob) => {
+    downloadBlob(blob, "店铺结算汇总.xlsx");
+  });
+}
 </script>

manager/src/views/finance/walletLog.vue

@@ -36,59 +36,55 @@
   </div>
 </template>
 
-<script>
+<script setup>
+import { onMounted, reactive, ref } from "vue";
 import * as API_Finance from "@/api/finance";
 import { getRequest } from "@/libs/axios";
 import { downloadBlob } from "@/utils/downloadBlob";
 
-export default {
-  name: "finance-wallet-log",
-  data() {
-    return {
-      loading: false,
-      searchForm: { memberName: "" },
-      dateRange: [],
-      pageNumber: 1,
-      pageSize: 20,
-      data: [],
-      total: 0,
-    };
-  },
-  mounted() {
-    this.getDataList();
-  },
-  methods: {
-    handleSearch() {
-      this.pageNumber = 1;
-      this.getDataList();
-    },
-    getDataList() {
-      this.loading = true;
-      const params = {
-        pageNumber: this.pageNumber,
-        pageSize: this.pageSize,
-        memberName: this.searchForm.memberName,
-      };
-      getRequest("/wallet/log", params).then((res) => {
-        this.loading = false;
-        if (res.success) {
-          this.data = res.result.records;
-          this.total = res.result.total;
-        }
-      }).catch(() => {
-        this.loading = false;
-      });
-    },
-    handleExport() {
-      const params = { memberName: this.searchForm.memberName };
-      if (this.dateRange?.length === 2) {
-        params.startDate = this.dateRange[0];
-        params.endDate = this.dateRange[1];
-      }
-      API_Finance.exportWalletLog(params).then((blob) => {
-        downloadBlob(blob, "钱包流水.xlsx");
-      });
-    },
-  },
-};
+defineOptions({ name: "finance-wallet-log" });
+
+const loading = ref(false);
+const searchForm = reactive({ memberName: "" });
+const dateRange = ref([]);
+const pageNumber = ref(1);
+const pageSize = ref(20);
+const data = ref([]);
+const total = ref(0);
+
+onMounted(() => {
+  getDataList();
+});
+
+function handleSearch() {
+  pageNumber.value = 1;
+  getDataList();
+}
+function getDataList() {
+  loading.value = true;
+  const params = {
+    pageNumber: pageNumber.value,
+    pageSize: pageSize.value,
+    memberName: searchForm.memberName,
+  };
+  getRequest("/wallet/log", params).then((res) => {
+    loading.value = false;
+    if (res.success) {
+      data.value = res.result.records;
+      total.value = res.result.total;
+    }
+  }).catch(() => {
+    loading.value = false;
+  });
+}
+function handleExport() {
+  const params = { memberName: searchForm.memberName };
+  if (dateRange.value?.length === 2) {
+    params.startDate = dateRange.value[0];
+    params.endDate = dateRange.value[1];
+  }
+  API_Finance.exportWalletLog(params).then((blob) => {
+    downloadBlob(blob, "钱包流水.xlsx");
+  });
+}
 </script>