fix: 完成财务模块接口对接

spring

2026-05-20 1ffe9b9bf12e1670fbfae0b9acbec95d4aaebe16

 src/views/financialManagement/receivable/receipt.vue

@@ -2,40 +2,54 @@
  <div class="app-container">
    <el-form :model="filters" :inline="true">
      <el-form-item label="收款单号:">
        <el-input v-model="filters.receiptCode" placeholder="请输入收款单号" clearable style="width: 200px;" />
        <el-input v-model="filters.collectionNumber" placeholder="请输入收款单号" clearable style="width: 200px;" />
      </el-form-item>
      <el-form-item label="客户:">
        <el-select v-model="filters.customerId" placeholder="请选择客户" clearable style="width: 200px;">
          <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.id" />
        <el-select v-model="filters.customerId" placeholder="请选择客户" clearable filterable style="width: 200px;">
          <el-option v-for="item in customerList" :key="item.id" :label="item.customerName" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="收款方式:">
        <el-select v-model="filters.receiptMethod" placeholder="请选择收款方式" clearable style="width: 150px;">
          <el-option label="银行转账" value="bank_transfer" />
          <el-option label="现金" value="cash" />
          <el-option label="支票" value="check" />
          <el-option label="汇票" value="draft" />
          <el-option label="支付宝" value="alipay" />
          <el-option label="微信" value="wechat" />
        <el-select v-model="filters.collectionMethod" placeholder="请选择收款方式" clearable style="width: 150px;">
          <el-option
            v-for="item in payment_methods"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="收款日期:">
        <el-date-picker
          v-model="filters.dateRange"
          type="daterange"
          value-format="YYYY-MM-DD"
          format="YYYY-MM-DD"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          clearable
          style="width: 240px;"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="getTableData">搜索</el-button>
        <el-button type="primary" @click="onSearch">搜索</el-button>
        <el-button @click="resetFilters">重置</el-button>
      </el-form-item>
    </el-form>
    <div class="table_list">
      <div class="actions">
        <div>
          <el-statistic title="本期收款合计" :value="totalReceiptAmount" precision="2" prefix="¥" />
          <el-statistic title="本页收款合计" :value="totalReceiptAmount" :precision="2" prefix="¥" />
        </div>
        <div>
          <el-button type="primary" @click="add" icon="Plus">新增收款</el-button>
          <el-button @click="handleOut" icon="Download">导出</el-button>
          <el-button type="success" @click="handleExport" icon="Download">导出</el-button>
        </div>
      </div>
      <PIMTable
        rowKey="id"
        v-loading="tableLoading"
        :column="columns"
        :tableData="dataList"
        :page="{
