From 29e25b468524391b999c3a4eb83bd430fc5890de Mon Sep 17 00:00:00 2001
From: wuxw <928255095@qq.com>
Date: Tue, 8 Jul 2025 18:37:26 +0800
Subject: [PATCH] 开发完成运营费用明细功能

---
 src/api/aCommunity/aFeeDetailConfigApi.js            |  16 ++++++++++++++++
 src/api/aCommunity/aFeeDetailDiscountApi.js          |  20 ++++++++++++++++++++
 src/api/aCommunity/aFeeDetailFeeObjApi.js            |  20 ++++++++++++++++++++
 src/api/aCommunity/aFeeDetailHisApi.js               |  20 ++++++++++++++++++++
 src/api/aCommunity/aFeeDetailImportApi.js            |  20 ++++++++++++++++++++
 src/api/aCommunity/aFeeDetailSubApi.js               |  41 +++++++++++++++++++++++++++++++++++++++++
 src/api/aCommunity/adminFeeDetailApi.js              |  58 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailConfig.vue       |  99 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailConfigDemo.vue   |  21 +++++++++++++++++++++
 src/components/aCommunity/aFeeDetailDiscount.vue     |  97 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailDiscountDemo.vue |  18 ++++++++++++++++++
 src/components/aCommunity/aFeeDetailFeeObj.vue       | 114 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailFeeObjDemo.vue   |  18 ++++++++++++++++++
 src/components/aCommunity/aFeeDetailHis.vue          | 138 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailHisDemo.vue      |  21 +++++++++++++++++++++
 src/components/aCommunity/aFeeDetailImport.vue       |  88 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailImportDemo.vue   |  18 ++++++++++++++++++
 src/components/aCommunity/aFeeDetailSub.vue          | 144 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/aCommunity/aFeeDetailSubDemo.vue      |  21 +++++++++++++++++++++
 src/components/fee/aRoomDetailMeterWaterLog.vue      |   4 +++-
 src/components/fee/aRoomDetailOwner.vue              |   3 ++-
 src/components/index/index-admin.vue                 |   6 +++++-
 src/i18n/communityI18n.js                            |   3 +++
 src/router/communityRouter.js                        |   5 +++++
 src/views/aCommunity/aFeeDetailConfigLang.js         |  44 ++++++++++++++++++++++++++++++++++++++++++++
 src/views/aCommunity/aFeeDetailDiscountLang.js       |  44 ++++++++++++++++++++++++++++++++++++++++++++
 src/views/aCommunity/aFeeDetailFeeObjLang.js         |  32 ++++++++++++++++++++++++++++++++
 src/views/aCommunity/aFeeDetailHisLang.js            |  30 ++++++++++++++++++++++++++++++
 src/views/aCommunity/aFeeDetailImportLang.js         |  32 ++++++++++++++++++++++++++++++++
 src/views/aCommunity/aFeeDetailSubLang.js            |  22 ++++++++++++++++++++++
 src/views/aCommunity/adminFeeDetailLang.js           | 257 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/aCommunity/adminFeeDetailList.vue          | 356 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/cityAreaList.vue                 |   2 +-
 33 files changed, 1828 insertions(+), 4 deletions(-)
 create mode 100644 src/api/aCommunity/aFeeDetailConfigApi.js
 create mode 100644 src/api/aCommunity/aFeeDetailDiscountApi.js
 create mode 100644 src/api/aCommunity/aFeeDetailFeeObjApi.js
 create mode 100644 src/api/aCommunity/aFeeDetailHisApi.js
 create mode 100644 src/api/aCommunity/aFeeDetailImportApi.js
 create mode 100644 src/api/aCommunity/aFeeDetailSubApi.js
 create mode 100644 src/api/aCommunity/adminFeeDetailApi.js
 create mode 100644 src/components/aCommunity/aFeeDetailConfig.vue
 create mode 100644 src/components/aCommunity/aFeeDetailConfigDemo.vue
 create mode 100644 src/components/aCommunity/aFeeDetailDiscount.vue
 create mode 100644 src/components/aCommunity/aFeeDetailDiscountDemo.vue
 create mode 100644 src/components/aCommunity/aFeeDetailFeeObj.vue
 create mode 100644 src/components/aCommunity/aFeeDetailFeeObjDemo.vue
 create mode 100644 src/components/aCommunity/aFeeDetailHis.vue
 create mode 100644 src/components/aCommunity/aFeeDetailHisDemo.vue
 create mode 100644 src/components/aCommunity/aFeeDetailImport.vue
 create mode 100644 src/components/aCommunity/aFeeDetailImportDemo.vue
 create mode 100644 src/components/aCommunity/aFeeDetailSub.vue
 create mode 100644 src/components/aCommunity/aFeeDetailSubDemo.vue
 create mode 100644 src/views/aCommunity/aFeeDetailConfigLang.js
 create mode 100644 src/views/aCommunity/aFeeDetailDiscountLang.js
 create mode 100644 src/views/aCommunity/aFeeDetailFeeObjLang.js
 create mode 100644 src/views/aCommunity/aFeeDetailHisLang.js
 create mode 100644 src/views/aCommunity/aFeeDetailImportLang.js
 create mode 100644 src/views/aCommunity/aFeeDetailSubLang.js
 create mode 100644 src/views/aCommunity/adminFeeDetailLang.js
 create mode 100644 src/views/aCommunity/adminFeeDetailList.vue

