Forráskód Böngészése

refactor(发票管理): 将发票管理逻辑提取为mixin并优化异步处理

yz 1 hónapja
szülő
commit
fff1f5f4ac
3 módosított fájl, 633 hozzáadás és 627 törlés
  1. 2 2
      src/api/order/invoice.js
  2. 629 0
      src/mixins/order/invoiceMixin.js
  3. 2 625
      src/views/order/invoice/index.vue

+ 2 - 2
src/api/order/invoice.js

@@ -95,7 +95,7 @@ import { INVOICE_TYPES, INVOICE_STATUS } from '@/views/order/invoice/constants'
  * @param {InvoiceQueryParams} params - 查询参数
  * @returns {Promise<AxiosResponse<ApiResponse<PageResult<InvoiceItem>>>>} 分页查询结果
  */
-export const getList = (current, size, params) => {
+export const getList = async (current, size, params) => {
   return request({
     url: '/api/blade-factory/api/factory/order-invoice',
     method: 'get',
@@ -193,4 +193,4 @@ export const getInvoicesByOrderId = (orderId) => {
       orderId
     }
   })
-}
+}

+ 629 - 0
src/mixins/order/invoiceMixin.js

@@ -0,0 +1,629 @@
+import { getList, add, update, remove, getDetail, updateStatus } from '@/api/order/invoice'
+import { mapGetters } from 'vuex'
+import {
+  INVOICE_TYPES,
+  INVOICE_STATUS,
+  INVOICE_TYPE_OPTIONS,
+  INVOICE_STATUS_OPTIONS,
+  getInvoiceTypeLabel,
+  getInvoiceTypeTagType,
+  getInvoiceStatusLabel,
+  getInvoiceStatusTagType
+} from '@/views/order/invoice/constants'
+
+/**
+ * 发票查询参数类型定义
+ * @typedef {Object} InvoiceQueryParams
+ * @property {string} [orderId] - 订单ID
+ * @property {string} [invoiceId] - 发票ID
+ * @property {string} [invoiceNo] - 发票号码
+ * @property {string} [customerName] - 客户名称
+ * @property {number} [invoiceStatus] - 开票状态
+ * @property {string} [startDate] - 开始日期
+ * @property {string} [endDate] - 结束日期
+ */
+
+/**
+ * 发票表单数据类型定义
+ * @typedef {Object} InvoiceForm
+ * @property {string} [id] - 发票ID
+ * @property {string} invoiceNo - 发票号码
+ * @property {string} invoiceCode - 发票代码
+ * @property {number} orderId - 订单ID
+ * @property {string} orderCode - 订单编码
+ * @property {number} customerId - 客户ID
+ * @property {string} customerCode - 客户编码
+ * @property {string} customerName - 客户名称
+ * @property {string} taxNo - 税号
+ * @property {string} invoiceTitle - 发票抬头
+ * @property {string} amount - 金额
+ * @property {string} taxAmount - 税额
+ * @property {string} totalAmount - 总金额
+ * @property {string} invoiceType - 发票类型
+ * @property {number} invoiceStatus - 开票状态
+ * @property {string} invoiceDate - 开票日期
+ */
+
+/**
+ * 分页信息类型定义
+ * @typedef {Object} PageInfo
+ * @property {number} pageSize - 每页大小
+ * @property {number} currentPage - 当前页码
+ * @property {number} total - 总记录数
+ */
+
+/**
+ * 发票管理混入
+ * @mixin InvoiceMixin
+ */
+export default {
+  data() {
+    return {
+      /** @type {InvoiceForm} 表单数据 */
+      form: {},
+
+      /** @type {InvoiceQueryParams} 查询参数 */
+      query: {},
+
+      /** @type {boolean} 加载状态 */
+      loading: true,
+
+      /** @type {PageInfo} 分页信息 */
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+
+      /** @type {Array<InvoiceItem>} 选中的数据列表 */
+      selectionList: [],
+
+      /** @type {Array<InvoiceItem>} 表格数据 */
+      data: [],
+
+      /** @type {Object} 表格配置选项 */
+      option: {
+        height: 'auto',
+        calcHeight: 30,
+        dialogWidth: 1000,
+        labelWidth: 120,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        selection: true,
+        viewBtn: true,
+        editBtn: true,
+        addBtn: true,
+        delBtn: true,
+        dialogClickModal: false,
+        column: [
+          {
+            label: '发票号码',
+            prop: 'invoiceNo',
+            search: true,
+            rules: [
+              {
+                required: true,
+                message: '请输入发票号码',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '发票代码',
+            prop: 'invoiceCode',
+            search: true,
+            rules: [
+              {
+                required: true,
+                message: '请输入发票代码',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '订单ID',
+            prop: 'orderId',
+            search: true,
+            type: 'number',
+            rules: [
+              {
+                required: true,
+                message: '请输入订单ID',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '订单编码',
+            prop: 'orderCode',
+            search: true,
+            addDisplay: false,
+            editDisplay: false
+          },
+          {
+            label: '客户名称',
+            prop: 'customerName',
+            search: true,
+            rules: [
+              {
+                required: true,
+                message: '请输入客户名称',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '客户编码',
+            prop: 'customerCode',
+            search: true,
+            rules: [
+              {
+                required: true,
+                message: '请输入客户编码',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '税号',
+            prop: 'taxNo',
+            rules: [
+              {
+                required: true,
+                message: '请输入税号',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '发票抬头',
+            prop: 'invoiceTitle',
+            rules: [
+              {
+                required: true,
+                message: '请输入发票抬头',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '金额',
+            prop: 'amount',
+            slot: true,
+            type: 'number',
+            precision: 2,
+            rules: [
+              {
+                required: true,
+                message: '请输入金额',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '税额',
+            prop: 'taxAmount',
+            slot: true,
+            type: 'number',
+            precision: 2,
+            rules: [
+              {
+                required: true,
+                message: '请输入税额',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '总金额',
+            prop: 'totalAmount',
+            slot: true,
+            type: 'number',
+            precision: 2,
+            rules: [
+              {
+                required: true,
+                message: '请输入总金额',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '发票类型',
+            prop: 'invoiceType',
+            slot: true,
+            type: 'select',
+            search: true,
+            width: 120,
+            dicData: INVOICE_TYPE_OPTIONS,
+            rules: [
+              {
+                required: true,
+                message: '请选择发票类型',
+                trigger: 'change'
+              }
+            ]
+          },
+          {
+            label: '开票状态',
+            prop: 'invoiceStatus',
+            slot: true,
+            search: true,
+            type: 'select',
+            dicData: INVOICE_STATUS_OPTIONS,
+            rules: [
+              {
+                required: true,
+                message: '请选择开票状态',
+                trigger: 'change'
+              }
+            ]
+          },
+          {
+            label: '开票日期',
+            prop: 'invoiceDate',
+            type: 'date',
+            format: 'yyyy-MM-dd',
+            valueFormat: 'yyyy-MM-dd',
+            rules: [
+              {
+                required: true,
+                message: '请选择开票日期',
+                trigger: 'change'
+              }
+            ]
+          },
+          {
+            label: '创建时间',
+            prop: 'createTime',
+            type: 'datetime',
+            format: 'yyyy-MM-dd HH:mm:ss',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss',
+            addDisplay: false,
+            editDisplay: false,
+            width: 160
+          },
+          {
+            label: '更新时间',
+            prop: 'updateTime',
+            type: 'datetime',
+            format: 'yyyy-MM-dd HH:mm:ss',
+            valueFormat: 'yyyy-MM-dd HH:mm:ss',
+            addDisplay: false,
+            editDisplay: false,
+            width: 160
+          }
+        ]
+      }
+    }
+  },
+
+  computed: {
+    ...mapGetters(['permission']),
+
+    /**
+     * 权限列表
+     * @returns {Object} 权限配置对象
+     */
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.order_invoice_add, false),
+        viewBtn: this.vaildData(this.permission.order_invoice_view, false),
+        editBtn: this.vaildData(this.permission.order_invoice_edit, false),
+        delBtn: this.vaildData(this.permission.order_invoice_delete, false)
+      }
+    },
+
+    /**
+     * 是否有选中的数据
+     * @returns {boolean} 是否有选中数据
+     */
+    hasSelection() {
+      return this.selectionList.length > 0
+    }
+  },
+
+  methods: {
+    /**
+     * 获取发票类型标签文本
+     * @param {string} type - 发票类型
+     * @returns {string} 标签文本
+     */
+    getInvoiceTypeLabel,
+
+    /**
+     * 获取发票类型标签样式
+     * @param {string} type - 发票类型
+     * @returns {string} 标签样式类型
+     */
+    getInvoiceTypeTagType,
+
+    /**
+     * 获取发票状态标签文本
+     * @param {number} status - 发票状态
+     * @returns {string} 标签文本
+     */
+    getInvoiceStatusLabel,
+
+    /**
+     * 获取发票状态标签样式
+     * @param {number} status - 发票状态
+     * @returns {string} 标签样式类型
+     */
+    getInvoiceStatusTagType,
+
+    /**
+     * 格式化金额显示
+     * @param {string|number} amount - 金额
+     * @returns {string} 格式化后的金额
+     */
+    formatAmount(amount) {
+      if (!amount) return '0.00'
+      return parseFloat(amount).toLocaleString('zh-CN', {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      })
+    },
+
+    /**
+     * 批量删除处理
+     * @returns {Promise<void>}
+     */
+    async handleDelete() {
+      if (!this.hasSelection) {
+        this.$message.warning('请选择要删除的数据')
+        return
+      }
+
+      try {
+        await this.$confirm('确定删除选中的发票信息吗?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+
+        const ids = this.selectionList.map(item => item.id).join(',')
+        const res = await remove(ids)
+
+        if (res.data.success) {
+          this.$message.success('删除成功')
+          await this.onLoad(this.page)
+        } else {
+          this.$message.error(res.data.msg || '删除失败')
+        }
+      } catch (error) {
+        if (error !== 'cancel') {
+          console.error('删除发票失败:', error)
+          this.$message.error('删除失败,请重试')
+        }
+      }
+    },
+
+    /**
+     * 批量更新发票状态
+     * @param {number} status - 新状态
+     * @returns {Promise<void>}
+     */
+    async handleBatchUpdateStatus(status) {
+      if (!this.hasSelection) {
+        this.$message.warning('请选择要更新状态的数据')
+        return
+      }
+
+      const statusText = getInvoiceStatusLabel(status)
+
+      try {
+        await this.$confirm(`确定将选中的发票状态更新为"${statusText}"吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+
+        const ids = this.selectionList.map(item => item.id)
+        const res = await updateStatus(ids, status)
+
+        if (res.data.success) {
+          this.$message.success('状态更新成功')
+          await this.onLoad(this.page)
+        } else {
+          this.$message.error(res.data.msg || '状态更新失败')
+        }
+      } catch (error) {
+        if (error !== 'cancel') {
+          console.error('更新发票状态失败:', error)
+          this.$message.error('状态更新失败,请重试')
+        }
+      }
+    },
+
+    /**
+     * 行删除处理
+     * @param {InvoiceItem} row - 要删除的行数据
+     * @param {number} index - 行索引
+     * @returns {Promise<void>}
+     */
+    async rowDel(row, index) {
+      try {
+        const res = await remove(row.id)
+        if (res.data.success) {
+          this.$message.success('删除成功')
+          this.onLoad(this.page)
+        } else {
+          this.$message.error(res.data.msg || '删除失败')
+        }
+      } catch (error) {
+        console.error('删除发票失败:', error)
+        this.$message.error('删除失败,请重试')
+      }
+    },
+
+    /**
+     * 行更新处理
+     * @param {InvoiceForm} row - 更新的行数据
+     * @param {number} index - 行索引
+     * @param {Function} done - 完成回调
+     * @param {Function} loading - 加载状态回调
+     * @returns {Promise<void>}
+     */
+    async rowUpdate(row, index, done, loading) {
+      try {
+        loading()
+        const res = await update(row)
+
+        if (res.data.success) {
+          this.$message.success('修改成功')
+          done()
+          this.onLoad(this.page)
+        } else {
+          this.$message.error(res.data.msg || '修改失败')
+          loading()
+        }
+      } catch (error) {
+        console.error('修改发票失败:', error)
+        this.$message.error('修改失败,请重试')
+        loading()
+      }
+    },
+
+    /**
+     * 行保存处理
+     * @param {InvoiceForm} row - 保存的行数据
+     * @param {Function} done - 完成回调
+     * @param {Function} loading - 加载状态回调
+     * @returns {Promise<void>}
+     */
+    async rowSave(row, done, loading) {
+      try {
+        loading()
+        const res = await add(row)
+
+        if (res.data.success) {
+          this.$message.success('添加成功')
+          done()
+          this.onLoad(this.page)
+        } else {
+          this.$message.error(res.data.msg || '添加失败')
+          loading()
+        }
+      } catch (error) {
+        console.error('添加发票失败:', error)
+        this.$message.error('添加失败,请重试')
+        loading()
+      }
+    },
+
+    /**
+     * 搜索变化处理
+     * @param {InvoiceQueryParams} params - 搜索参数
+     * @param {Function} done - 完成回调
+     * @returns {void}
+     */
+    searchChange(params, done) {
+      this.query = params
+      this.onLoad(this.page, params)
+      done()
+    },
+
+    /**
+     * 搜索重置处理
+     * @returns {void}
+     */
+    searchReset() {
+      this.query = {}
+      this.onLoad(this.page)
+    },
+
+    /**
+     * 选择变化处理
+     * @param {Array<InvoiceItem>} list - 选中的数据列表
+     * @returns {void}
+     */
+    selectionChange(list) {
+      this.selectionList = list
+    },
+
+    /**
+     * 当前页变化处理
+     * @param {number} currentPage - 当前页码
+     * @returns {void}
+     */
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage
+    },
+
+    /**
+     * 页大小变化处理
+     * @param {number} pageSize - 页大小
+     * @returns {void}
+     */
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize
+    },
+
+    /**
+     * 刷新变化处理
+     * @returns {void}
+     */
+    refreshChange() {
+      this.onLoad(this.page, this.query)
+    },
+
+    /**
+     * 打开前处理
+     * @param {Function} done - 完成回调
+     * @param {string} type - 操作类型
+     * @returns {void}
+     */
+    beforeOpen(done, type) {
+      done()
+    },
+
+    /**
+     * 加载数据
+     * @param {PageInfo} page - 分页信息
+     * @param {InvoiceQueryParams} params - 查询参数
+     * @returns {Promise<void>}
+     */
+    async onLoad(page, params = {}) {
+      this.loading = true
+
+      try {
+        const res = await getList(page.currentPage || 1, page.pageSize || 10, {
+          ...this.query,
+          ...params
+        })
+
+        if (res.data.success) {
+          const { records, total } = res.data.data
+          this.data = records || []
+          this.page.total = total || 0
+        } else {
+          this.$message.error(res.data.msg || '获取数据失败')
+          this.data = []
+          this.page.total = 0
+        }
+      } catch (error) {
+        console.error('获取发票列表失败:', error)
+        this.$message.error('获取数据失败,请重试')
+        this.data = []
+        this.page.total = 0
+      } finally {
+        this.loading = false
+      }
+    }
+  },
+
+  /**
+   * 组件挂载后初始化
+   * @returns {void}
+   */
+  mounted() {
+    // 默认不加载数据,需要通过搜索条件触发
+    this.loading = false
+    this.data = []
+    this.page.total = 0
+  }
+}

+ 2 - 625
src/views/order/invoice/index.vue

@@ -81,59 +81,7 @@
 </template>
 
 <script>
-import { getList, add, update, remove, getDetail, updateStatus } from '@/api/order/invoice'
-import { mapGetters } from 'vuex'
-import {
-  INVOICE_TYPES,
-  INVOICE_STATUS,
-  INVOICE_TYPE_OPTIONS,
-  INVOICE_STATUS_OPTIONS,
-  getInvoiceTypeLabel,
-  getInvoiceTypeTagType,
-  getInvoiceStatusLabel,
-  getInvoiceStatusTagType
-} from './constants'
-
-/**
- * 发票查询参数类型定义
- * @typedef {Object} InvoiceQueryParams
- * @property {string} [orderId] - 订单ID
- * @property {string} [invoiceId] - 发票ID
- * @property {string} [invoiceNo] - 发票号码
- * @property {string} [customerName] - 客户名称
- * @property {number} [invoiceStatus] - 开票状态
- * @property {string} [startDate] - 开始日期
- * @property {string} [endDate] - 结束日期
- */
-
-/**
- * 发票表单数据类型定义
- * @typedef {Object} InvoiceForm
- * @property {string} [id] - 发票ID
- * @property {string} invoiceNo - 发票号码
- * @property {string} invoiceCode - 发票代码
- * @property {number} orderId - 订单ID
- * @property {string} orderCode - 订单编码
- * @property {number} customerId - 客户ID
- * @property {string} customerCode - 客户编码
- * @property {string} customerName - 客户名称
- * @property {string} taxNo - 税号
- * @property {string} invoiceTitle - 发票抬头
- * @property {string} amount - 金额
- * @property {string} taxAmount - 税额
- * @property {string} totalAmount - 总金额
- * @property {string} invoiceType - 发票类型
- * @property {number} invoiceStatus - 开票状态
- * @property {string} invoiceDate - 开票日期
- */
-
-/**
- * 分页信息类型定义
- * @typedef {Object} PageInfo
- * @property {number} pageSize - 每页大小
- * @property {number} currentPage - 当前页码
- * @property {number} total - 总记录数
- */
+import invoiceMixin from '@/mixins/order/invoiceMixin'
 
 /**
  * 发票及开票信息查询组件
@@ -141,578 +89,7 @@ import {
  */
 export default {
   name: 'InvoiceIndex',
-  
-  data() {
-    return {
-      /** @type {InvoiceForm} 表单数据 */
-      form: {},
-      
-      /** @type {InvoiceQueryParams} 查询参数 */
-      query: {},
-      
-      /** @type {boolean} 加载状态 */
-      loading: true,
-      
-      /** @type {PageInfo} 分页信息 */
-      page: {
-        pageSize: 10,
-        currentPage: 1,
-        total: 0
-      },
-      
-      /** @type {Array<InvoiceItem>} 选中的数据列表 */
-      selectionList: [],
-      
-      /** @type {Array<InvoiceItem>} 表格数据 */
-      data: [],
-      
-      /** @type {Object} 表格配置选项 */
-      option: {
-        height: 'auto',
-        calcHeight: 30,
-        dialogWidth: 1000,
-        labelWidth: 120,
-        tip: false,
-        searchShow: true,
-        searchMenuSpan: 6,
-        border: true,
-        index: true,
-        selection: true,
-        viewBtn: true,
-        editBtn: true,
-        addBtn: true,
-        delBtn: true,
-        dialogClickModal: false,
-        column: [
-          {
-            label: '发票号码',
-            prop: 'invoiceNo',
-            search: true,
-            rules: [
-              {
-                required: true,
-                message: '请输入发票号码',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '发票代码',
-            prop: 'invoiceCode',
-            search: true,
-            rules: [
-              {
-                required: true,
-                message: '请输入发票代码',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '订单ID',
-            prop: 'orderId',
-            search: true,
-            type: 'number',
-            rules: [
-              {
-                required: true,
-                message: '请输入订单ID',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '订单编码',
-            prop: 'orderCode',
-            search: true,
-            addDisplay: false,
-            editDisplay: false
-          },
-          {
-            label: '客户名称',
-            prop: 'customerName',
-            search: true,
-            rules: [
-              {
-                required: true,
-                message: '请输入客户名称',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '客户编码',
-            prop: 'customerCode',
-            search: true,
-            rules: [
-              {
-                required: true,
-                message: '请输入客户编码',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '税号',
-            prop: 'taxNo',
-            rules: [
-              {
-                required: true,
-                message: '请输入税号',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '发票抬头',
-            prop: 'invoiceTitle',
-            rules: [
-              {
-                required: true,
-                message: '请输入发票抬头',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '金额',
-            prop: 'amount',
-            slot: true,
-            type: 'number',
-            precision: 2,
-            rules: [
-              {
-                required: true,
-                message: '请输入金额',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '税额',
-            prop: 'taxAmount',
-            slot: true,
-            type: 'number',
-            precision: 2,
-            rules: [
-              {
-                required: true,
-                message: '请输入税额',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '总金额',
-            prop: 'totalAmount',
-            slot: true,
-            type: 'number',
-            precision: 2,
-            rules: [
-              {
-                required: true,
-                message: '请输入总金额',
-                trigger: 'blur'
-              }
-            ]
-          },
-          {
-            label: '发票类型',
-            prop: 'invoiceType',
-            slot: true,
-            type: 'select',
-            search: true,
-            width: 120,
-            dicData: INVOICE_TYPE_OPTIONS,
-            rules: [
-              {
-                required: true,
-                message: '请选择发票类型',
-                trigger: 'change'
-              }
-            ]
-          },
-          {
-            label: '开票状态',
-            prop: 'invoiceStatus',
-            slot: true,
-            search: true,
-            type: 'select',
-            dicData: INVOICE_STATUS_OPTIONS,
-            rules: [
-              {
-                required: true,
-                message: '请选择开票状态',
-                trigger: 'change'
-              }
-            ]
-          },
-          {
-            label: '开票日期',
-            prop: 'invoiceDate',
-            type: 'date',
-            format: 'yyyy-MM-dd',
-            valueFormat: 'yyyy-MM-dd',
-            rules: [
-              {
-                required: true,
-                message: '请选择开票日期',
-                trigger: 'change'
-              }
-            ]
-          },
-          {
-            label: '创建时间',
-            prop: 'createTime',
-            type: 'datetime',
-            format: 'yyyy-MM-dd HH:mm:ss',
-            valueFormat: 'yyyy-MM-dd HH:mm:ss',
-            addDisplay: false,
-            editDisplay: false,
-            width: 160
-          },
-          {
-            label: '更新时间',
-            prop: 'updateTime',
-            type: 'datetime',
-            format: 'yyyy-MM-dd HH:mm:ss',
-            valueFormat: 'yyyy-MM-dd HH:mm:ss',
-            addDisplay: false,
-            editDisplay: false,
-            width: 160
-          }
-        ]
-      }
-    }
-  },
-
-  computed: {
-    ...mapGetters(['permission']),
-    
-    /**
-     * 权限列表
-     * @returns {Object} 权限配置对象
-     */
-    permissionList() {
-      return {
-        addBtn: this.vaildData(this.permission.order_invoice_add, false),
-        viewBtn: this.vaildData(this.permission.order_invoice_view, false),
-        editBtn: this.vaildData(this.permission.order_invoice_edit, false),
-        delBtn: this.vaildData(this.permission.order_invoice_delete, false)
-      }
-    },
-    
-    /**
-     * 是否有选中的数据
-     * @returns {boolean} 是否有选中数据
-     */
-    hasSelection() {
-      return this.selectionList.length > 0
-    }
-  },
-
-  methods: {
-    /**
-     * 获取发票类型标签文本
-     * @param {string} type - 发票类型
-     * @returns {string} 标签文本
-     */
-    getInvoiceTypeLabel,
-
-    /**
-     * 获取发票类型标签样式
-     * @param {string} type - 发票类型
-     * @returns {string} 标签样式类型
-     */
-    getInvoiceTypeTagType,
-
-    /**
-     * 获取发票状态标签文本
-     * @param {number} status - 发票状态
-     * @returns {string} 标签文本
-     */
-    getInvoiceStatusLabel,
-
-    /**
-     * 获取发票状态标签样式
-     * @param {number} status - 发票状态
-     * @returns {string} 标签样式类型
-     */
-    getInvoiceStatusTagType,
-
-
-
-    /**
-     * 格式化金额显示
-     * @param {string|number} amount - 金额
-     * @returns {string} 格式化后的金额
-     */
-    formatAmount(amount) {
-      if (!amount) return '0.00'
-      return parseFloat(amount).toLocaleString('zh-CN', {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2
-      })
-    },
-
-    /**
-     * 批量删除处理
-     * @returns {Promise<void>}
-     */
-    async handleDelete() {
-      if (!this.hasSelection) {
-        this.$message.warning('请选择要删除的数据')
-        return
-      }
-
-      try {
-        await this.$confirm('确定删除选中的发票信息吗?', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        })
-
-        const ids = this.selectionList.map(item => item.id).join(',')
-        const res = await remove(ids)
-        
-        if (res.data.success) {
-          this.$message.success('删除成功')
-          this.onLoad(this.page)
-        } else {
-          this.$message.error(res.data.msg || '删除失败')
-        }
-      } catch (error) {
-        if (error !== 'cancel') {
-          console.error('删除发票失败:', error)
-          this.$message.error('删除失败,请重试')
-        }
-      }
-    },
-
-    /**
-     * 批量更新发票状态
-     * @param {number} status - 新状态
-     * @returns {Promise<void>}
-     */
-    async handleBatchUpdateStatus(status) {
-      if (!this.hasSelection) {
-        this.$message.warning('请选择要更新状态的数据')
-        return
-      }
-
-      const statusText = getInvoiceStatusLabel(status)
-      
-      try {
-        await this.$confirm(`确定将选中的发票状态更新为"${statusText}"吗?`, '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        })
-
-        const ids = this.selectionList.map(item => item.id)
-        const res = await updateStatus(ids, status)
-        
-        if (res.data.success) {
-          this.$message.success('状态更新成功')
-          await this.onLoad(this.page)
-        } else {
-          this.$message.error(res.data.msg || '状态更新失败')
-        }
-      } catch (error) {
-        if (error !== 'cancel') {
-          console.error('更新发票状态失败:', error)
-          this.$message.error('状态更新失败,请重试')
-        }
-      }
-    },
-
-    /**
-     * 行删除处理
-     * @param {InvoiceItem} row - 要删除的行数据
-     * @param {number} index - 行索引
-     * @returns {Promise<void>}
-     */
-    async rowDel(row, index) {
-      try {
-        const res = await remove(row.id)
-        if (res.data.success) {
-          this.$message.success('删除成功')
-          this.onLoad(this.page)
-        } else {
-          this.$message.error(res.data.msg || '删除失败')
-        }
-      } catch (error) {
-        console.error('删除发票失败:', error)
-        this.$message.error('删除失败,请重试')
-      }
-    },
-
-    /**
-     * 行更新处理
-     * @param {InvoiceForm} row - 更新的行数据
-     * @param {number} index - 行索引
-     * @param {Function} done - 完成回调
-     * @param {Function} loading - 加载状态回调
-     * @returns {Promise<void>}
-     */
-    async rowUpdate(row, index, done, loading) {
-      try {
-        loading()
-        const res = await update(row)
-        
-        if (res.data.success) {
-          this.$message.success('修改成功')
-          done()
-          this.onLoad(this.page)
-        } else {
-          this.$message.error(res.data.msg || '修改失败')
-          loading()
-        }
-      } catch (error) {
-        console.error('修改发票失败:', error)
-        this.$message.error('修改失败,请重试')
-        loading()
-      }
-    },
-
-    /**
-     * 行保存处理
-     * @param {InvoiceForm} row - 保存的行数据
-     * @param {Function} done - 完成回调
-     * @param {Function} loading - 加载状态回调
-     * @returns {Promise<void>}
-     */
-    async rowSave(row, done, loading) {
-      try {
-        loading()
-        const res = await add(row)
-        
-        if (res.data.success) {
-          this.$message.success('添加成功')
-          done()
-          this.onLoad(this.page)
-        } else {
-          this.$message.error(res.data.msg || '添加失败')
-          loading()
-        }
-      } catch (error) {
-        console.error('添加发票失败:', error)
-        this.$message.error('添加失败,请重试')
-        loading()
-      }
-    },
-
-    /**
-     * 搜索变化处理
-     * @param {InvoiceQueryParams} params - 搜索参数
-     * @param {Function} done - 完成回调
-     * @returns {void}
-     */
-    searchChange(params, done) {
-      this.query = params
-      this.onLoad(this.page, params)
-      done()
-    },
-
-    /**
-     * 搜索重置处理
-     * @returns {void}
-     */
-    searchReset() {
-      this.query = {}
-      this.onLoad(this.page)
-    },
-
-    /**
-     * 选择变化处理
-     * @param {Array<InvoiceItem>} list - 选中的数据列表
-     * @returns {void}
-     */
-    selectionChange(list) {
-      this.selectionList = list
-    },
-
-    /**
-     * 当前页变化处理
-     * @param {number} currentPage - 当前页码
-     * @returns {void}
-     */
-    currentChange(currentPage) {
-      this.page.currentPage = currentPage
-    },
-
-    /**
-     * 页大小变化处理
-     * @param {number} pageSize - 页大小
-     * @returns {void}
-     */
-    sizeChange(pageSize) {
-      this.page.pageSize = pageSize
-    },
-
-    /**
-     * 刷新变化处理
-     * @returns {void}
-     */
-    refreshChange() {
-      this.onLoad(this.page, this.query)
-    },
-
-    /**
-     * 打开前处理
-     * @param {Function} done - 完成回调
-     * @param {string} type - 操作类型
-     * @returns {void}
-     */
-    beforeOpen(done, type) {
-      done()
-    },
-
-    /**
-     * 加载数据
-     * @param {PageInfo} page - 分页信息
-     * @param {InvoiceQueryParams} params - 查询参数
-     * @returns {Promise<void>}
-     */
-    async onLoad(page, params = {}) {
-      this.loading = true
-      
-      try {
-        const res = await getList(page.currentPage || 1, page.pageSize || 10, {
-          ...this.query,
-          ...params
-        })
-        
-        if (res.data.success) {
-          const { records, total } = res.data.data
-          this.data = records || []
-          this.page.total = total || 0
-        } else {
-          this.$message.error(res.data.msg || '获取数据失败')
-          this.data = []
-          this.page.total = 0
-        }
-      } catch (error) {
-        console.error('获取发票列表失败:', error)
-        this.$message.error('获取数据失败,请重试')
-        this.data = []
-        this.page.total = 0
-      } finally {
-        this.loading = false
-      }
-    }
-  },
-
-  /**
-   * 组件挂载后初始化
-   * @returns {void}
-   */
-  mounted() {
-    // 默认不加载数据,需要通过搜索条件触发
-    this.loading = false
-    this.data = []
-    this.page.total = 0
-  }
+  mixins: [invoiceMixin]
 }
 </script>