@@ -49,97 +63,192 @@
          <span class="text-success">¥{{ formatMoney(row.amount) }}</span>
        </template>
        <template #receiptMethod="{ row }">
          <el-tag>{{ getReceiptMethodLabel(row.receiptMethod) }}</el-tag>
        </template>
        <template #status="{ row }">
          <el-tag :type="row.status === 'confirmed' ? 'success' : 'warning'">{{ row.status === 'confirmed' ? '已确认' : '待确认' }}</el-tag>
          <span>{{ getReceiptMethodLabel(row.receiptMethod) }}</span>
        </template>
        <template #operation="{ row }">
          <el-button type="primary" link @click="view(row)">查看</el-button>
          <el-button type="primary" link @click="edit(row)" v-if="row.status === 'pending'">编辑</el-button>
          <el-button type="success" link @click="handleConfirm(row)" v-if="row.status === 'pending'">确认</el-button>
          <el-button type="danger" link @click="handleDelete(row)" v-if="row.status === 'pending'">删除</el-button>
          <el-button type="primary" link @click="edit(row)">编辑</el-button>
          <el-button type="danger" link @click="handleDelete(row)">删除</el-button>
        </template>
      </PIMTable>
    </div>

    <FormDialog :title="dialogTitle" v-model="dialogVisible" width="800px" @confirm="submitForm" @cancel="dialogVisible = false">
    <FormDialog
      :title="dialogTitle"
      v-model="dialogVisible"
      width="800px"
      :operation-type="isView ? 'detail' : ''"
      @confirm="submitForm"
      @cancel="closeDialog"
    >
      <el-form :model="form" :rules="rules" ref="formRef" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="12">
          <el-col :span="24">
            <el-form-item label="收款单号" prop="receiptCode">
              <el-input v-model="form.receiptCode" placeholder="系统自动生成" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="客户" prop="customerId">
              <el-select v-model="form.customerId" placeholder="请选择客户" style="width: 100%;" :disabled="isEdit">
                <el-option v-for="item in customerList" :key="item.id" :label="item.name" :value="item.id" />
              <el-select
                v-model="form.customerId"
                placeholder="请选择客户"
                style="width: 100%;"
                :disabled="isEdit || isView"
                filterable
                @change="handleCustomerChange"
              >
                <el-option v-for="item in customerList" :key="item.id" :label="item.customerName" :value="item.id" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="关联单据" prop="stockOutRecordIds">
              <el-input
                :model-value="outboundBatchDisplayText"
                placeholder="请先选择客户"
                readonly
                :disabled="!form.customerId || isEdit || isView"
                class="outbound-batch-input"
                @click="handleOutboundInputClick"
              >
                <template v-if="!isEdit && !isView" #append>
                  <el-button
                    :disabled="!form.customerId"
                    :loading="outboundBatchLoading"
                    @click.stop="openOutboundSelectDialog"
                  >
                    选择
                  </el-button>
                </template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="收款日期" prop="receiptDate">
              <el-date-picker v-model="form.receiptDate" type="date" placeholder="选择日期" value-format="YYYY-MM-DD" style="width: 100%;" />
              <el-date-picker
                v-model="form.receiptDate"
                type="date"
                placeholder="选择日期"
                value-format="YYYY-MM-DD"
                style="width: 100%;"
                :disabled="isView"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款金额" prop="amount">
              <el-input-number v-model="form.amount" :min="0" :precision="2" style="width: 100%;" />
              <el-input-number
                v-model="form.amount"
                :min="0"
                :precision="2"
                style="width: 100%;"
                :disabled="isView"
                placeholder="根据关联单据自动汇总，可修改"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="收款方式" prop="receiptMethod">
              <el-select v-model="form.receiptMethod" placeholder="请选择收款方式" style="width: 100%;">
                <el-option label="银行转账" value="bank_transfer" />
                <el-option label="现金" value="cash" />
                <el-option label="支票" value="check" />
                <el-option label="汇票" value="draft" />
                <el-option label="支付宝" value="alipay" />
                <el-option label="微信" value="wechat" />
              <el-select
                v-model="form.receiptMethod"
                placeholder="请选择收款方式"
                style="width: 100%;"
                :disabled="isView"
              >
                <el-option
                  v-for="item in payment_methods"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="银行账号" prop="bankAccount" v-if="form.receiptMethod === 'bank_transfer'">
              <el-input v-model="form.bankAccount" placeholder="请输入银行账号" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="关联单据" prop="relatedDocs">
          <el-select v-model="form.relatedDocs" multiple placeholder="请选择关联单据" style="width: 100%;">
            <el-option v-for="item in outList" :key="item.outCode" :label="item.outCode" :value="item.outCode" />
          </el-select>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注" />
          <el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注" :disabled="isView" />
        </el-form-item>
      </el-form>
      <template #footer>
        <el-button type="primary" @click="submitForm">确定</el-button>
        <el-button @click="dialogVisible = false">取消</el-button>
      <template v-if="!isView" #footer>
        <el-button type="primary" :loading="submitLoading" @click="submitForm">确定</el-button>
        <el-button @click="closeDialog">取消</el-button>
      </template>
    </FormDialog>

    <el-dialog
      v-model="outboundSelectVisible"
      title="选择关联单据"
      width="1200px"
      append-to-body
      destroy-on-close
      :close-on-click-modal="false"
      @closed="handleOutboundDialogClosed"
    >
      <el-table
        ref="outboundTableRef"
        v-loading="outboundBatchLoading"
        :data="outboundBatchList"
        row-key="id"
        border
        stripe
        max-height="480"
        @selection-change="handleOutboundDialogSelectionChange"
      >
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column prop="outboundBatches" label="出库单号" min-width="140" show-overflow-tooltip />
        <el-table-column prop="customerName" label="客户名称" min-width="120" show-overflow-tooltip />
        <el-table-column prop="productName" label="产品名称" min-width="120" show-overflow-tooltip />
        <el-table-column prop="specificationModel" label="规格型号" min-width="140" show-overflow-tooltip />
        <el-table-column prop="salesContractNo" label="销售合同号" min-width="140" show-overflow-tooltip />
        <el-table-column prop="shippingNo" label="发货单号" min-width="130" show-overflow-tooltip />
        <el-table-column prop="shippingDate" label="发货日期" width="110" align="center" />
        <el-table-column prop="outboundAmount" label="出库金额" width="110" align="right">
          <template #default="{ row }">¥{{ formatMoney(row.outboundAmount) }}</template>
        </el-table-column>
        <el-table-column prop="taxRate" label="税率" width="80" align="center">
          <template #default="{ row }">{{ row.taxRate }}%</template>
        </el-table-column>
      </el-table>
      <template #footer>
        <el-button type="primary" @click="confirmOutboundSelection">确定</el-button>
        <el-button @click="outboundSelectVisible = false">取消</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted, computed } from "vue";