diff --git a/src/api/aCommunity/aFeeDetailConfigApi.js b/src/api/aCommunity/aFeeDetailConfigApi.js
new file mode 100644
index 0000000..9b141e8
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailConfigApi.js
@@ -0,0 +1,16 @@
+import request from '@/utils/request'
+
+export function queryAdminFeeConfigs(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/feeConfig.queryAdminFeeConfigs',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+        resolve(res)
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/aFeeDetailDiscountApi.js b/src/api/aCommunity/aFeeDetailDiscountApi.js
new file mode 100644
index 0000000..cced0fc
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailDiscountApi.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+export function queryAdminApplyRoomDiscount(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.queryAdminApplyRoomDiscount',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取费用折扣数据失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/aFeeDetailFeeObjApi.js b/src/api/aCommunity/aFeeDetailFeeObjApi.js
new file mode 100644
index 0000000..2663dda
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailFeeObjApi.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+export function listAdminConfigFeeObjs(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/feeConfig.listAdminConfigFeeObjs',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取费用对象数据失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/aFeeDetailHisApi.js b/src/api/aCommunity/aFeeDetailHisApi.js
new file mode 100644
index 0000000..9e92ae6
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailHisApi.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+export function queryAdminHisFee(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.queryAdminHisFee',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取费用历史数据失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/aFeeDetailImportApi.js b/src/api/aCommunity/aFeeDetailImportApi.js
new file mode 100644
index 0000000..8b76e0f
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailImportApi.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+export function queryAdminImportFeeDetail(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.queryAdminImportFeeDetail',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取导入费用明细数据失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/aFeeDetailSubApi.js b/src/api/aCommunity/aFeeDetailSubApi.js
new file mode 100644
index 0000000..57ad4cb
--- /dev/null
+++ b/src/api/aCommunity/aFeeDetailSubApi.js
@@ -0,0 +1,41 @@
+import request from '@/utils/request'
+
+// 获取子费用列表
+export function listAdminPayFeeSub(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/feeSub.listAdminPayFeeSub',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取子费用列表失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 获取费用信息
+export function listAdminFee(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.listAdminFee',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '获取费用信息失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/aCommunity/adminFeeDetailApi.js b/src/api/aCommunity/adminFeeDetailApi.js
new file mode 100644
index 0000000..c47a332
--- /dev/null
+++ b/src/api/aCommunity/adminFeeDetailApi.js
@@ -0,0 +1,58 @@
+import request from '@/utils/request'
+
+// 获取费用详情列表
+export function getFeeDetail(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.listAdminFee',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+        resolve(res)
+
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 更新费用信息
+export function updateFeeDetail(data) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.updateAdminFee',
+      method: 'post',
+      data
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '更新费用信息失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 删除费用信息
+export function deleteFeeDetail(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/fee.deleteAdminFee',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '删除费用信息失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailConfig.vue b/src/components/aCommunity/aFeeDetailConfig.vue
new file mode 100644
index 0000000..6cca124
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailConfig.vue
@@ -0,0 +1,99 @@
+<template>
+  <div class="margin-top">
+    <el-table :data="aFeeDetailConfigInfo.feeConfigs" border style="width: 100%">
+      <el-table-column prop="feeTypeCdName" :label="$t('aFeeDetailConfig.feeType')" align="center"></el-table-column>
+      <el-table-column prop="feeName" :label="$t('aFeeDetailConfig.feeItem')" align="center"></el-table-column>
+      <el-table-column prop="feeFlagName" :label="$t('aFeeDetailConfig.feeFlag')" align="center"></el-table-column>
+      <el-table-column prop="billTypeName" :label="$t('aFeeDetailConfig.billType')" align="center"></el-table-column>
+      <el-table-column :label="$t('aFeeDetailConfig.paymentType')" align="center">
+        <template #default="{ row }">{{ row.paymentCd === '1200' ? $t('aFeeDetailConfig.prepay') :
+          $t('aFeeDetailConfig.postpay')}}</template>
+      </el-table-column>
+      <el-table-column prop="paymentCycle" :label="$t('aFeeDetailConfig.paymentCycle')"
+        align="center"></el-table-column>
+      <el-table-column prop="units" :label="$t('aFeeDetailConfig.unit')" align="center"></el-table-column>
+      <el-table-column prop="computingFormulaName" :label="$t('aFeeDetailConfig.formula')"
+        align="center"></el-table-column>
+      <el-table-column :label="$t('aFeeDetailConfig.unitPrice')" align="center">
+        <template #default="{ row }">{{ row.computingFormula === '2002' ? '-' : row.squarePrice }}</template>
+      </el-table-column>
+      <el-table-column prop="additionalAmount" :label="$t('aFeeDetailConfig.additionalFee')"
+        align="center"></el-table-column>
+      <el-table-column :label="$t('aFeeDetailConfig.accountDeduction')" align="center">
+        <template #default="{ row }">{{ row.deductFrom === 'Y' ? $t('aFeeDetailConfig.yes') :
+          $t('aFeeDetailConfig.no')}}</template>
+      </el-table-column>
+      <el-table-column :label="$t('aFeeDetailConfig.mobilePayment')" align="center">
+        <template #default="{ row }">{{ row.payOnline === 'Y' ? $t('aFeeDetailConfig.yes') :
+          $t('aFeeDetailConfig.no')}}</template>
+      </el-table-column>
+      <el-table-column prop="scale" :label="$t('aFeeDetailConfig.decimalPlaces')" align="center"></el-table-column>
+    </el-table>
+
+      <el-row class="margin-top">
+        <el-col :span="12"></el-col>
+        <el-col :span="12">
+          <el-pagination @current-change="handlePageChange" :current-page="currentPage" :page-size="pageSize"
+            layout="total, prev, pager, next, jumper" :total="total">
+          </el-pagination>
+        </el-col>
+      </el-row>
+  </div>
+</template>
+
+<script>
+import { queryAdminFeeConfigs } from '@/api/aCommunity/aFeeDetailConfigApi'
+
+export default {
+  name: 'AFeeDetailConfig',
+  data() {
+    return {
+      aFeeDetailConfigInfo: {
+        feeConfigs: [],
+        configId: ''
+      },
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(data) {
+      this.aFeeDetailConfigInfo.configId = data.configId
+      this._loadAFeeDetailConfigData()
+    },
+    handleSwitch(data) {
+      this.aFeeDetailConfigInfo.configId = data.configId
+      this._loadAFeeDetailConfigData()
+    },
+    handleNotify() {
+      this._loadAFeeDetailConfigData()
+    },
+    handlePageChange(page) {
+      this.currentPage = page
+      this._loadAFeeDetailConfigData()
+    },
+    async _loadAFeeDetailConfigData() {
+      try {
+        const params = {
+          configId: this.aFeeDetailConfigInfo.configId,
+          page: this.currentPage,
+          row: this.pageSize
+        }
+
+        const res = await queryAdminFeeConfigs(params)
+        this.aFeeDetailConfigInfo.feeConfigs = res.feeConfigs
+        this.total = res.records
+      } catch (error) {
+        console.error('加载费用配置数据失败:', error)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailConfigDemo.vue b/src/components/aCommunity/aFeeDetailConfigDemo.vue
new file mode 100644
index 0000000..cf375c2
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailConfigDemo.vue
@@ -0,0 +1,21 @@
+<template>
+  <a-fee-detail-config ref="feeConfigComponent" />
+</template>
+
+<script>
+import AFeeDetailConfig from './aFeeDetailConfig'
+
+export default {
+  components: {
+    AFeeDetailConfig
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeConfigComponent.handleSwitch(data)
+    },
+    refresh() {
+      this.$refs.feeConfigComponent.handleNotify()
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailDiscount.vue b/src/components/aCommunity/aFeeDetailDiscount.vue
new file mode 100644
index 0000000..5d4dd2b
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailDiscount.vue
@@ -0,0 +1,97 @@
+<template>
+  <div class="margin-top">
+    <el-table :data="aFeeDetailDiscountInfo.applyRoomDiscounts" border style="width: 100%">
+      <el-table-column prop="roomName" :label="$t('aFeeDetailDiscount.roomName')" align="center"></el-table-column>
+      <el-table-column prop="discountId" :label="$t('aFeeDetailDiscount.discountId')" align="center"></el-table-column>
+      <el-table-column prop="discountName" :label="$t('aFeeDetailDiscount.discountName')" align="center"></el-table-column>
+      <el-table-column prop="applyTypeName" :label="$t('aFeeDetailDiscount.applyType')" align="center"></el-table-column>
+      <el-table-column prop="createUserName" :label="$t('aFeeDetailDiscount.applicant')" align="center"></el-table-column>
+      <el-table-column prop="createUserTel" :label="$t('aFeeDetailDiscount.applicantPhone')" align="center"></el-table-column>
+      <el-table-column prop="startTime" :label="$t('aFeeDetailDiscount.startTime')" align="center"></el-table-column>
+      <el-table-column prop="endTime" :label="$t('aFeeDetailDiscount.endTime')" align="center"></el-table-column>
+      <el-table-column prop="stateName" :label="$t('aFeeDetailDiscount.status')" align="center"></el-table-column>
+      <el-table-column prop="createTime" :label="$t('aFeeDetailDiscount.createTime')" align="center"></el-table-column>
+      <el-table-column :label="$t('aFeeDetailDiscount.useStatus')" align="center">
+        <template #default="{row}">{{row.inUse === '0' ? $t('aFeeDetailDiscount.notUsed') : $t('aFeeDetailDiscount.used')}}</template>
+      </el-table-column>
+      <el-table-column :label="$t('aFeeDetailDiscount.returnType')" align="center">
+        <template #default="{row}">
+          <span v-if="row.discountId">
+            {{row.returnWay === '1002' ? $t('aFeeDetailDiscount.accountBalance') : $t('aFeeDetailDiscount.discount')}}
+          </span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('aFeeDetailDiscount.returnAmount')" align="center">
+        <template #default="{row}">{{row.returnAmount ? row.returnAmount : '-'}}</template>
+      </el-table-column>
+    </el-table>
+
+    <el-row class="margin-top">
+      <el-col :span="12"></el-col>
+      <el-col :span="12">
+        <el-pagination
+          @current-change="handlePageChange"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          layout="total, prev, pager, next, jumper"
+          :total="total">
+        </el-pagination>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { queryAdminApplyRoomDiscount } from '@/api/aCommunity/aFeeDetailDiscountApi'
+
+export default {
+  name: 'AFeeDetailDiscount',
+  data() {
+    return {
+      aFeeDetailDiscountInfo: {
+        applyRoomDiscounts: [],
+        feeId: ''
+      },
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(data) {
+      this.aFeeDetailDiscountInfo.feeId = data.feeId
+      this._loadAFeeDetailDiscountData()
+    },
+    handleSwitch(data) {
+      this.aFeeDetailDiscountInfo.feeId = data.feeId
+      this._loadAFeeDetailDiscountData()
+    },
+    handlePageChange(page) {
+      this.currentPage = page
+      this._loadAFeeDetailDiscountData()
+    },
+    async _loadAFeeDetailDiscountData() {
+      try {
+        const params = {
+          feeId: this.aFeeDetailDiscountInfo.feeId,
+          page: this.currentPage,
+          row: this.pageSize
+        }
+        
+        const res = await queryAdminApplyRoomDiscount(params)
+        this.aFeeDetailDiscountInfo.applyRoomDiscounts = res.data
+        this.total = res.records
+      } catch (error) {
+        console.error('加载费用折扣数据失败:', error)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailDiscountDemo.vue b/src/components/aCommunity/aFeeDetailDiscountDemo.vue
new file mode 100644
index 0000000..4700459
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailDiscountDemo.vue
@@ -0,0 +1,18 @@
+<template>
+  <a-fee-detail-discount ref="feeDiscountComponent" />
+</template>
+
+<script>
+import AFeeDetailDiscount from './aFeeDetailDiscount'
+
+export default {
+  components: {
+    AFeeDetailDiscount
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeDiscountComponent.handleSwitch(data)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailFeeObj.vue b/src/components/aCommunity/aFeeDetailFeeObj.vue
new file mode 100644
index 0000000..510ca39
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailFeeObj.vue
@@ -0,0 +1,114 @@
+<template>
+  <div>
+    <el-row class="margin-top">
+      <el-col :span="4">
+        <el-select v-model="aFeeDetailFeeObjInfo.payerObjType" class="w-100" :placeholder="$t('aFeeDetailFeeObj.selectFeeObj')">
+          <el-option :label="$t('aFeeDetailFeeObj.house')" value="3333"></el-option>
+          <el-option :label="$t('aFeeDetailFeeObj.car')" value="6666"></el-option>
+          <el-option :label="$t('aFeeDetailFeeObj.contract')" value="7777"></el-option>
+        </el-select>
+      </el-col>
+      <el-col :span="4" class="pl-10">
+        <el-button type="primary" size="small" @click="_qureyAFeeDetailFeeObj">
+          {{$t('aFeeDetailFeeObj.query')}}
+        </el-button>
+      </el-col>
+    </el-row>
+
+    <div class="margin-top">
+      <el-table :data="aFeeDetailFeeObjInfo.feeObjs" border style="width: 100%">
+        <el-table-column prop="feeId" :label="$t('aFeeDetailFeeObj.feeId')" align="center"></el-table-column>
+        <el-table-column :label="$t('aFeeDetailFeeObj.objType')" align="center">
+          <template #default="{row}">
+            <span v-if="row.payerObjType === '3333'">{{$t('aFeeDetailFeeObj.house')}}</span>
+            <span v-else-if="row.payerObjType === '6666'">{{$t('aFeeDetailFeeObj.car')}}</span>
+            <span v-else>{{$t('aFeeDetailFeeObj.contract')}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="payerObjName" :label="$t('aFeeDetailFeeObj.objName')" align="center"></el-table-column>
+        <el-table-column prop="ownerName" :label="$t('aFeeDetailFeeObj.ownerName')" align="center"></el-table-column>
+        <el-table-column prop="ownerTel" :label="$t('aFeeDetailFeeObj.phone')" align="center"></el-table-column>
+        <el-table-column prop="createTime" :label="$t('aFeeDetailFeeObj.createTime')" align="center"></el-table-column>
+      </el-table>
+
+      <el-row class="margin-top">
+        <el-col :span="12"></el-col>
+        <el-col :span="12">
+          <el-pagination
+            @current-change="handlePageChange"
+            :current-page="currentPage"
+            :page-size="pageSize"
+            layout="total, prev, pager, next, jumper"
+            :total="total">
+          </el-pagination>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { listAdminConfigFeeObjs } from '@/api/aCommunity/aFeeDetailFeeObjApi'
+
+export default {
+  name: 'AFeeDetailFeeObj',
+  data() {
+    return {
+      aFeeDetailFeeObjInfo: {
+        feeObjs: [],
+        configId: '',
+        payerObjType: ''
+      },
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(data) {
+      this.aFeeDetailFeeObjInfo.configId = data.configId
+      this._loadAFeeDetailFeeObjData()
+    },
+    handleSwitch(data) {
+      this.aFeeDetailFeeObjInfo.configId = data.configId
+      this._loadAFeeDetailFeeObjData()
+    },
+    handlePageChange(page) {
+      this.currentPage = page
+      this._loadAFeeDetailFeeObjData()
+    },
+    async _loadAFeeDetailFeeObjData() {
+      try {
+        const params = {
+          configId: this.aFeeDetailFeeObjInfo.configId,
+          payerObjType: this.aFeeDetailFeeObjInfo.payerObjType,
+          page: this.currentPage,
+          row: this.pageSize
+        }
+        
+        const res = await listAdminConfigFeeObjs(params)
+        this.aFeeDetailFeeObjInfo.feeObjs = res.data
+        this.total = res.records
+      } catch (error) {
+        console.error('加载费用对象数据失败:', error)
+      }
+    },
+    _qureyAFeeDetailFeeObj() {
+      this.currentPage = 1
+      this._loadAFeeDetailFeeObjData()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+.pl-10 {
+  padding-left: 10px;
+}
+.w-100 {
+  width: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailFeeObjDemo.vue b/src/components/aCommunity/aFeeDetailFeeObjDemo.vue
new file mode 100644
index 0000000..1b0c3d3
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailFeeObjDemo.vue
@@ -0,0 +1,18 @@
+<template>
+  <a-fee-detail-fee-obj ref="feeObjComponent" />
+</template>
+
+<script>
+import AFeeDetailFeeObj from './aFeeDetailFeeObj'
+
+export default {
+  components: {
+    AFeeDetailFeeObj
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeObjComponent.handleSwitch(data)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailHis.vue b/src/components/aCommunity/aFeeDetailHis.vue
new file mode 100644
index 0000000..158a500
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailHis.vue
@@ -0,0 +1,138 @@
+<template>
+  <div>
+    <el-row>
+      <el-col :span="24" class="text-right"></el-col>
+    </el-row>
+    <div class="margin-top">
+      <el-table :data="aFeeDetailHisInfo.fees" border style="width: 100%">
+        <el-table-column prop="feeName" :label="$t('aFeeDetailHis.feeName')" align="center">
+          <template #default="{ row }">
+            {{ row.feeName }}
+            <span v-if="row.payerObjName">({{ row.payerObjName }})</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="startTime" :label="$t('aFeeDetailHis.startTime')" align="center">
+          <template #default="{ row }">{{ row.startTime || '-' }}</template>
+        </el-table-column>
+        <el-table-column prop="endTime" :label="$t('aFeeDetailHis.endTime')" align="center">
+          <template #default="{ row }">{{ row.endTime || '-' }}</template>
+        </el-table-column>
+        <el-table-column :label="$t('aFeeDetailHis.operation')" align="center">
+          <template #default="{ row }">{{ _getFeeHisOperate(row) }}</template>
+        </el-table-column>
+        <el-table-column prop="userName" :label="$t('aFeeDetailHis.operator')" align="center">
+          <template #default="{ row }">{{ row.userName || '-' }}</template>
+        </el-table-column>
+        <el-table-column prop="createTime" :label="$t('aFeeDetailHis.operationTime')" align="center"></el-table-column>
+      </el-table>
+
+      <el-row class="margin-top">
+        <el-col :span="12"></el-col>
+        <el-col :span="12">
+          <el-pagination @current-change="handlePageChange" :current-page="currentPage" :page-size="pageSize"
+            layout="total, prev, pager, next, jumper" :total="total">
+          </el-pagination>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { queryAdminHisFee } from '@/api/aCommunity/aFeeDetailHisApi'
+
+export default {
+  name: 'AFeeDetailHis',
+  data() {
+    return {
+      aFeeDetailHisInfo: {
+        fees: [],
+        feeId: '',
+        staffNameLike: '',
+        feeNameLike: '',
+        payerObjName: '',
+        logStartTime: '',
+        logEndTime: ''
+      },
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(data) {
+      this.aFeeDetailHisInfo.feeId = data.feeId
+      this.aFeeDetailHisInfo.staffNameLike = data.staffNameLike
+      this.aFeeDetailHisInfo.feeNameLike = data.feeNameLike
+      this.aFeeDetailHisInfo.payerObjName = data.payerObjName
+      this.aFeeDetailHisInfo.logStartTime = data.logStartTime
+      this.aFeeDetailHisInfo.logEndTime = data.logEndTime
+      this._loadAFeeDetailHisData()
+    },
+    handleSwitch(data) {
+      this.aFeeDetailHisInfo.feeId = data.feeId
+      this.aFeeDetailHisInfo.staffNameLike = data.staffNameLike
+      this.aFeeDetailHisInfo.feeNameLike = data.feeNameLike
+      this.aFeeDetailHisInfo.payerObjName = data.payerObjName
+      this.aFeeDetailHisInfo.logStartTime = data.logStartTime
+      this.aFeeDetailHisInfo.logEndTime = data.logEndTime
+      this._loadAFeeDetailHisData()
+    },
+    handleNotify() {
+      this._loadAFeeDetailHisData()
+    },
+    handlePageChange(page) {
+      this.currentPage = page
+      this._loadAFeeDetailHisData()
+    },
+    async _loadAFeeDetailHisData() {
+      try {
+        const params = {
+          feeId: this.aFeeDetailHisInfo.feeId,
+          staffNameLike: this.aFeeDetailHisInfo.staffNameLike,
+          feeNameLike: this.aFeeDetailHisInfo.feeNameLike,
+          payerObjName: this.aFeeDetailHisInfo.payerObjName,
+          logStartTime: this.aFeeDetailHisInfo.logStartTime,
+          logEndTime: this.aFeeDetailHisInfo.logEndTime,
+          page: this.currentPage,
+          row: this.pageSize
+        }
+
+        const res = await queryAdminHisFee(params)
+        this.aFeeDetailHisInfo.fees = res.data
+        this.total = res.records
+      } catch (error) {
+        console.error('加载费用历史数据失败:', error)
+      }
+    },
+    _getFeeHisOperate(fee) {
+      let feeCount = 0
+      this.aFeeDetailHisInfo.fees.forEach(item => {
+        if (fee.bId === item.bId) {
+          feeCount += 1
+        }
+      })
+
+      if (feeCount <= 1) {
+        if (fee.operate === 'ADD') return this.$t('aFeeDetailHis.add')
+        if (fee.operate === 'DEL') return this.$t('aFeeDetailHis.delete')
+        return '-'
+      }
+
+      if (fee.operate === 'ADD') return this.$t('aFeeDetailHis.modifyNew')
+      if (fee.operate === 'DEL') return this.$t('aFeeDetailHis.modifyOld')
+      return '-'
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+
+.text-right {
+  text-align: right;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailHisDemo.vue b/src/components/aCommunity/aFeeDetailHisDemo.vue
new file mode 100644
index 0000000..1fd1b81
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailHisDemo.vue
@@ -0,0 +1,21 @@
+<template>
+  <a-fee-detail-his ref="feeHisComponent" />
+</template>
+
+<script>
+import AFeeDetailHis from './aFeeDetailHis'
+
+export default {
+  components: {
+    AFeeDetailHis
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeHisComponent.handleSwitch(data)
+    },
+    refresh() {
+      this.$refs.feeHisComponent.handleNotify()
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailImport.vue b/src/components/aCommunity/aFeeDetailImport.vue
new file mode 100644
index 0000000..ef009c8
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailImport.vue
@@ -0,0 +1,88 @@
+<template>
+  <div class="margin-top">
+    <el-table :data="aFeeDetailImportInfo.importFeeDetails" border style="width: 100%">
+      <el-table-column prop="floorNum" :label="$t('aFeeDetailImport.floorNum')" align="center"></el-table-column>
+      <el-table-column prop="unitNum" :label="$t('aFeeDetailImport.unitNum')" align="center"></el-table-column>
+      <el-table-column prop="roomNum" :label="$t('aFeeDetailImport.roomNum')" align="center"></el-table-column>
+      <el-table-column prop="feeName" :label="$t('aFeeDetailImport.feeName')" align="center"></el-table-column>
+      <el-table-column prop="startTime" :label="$t('aFeeDetailImport.startTime')" align="center"></el-table-column>
+      <el-table-column prop="endTime" :label="$t('aFeeDetailImport.endTime')" align="center"></el-table-column>
+      <el-table-column prop="amount" :label="$t('aFeeDetailImport.totalAmount')" align="center"></el-table-column>
+      <el-table-column prop="remark" :label="$t('aFeeDetailImport.remark')" align="center"></el-table-column>
+      <el-table-column :label="$t('aFeeDetailImport.status')" align="center">
+        <template #default="{row}">
+          <el-tag :type="row.state === '1000' ? 'success' : 'danger'">
+            {{row.state === '1000' ? $t('aFeeDetailImport.importSuccess') : $t('aFeeDetailImport.importFailed')}}
+          </el-tag>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-row class="margin-top">
+      <el-col :span="12"></el-col>
+      <el-col :span="12">
+        <el-pagination
+          @current-change="handlePageChange"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          layout="total, prev, pager, next, jumper"
+          :total="total">
+        </el-pagination>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { queryAdminImportFeeDetail } from '@/api/aCommunity/aFeeDetailImportApi'
+
+export default {
+  name: 'AFeeDetailImport',
+  data() {
+    return {
+      aFeeDetailImportInfo: {
+        importFeeDetails: [],
+        feeId: ''
+      },
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(data) {
+      this.aFeeDetailImportInfo.feeId = data.feeId
+      this._loadAFeeDetailImportData()
+    },
+    handleSwitch(data) {
+      this.aFeeDetailImportInfo.feeId = data.feeId
+      this._loadAFeeDetailImportData()
+    },
+    handlePageChange(page) {
+      this.currentPage = page
+      this._loadAFeeDetailImportData()
+    },
+    async _loadAFeeDetailImportData() {
+      try {
+        const params = {
+          feeId: this.aFeeDetailImportInfo.feeId,
+          page: this.currentPage,
+          row: this.pageSize
+        }
+        
+        const res = await queryAdminImportFeeDetail(params)
+        this.aFeeDetailImportInfo.importFeeDetails = res.data
+        this.total = res.records
+      } catch (error) {
+        console.error('加载导入费用明细数据失败:', error)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailImportDemo.vue b/src/components/aCommunity/aFeeDetailImportDemo.vue
new file mode 100644
index 0000000..bdf7696
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailImportDemo.vue
@@ -0,0 +1,18 @@
+<template>
+  <a-fee-detail-import ref="feeImportComponent" />
+</template>
+
+<script>
+import AFeeDetailImport from './aFeeDetailImport'
+
+export default {
+  components: {
+    AFeeDetailImport
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeImportComponent.handleSwitch(data)
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailSub.vue b/src/components/aCommunity/aFeeDetailSub.vue
new file mode 100644
index 0000000..be28652
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailSub.vue
@@ -0,0 +1,144 @@
+<template>
+  <div>
+    <el-row>
+      <el-col :span="24" class="text-right">
+      </el-col>
+    </el-row>
+    <el-table :data="aFeeDetailSubInfo.subs" border style="width: 100%" class="margin-top">
+      <el-table-column prop="preFeeId" :label="$t('aFeeDetailSub.parentFeeId')" align="center">
+        <template slot-scope="scope">
+          <router-link :to="{ path: '/pages/fee/adminFeeDetail', query: { feeId: scope.row.preFeeId } }"
+            target="_blank">
+            {{ scope.row.preFeeId }}
+          </router-link>
+        </template>
+      </el-table-column>
+      <el-table-column prop="feeId" :label="$t('aFeeDetailSub.childFeeId')" align="center">
+        <template slot-scope="scope">
+          <router-link :to="{ path: '/pages/fee/adminFeeDetail', query: { feeId: scope.row.feeId } }" target="_blank">
+            {{ scope.row.feeId }}
+          </router-link>
+        </template>
+      </el-table-column>
+      <el-table-column prop="feeName" :label="$t('aFeeDetailSub.feeName')" align="center" />
+      <el-table-column prop="payerObjName" :label="$t('aFeeDetailSub.feeObject')" align="center" />
+      <el-table-column :label="$t('aFeeDetailSub.billingPeriod')" align="center">
+        <template slot-scope="scope">
+          {{ $dateFormat(scope.row.endTime) }}<br>
+          ~{{ $dateFormat(scope.row.maxTime) }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="createTime" :label="$t('aFeeDetailSub.splitTime')" align="center" />
+    </el-table>
+    <el-row>
+      <el-col :span="24" class="float-right">
+        <el-pagination :current-page="currentPage" :page-size="pageSize" :total="aFeeDetailSubInfo.total"
+          layout="total, prev, pager, next" @current-change="handlePageChange" />
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { listAdminPayFeeSub, listAdminFee } from '@/api/aCommunity/aFeeDetailSubApi'
+import { getCommunityId } from '@/api/community/communityApi'
+
+export default {
+  name: 'AFeeDetailSub',
+  data() {
+    return {
+      aFeeDetailSubInfo: {
+        subs: [],
+        feeId: '',
+        total: 0,
+        records: 0,
+        fee: {}
+      },
+      currentPage: 1,
+      pageSize: 10,
+      communityId: ''
+    }
+  },
+  created() {
+    this.communityId = getCommunityId()
+    this.initEvents()
+  },
+  methods: {
+    open(data) {
+      if (!data.feeId) return
+      Object.assign(this.aFeeDetailSubInfo, data)
+      this.listAFeeDetailSub(1, this.pageSize)
+      this.loadAFeeDetailSubFeeInfo()
+    },
+    initEvents() {
+      this.$on('switch', this.handleSwitch)
+      this.$on('loadSub', this.handleLoadSub)
+    },
+    handleSwitch(param) {
+      if (!param.feeId) return
+      Object.assign(this.aFeeDetailSubInfo, param)
+      this.listAFeeDetailSub(1, this.pageSize)
+      this.loadAFeeDetailSubFeeInfo()
+    },
+    handleLoadSub() {
+      this.listAFeeDetailSub(this.currentPage, this.pageSize)
+      this.loadAFeeDetailSubFeeInfo()
+    },
+    handlePageChange(currentPage) {
+      this.currentPage = currentPage
+      this.listAFeeDetailSub(currentPage, this.pageSize)
+    },
+    async listAFeeDetailSub(page, rows) {
+      try {
+        const params = {
+          page,
+          row: rows,
+          pcFeeId: this.aFeeDetailSubInfo.feeId,
+          communityId: this.communityId
+        }
+        const res = await listAdminPayFeeSub(params)
+        this.aFeeDetailSubInfo.total = res.total
+        this.aFeeDetailSubInfo.records = res.records
+        this.aFeeDetailSubInfo.subs = res.data
+      } catch (error) {
+        console.error('获取子费用列表失败:', error)
+      }
+    },
+    async loadAFeeDetailSubFeeInfo() {
+      try {
+        const params = {
+          page: 1,
+          row: 1,
+          feeId: this.aFeeDetailSubInfo.feeId,
+          communityId: this.communityId
+        }
+        const res = await listAdminFee(params)
+        this.aFeeDetailSubInfo.fee = res.fees[0]
+      } catch (error) {
+        console.error('获取费用信息失败:', error)
+      }
+    },
+    mergeFee(fee) {
+      this.$emit('openMergeFeeModal', fee)
+    },
+    splitPayFee(fee) {
+      console.log(fee)
+      this.$emit('openSplitFeeModal', this.aFeeDetailSubInfo.fee)
+    }
+  }
+}
+</script>
+
+<style scoped>
+.margin-top {
+  margin-top: 20px;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.float-right {
+  float: right;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/aCommunity/aFeeDetailSubDemo.vue b/src/components/aCommunity/aFeeDetailSubDemo.vue
new file mode 100644
index 0000000..35af477
--- /dev/null
+++ b/src/components/aCommunity/aFeeDetailSubDemo.vue
@@ -0,0 +1,21 @@
+<template>
+  <a-fee-detail-sub ref="feeSubComponent" />
+</template>
+
+<script>
+import AFeeDetailSub from './aFeeDetailSub'
+
+export default {
+  components: {
+    AFeeDetailSub
+  },
+  methods: {
+    open(data) {
+      this.$refs.feeSubComponent.handleSwitch(data)
+    },
+    refresh() {
+      this.$refs.feeSubComponent.handleLoadSub()
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/fee/aRoomDetailMeterWaterLog.vue b/src/components/fee/aRoomDetailMeterWaterLog.vue
index dbee0c0..f14a657 100644
--- a/src/components/fee/aRoomDetailMeterWaterLog.vue
+++ b/src/components/fee/aRoomDetailMeterWaterLog.vue
@@ -47,7 +47,9 @@ export default {
     }
   },
   methods: {
-    open() {
+    open(params) {
+      this.roomId = params.roomId
+      this.feeId = params.feeId
       this.page.current = 1
       this.loadData()
     },
diff --git a/src/components/fee/aRoomDetailOwner.vue b/src/components/fee/aRoomDetailOwner.vue
index 96182a1..f3a2802 100644
--- a/src/components/fee/aRoomDetailOwner.vue
+++ b/src/components/fee/aRoomDetailOwner.vue
@@ -63,7 +63,8 @@ export default {
     }
   },
   methods: {
-    open() {
+    open(params) {
+      this.roomId = params.roomId
       this.loadData()
     },
     async loadData() {
diff --git a/src/components/index/index-admin.vue b/src/components/index/index-admin.vue
index 4c9e44c..f9e43b5 100644
--- a/src/components/index/index-admin.vue
+++ b/src/components/index/index-admin.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div class="admin-index-container">
         <div class="vc-index-nav">
             <span><i class="fa fa-home margin-right-sm"></i>{{ $t('adminIndex.home') }}</span>
             <span class="margin-left-sm margin-right-sm">/</span>
@@ -150,6 +150,10 @@ export default {
 </script>
   
 <style lang="scss" scoped>
+.admin-index-container {
+  padding: 0 10px; // 添加左右内边距
+}
+
 .vc-index-nav {
     padding: 10px;
     font-size: 16px;
diff --git a/src/i18n/communityI18n.js b/src/i18n/communityI18n.js
index 3ae49b9..4cf4eed 100644
--- a/src/i18n/communityI18n.js
+++ b/src/i18n/communityI18n.js
@@ -10,6 +10,7 @@ import { messages as ownerExitRoomMessages } from '../views/room/ownerExitRoomLa
 import { messages as adminRoomDetailMessages } from '../views/aCommunity/adminRoomDetailLang.js'
 import { messages as adminOwnerDetailMessages } from '../views/aCommunity/adminOwnerDetailLang.js'
 import { messages as adminCarDetailMessages } from '../views/aCommunity/adminCarDetailLang.js'
+import { messages as adminFeeDetailMessages } from '../views/aCommunity/adminFeeDetailLang.js'
 export const messages = {
     en: {
         ...roomStructureMessages.en,
@@ -24,6 +25,7 @@ export const messages = {
         ...adminRoomDetailMessages.en,
         ...adminOwnerDetailMessages.en,
         ...adminCarDetailMessages.en,
+        ...adminFeeDetailMessages.en,
     },
     zh: {
         ...roomStructureMessages.zh,
@@ -38,5 +40,6 @@ export const messages = {
         ...adminRoomDetailMessages.zh,
         ...adminOwnerDetailMessages.zh,
         ...adminCarDetailMessages.zh,
+        ...adminFeeDetailMessages.zh,
     }
 }
\ No newline at end of file
diff --git a/src/router/communityRouter.js b/src/router/communityRouter.js
index fec4996..3a69a96 100644
--- a/src/router/communityRouter.js
+++ b/src/router/communityRouter.js
@@ -59,4 +59,9 @@ export default [
         name: '/pages/car/adminCarDetail',
         component: () => import('@/views/aCommunity/adminCarDetailList.vue')
     },
+    {
+        path:'/pages/fee/adminFeeDetail',
+        name:'/pages/fee/adminFeeDetail',
+        component: () => import('@/views/aCommunity/adminFeeDetailList.vue')
+        },
 ]
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailConfigLang.js b/src/views/aCommunity/aFeeDetailConfigLang.js
new file mode 100644
index 0000000..d4ef4b3
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailConfigLang.js
@@ -0,0 +1,44 @@
+export const messages = {
+  en: {
+    aFeeDetailConfig: {
+      feeType: 'Fee Type',
+      feeItem: 'Fee Item',
+      feeFlag: 'Fee Flag',
+      billType: 'Bill Type',
+      paymentType: 'Payment Type',
+      prepay: 'Prepay',
+      postpay: 'Postpay',
+      paymentCycle: 'Payment Cycle',
+      unit: 'Unit',
+      formula: 'Formula',
+      unitPrice: 'Unit Price',
+      additionalFee: 'Additional Fee',
+      accountDeduction: 'Account Deduction',
+      mobilePayment: 'Mobile Payment',
+      decimalPlaces: 'Decimal Places',
+      yes: 'Yes',
+      no: 'No'
+    }
+  },
+  zh: {
+    aFeeDetailConfig: {
+      feeType: '费用类型',
+      feeItem: '收费项目',
+      feeFlag: '费用标识',
+      billType: '催缴类型',
+      paymentType: '付费类型',
+      prepay: '预付费',
+      postpay: '后付费',
+      paymentCycle: '缴费周期',
+      unit: '单位',
+      formula: '公式',
+      unitPrice: '计费单价',
+      additionalFee: '附加/固定费用',
+      accountDeduction: '账户抵扣',
+      mobilePayment: '手机缴费',
+      decimalPlaces: '保留小数位',
+      yes: '是',
+      no: '否'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailDiscountLang.js b/src/views/aCommunity/aFeeDetailDiscountLang.js
new file mode 100644
index 0000000..2d1d8d0
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailDiscountLang.js
@@ -0,0 +1,44 @@
+export const messages = {
+  en: {
+    aFeeDetailDiscount: {
+      roomName: 'Room(Building-Unit-Room)',
+      discountId: 'Discount ID',
+      discountName: 'Discount Name',
+      applyType: 'Apply Type',
+      applicant: 'Applicant',
+      applicantPhone: 'Applicant Phone',
+      startTime: 'Start Time',
+      endTime: 'End Time',
+      status: 'Status',
+      createTime: 'Create Time',
+      useStatus: 'Use Status',
+      notUsed: 'Not Used',
+      used: 'Used',
+      returnType: 'Return Type',
+      accountBalance: 'Account Balance',
+      discount: 'Discount',
+      returnAmount: 'Return Amount'
+    }
+  },
+  zh: {
+    aFeeDetailDiscount: {
+      roomName: '房屋(楼栋-单元-房屋)',
+      discountId: '折扣ID',
+      discountName: '折扣名称',
+      applyType: '申请类型',
+      applicant: '申请人',
+      applicantPhone: '申请电话',
+      startTime: '开始时间',
+      endTime: '结束时间',
+      status: '状态',
+      createTime: '创建时间',
+      useStatus: '使用状态',
+      notUsed: '未使用',
+      used: '已使用',
+      returnType: '返还类型',
+      accountBalance: '账户余额',
+      discount: '折扣',
+      returnAmount: '返还金额'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailFeeObjLang.js b/src/views/aCommunity/aFeeDetailFeeObjLang.js
new file mode 100644
index 0000000..8c490f4
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailFeeObjLang.js
@@ -0,0 +1,32 @@
+export const messages = {
+  en: {
+    aFeeDetailFeeObj: {
+      selectFeeObj: 'Please select fee object',
+      house: 'House',
+      car: 'Car',
+      contract: 'Contract',
+      feeId: 'Fee ID',
+      objType: 'Object Type',
+      objName: 'Object Name',
+      ownerName: 'Owner Name',
+      phone: 'Phone',
+      createTime: 'Create Time',
+      query: 'Query'
+    }
+  },
+  zh: {
+    aFeeDetailFeeObj: {
+      selectFeeObj: '请选择费用对象',
+      house: '房屋',
+      car: '车辆',
+      contract: '合同',
+      feeId: '费用编号',
+      objType: '对象类型',
+      objName: '对象名称',
+      ownerName: '业主名称',
+      phone: '手机号',
+      createTime: '创建时间',
+      query: '查询'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailHisLang.js b/src/views/aCommunity/aFeeDetailHisLang.js
new file mode 100644
index 0000000..c5a43fe
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailHisLang.js
@@ -0,0 +1,30 @@
+export const messages = {
+  en: {
+    aFeeDetailHis: {
+      feeName: 'Fee Item',
+      startTime: 'Account Time',
+      endTime: 'Billing Start Time',
+      operation: 'Action',
+      operator: 'Operator',
+      operationTime: 'Operation Time',
+      add: 'Add',
+      delete: 'Delete',
+      modifyNew: 'Modify(New)',
+      modifyOld: 'Modify(Old)'
+    }
+  },
+  zh: {
+    aFeeDetailHis: {
+      feeName: '费用项',
+      startTime: '建账时间',
+      endTime: '计费起始时间',
+      operation: '动作',
+      operator: '操作人',
+      operationTime: '操作时间',
+      add: '添加',
+      delete: '删除',
+      modifyNew: '修改(新)',
+      modifyOld: '修改(旧)'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailImportLang.js b/src/views/aCommunity/aFeeDetailImportLang.js
new file mode 100644
index 0000000..6b07243
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailImportLang.js
@@ -0,0 +1,32 @@
+export const messages = {
+  en: {
+    aFeeDetailImport: {
+      floorNum: 'Building Number',
+      unitNum: 'Unit Number',
+      roomNum: 'Room Number',
+      feeName: 'Fee Name',
+      startTime: 'Start Time',
+      endTime: 'End Time',
+      totalAmount: 'Total Amount',
+      remark: 'Remark',
+      status: 'Status',
+      importSuccess: 'Import Success',
+      importFailed: 'Import Failed'
+    }
+  },
+  zh: {
+    aFeeDetailImport: {
+      floorNum: '楼栋编号',
+      unitNum: '单元编号',
+      roomNum: '房屋编号',
+      feeName: '费用名称',
+      startTime: '开始时间',
+      endTime: '结束时间',
+      totalAmount: '总金额',
+      remark: '备注',
+      status: '状态',
+      importSuccess: '导入成功',
+      importFailed: '导入失败'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/aFeeDetailSubLang.js b/src/views/aCommunity/aFeeDetailSubLang.js
new file mode 100644
index 0000000..7546c52
--- /dev/null
+++ b/src/views/aCommunity/aFeeDetailSubLang.js
@@ -0,0 +1,22 @@
+export const messages = {
+  en: {
+    aFeeDetailSub: {
+      parentFeeId: 'Parent Fee ID',
+      childFeeId: 'Child Fee ID',
+      feeName: 'Fee Name',
+      feeObject: 'Fee Object',
+      billingPeriod: 'Billing Period',
+      splitTime: 'Split Time'
+    }
+  },
+  zh: {
+    aFeeDetailSub: {
+      parentFeeId: '父费用ID',
+      childFeeId: '子费用ID',
+      feeName: '费用名称',
+      feeObject: '费用对象',
+      billingPeriod: '计费时间段',
+      splitTime: '拆分时间'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/adminFeeDetailLang.js b/src/views/aCommunity/adminFeeDetailLang.js
new file mode 100644
index 0000000..a75f586
--- /dev/null
+++ b/src/views/aCommunity/adminFeeDetailLang.js
@@ -0,0 +1,257 @@
+
+export const messages = {
+  en: {
+    adminFeeDetail: {
+      feeInfo: 'Fee Information',
+      paymentRecord: 'Payment Record',
+      relatedRoom: 'Related Room',
+      relatedCar: 'Related Car',
+      relatedContract: 'Related Contract',
+      modifyRecord: 'Modify Record',
+      feeItem: 'Fee Item',
+      owner: 'Owner',
+      sameFeeObj: 'Same Fee Object',
+      relatedMeter: 'Related Meter',
+      relatedImport: 'Related Import',
+      discountApply: 'Discount Application',
+      reprintReceipt: 'Reprint Receipt',
+      feeSplit: 'Fee Split'
+    },
+    adminFeeDetailInfo: {
+      feeId: 'Fee ID',
+      feeFlag: 'Fee Flag',
+      feeType: 'Fee Type',
+      payerObj: 'Payer Object',
+      feeItem: 'Fee Item',
+      feeState: 'Fee State',
+      createTime: 'Create Time',
+      batchId: 'Batch ID',
+      startTime: 'Start Time',
+      endTime: 'End Time',
+      owedAmount: 'Owed Amount'
+    },
+    aRoomDetailCar: {
+      placeholderCarNum: 'Please enter license plate number',
+      carNum: 'License Plate',
+      leaseType: 'Plate Type',
+      tempCar: 'Temporary Car',
+      carType: 'Vehicle Type',
+      color: 'Color',
+      owner: 'Owner',
+      parkingSpace: 'Parking Space',
+      released: 'Released',
+      validity: 'Validity'
+    },
+    aFeeDetailHis: {
+      feeName: 'Fee Item',
+      startTime: 'Account Time',
+      endTime: 'Billing Start Time',
+      operation: 'Action',
+      operator: 'Operator',
+      operationTime: 'Operation Time',
+      add: 'Add',
+      delete: 'Delete',
+      modifyNew: 'Modify(New)',
+      modifyOld: 'Modify(Old)'
+    },
+    aFeeDetailConfig: {
+      feeType: 'Fee Type',
+      feeItem: 'Fee Item',
+      feeFlag: 'Fee Flag',
+      billType: 'Bill Type',
+      paymentType: 'Payment Type',
+      prepay: 'Prepay',
+      postpay: 'Postpay',
+      paymentCycle: 'Payment Cycle',
+      unit: 'Unit',
+      formula: 'Formula',
+      unitPrice: 'Unit Price',
+      additionalFee: 'Additional Fee',
+      accountDeduction: 'Account Deduction',
+      mobilePayment: 'Mobile Payment',
+      decimalPlaces: 'Decimal Places',
+      yes: 'Yes',
+      no: 'No'
+    },
+    aFeeDetailFeeObj: {
+      selectFeeObj: 'Please select fee object',
+      house: 'House',
+      car: 'Car',
+      contract: 'Contract',
+      feeId: 'Fee ID',
+      objType: 'Object Type',
+      objName: 'Object Name',
+      ownerName: 'Owner Name',
+      phone: 'Phone',
+      createTime: 'Create Time',
+      query: 'Query'
+    },
+    aFeeDetailImport: {
+      floorNum: 'Building Number',
+      unitNum: 'Unit Number',
+      roomNum: 'Room Number',
+      feeName: 'Fee Name',
+      startTime: 'Start Time',
+      endTime: 'End Time',
+      totalAmount: 'Total Amount',
+      remark: 'Remark',
+      status: 'Status',
+      importSuccess: 'Import Success',
+      importFailed: 'Import Failed'
+    },
+    aFeeDetailDiscount: {
+      roomName: 'Room(Building-Unit-Room)',
+      discountId: 'Discount ID',
+      discountName: 'Discount Name',
+      applyType: 'Apply Type',
+      applicant: 'Applicant',
+      applicantPhone: 'Applicant Phone',
+      startTime: 'Start Time',
+      endTime: 'End Time',
+      status: 'Status',
+      createTime: 'Create Time',
+      useStatus: 'Use Status',
+      notUsed: 'Not Used',
+      used: 'Used',
+      returnType: 'Return Type',
+      accountBalance: 'Account Balance',
+      discount: 'Discount',
+      returnAmount: 'Return Amount'
+    },
+    aFeeDetailSub: {
+      parentFeeId: 'Parent Fee ID',
+      childFeeId: 'Child Fee ID',
+      feeName: 'Fee Name',
+      feeObject: 'Fee Object',
+      billingPeriod: 'Billing Period',
+      splitTime: 'Split Time'
+    }
+  },
+  zh: {
+    adminFeeDetail: {
+      feeInfo: '费用信息',
+      paymentRecord: '缴费记录',
+      relatedRoom: '关联房屋',
+      relatedCar: '关联车辆',
+      relatedContract: '关联合同',
+      modifyRecord: '修改记录',
+      feeItem: '费用项',
+      owner: '业主',
+      sameFeeObj: '同费用对象',
+      relatedMeter: '关联抄表',
+      relatedImport: '关联导入',
+      discountApply: '优惠申请',
+      reprintReceipt: '补打收据',
+      feeSplit: '费用拆分'
+    },
+    adminFeeDetailInfo: {
+      feeId: '费用ID',
+      feeFlag: '费用标识',
+      feeType: '费用类型',
+      payerObj: '付费对象',
+      feeItem: '费用项',
+      feeState: '费用状态',
+      createTime: '建账时间',
+      batchId: '批次',
+      startTime: '应收开始时间',
+      endTime: '应收结束时间',
+      owedAmount: '欠费金额'
+    },
+    aRoomDetailCar: {
+      placeholderCarNum: '请填写车牌号',
+      carNum: '车牌号',
+      leaseType: '车牌类型',
+      tempCar: '临时车',
+      carType: '车辆类型',
+      color: '颜色',
+      owner: '业主',
+      parkingSpace: '车位',
+      released: '车位已释放',
+      validity: '有效期'
+    },
+    aFeeDetailHis: {
+      feeName: '费用项',
+      startTime: '建账时间',
+      endTime: '计费起始时间',
+      operation: '动作',
+      operator: '操作人',
+      operationTime: '操作时间',
+      add: '添加',
+      delete: '删除',
+      modifyNew: '修改(新)',
+      modifyOld: '修改(旧)'
+    },
+    aFeeDetailConfig: {
+      feeType: '费用类型',
+      feeItem: '收费项目',
+      feeFlag: '费用标识',
+      billType: '催缴类型',
+      paymentType: '付费类型',
+      prepay: '预付费',
+      postpay: '后付费',
+      paymentCycle: '缴费周期',
+      unit: '单位',
+      formula: '公式',
+      unitPrice: '计费单价',
+      additionalFee: '附加/固定费用',
+      accountDeduction: '账户抵扣',
+      mobilePayment: '手机缴费',
+      decimalPlaces: '保留小数位',
+      yes: '是',
+      no: '否'
+    },
+    aFeeDetailFeeObj: {
+      selectFeeObj: '请选择费用对象',
+      house: '房屋',
+      car: '车辆',
+      contract: '合同',
+      feeId: '费用编号',
+      objType: '对象类型',
+      objName: '对象名称',
+      ownerName: '业主名称',
+      phone: '手机号',
+      createTime: '创建时间',
+      query: '查询'
+    },
+    aFeeDetailImport: {
+      floorNum: '楼栋编号',
+      unitNum: '单元编号',
+      roomNum: '房屋编号',
+      feeName: '费用名称',
+      startTime: '开始时间',
+      endTime: '结束时间',
+      totalAmount: '总金额',
+      remark: '备注',
+      status: '状态',
+      importSuccess: '导入成功',
+      importFailed: '导入失败'
+    },
+    aFeeDetailDiscount: {
+      roomName: '房屋(楼栋-单元-房屋)',
+      discountId: '折扣ID',
+      discountName: '折扣名称',
+      applyType: '申请类型',
+      applicant: '申请人',
+      applicantPhone: '申请电话',
+      startTime: '开始时间',
+      endTime: '结束时间',
+      status: '状态',
+      createTime: '创建时间',
+      useStatus: '使用状态',
+      notUsed: '未使用',
+      used: '已使用',
+      returnType: '返还类型',
+      accountBalance: '账户余额',
+      discount: '折扣',
+      returnAmount: '返还金额'
+    },
+    aFeeDetailSub: {
+      parentFeeId: '父费用ID',
+      childFeeId: '子费用ID',
+      feeName: '费用名称',
+      feeObject: '费用对象',
+      billingPeriod: '计费时间段',
+      splitTime: '拆分时间'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/aCommunity/adminFeeDetailList.vue b/src/views/aCommunity/adminFeeDetailList.vue
new file mode 100644
index 0000000..3eb3571
--- /dev/null
+++ b/src/views/aCommunity/adminFeeDetailList.vue
@@ -0,0 +1,356 @@
+<template>
+  <div class="admin-fee-detail-container">
+    <div class="white-bg padding-left padding-right padding-top border-radius-top">
+      <div class="flex justify-between">
+        <div class="text-title">
+          {{ $t('adminFeeDetail.feeInfo') }}
+        </div>
+      </div>
+
+      <!-- 费用信息 -->
+      <div class="margin-top">
+        <el-row :gutter="20">
+          <el-col :span="24">
+            <el-row :gutter="20">
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.feeId') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.feeId }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.feeFlag') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.feeFlagName || '-' }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.feeType') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.feeTypeCdName }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.payerObj') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.payerObjName || '-' }}</label>
+                </div>
+              </el-col>
+            </el-row>
+
+            <el-row :gutter="20">
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.feeItem') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.feeName }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.feeState') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.stateName }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.createTime') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.startTime }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.batchId') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.batchId }}</label>
+                </div>
+              </el-col>
+            </el-row>
+
+            <el-row :gutter="20">
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.startTime') }}:
+                  </label>
+                  <label>{{ getEndTime(adminFeeDetailInfo) }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.endTime') }}:
+                  </label>
+                  <label>{{ getDeadlineTime(adminFeeDetailInfo) }}</label>
+                </div>
+              </el-col>
+              <el-col :span="6">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ $t('adminFeeDetailInfo.owedAmount') }}:
+                  </label>
+                  <label>{{ adminFeeDetailInfo.amountOwed }}</label>
+                </div>
+              </el-col>
+            </el-row>
+
+            <el-row :gutter="20">
+              <el-col :span="6" v-for="(item, index) in adminFeeDetailInfo.attrs" :key="index">
+                <div class="form-group">
+                  <label class="col-form-label">
+                    {{ item.specCdName }}:
+                  </label>
+                  <label>{{ item.value }}</label>
+                </div>
+              </el-col>
+            </el-row>
+          </el-col>
+        </el-row>
+      </div>
+
+      <divider />
+      <div class="margin-top-sm">
+        <el-tabs v-model="adminFeeDetailInfo._currentTab" @tab-click="changeTab(adminFeeDetailInfo._currentTab)">
+          <el-tab-pane :label="$t('adminFeeDetail.paymentRecord')" name="aRoomDetailHisFee"></el-tab-pane>
+          <el-tab-pane v-if="adminFeeDetailInfo.payerObjType == '3333'" :label="$t('adminFeeDetail.relatedRoom')"
+            name="aRoomDetailRoom">
+          </el-tab-pane>
+          <el-tab-pane v-if="adminFeeDetailInfo.payerObjType == '6666'" :label="$t('adminFeeDetail.relatedCar')"
+            name="aRoomDetailCar">
+          </el-tab-pane>
+          <el-tab-pane v-if="adminFeeDetailInfo.payerObjType == '7777'" :label="$t('adminFeeDetail.relatedContract')"
+            name="adminFeeDetailContract">
+          </el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.modifyRecord')" name="aFeeDetailHis"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.feeItem')" name="aFeeDetailConfig"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.owner')" name="aRoomDetailOwner"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.sameFeeObj')" name="aFeeDetailFeeObj"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.relatedMeter')" name="aRoomDetailMeterWaterLog"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.relatedImport')" name="aFeeDetailImport"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.discountApply')" name="aFeeDetailDiscount"></el-tab-pane>
+          <el-tab-pane :label="$t('adminFeeDetail.reprintReceipt')" name="aRoomDetailReceipt"></el-tab-pane>
+          <el-tab-pane v-if="adminFeeDetailInfo.feeFlag != '2006012'" :label="$t('adminFeeDetail.feeSplit')"
+            name="aFeeDetailSub">
+          </el-tab-pane>
+        </el-tabs>
+      </div>
+    </div>
+
+    <div class="white-bg padding-left padding-right padding-top border-radius-bottom">
+      <component :is="adminFeeDetailInfo._currentTab" :ref="adminFeeDetailInfo._currentTab"
+        @refresh="loadAdminFeeDetailInfo">
+      </component>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getFeeDetail } from '@/api/aCommunity/adminFeeDetailApi'
+import { getCommunityId } from '@/api/community/communityApi'
+//import { getDict } from '@/api/community/communityApi'
+
+// 导入所有子组件
+import ARoomDetailHisFee from '@/components/fee/aRoomDetailHisFee.vue'
+import ARoomDetailRoom from '@/components/fee/aRoomDetailRoom.vue'
+import ARoomDetailCar from '@/components/aCommunity/aRoomDetailCar.vue'
+import AFeeDetailHis from '@/components/aCommunity/aFeeDetailHis.vue'
+import AFeeDetailConfig from '@/components/aCommunity/aFeeDetailConfig.vue'
+import ARoomDetailOwner from '@/components/fee/aRoomDetailOwner.vue'
+import AFeeDetailFeeObj from '@/components/aCommunity/aFeeDetailFeeObj.vue'
+import ARoomDetailMeterWaterLog from '@/components/fee/aRoomDetailMeterWaterLog.vue'
+import AFeeDetailImport from '@/components/aCommunity/aFeeDetailImport.vue'
+import AFeeDetailDiscount from '@/components/aCommunity/aFeeDetailDiscount.vue'
+import ARoomDetailReceipt from '@/components/fee/aRoomDetailReceipt.vue'
+import AFeeDetailSub from '@/components/aCommunity/aFeeDetailSub.vue'
+import divider from '@/components/system/divider.vue'
+
+export default {
+  name: 'AdminFeeDetailList',
+  components: {
+    ARoomDetailHisFee,
+    ARoomDetailRoom,
+    ARoomDetailCar,
+    AFeeDetailHis,
+    AFeeDetailConfig,
+    ARoomDetailOwner,
+    AFeeDetailFeeObj,
+    ARoomDetailMeterWaterLog,
+    AFeeDetailImport,
+    AFeeDetailDiscount,
+    ARoomDetailReceipt,
+    AFeeDetailSub,
+    divider
+  },
+  data() {
+    return {
+      adminFeeDetailInfo: {
+        feeId: '',
+        configId: '',
+        feeFlag: '',
+        feeFlagName: '',
+        feeTypeCdName: '',
+        payerObjName: '',
+        payerObjId: '',
+        payerObjType: '',
+        feeName: '',
+        stateName: '',
+        state: '',
+        startTime: '',
+        batchId: '',
+        endTime: '',
+        deadlineTime: '',
+        amountOwed: '',
+        attrs: [],
+        _currentTab: 'aRoomDetailHisFee',
+        needBack: false
+      },
+      communityId: ''
+    }
+  },
+  created() {
+    this.communityId = getCommunityId()
+    this.adminFeeDetailInfo.feeId = this.$route.query.feeId || ''
+    if (this.adminFeeDetailInfo.feeId) {
+      this.loadAdminFeeDetailInfo()
+    }
+  },
+  methods: {
+    async loadAdminFeeDetailInfo() {
+      try {
+        const params = {
+          page: 1,
+          row: 1,
+          feeId: this.adminFeeDetailInfo.feeId
+        }
+        const response = await getFeeDetail(params)
+        const feeInfo = response.fees[0]
+        Object.assign(this.adminFeeDetailInfo, feeInfo)
+        this.adminFeeDetailInfo.attrs = feeInfo.feeAttrs
+        this.changeTab(this.adminFeeDetailInfo._currentTab)
+      } catch (error) {
+        console.error('加载费用详情失败:', error)
+      }
+    },
+    changeTab(tab) {
+      this.adminFeeDetailInfo._currentTab = tab
+      let ownerId = ''
+      this.adminFeeDetailInfo.attrs.forEach(item => {
+        if (item.specCd === '390007') {
+          ownerId = item.value
+        }
+      })
+
+      setTimeout(() => {
+        if (this.$refs[tab] && this.$refs[tab].open) {
+          this.$refs[tab].open({
+            feeId: this.adminFeeDetailInfo.feeId,
+            payerObjId: this.adminFeeDetailInfo.payerObjId,
+            roomId: this.adminFeeDetailInfo.payerObjId,
+            carId: this.adminFeeDetailInfo.payerObjId,
+            configId: this.adminFeeDetailInfo.configId,
+            state: this.adminFeeDetailInfo.state,
+            ownerId: ownerId
+          })
+        }
+      }, 500)
+    },
+    getDeadlineTime(fee) {
+      if (fee.amountOwed == 0 && fee.endTime == fee.deadlineTime) {
+        return '-'
+      }
+      if (fee.state == '2009001') {
+        return '-'
+      }
+      return fee.deadlineTime
+    },
+    getEndTime(fee) {
+      if (fee.state == '2009001') {
+        return '-'
+      }
+      return fee.endTime
+    }
+  }
+}
+</script>
+
+<style scoped>
+.admin-fee-detail-container {
+  background-color: #f5f5f5;
+  padding: 20px;
+}
+
+.white-bg {
+  background-color: #fff;
+}
+
+.padding-left {
+  padding-left: 20px;
+}
+
+.padding-right {
+  padding-right: 20px;
+}
+
+.padding-top {
+  padding-top: 20px;
+}
+
+.border-radius-top {
+  border-radius: 4px 4px 0 0;
+}
+
+.border-radius-bottom {
+  border-radius: 0 0 4px 4px;
+}
+
+.margin-top {
+  margin-top: 20px;
+}
+
+.margin-top-sm {
+  margin-top: 10px;
+}
+
+.text-title {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+.flex {
+  display: flex;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.vc-line-primary {
+  height: 1px;
+  background-color: #ebeef5;
+}
+
+.form-group {
+  margin-bottom: 15px;
+  text-align: left;
+}
+
+.col-form-label {
+  margin-bottom: 5px;
+  color: #606266;
+  margin-right: 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/community/cityAreaList.vue b/src/views/community/cityAreaList.vue
index 553f19d..bc961df 100644
--- a/src/views/community/cityAreaList.vue
+++ b/src/views/community/cityAreaList.vue
@@ -6,7 +6,7 @@
       </el-col>
       <el-col :span="20">
         <el-card class="box-card">
-          <div slot="header" class="clearfix">
+          <div slot="header" class="flex justify-between">
             <span>{{ $t('cityArea.detailTitle') }}</span>
           </div>
           <div class="margin-top">
--
libgit2 0.21.4