import { ref, reactive, computed, onMounted, nextTick, getCurrentInstance } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import FormDialog from "@/components/Dialog/FormDialog.vue";
import { listCustomer } from "@/api/basicData/customer.js";
import {
  getOutboundBatchesByCustomer,
  addAccountSalesCollection,
  listPageAccountSalesCollection,
  updateAccountSalesCollection,
  deleteAccountSalesCollection,
} from "@/api/financialManagement/accountSalesCollection.js";

defineOptions({
  name: "收款单",
});

const { proxy } = getCurrentInstance();
const { payment_methods } = proxy.useDict("payment_methods");

const filters = reactive({
  receiptCode: "",
  collectionNumber: "",
  customerId: "",
  receiptMethod: "",
  collectionMethod: "",
  dateRange: [],
});

const pagination = reactive({
@@ -152,97 +261,365 @@
  { label: "收款单号", prop: "receiptCode", width: "150" },
  { label: "客户名称", prop: "customerName", width: "180" },
  { label: "收款日期", prop: "receiptDate", width: "120" },
  { label: "收款金额", prop: "amount", slot: "amount" },
  { label: "收款方式", prop: "receiptMethod", slot: "receiptMethod" },
  { label: "状态", prop: "status", slot: "status" },
  { label: "收款金额", prop: "amount", dataType: "slot", slot: "amount" },
  { label: "收款方式", prop: "receiptMethod", dataType: "slot", slot: "receiptMethod", width: "120" },
  { label: "备注", prop: "remark", showOverflowTooltip: true },
  { label: "操作", prop: "operation", slot: "operation", width: "220", fixed: "right" },
  { label: "操作", prop: "operation", dataType: "slot", slot: "operation", width: "200", fixed: "right" },
];

const dataList = ref([]);
const tableLoading = ref(false);
const dialogVisible = ref(false);
const dialogTitle = ref("");
const formRef = ref(null);
const isEdit = ref(false);
const isView = ref(false);
const currentId = ref(null);
const submitLoading = ref(false);

const customerList = [
  { id: 1, name: "北京科技有限公司" },
  { id: 2, name: "上海贸易公司" },
  { id: 3, name: "广州实业有限公司" },
  { id: 4, name: "深圳电子公司" },
];
const customerList = ref([]);
const outboundBatchList = ref([]);
const outboundBatchOptions = ref([]);
const outboundBatchLoading = ref(false);
const outboundSelectVisible = ref(false);
const outboundTableRef = ref(null);
const dialogOutboundSelection = ref([]);

const outList = [
  { outCode: "CK2024001", customerId: 1 },
  { outCode: "CK2024002", customerId: 2 },
  { outCode: "CK2024003", customerId: 3 },
];
const getReceiptMethodLabel = (value) => {
  if (value === undefined || value === null || value === "") return "-";
  const item = payment_methods.value?.find((m) => String(m.value) === String(value));
  return item?.label ?? value;
};

const getDefaultReceiptMethod = () => payment_methods.value?.[0]?.value ?? "";

const form = reactive({
  receiptCode: "",
  customerId: "",
  receiptDate: "",
  amount: 0,
  receiptMethod: "bank_transfer",
  bankAccount: "",
  relatedDocs: [],
  receiptMethod: "",
  stockOutRecordIds: [],
  outboundBatches: "",
  remark: "",
});

const rules = {
  customerId: [{ required: true, message: "请选择客户", trigger: "change" }],
  stockOutRecordIds: [{ required: true, type: "array", min: 1, message: "请选择关联单据", trigger: "change" }],
  receiptDate: [{ required: true, message: "请选择收款日期", trigger: "change" }],
  amount: [{ required: true, message: "请输入收款金额", trigger: "blur" }],
  receiptMethod: [{ required: true, message: "请选择收款方式", trigger: "change" }],
};

const mockData = [
  { id: 1, receiptCode: "SK2024001", customerId: 1, customerName: "北京科技有限公司", receiptDate: "2024-01-16", amount: 3000, receiptMethod: "bank_transfer", status: "confirmed", relatedDocs: ["CK2024001"], remark: "" },
  { id: 2, receiptCode: "SK2024002", customerId: 2, customerName: "上海贸易公司", receiptDate: "2024-01-18", amount: 5000, receiptMethod: "cash", status: "pending", relatedDocs: ["CK2024002"], remark: "" },
  { id: 3, receiptCode: "SK2024003", customerId: 3, customerName: "广州实业有限公司", receiptDate: "2024-01-20", amount: 8000, receiptMethod: "alipay", status: "confirmed", relatedDocs: ["CK2024003"], remark: "" },
];

const totalReceiptAmount = computed(() => {
  return dataList.value.reduce((sum, item) => sum + Number(item.amount), 0);
});
const totalReceiptAmount = computed(() =>
  dataList.value.reduce((sum, item) => sum + Number(item.amount || 0), 0)
);

const formatMoney = (value) => {
  if (value === undefined || value === null) return "0.00";
  return Number(value).toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ",");
};

const getReceiptMethodLabel = (method) => {
  const map = {
    bank_transfer: "银行转账",
    cash: "现金",
    check: "支票",
    draft: "汇票",
    alipay: "支付宝",
    wechat: "微信",
const parseStockOutRecordIds = (value) => {
  if (!value) return [];
  if (Array.isArray(value)) return value;
  return String(value)
    .split(/[,，]/)
    .map((s) => s.trim())
    .filter(Boolean)
    .map((s) => (/^\d+$/.test(s) ? Number(s) : s));
};

const formatOutboundBatches = (value) => {
  if (value === undefined || value === null || value === "") return "";
  if (Array.isArray(value)) return value.filter(Boolean).join("、");
  return String(value)
    .split(/[,，]/)
    .map((s) => s.trim())
    .filter(Boolean)
    .join("、");
};

const normalizeTableRow = (row) => ({
  ...row,
  receiptCode: row.collectionNumber ?? row.receiptCode,
  receiptDate: row.collectionDate ?? row.receiptDate,
  amount: row.collectionAmount ?? row.amount,
  receiptMethod: row.collectionMethod ?? row.receiptMethod ?? "",
  stockOutRecordIds: row.stockOutRecordIds ?? row.stockOutRecordId ?? "",
  outboundBatches: formatOutboundBatches(row.outboundBatches),
});

const getCustomerList = () => {
  listCustomer({ current: -1, size: -1, type: 0 }).then((res) => {
    if (res.code === 200) {
      customerList.value = res.data?.records || [];
    }
  });
};

const normalizeOutboundBatchOptions = (data) => {
  const list = Array.isArray(data) ? data : [];
  return list.map((item, index) => {
    if (typeof item === "string" || typeof item === "number") {
      const text = String(item);
      return { label: text, value: text, outboundAmount: 0 };
    }
    const label =
      item.outboundBatches ??
      item.batchNo ??
      item.shippingNo ??
      item.outboundNo ??
      item.label ??
      `出库单${index + 1}`;
    const value = item.id ?? item.stockOutRecordId ?? label;
    return { label: String(label), value, outboundAmount: Number(item.outboundAmount) || 0 };
  });
};

const isSameOutboundId = (a, b) => String(a) === String(b);

const getOutboundRowId = (row) => row?.id ?? row?.stockOutRecordId;

const outboundBatchDisplayText = computed(() => {
  if (isEdit.value || isView.value) {
    return form.outboundBatches || "";
  }
  if (form.outboundBatches) return form.outboundBatches;
  const ids = form.stockOutRecordIds || [];
  if (!ids.length) return "";
  const labels = outboundBatchOptions.value
    .filter((opt) => ids.some((id) => isSameOutboundId(id, opt.value)))
    .map((opt) => opt.label);
  if (labels.length) return labels.join("、");
  return ids.join("、");
});

const handleOutboundInputClick = () => {
  if (isEdit.value || isView.value) return;
  openOutboundSelectDialog();
};

/** 为已选 ID 补全选项（编辑/查看回显） */
const ensureOutboundOptionsForSelected = () => {
  const ids = form.stockOutRecordIds || [];
  ids.forEach((id) => {
    const exists = outboundBatchOptions.value.some((opt) => isSameOutboundId(opt.value, id));
    if (exists) return;
    const fromList = outboundBatchList.value.find((row) => isSameOutboundId(getOutboundRowId(row), id));
    if (fromList) {
      const [option] = normalizeOutboundBatchOptions([fromList]);
      if (option) outboundBatchOptions.value.push(option);
      return;
    }
    outboundBatchOptions.value.push({
      label: String(id),
      value: id,
      outboundAmount: 0,
    });
  });
};

const syncCollectionAmount = () => {
  const selected = form.stockOutRecordIds || [];
  const sum = outboundBatchOptions.value
    .filter((opt) => selected.some((id) => isSameOutboundId(id, opt.value)))
    .reduce((acc, opt) => acc + (Number(opt.outboundAmount) || 0), 0);
  form.amount = sum > 0 ? Number(sum.toFixed(2)) : 0;
};

const restoreOutboundTableSelection = () => {
  nextTick(() => {
    const table = outboundTableRef.value;
    if (!table) return;
    table.clearSelection();
    const selectedIds = new Set((form.stockOutRecordIds || []).map((id) => String(id)));
    outboundBatchList.value.forEach((row) => {
      const rowId = getOutboundRowId(row);
      if (rowId !== undefined && rowId !== null && selectedIds.has(String(rowId))) {
        table.toggleRowSelection(row, true);
      }
    });
  });
};

const loadOutboundBatches = (customerId, keepSelected = false) => {
  if (!customerId) {
    outboundBatchList.value = [];
    outboundBatchOptions.value = [];
    if (!keepSelected) {
      form.stockOutRecordIds = [];
      form.amount = 0;
    }
    return Promise.resolve();
  }
  outboundBatchLoading.value = true;
  return getOutboundBatchesByCustomer({ customerId })
    .then((res) => {
      if (res.code === 200) {
        const list = res.data?.records ?? res.data ?? [];
        outboundBatchList.value = Array.isArray(list) ? list : [];
        outboundBatchOptions.value = normalizeOutboundBatchOptions(list);
      } else {
        outboundBatchList.value = [];
        outboundBatchOptions.value = [];
      }
    })
    .catch(() => {
      outboundBatchList.value = [];
      outboundBatchOptions.value = [];
    })
    .finally(() => {
      outboundBatchLoading.value = false;
      if (keepSelected) {
        ensureOutboundOptionsForSelected();
        restoreOutboundTableSelection();
      }
    });
};

const handleCustomerChange = (customerId) => {
  form.stockOutRecordIds = [];
  form.outboundBatches = "";
  form.amount = 0;
  loadOutboundBatches(customerId);
};

const openOutboundSelectDialog = () => {
  if (!form.customerId || isEdit.value || isView.value) return;
  outboundSelectVisible.value = true;
  loadOutboundBatches(form.customerId, true).then(() => {
    restoreOutboundTableSelection();
  });
};

const handleOutboundDialogSelectionChange = (selection) => {
  dialogOutboundSelection.value = selection;
};

const confirmOutboundSelection = () => {
  if (dialogOutboundSelection.value.length === 0) {
    ElMessage.warning("请至少选择一条关联单据");
    return;
  }
  form.stockOutRecordIds = dialogOutboundSelection.value
    .map((row) => getOutboundRowId(row))
    .filter((id) => id !== undefined && id !== null);
  form.outboundBatches = dialogOutboundSelection.value
    .map((row) => row.outboundBatches ?? row.batchNo ?? row.shippingNo ?? "")
    .filter(Boolean)
    .join("、");
  outboundSelectVisible.value = false;
  syncCollectionAmount();
  formRef.value?.validateField("stockOutRecordIds");
};

const handleOutboundDialogClosed = () => {
  dialogOutboundSelection.value = [];
};

const appendFilterParams = (params) => {
  if (filters.collectionNumber) {
    params.collectionNumber = filters.collectionNumber;
  }
  if (filters.customerId) {
    params.customerId = filters.customerId;
  }
  if (filters.collectionMethod) {
    params.collectionMethod = filters.collectionMethod;
  }
  if (filters.dateRange?.length === 2) {
    params.startDate = filters.dateRange[0];
    params.endDate = filters.dateRange[1];
  }
  return params;
};

const buildListParams = () =>
  appendFilterParams({
    current: pagination.currentPage,
    size: pagination.pageSize,
  });

const buildExportParams = () => appendFilterParams({});

const buildSubmitPayload = (forUpdate = false) => {
  const payload = {
    customerId: form.customerId,
    collectionDate: form.receiptDate,
    collectionAmount: form.amount,
    collectionMethod: form.receiptMethod,
    collectionNumber: form.receiptCode || "",
    remark: form.remark || "",
    stockOutRecordIds: (form.stockOutRecordIds || []).join(","),
  };
  return map[method] || method;
  if (forUpdate) {
    payload.id = currentId.value;
  }
  return payload;
};

const fillFormFromRow = (row) => {
  const stockOutRecordIds = parseStockOutRecordIds(row.stockOutRecordIds ?? row.stockOutRecordId);
  Object.assign(form, {
    receiptCode: row.receiptCode ?? row.collectionNumber ?? "",
    customerId: row.customerId,
    receiptDate: row.receiptDate ?? row.collectionDate ?? "",
    amount: Number(row.amount ?? row.collectionAmount ?? 0),
    receiptMethod: row.receiptMethod ?? row.collectionMethod ?? "",
    stockOutRecordIds,
    outboundBatches: formatOutboundBatches(row.outboundBatches),
    remark: row.remark ?? "",
  });
};

const closeDialog = () => {
  dialogVisible.value = false;
  outboundSelectVisible.value = false;
  isView.value = false;
  isEdit.value = false;
};

const handleExport = () => {
  const params = buildExportParams();
  proxy.download("/accountSalesCollection/exportAccountSalesCollection", params, `收款单_${Date.now()}.xlsx`);
};

const getTableData = () => {
  let result = [...mockData];
  if (filters.receiptCode) {
    result = result.filter(item => item.receiptCode.includes(filters.receiptCode));
  }
  if (filters.customerId) {
    result = result.filter(item => item.customerId === filters.customerId);
  }
  if (filters.receiptMethod) {
    result = result.filter(item => item.receiptMethod === filters.receiptMethod);
  }
  pagination.total = result.length;
  dataList.value = result.slice((pagination.currentPage - 1) * pagination.pageSize, pagination.currentPage * pagination.pageSize);
  tableLoading.value = true;
  listPageAccountSalesCollection(buildListParams())
    .then((res) => {
      const ok = res.code === 200 || res.code === 0;
      if (ok && res.data) {
        pagination.total = res.data.total ?? 0;
        dataList.value = (res.data.records ?? []).map(normalizeTableRow);
      } else {
        ElMessage.error(res.msg || "查询失败");
        dataList.value = [];
        pagination.total = 0;
      }
    })
    .catch(() => {
      dataList.value = [];
      pagination.total = 0;
      ElMessage.error("查询失败");
    })
    .finally(() => {
      tableLoading.value = false;
    });
};

const onSearch = () => {
  pagination.currentPage = 1;
  getTableData();
};

const resetFilters = () => {
  filters.receiptCode = "";
  filters.collectionNumber = "";
  filters.customerId = "";
  filters.receiptMethod = "";
  filters.collectionMethod = "";
  filters.dateRange = [];
  pagination.currentPage = 1;
  getTableData();
};
@@ -255,88 +632,89 @@

const add = () => {
  isEdit.value = false;
  isView.value = false;
  dialogTitle.value = "新增收款";
  Object.assign(form, {
    receiptCode: "SK" + Date.now().toString().slice(-8),
    customerId: "",
    receiptDate: new Date().toISOString().split('T')[0],
    receiptDate: new Date().toISOString().split("T")[0],
    amount: 0,
    receiptMethod: "bank_transfer",
    bankAccount: "",
    relatedDocs: [],
    receiptMethod: getDefaultReceiptMethod(),
    stockOutRecordIds: [],
    outboundBatches: "",
    remark: "",
  });
  outboundBatchList.value = [];
  outboundBatchOptions.value = [];
  dialogVisible.value = true;
};

const edit = (row) => {
  isEdit.value = true;
  isView.value = false;
  currentId.value = row.id;
  dialogTitle.value = "编辑收款";
  Object.assign(form, row);
  fillFormFromRow(row);
  dialogVisible.value = true;
};

const view = (row) => {
  ElMessage.info(`查看收款单: ${row.receiptCode}`);
};

const handleConfirm = (row) => {
  ElMessageBox.confirm("确认该收款单吗？", "提示", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "info",
  }).then(() => {
    const index = mockData.findIndex(item => item.id === row.id);
    if (index !== -1) {
      mockData[index].status = "confirmed";
    }
    ElMessage.success("确认成功");
    getTableData();
  });
  isView.value = true;
  isEdit.value = false;
  dialogTitle.value = "查看收款";
  fillFormFromRow(row);
  dialogVisible.value = true;
};

const handleDelete = (row) => {
  ElMessageBox.confirm("确认删除该收款单吗？", "提示", {
  ElMessageBox.confirm(`确认删除收款单「${row.receiptCode ?? row.collectionNumber}」吗？`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(() => {
    const index = mockData.findIndex(item => item.id === row.id);
    if (index !== -1) {
      mockData.splice(index, 1);
    }
    ElMessage.success("删除成功");
    getTableData();
    deleteAccountSalesCollection([row.id])
      .then((res) => {
        if (res.code === 200) {
          ElMessage.success("删除成功");
          getTableData();
        } else {
          ElMessage.error(res.msg || "删除失败");
        }
      })
      .catch(() => {
        ElMessage.error("删除失败");
      });
  });
};

const handleOut = () => {
  ElMessage.success("导出成功");
};

const submitForm = () => {
  formRef.value.validate((valid) => {
    if (valid) {
      const customer = customerList.find(item => item.id === form.customerId);
      if (isEdit.value) {
        const index = mockData.findIndex(item => item.id === currentId.value);
        if (index !== -1) {
          mockData[index] = { ...mockData[index], ...form, customerName: customer?.name };
    if (!valid) return;
    submitLoading.value = true;
    const request = isEdit.value
      ? updateAccountSalesCollection(buildSubmitPayload(true))
      : addAccountSalesCollection(buildSubmitPayload());
    request
      .then((res) => {
        if (res.code === 200) {
          ElMessage.success(isEdit.value ? "修改成功" : "新增成功");
          closeDialog();
          getTableData();
        } else {
          ElMessage.error(res.msg || (isEdit.value ? "修改失败" : "新增失败"));
        }
        ElMessage.success("编辑成功");
      } else {
        const newId = mockData.length > 0 ? Math.max(...mockData.map(item => item.id)) + 1 : 1;
        mockData.push({ id: newId, ...form, customerName: customer?.name, status: "pending" });
        ElMessage.success("新增成功");
      }
      dialogVisible.value = false;
      getTableData();
    }
      })
      .catch(() => {
        ElMessage.error(isEdit.value ? "修改失败" : "新增失败");
      })
      .finally(() => {
        submitLoading.value = false;
      });
  });
};

onMounted(() => {
  getCustomerList();
  getTableData();
});
</script>
@@ -353,4 +731,10 @@
  color: #67c23a;
  font-weight: bold;
}

.outbound-batch-input:not(.is-disabled) {
  :deep(.el-input__wrapper) {
    cursor: pointer;
  }
}
</style>