From 34fbc487478dae46a7a50e89f042f61334582223 Mon Sep 17 00:00:00 2001
From: wuxw <928255095@qq.com>
Date: Sun, 8 Jun 2025 23:35:41 +0800
Subject: [PATCH] 完成预约功能

---
 src/api/community/communitySpaceConfirmApi.js           |  44 ++++++++++++++++++++++++++++++++++++++++++++
 src/api/community/communitySpaceManageApi.js            | 195 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/api/community/communitySpacePersonManageApi.js      |  61 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/api/community/reportCommunitySpaceApi.js            |  81 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/AddCommunitySpace.vue          | 102 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/AddCommunityVenue.vue          | 104 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/DeleteCommunitySpace.vue       |  48 ++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/DeleteCommunityVenue.vue       |  48 ++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/EditCommunitySpace.vue         | 111 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/EditCommunitySpaceOpenTime.vue |  74 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/EditCommunityVenue.vue         | 104 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/addCommunitySpacePerson.vue    | 175 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/components/community/deleteCommunitySpacePerson.vue |  55 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/i18n/commonLang.js                                  |   2 ++
 src/i18n/index.js                                       |  12 ++++++++++++
 src/router/index.js                                     |  21 ++++++++++++++++++++-
 src/views/community/communitySpaceConfirmLang.js        |  54 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/communitySpaceConfirmList.vue       | 331 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/communitySpaceManageLang.js         |  76 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/communitySpaceManageList.vue        | 307 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/communitySpacePersonManageLang.js   |  92 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/communitySpacePersonManageList.vue  | 232 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/reportCommunitySpaceLang.js         |  72 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/views/community/reportCommunitySpaceList.vue        | 208 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 24 files changed, 2608 insertions(+), 1 deletion(-)
 create mode 100644 src/api/community/communitySpaceConfirmApi.js
 create mode 100644 src/api/community/communitySpaceManageApi.js
 create mode 100644 src/api/community/communitySpacePersonManageApi.js
 create mode 100644 src/api/community/reportCommunitySpaceApi.js
 create mode 100644 src/components/community/AddCommunitySpace.vue
 create mode 100644 src/components/community/AddCommunityVenue.vue
 create mode 100644 src/components/community/DeleteCommunitySpace.vue
 create mode 100644 src/components/community/DeleteCommunityVenue.vue
 create mode 100644 src/components/community/EditCommunitySpace.vue
 create mode 100644 src/components/community/EditCommunitySpaceOpenTime.vue
 create mode 100644 src/components/community/EditCommunityVenue.vue
 create mode 100644 src/components/community/addCommunitySpacePerson.vue
 create mode 100644 src/components/community/deleteCommunitySpacePerson.vue
 create mode 100644 src/views/community/communitySpaceConfirmLang.js
 create mode 100644 src/views/community/communitySpaceConfirmList.vue
 create mode 100644 src/views/community/communitySpaceManageLang.js
 create mode 100644 src/views/community/communitySpaceManageList.vue
 create mode 100644 src/views/community/communitySpacePersonManageLang.js
 create mode 100644 src/views/community/communitySpacePersonManageList.vue
 create mode 100644 src/views/community/reportCommunitySpaceLang.js
 create mode 100644 src/views/community/reportCommunitySpaceList.vue

diff --git a/src/api/community/communitySpaceConfirmApi.js b/src/api/community/communitySpaceConfirmApi.js
new file mode 100644
index 0000000..8a508b0
--- /dev/null
+++ b/src/api/community/communitySpaceConfirmApi.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询核销订单列表
+export function listCommunitySpaceConfirmOrder(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.listCommunitySpaceConfirmOrder',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve({
+          data: res.data,
+          total: res.total
+        })
+      } else {
+        reject(new Error(res.msg || '获取核销列表失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 核销场地订单
+export function saveCommunitySpaceConfirmOrder(data) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.saveCommunitySpaceConfirmOrder',
+      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)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/community/communitySpaceManageApi.js b/src/api/community/communitySpaceManageApi.js
new file mode 100644
index 0000000..796f6ab
--- /dev/null
+++ b/src/api/community/communitySpaceManageApi.js
@@ -0,0 +1,195 @@
+import request from '@/utils/request'
+import { getCommunityId } from '@/api/community/communityApi'
+
+// 查询场馆列表
+export function listCommunityVenue(params) {
+  return new Promise((resolve, reject) => {
+    params.communityId = getCommunityId()
+    request({
+      url: '/communityVenue.listCommunityVenue',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+
+        resolve(res)
+
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 添加场馆
+export function saveCommunityVenue(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/communityVenue.saveCommunityVenue',
+      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 updateCommunityVenue(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/communityVenue.updateCommunityVenue',
+      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 deleteCommunityVenue(venueId) {
+  return new Promise((resolve, reject) => {
+    const data = {
+      venueId,
+      communityId: getCommunityId()
+    }
+    request({
+      url: '/communityVenue.deleteCommunityVenue',
+      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 listCommunitySpace(params) {
+  return new Promise((resolve, reject) => {
+    params.communityId = getCommunityId()
+    request({
+      url: '/communitySpace.listCommunitySpace',
+      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 saveCommunitySpace(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/communitySpace.saveCommunitySpace',
+      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 updateCommunitySpace(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/communitySpace.updateCommunitySpace',
+      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 deleteCommunitySpace(spaceId) {
+  return new Promise((resolve, reject) => {
+    const data = {
+      spaceId,
+      communityId: getCommunityId()
+    }
+    request({
+      url: '/communitySpace.deleteCommunitySpace',
+      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 updateCommunitySpaceOpenTime(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/communitySpaceOpenTime.updateCommunitySpaceOpenTime',
+      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)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/api/community/communitySpacePersonManageApi.js b/src/api/community/communitySpacePersonManageApi.js
new file mode 100644
index 0000000..5e1cee1
--- /dev/null
+++ b/src/api/community/communitySpacePersonManageApi.js
@@ -0,0 +1,61 @@
+import request from '@/utils/request'
+
+// 查询预约订单列表
+export function listCommunitySpacePerson(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.listCommunitySpacePerson',
+      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 deleteCommunitySpacePerson(data) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.deleteCommunitySpacePerson',
+      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 listCommunitySpace(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.listCommunitySpace',
+      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/community/reportCommunitySpaceApi.js b/src/api/community/reportCommunitySpaceApi.js
new file mode 100644
index 0000000..67e662f
--- /dev/null
+++ b/src/api/community/reportCommunitySpaceApi.js
@@ -0,0 +1,81 @@
+import request from '@/utils/request'
+
+// 获取场馆列表
+export function listCommunityVenue(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communityVenue.listCommunityVenue',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res.data)
+      } else {
+        reject(new Error(res.msg || '获取场馆列表失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 获取场地列表
+export function listCommunitySpace(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.listCommunitySpace',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res.data)
+      } else {
+        reject(new Error(res.msg || '获取场地列表失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 获取场地预约记录
+export function listCommunitySpacePerson(params) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.listCommunitySpacePerson',
+      method: 'get',
+      params
+    }).then(response => {
+      const res = response.data
+      if (res.code === 0) {
+        resolve(res.data)
+      } else {
+        reject(new Error(res.msg || '获取场地预约记录失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
+// 保存场地预约
+export function saveCommunitySpacePerson(data) {
+  return new Promise((resolve, reject) => {
+    request({
+      url: '/communitySpace.saveCommunitySpacePerson',
+      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)
+    })
+  })
+}
\ No newline at end of file
diff --git a/src/components/community/AddCommunitySpace.vue b/src/components/community/AddCommunitySpace.vue
new file mode 100644
index 0000000..43ed2a9
--- /dev/null
+++ b/src/components/community/AddCommunitySpace.vue
@@ -0,0 +1,102 @@
+<template>
+  <el-dialog :title="$t('communitySpaceManage.addSpace')" :visible.sync="visible" width="50%" @close="resetForm">
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item :label="$t('communitySpaceManage.name')" prop="name">
+        <el-input v-model="form.name" :placeholder="$t('communitySpaceManage.selectSpace')" />
+      </el-form-item>
+
+      <el-form-item :label="$t('communitySpaceManage.feeMoney')" prop="feeMoney">
+        <el-input v-model="form.feeMoney" :placeholder="$t('communitySpaceManage.selectSpace')" />
+      </el-form-item>
+
+      <el-form-item :label="$t('communitySpaceManage.adminName')" prop="adminName">
+        <el-input v-model="form.adminName" :placeholder="$t('communitySpaceManage.selectSpace')" />
+      </el-form-item>
+
+      <el-form-item :label="$t('communitySpaceManage.tel')" prop="tel">
+        <el-input v-model="form.tel" :placeholder="$t('communitySpaceManage.selectSpace')" />
+      </el-form-item>
+
+      <el-form-item :label="$t('communitySpaceManage.state')" prop="state">
+        <el-select v-model="form.state" style="width:100%">
+          <el-option :label="$t('communitySpaceManage.status1001')" value="1001" />
+          <el-option :label="$t('communitySpaceManage.status2002')" value="2002" />
+        </el-select>
+      </el-form-item>
+    </el-form>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="primary" @click="submitForm">
+        {{ $t('communitySpaceManage.save') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { saveCommunitySpace } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'AddCommunitySpace',
+  data() {
+    return {
+      visible: false,
+      form: {
+        venueId: '',
+        name: '',
+        feeMoney: '',
+        startTime: '00:00',
+        endTime: '23:59',
+        adminName: '',
+        tel: '',
+        state: '1001'
+      },
+      rules: {
+        name: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        feeMoney: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        adminName: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        tel: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        state: [
+          { required: true, message: this.$t('communitySpaceManage.selectStatus'), trigger: 'change' }
+        ]
+      }
+    }
+  },
+  methods: {
+    open(venueId) {
+      this.form.venueId = venueId
+      this.visible = true
+    },
+
+    resetForm() {
+      this.$refs.form.resetFields()
+    },
+
+    submitForm() {
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          try {
+            await saveCommunitySpace(this.form)
+            this.$message.success(this.$t('common.success'))
+            this.visible = false
+            this.$emit('success')
+          } catch (error) {
+            console.error('添加场地失败:', error)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/AddCommunityVenue.vue b/src/components/community/AddCommunityVenue.vue
new file mode 100644
index 0000000..4735715
--- /dev/null
+++ b/src/components/community/AddCommunityVenue.vue
@@ -0,0 +1,104 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.add') + $t('communitySpaceManage.venue')" 
+    :visible.sync="visible"
+    width="50%"
+    @close="resetForm"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item :label="$t('communitySpaceManage.venueName')" prop="name">
+        <el-input v-model="form.name" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.startTime')" prop="startTime">
+        <el-time-picker
+          v-model="form.startTime"
+          value-format="HH:mm"
+          placeholder="选择时间"
+          style="width:100%"
+        />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.endTime')" prop="endTime">
+        <el-time-picker
+          v-model="form.endTime"
+          value-format="HH:mm"
+          placeholder="选择时间"
+          style="width:100%"
+        />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.description')" prop="remark">
+        <el-input type="textarea" v-model="form.remark" />
+      </el-form-item>
+    </el-form>
+    
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="primary" @click="submitForm">
+        {{ $t('communitySpaceManage.save') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { saveCommunityVenue } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'AddCommunityVenue',
+  data() {
+    return {
+      visible: false,
+      form: {
+        name: '',
+        startTime: '08:00',
+        endTime: '22:00',
+        remark: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'blur' }
+        ],
+        startTime: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'change' }
+        ],
+        endTime: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'change' }
+        ],
+        remark: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    open() {
+      this.visible = true
+    },
+    
+    resetForm() {
+      this.$refs.form.resetFields()
+      this.form.startTime = '08:00'
+      this.form.endTime = '22:00'
+    },
+    
+    submitForm() {
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          try {
+            await saveCommunityVenue(this.form)
+            this.$message.success(this.$t('common.success'))
+            this.visible = false
+            this.$emit('success')
+          } catch (error) {
+            console.error('添加场馆失败:', error)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/DeleteCommunitySpace.vue b/src/components/community/DeleteCommunitySpace.vue
new file mode 100644
index 0000000..3c3385b
--- /dev/null
+++ b/src/components/community/DeleteCommunitySpace.vue
@@ -0,0 +1,48 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.confirmDelete')" 
+    :visible.sync="visible"
+    width="30%"
+  >
+    <p>{{ $t('communitySpaceManage.confirmDeleteSpace') }}</p>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="danger" @click="confirmDelete">
+        {{ $t('communitySpaceManage.confirmDelete') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { deleteCommunitySpace } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'DeleteCommunitySpace',
+  data() {
+    return {
+      visible: false,
+      spaceId: ''
+    }
+  },
+  methods: {
+    open(space) {
+      this.spaceId = space.spaceId
+      this.visible = true
+    },
+    
+    async confirmDelete() {
+      try {
+        await deleteCommunitySpace(this.spaceId)
+        this.$message.success(this.$t('common.success'))
+        this.visible = false
+        this.$emit('success')
+      } catch (error) {
+        console.error('删除场地失败:', error)
+      }
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/DeleteCommunityVenue.vue b/src/components/community/DeleteCommunityVenue.vue
new file mode 100644
index 0000000..c3a5c41
--- /dev/null
+++ b/src/components/community/DeleteCommunityVenue.vue
@@ -0,0 +1,48 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.confirmDelete')" 
+    :visible.sync="visible"
+    width="30%"
+  >
+    <p>{{ $t('communitySpaceManage.confirmDeleteVenue') }}</p>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="danger" @click="confirmDelete">
+        {{ $t('communitySpaceManage.confirmDelete') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { deleteCommunityVenue } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'DeleteCommunityVenue',
+  data() {
+    return {
+      visible: false,
+      venueId: ''
+    }
+  },
+  methods: {
+    open(venue) {
+      this.venueId = venue.venueId
+      this.visible = true
+    },
+    
+    async confirmDelete() {
+      try {
+        await deleteCommunityVenue(this.venueId)
+        this.$message.success(this.$t('common.success'))
+        this.visible = false
+        this.$emit('success')
+      } catch (error) {
+        console.error('删除场馆失败:', error)
+      }
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/EditCommunitySpace.vue b/src/components/community/EditCommunitySpace.vue
new file mode 100644
index 0000000..04b7417
--- /dev/null
+++ b/src/components/community/EditCommunitySpace.vue
@@ -0,0 +1,111 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.edit')" 
+    :visible.sync="visible"
+    width="50%"
+    @close="resetForm"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item :label="$t('communitySpaceManage.name')" prop="name">
+        <el-input v-model="form.name" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.feeMoney')" prop="feeMoney">
+        <el-input v-model="form.feeMoney" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.adminName')" prop="adminName">
+        <el-input v-model="form.adminName" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.tel')" prop="tel">
+        <el-input v-model="form.tel" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.state')" prop="state">
+        <el-select v-model="form.state" style="width:100%">
+          <el-option 
+            :label="$t('communitySpaceManage.status1001')" 
+            value="1001" 
+          />
+          <el-option 
+            :label="$t('communitySpaceManage.status2002')" 
+            value="2002" 
+          />
+        </el-select>
+      </el-form-item>
+    </el-form>
+    
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="primary" @click="submitForm">
+        {{ $t('communitySpaceManage.save') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateCommunitySpace } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'EditCommunitySpace',
+  data() {
+    return {
+      visible: false,
+      form: {
+        spaceId: '',
+        name: '',
+        feeMoney: '',
+        adminName: '',
+        tel: '',
+        state: '1001'
+      },
+      rules: {
+        name: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        feeMoney: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        adminName: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        tel: [
+          { required: true, message: this.$t('communitySpaceManage.selectSpace'), trigger: 'blur' }
+        ],
+        state: [
+          { required: true, message: this.$t('communitySpaceManage.selectStatus'), trigger: 'change' }
+        ]
+      }
+    }
+  },
+  methods: {
+    open(space) {
+      this.form = { ...space }
+      this.visible = true
+    },
+    
+    resetForm() {
+      this.$refs.form.resetFields()
+    },
+    
+    submitForm() {
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          try {
+            await updateCommunitySpace(this.form)
+            this.$message.success(this.$t('common.success'))
+            this.visible = false
+            this.$emit('success')
+          } catch (error) {
+            console.error('修改场地失败:', error)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/EditCommunitySpaceOpenTime.vue b/src/components/community/EditCommunitySpaceOpenTime.vue
new file mode 100644
index 0000000..8a6733d
--- /dev/null
+++ b/src/components/community/EditCommunitySpaceOpenTime.vue
@@ -0,0 +1,74 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.openTimeTitle')" 
+    :visible.sync="visible"
+    width="70%"
+  >
+    <el-row :gutter="20">
+      <el-col :span="6" v-for="(item, index) in openTimes" :key="index">
+        <div class="time-item">
+          <span>{{ item.hours }}{{ $t('common.hour') }}</span>
+          <el-select v-model="item.isOpen" @change="updateOpenTime(item)" style="width:100%">
+            <el-option 
+              :label="$t('communitySpaceManage.status1001')" 
+              value="Y" 
+            />
+            <el-option 
+              :label="$t('communitySpaceManage.status2002')" 
+              value="N" 
+            />
+          </el-select>
+        </div>
+      </el-col>
+    </el-row>
+    
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateCommunitySpaceOpenTime } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'EditCommunitySpaceOpenTime',
+  data() {
+    return {
+      visible: false,
+      openTimes: []
+    }
+  },
+  methods: {
+    open(space) {
+      this.openTimes = space.openTimes || []
+      this.visible = true
+    },
+    
+    async updateOpenTime(item) {
+      try {
+        await updateCommunitySpaceOpenTime(item)
+        this.$message.success(this.$t('common.success'))
+      } catch (error) {
+        console.error('更新开放时间失败:', error)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.time-item {
+  margin-bottom: 15px;
+  padding: 10px;
+  border: 1px solid #eee;
+  border-radius: 4px;
+}
+.time-item span {
+  display: block;
+  margin-bottom: 5px;
+  font-weight: bold;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/community/EditCommunityVenue.vue b/src/components/community/EditCommunityVenue.vue
new file mode 100644
index 0000000..6d3f54d
--- /dev/null
+++ b/src/components/community/EditCommunityVenue.vue
@@ -0,0 +1,104 @@
+<template>
+  <el-dialog 
+    :title="$t('communitySpaceManage.edit') + $t('communitySpaceManage.venue')" 
+    :visible.sync="visible"
+    width="50%"
+    @close="resetForm"
+  >
+    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+      <el-form-item :label="$t('communitySpaceManage.venueName')" prop="name">
+        <el-input v-model="form.name" />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.startTime')" prop="startTime">
+        <el-time-picker
+          v-model="form.startTime"
+          value-format="HH:mm"
+          placeholder="选择时间"
+          style="width:100%"
+        />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.endTime')" prop="endTime">
+        <el-time-picker
+          v-model="form.endTime"
+          value-format="HH:mm"
+          placeholder="选择时间"
+          style="width:100%"
+        />
+      </el-form-item>
+      
+      <el-form-item :label="$t('communitySpaceManage.description')" prop="remark">
+        <el-input type="textarea" v-model="form.remark" />
+      </el-form-item>
+    </el-form>
+    
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">
+        {{ $t('communitySpaceManage.cancel') }}
+      </el-button>
+      <el-button type="primary" @click="submitForm">
+        {{ $t('communitySpaceManage.save') }}
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateCommunityVenue } from '@/api/community/communitySpaceManageApi'
+
+export default {
+  name: 'EditCommunityVenue',
+  data() {
+    return {
+      visible: false,
+      form: {
+        venueId: '',
+        name: '',
+        startTime: '',
+        endTime: '',
+        remark: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'blur' }
+        ],
+        startTime: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'change' }
+        ],
+        endTime: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'change' }
+        ],
+        remark: [
+          { required: true, message: this.$t('communitySpaceManage.selectVenue'), trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    open(venue) {
+      this.form = { ...venue }
+      this.visible = true
+    },
+    
+    resetForm() {
+      this.$refs.form.resetFields()
+    },
+    
+    submitForm() {
+      this.$refs.form.validate(async valid => {
+        if (valid) {
+          try {
+            await updateCommunityVenue(this.form)
+            this.$message.success(this.$t('common.success'))
+            this.visible = false
+            this.$emit('success')
+          } catch (error) {
+            console.error('修改场馆失败:', error)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/addCommunitySpacePerson.vue b/src/components/community/addCommunitySpacePerson.vue
new file mode 100644
index 0000000..48ae736
--- /dev/null
+++ b/src/components/community/addCommunitySpacePerson.vue
@@ -0,0 +1,175 @@
+<template>
+  <el-dialog :title="$t('addCommunitySpacePerson.title')" :visible.sync="visible" width="800px" @close="closeDialog">
+    <el-form ref="form" :model="formData" :rules="rules" label-width="120px">
+      <el-row>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.personName')" prop="personName">
+            <el-input v-model="formData.personName" :placeholder="$t('addCommunitySpacePerson.requiredPersonName')" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.personTel')" prop="personTel">
+            <el-input v-model="formData.personTel" :placeholder="$t('addCommunitySpacePerson.requiredPersonTel')" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.receivableAmount')" prop="receivableAmount">
+            <el-input v-model="formData.receivableAmount"
+              :placeholder="$t('addCommunitySpacePerson.requiredReceivableAmount')" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.receivedAmount')" prop="receivedAmount">
+            <el-input v-model="formData.receivedAmount"
+              :placeholder="$t('addCommunitySpacePerson.requiredReceivedAmount')" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.payWay')" prop="payWay">
+            <el-select v-model="formData.payWay" :placeholder="$t('addCommunitySpacePerson.selectPayWay')"
+              style="width:100%">
+              <el-option v-for="item in payOptions" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item :label="$t('addCommunitySpacePerson.appointmentTime')" prop="appointmentTime">
+            <el-input v-model="formData.appointmentTime" disabled
+              :placeholder="$t('addCommunitySpacePerson.requiredAppointmentTime')" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+
+      <el-row>
+        <el-col :span="24">
+          <el-form-item :label="$t('addCommunitySpacePerson.remark')" prop="remark">
+            <el-input v-model="formData.remark" type="textarea"
+              :placeholder="$t('addCommunitySpacePerson.requiredRemark')" :rows="3" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">{{ $t('common.cancel') }}</el-button>
+      <el-button type="primary" @click="handleSubmit">{{ $t('common.save') }}</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { saveCommunitySpacePerson } from '@/api/community/reportCommunitySpaceApi'
+import { getCommunityId } from '@/api/community/communityApi'
+import { dateFormat } from '@/utils/dateUtil'
+
+
+export default {
+  name: 'AddCommunitySpacePerson',
+  props: {
+    communityId: {
+      type: String,
+      default: () => getCommunityId()
+    }
+  },
+  data() {
+    return {
+      visible: false,
+      formData: {
+        spaceId: '',
+        personName: '',
+        personTel: '',
+        appointmentTime: '',
+        receivableAmount: '',
+        receivedAmount: '',
+        payWay: '',
+        remark: '',
+        openTime: '',
+        communityId: this.communityId,
+        state: 'S'
+      },
+      rules: {
+        personName: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredPersonName'), trigger: 'blur' },
+          { max: 64, message: this.$t('addCommunitySpacePerson.maxPersonName'), trigger: 'blur' }
+        ],
+        personTel: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredPersonTel'), trigger: 'blur' },
+          { max: 11, message: this.$t('addCommunitySpacePerson.maxPersonTel'), trigger: 'blur' }
+        ],
+        appointmentTime: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredAppointmentTime'), trigger: 'blur' }
+        ],
+        receivableAmount: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredReceivableAmount'), trigger: 'blur' },
+          { max: 10, message: this.$t('addCommunitySpacePerson.maxReceivableAmount'), trigger: 'blur' }
+        ],
+        receivedAmount: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredReceivedAmount'), trigger: 'blur' },
+          { max: 10, message: this.$t('addCommunitySpacePerson.maxReceivedAmount'), trigger: 'blur' }
+        ],
+        payWay: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredPayWay'), trigger: 'change' }
+        ],
+        remark: [
+          { required: true, message: this.$t('addCommunitySpacePerson.requiredRemark'), trigger: 'blur' },
+          { max: 512, message: this.$t('addCommunitySpacePerson.maxRemark'), trigger: 'blur' }
+        ]
+      },
+      payOptions: [
+        { value: '1', label: this.$t('addCommunitySpacePerson.cash') },
+        { value: '2', label: this.$t('addCommunitySpacePerson.wechat') },
+        { value: '3', label: this.$t('addCommunitySpacePerson.alipay') }
+      ]
+    }
+  },
+  methods: {
+    open(data) {
+      this.resetForm()
+      Object.assign(this.formData, data)
+      this.formData.appointmentTime = dateFormat(this.formData.appointmentTime) + ` ${this.formData.openTime}:00`
+      this.visible = true
+    },
+    closeDialog() {
+      this.$refs.form.resetFields()
+    },
+    resetForm() {
+      this.formData = {
+        spaceId: '',
+        personName: '',
+        personTel: '',
+        appointmentTime: '',
+        receivableAmount: '',
+        receivedAmount: '',
+        payWay: '',
+        remark: '',
+        openTime: '',
+        communityId: this.communityId,
+        state: 'S'
+      }
+    },
+    handleSubmit() {
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          this.saveData()
+        }
+      })
+    },
+    async saveData() {
+      try {
+        await saveCommunitySpacePerson(this.formData)
+        this.$message.success(this.$t('common.saveSuccess'))
+        this.visible = false
+        this.$emit('success')
+      } catch (error) {
+        this.$message.error(error.message || this.$t('common.saveFailed'))
+      }
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/community/deleteCommunitySpacePerson.vue b/src/components/community/deleteCommunitySpacePerson.vue
new file mode 100644
index 0000000..5d41de4
--- /dev/null
+++ b/src/components/community/deleteCommunitySpacePerson.vue
@@ -0,0 +1,55 @@
+<template>
+  <el-dialog
+    :title="$t('deleteCommunitySpacePerson.confirmTitle')"
+    :visible.sync="visible"
+    width="30%"
+    @close="close"
+  >
+    <div>
+      <p>{{ $t('deleteCommunitySpacePerson.confirmContent') }}</p>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="close">{{ $t('deleteCommunitySpacePerson.cancel') }}</el-button>
+      <el-button type="primary" @click="deleteCommunitySpacePerson">{{ $t('deleteCommunitySpacePerson.confirmCancel') }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { deleteCommunitySpacePerson } from '@/api/community/communitySpacePersonManageApi'
+import { getCommunityId } from '@/api/community/communityApi'
+
+export default {
+  name: 'DeleteCommunitySpacePerson',
+  data() {
+    return {
+      visible: false,
+      deleteData: {}
+    }
+  },
+  methods: {
+    open(data) {
+      this.deleteData = { ...data }
+      this.visible = true
+    },
+    close() {
+      this.visible = false
+    },
+    async deleteCommunitySpacePerson() {
+      try {
+        const communityId = getCommunityId()
+        const data = {
+          ...this.deleteData,
+          communityId
+        }
+        await deleteCommunitySpacePerson(data)
+        this.$emit('success')
+        this.$message.success(this.$t('common.deleteSuccess'))
+        this.close()
+      } catch (error) {
+        this.$message.error(error.message || this.$t('common.deleteFailed'))
+      }
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/i18n/commonLang.js b/src/i18n/commonLang.js
index 26df550..a0659f2 100644
--- a/src/i18n/commonLang.js
+++ b/src/i18n/commonLang.js
@@ -41,6 +41,7 @@ export const messages = {
         disabled: 'Disabled',
         import: 'Import',
         remark: 'Remark',
+        hour:'hour',
       }
     },
     zh: {
@@ -85,6 +86,7 @@ export const messages = {
         disabled: '禁用',
         import: '导入',
         remark: '备注',
+        hour:'时',
       }
     }
   } 
\ No newline at end of file
diff --git a/src/i18n/index.js b/src/i18n/index.js
index c6bfc92..2bb595d 100644
--- a/src/i18n/index.js
+++ b/src/i18n/index.js
@@ -131,6 +131,10 @@ import { messages as listOwnerMessages } from '../views/owner/listOwnerLang'
 import { messages as auditAuthOwnerMessages } from '../views/owner/auditAuthOwnerLang'
 import { messages as accountManageMessages } from '../views/account/accountManageLang'
 import { messages as accountDetailManageMessages } from '../views/account/accountDetailManageLang'
+import { messages as communitySpaceManageMessages } from '../views/community/communitySpaceManageLang'
+import { messages as reportCommunitySpaceMessages } from '../views/community/reportCommunitySpaceLang'
+import { messages as communitySpacePersonManageMessages } from '../views/community/communitySpacePersonManageLang'
+import { messages as communitySpaceConfirmMessages } from '../views/community/communitySpaceConfirmLang'
 
 Vue.use(VueI18n)
 
@@ -266,6 +270,10 @@ const messages = {
     ...auditAuthOwnerMessages.en,
     ...accountManageMessages.en,
     ...accountDetailManageMessages.en,
+    ...communitySpaceManageMessages.en,
+    ...reportCommunitySpaceMessages.en,
+    ...communitySpacePersonManageMessages.en,
+    ...communitySpaceConfirmMessages.en,
   },
   zh: {
     ...loginMessages.zh,
@@ -397,6 +405,10 @@ const messages = {
     ...auditAuthOwnerMessages.zh,
     ...accountManageMessages.zh,
     ...accountDetailManageMessages.zh,
+    ...communitySpaceManageMessages.zh,
+    ...reportCommunitySpaceMessages.zh,
+    ...communitySpacePersonManageMessages.zh,
+    ...communitySpaceConfirmMessages.zh,
   }
 }
 
diff --git a/src/router/index.js b/src/router/index.js
index 24f5045..1cab57d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -646,7 +646,26 @@ const routes = [
         name: '/views/account/accountDetailManage',
         component: () => import('@/views/account/accountDetailManageList.vue')
       },
-
+      {
+        path: '/pages/property/communitySpaceManage',
+        name: '/pages/property/communitySpaceManage',
+        component: () => import('@/views/community/communitySpaceManageList.vue')
+      },
+      {
+        path: '/pages/property/reportCommunitySpace',
+        name: '/pages/property/reportCommunitySpace',
+        component: () => import('@/views/community/reportCommunitySpaceList.vue')
+      },
+      {
+        path:'/pages/property/communitySpacePersonManage',
+        name:'/pages/property/communitySpacePersonManage',
+        component: () => import('@/views/community/communitySpacePersonManageList.vue')
+        },
+        {
+          path:'/pages/property/communitySpaceConfirm',
+          name:'/pages/property/communitySpaceConfirm',
+          component: () => import('@/views/community/communitySpaceConfirmList.vue')
+          },
       // 其他子路由可以在这里添加
     ]
   },
diff --git a/src/views/community/communitySpaceConfirmLang.js b/src/views/community/communitySpaceConfirmLang.js
new file mode 100644
index 0000000..fc08b42
--- /dev/null
+++ b/src/views/community/communitySpaceConfirmLang.js
@@ -0,0 +1,54 @@
+export const messages = {
+  en: {
+    communitySpaceConfirm: {
+      writeOff: 'Write Off',
+      writeOffPlaceholder: 'Please scan with barcode scanner to write off',
+      writeOffResult: 'Write Off Result',
+      writeOffTime: 'Write Off Time',
+      space: 'Space',
+      appointmentDate: 'Appointment Date',
+      appointmentHours: 'Appointment Hours',
+      appointmentPerson: 'Appointment Person',
+      appointmentPhone: 'Appointment Phone',
+      searchCondition: 'Search Conditions',
+      search: 'Search',
+      reset: 'Reset',
+      writeOffOrder: 'Write Off Order',
+      venue: 'Venue',
+      appointmentTime: 'Appointment Time',
+      remark: 'Remark',
+      personNamePlaceholder: 'Enter appointment person name',
+      personTelPlaceholder: 'Enter appointment phone',
+      appointmentTimePlaceholder: 'Select appointment time',
+      scanTip: 'Please scan barcode first',
+      writeOffSuccess: 'Write off successful',
+      writeOffFailed: 'Write off failed'
+    }
+  },
+  zh: {
+    communitySpaceConfirm: {
+      writeOff: '核销',
+      writeOffPlaceholder: '请扫码枪扫码核销',
+      writeOffResult: '核销结果',
+      writeOffTime: '核销时间',
+      space: '场地',
+      appointmentDate: '预约日期',
+      appointmentHours: '预约小时',
+      appointmentPerson: '预约人',
+      appointmentPhone: '预约电话',
+      searchCondition: '查询条件',
+      search: '查询',
+      reset: '重置',
+      writeOffOrder: '核销订单',
+      venue: '场馆',
+      appointmentTime: '预约时间',
+      remark: '备注',
+      personNamePlaceholder: '请输入预约人',
+      personTelPlaceholder: '请输入预约电话',
+      appointmentTimePlaceholder: '请选择预约时间',
+      scanTip: '请先扫码',
+      writeOffSuccess: '核销成功',
+      writeOffFailed: '核销失败'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/community/communitySpaceConfirmList.vue b/src/views/community/communitySpaceConfirmList.vue
new file mode 100644
index 0000000..f115e9e
--- /dev/null
+++ b/src/views/community/communitySpaceConfirmList.vue
@@ -0,0 +1,331 @@
+<template>
+  <div class="community-space-confirm-container">
+    <el-row :gutter="20">
+      <el-col :span="6">
+        <el-card class="write-off-card">
+          <el-row :gutter="10" class="mb-10">
+            <el-col :span="18">
+              <el-input 
+                v-model="communitySpaceConfirmInfo.timeId"
+                :placeholder="$t('communitySpaceConfirm.writeOffPlaceholder')"
+                @keyup.enter.native="confirmCommunitySpace"
+                clearable
+              />
+            </el-col>
+            <el-col :span="6">
+              <el-button 
+                type="primary" 
+                @click="confirmCommunitySpace"
+                class="full-width-btn"
+              >
+                {{ $t('communitySpaceConfirm.writeOff') }}
+              </el-button>
+            </el-col>
+          </el-row>
+
+          <div class="result-card">
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.writeOffResult') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.remark || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.writeOffTime') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.createTime || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.space') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.spaceName || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.appointmentDate') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.appointmentTime || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.appointmentHours') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.hours || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.appointmentPerson') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.personName || '-' }}</span>
+            </div>
+            <div class="result-item">
+              <span class="label">{{ $t('communitySpaceConfirm.appointmentPhone') }}:</span>
+              <span>{{ communitySpaceConfirmInfo.order.personTel || '-' }}</span>
+            </div>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="18">
+        <el-card class="search-card">
+          <div slot="header" class="clearfix">
+            <span>{{ $t('communitySpaceConfirm.searchCondition') }}</span>
+          </div>
+          <el-row :gutter="20">
+            <el-col :span="6">
+              <el-input 
+                v-model="communitySpaceConfirmInfo.conditions.personName"
+                :placeholder="$t('communitySpaceConfirm.personNamePlaceholder')"
+                clearable
+              />
+            </el-col>
+            <el-col :span="6">
+              <el-input 
+                v-model="communitySpaceConfirmInfo.conditions.personTel"
+                :placeholder="$t('communitySpaceConfirm.personTelPlaceholder')"
+                clearable
+              />
+            </el-col>
+            <el-col :span="6">
+              <el-date-picker
+                v-model="communitySpaceConfirmInfo.conditions.appointmentTime"
+                type="datetime"
+                :placeholder="$t('communitySpaceConfirm.appointmentTimePlaceholder')"
+                value-format="yyyy-MM-dd HH:mm:ss"
+                class="full-width"
+              />
+            </el-col>
+            <el-col :span="6">
+              <el-button type="primary" @click="queryCommunitySpaceConfirm">
+                <i class="el-icon-search"></i>
+                {{ $t('communitySpaceConfirm.search') }}
+              </el-button>
+              <el-button @click="resetCommunitySpaceConfirm">
+                <i class="el-icon-refresh"></i>
+                {{ $t('communitySpaceConfirm.reset') }}
+              </el-button>
+            </el-col>
+          </el-row>
+        </el-card>
+
+        <el-card class="table-card">
+          <el-table 
+            :data="communitySpaceConfirmInfo.orders"
+            border
+            style="width: 100%"
+            v-loading="loading"
+          >
+            <el-table-column 
+              prop="orderId" 
+              :label="$t('communitySpaceConfirm.writeOffOrder')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="venueName" 
+              :label="$t('communitySpaceConfirm.venue')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="spaceName" 
+              :label="$t('communitySpaceConfirm.space')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="appointmentTime" 
+              :label="$t('communitySpaceConfirm.appointmentDate')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="hours" 
+              :label="$t('communitySpaceConfirm.appointmentTime')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="personName" 
+              :label="$t('communitySpaceConfirm.appointmentPerson')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="personTel" 
+              :label="$t('communitySpaceConfirm.appointmentPhone')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="createTime" 
+              :label="$t('communitySpaceConfirm.writeOffTime')" 
+              align="center"
+            />
+            <el-table-column 
+              prop="remark" 
+              :label="$t('communitySpaceConfirm.remark')" 
+              align="center"
+            />
+          </el-table>
+          
+          <el-pagination
+            class="mt-20"
+            :current-page="pagination.current"
+            :page-sizes="[10, 20, 30, 50]"
+            :page-size="pagination.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="pagination.total"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          />
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { 
+  listCommunitySpaceConfirmOrder, 
+  saveCommunitySpaceConfirmOrder 
+} from '@/api/community/communitySpaceConfirmApi'
+import { getCommunityId } from '@/api/community/communityApi'
+
+export default {
+  name: 'CommunitySpaceConfirmList',
+  data() {
+    return {
+      loading: false,
+      communitySpaceConfirmInfo: {
+        orders: [],
+        order: {
+          remark: '',
+          appointmentTime: '',
+          createTime: '',
+          hours: '',
+          spaceName: '',
+          personName: '',
+          personTel: '',
+        },
+        timeId: '',
+        conditions: {
+          spaceId: '',
+          personName: '',
+          personTel: '',
+          appointmentTime: '',
+          communityId: ''
+        }
+      },
+      pagination: {
+        current: 1,
+        size: 10,
+        total: 0
+      }
+    }
+  },
+  created() {
+    this.communitySpaceConfirmInfo.conditions.communityId = getCommunityId()
+    this.listCommunitySpaceConfirms()
+  },
+  methods: {
+    async listCommunitySpaceConfirms() {
+      this.loading = true
+      try {
+        const params = {
+          ...this.communitySpaceConfirmInfo.conditions,
+          page: this.pagination.current,
+          row: this.pagination.size
+        }
+        
+        const { data, total } = await listCommunitySpaceConfirmOrder(params)
+        this.communitySpaceConfirmInfo.orders = data || []
+        this.pagination.total = total
+      } catch (error) {
+        console.error('获取核销列表失败:', error)
+      } finally {
+        this.loading = false
+      }
+    },
+    async confirmCommunitySpace() {
+      if (!this.communitySpaceConfirmInfo.timeId) {
+        this.$message.warning(this.$t('communitySpaceConfirm.scanTip'))
+        return
+      }
+      
+      try {
+        const data = {
+          timeId: this.communitySpaceConfirmInfo.timeId,
+          communityId: this.communitySpaceConfirmInfo.conditions.communityId
+        }
+        
+        const result = await saveCommunitySpaceConfirmOrder(data)
+        if (result.code === 0) {
+          this.$message.success(this.$t('communitySpaceConfirm.writeOffSuccess'))
+          this.communitySpaceConfirmInfo.timeId = ''
+          
+          // 更新核销结果
+          if (result.data && result.data.length > 0) {
+            this.communitySpaceConfirmInfo.order = { 
+              ...result.data[0],
+              remark: result.data[0].remark || this.$t('communitySpaceConfirm.writeOffSuccess')
+            }
+          }
+          
+          // 刷新列表
+          this.pagination.current = 1
+          this.listCommunitySpaceConfirms()
+        } else {
+          this.$message.error(result.msg)
+        }
+      } catch (error) {
+        console.error('核销失败:', error)
+        this.$message.error(this.$t('communitySpaceConfirm.writeOffFailed'))
+      }
+    },
+    queryCommunitySpaceConfirm() {
+      this.pagination.current = 1
+      this.listCommunitySpaceConfirms()
+    },
+    resetCommunitySpaceConfirm() {
+      this.communitySpaceConfirmInfo.conditions.personName = ''
+      this.communitySpaceConfirmInfo.conditions.personTel = ''
+      this.communitySpaceConfirmInfo.conditions.appointmentTime = ''
+      this.queryCommunitySpaceConfirm()
+    },
+    handleSizeChange(size) {
+      this.pagination.size = size
+      this.listCommunitySpaceConfirms()
+    },
+    handleCurrentChange(current) {
+      this.pagination.current = current
+      this.listCommunitySpaceConfirms()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.community-space-confirm-container {
+  padding: 20px;
+  
+  .write-off-card, .search-card, .table-card {
+    margin-bottom: 20px;
+  }
+  
+  .result-card {
+    margin-top: 15px;
+    
+    .result-item {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 10px;
+      font-size: 14px;
+      
+      .label {
+        font-weight: bold;
+        color: #606266;
+      }
+    }
+  }
+  
+  .full-width {
+    width: 100%;
+  }
+  
+  .full-width-btn {
+    width: 100%;
+  }
+  
+  .mb-10 {
+    margin-bottom: 10px;
+  }
+  
+  .mt-20 {
+    margin-top: 20px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/community/communitySpaceManageLang.js b/src/views/community/communitySpaceManageLang.js
new file mode 100644
index 0000000..13471d1
--- /dev/null
+++ b/src/views/community/communitySpaceManageLang.js
@@ -0,0 +1,76 @@
+export const messages = {
+  en: {
+    communitySpaceManage: {
+      add: 'Add',
+      edit: 'Edit',
+      delete: 'Delete',
+      venue: 'Venue',
+      spaceId: 'ID',
+      name: 'Name',
+      startTime: 'Opening Time',
+      endTime: 'Closing Time',
+      feeMoney: 'Hourly Fee',
+      adminName: 'Manager',
+      tel: 'Manager Phone',
+      state: 'Status',
+      operation: 'Operation',
+      openTime: 'Open Time',
+      query: 'Search',
+      reset: 'Reset',
+      addSpace: 'Add Space',
+      document: 'Document',
+      venueName: 'Venue Name',
+      description: 'Description',
+      confirmDelete: 'Confirm Delete',
+      cancel: 'Cancel',
+      save: 'Save',
+      selectStatus: 'Select Status',
+      selectVenue: 'Select Venue',
+      selectSpace: 'Select Space',
+      status1001: 'Available',
+      status2002: 'Unavailable',
+      confirmDeleteSpace: 'Confirm to delete space?',
+      confirmDeleteVenue: 'Confirm to delete venue?',
+      openTimeTitle: 'Opening Hours',
+      venueInfo: 'Venue Information',
+      spaceInfo: 'Space Information'
+    }
+  },
+  zh: {
+    communitySpaceManage: {
+      add: '添加',
+      edit: '修改',
+      delete: '删除',
+      venue: '场馆',
+      spaceId: '编号',
+      name: '名称',
+      startTime: '开场时间',
+      endTime: '关场时间',
+      feeMoney: '每小时费用',
+      adminName: '管理员',
+      tel: '管理员电话',
+      state: '状态',
+      operation: '操作',
+      openTime: '开放时间',
+      query: '查询',
+      reset: '重置',
+      addSpace: '添加场地',
+      document: '文档',
+      venueName: '场馆名称',
+      description: '描述',
+      confirmDelete: '确认删除',
+      cancel: '取消',
+      save: '保存',
+      selectStatus: '请选择状态',
+      selectVenue: '请选择场馆',
+      selectSpace: '请选择场地',
+      status1001: '可预约',
+      status2002: '不可预约',
+      confirmDeleteSpace: '确定删除场地?',
+      confirmDeleteVenue: '确定删除场馆?',
+      openTimeTitle: '开放时间',
+      venueInfo: '场馆信息',
+      spaceInfo: '场地信息'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/community/communitySpaceManageList.vue b/src/views/community/communitySpaceManageList.vue
new file mode 100644
index 0000000..e8fda67
--- /dev/null
+++ b/src/views/community/communitySpaceManageList.vue
@@ -0,0 +1,307 @@
+<template>
+  <div class="community-space-manage">
+    <el-row :gutter="20">
+      <el-col :span="4">
+        <el-card class="venue-list">
+          <div class="button-group">
+            <el-button type="primary" size="small" @click="openAddVenueModal">
+              {{ $t('communitySpaceManage.add') }}
+            </el-button>
+            <el-button type="primary" size="small" @click="openEditVenueModal">
+              {{ $t('communitySpaceManage.edit') }}
+            </el-button>
+            <el-button type="danger" size="small" @click="openDeleteVenueModal">
+              {{ $t('communitySpaceManage.delete') }}
+            </el-button>
+          </div>
+          <el-scrollbar class="venue-scrollbar">
+            <ul class="venue-items">
+              <li v-for="(item, index) in venues" :key="index" :class="{ 'active': conditions.venueId === item.venueId }"
+                @click="selectVenue(item)">
+                {{ item.name }}
+              </li>
+            </ul>
+          </el-scrollbar>
+        </el-card>
+      </el-col>
+      <el-col :span="20">
+        <el-card>
+          <div slot="header" class="clearfix text-left">
+            <span>{{ $t('communitySpaceManage.query') }}</span>
+          </div>
+          <el-form :inline="true" :model="conditions" class="search-form">
+            <el-form-item :label="$t('communitySpaceManage.spaceId')">
+              <el-input v-model="conditions.spaceId" :placeholder="$t('communitySpaceManage.selectSpace')"></el-input>
+            </el-form-item>
+            <el-form-item :label="$t('communitySpaceManage.name')">
+              <el-input v-model="conditions.name" :placeholder="$t('communitySpaceManage.selectSpace')"></el-input>
+            </el-form-item>
+            <el-form-item :label="$t('communitySpaceManage.state')">
+              <el-select v-model="conditions.state" :placeholder="$t('communitySpaceManage.selectStatus')"
+                style="width:100%">
+                <el-option :label="$t('communitySpaceManage.selectStatus')" value=""></el-option>
+                <el-option :label="$t('communitySpaceManage.status1001')" value="1001"></el-option>
+                <el-option :label="$t('communitySpaceManage.status2002')" value="2002"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="querySpaces">
+                <i class="el-icon-search"></i>
+                {{ $t('communitySpaceManage.query') }}
+              </el-button>
+              <el-button @click="resetConditions">
+                <i class="el-icon-refresh"></i>
+                {{ $t('communitySpaceManage.reset') }}
+              </el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+
+        <el-card style="margin-top: 20px;">
+          <div slot="header" class="clearfix flex justify-between">
+            <span>{{ $t('communitySpaceManage.spaceInfo') }}</span>
+            <div style="float: right;">
+              <el-button type="primary" size="small" @click="openAddSpaceModal">
+                <i class="el-icon-plus"></i>
+                {{ $t('communitySpaceManage.addSpace') }}
+              </el-button>
+            </div>
+          </div>
+          <el-table :data="spaces" border style="width: 100%">
+            <el-table-column prop="spaceId" :label="$t('communitySpaceManage.spaceId')" align="center" />
+            <el-table-column prop="name" :label="$t('communitySpaceManage.name')" align="center" />
+            <el-table-column prop="startTime" :label="$t('communitySpaceManage.startTime')" align="center" />
+            <el-table-column prop="endTime" :label="$t('communitySpaceManage.endTime')" align="center" />
+            <el-table-column prop="feeMoney" :label="$t('communitySpaceManage.feeMoney')" align="center" />
+            <el-table-column prop="adminName" :label="$t('communitySpaceManage.adminName')" align="center" />
+            <el-table-column prop="tel" :label="$t('communitySpaceManage.tel')" align="center" />
+            <el-table-column prop="state" :label="$t('communitySpaceManage.state')" align="center">
+              <template slot-scope="scope">
+                {{ scope.row.state === '1001' ? $t('communitySpaceManage.status1001') :
+                  $t('communitySpaceManage.status2002') }}
+              </template>
+            </el-table-column>
+            <el-table-column :label="$t('communitySpaceManage.operation')" align="center" width="300">
+              <template slot-scope="scope">
+                <el-button size="mini" @click="openEditOpenTime(scope.row)">
+                  {{ $t('communitySpaceManage.openTime') }}
+                </el-button>
+                <el-button size="mini" type="primary" @click="openEditSpaceModal(scope.row)">
+                  {{ $t('communitySpaceManage.edit') }}
+                </el-button>
+                <el-button size="mini" type="danger" @click="openDeleteSpaceModal(scope.row)">
+                  {{ $t('communitySpaceManage.delete') }}
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <el-pagination style="margin-top: 20px;" @size-change="handleSizeChange" @current-change="handlePageChange"
+            :current-page="page.current" :page-sizes="[10, 20, 30, 50]" :page-size="page.size"
+            layout="total, sizes, prev, pager, next, jumper" :total="total">
+          </el-pagination>
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <!-- 子组件 -->
+    <add-community-space ref="addSpaceModal" @success="listSpaces" />
+    <edit-community-space ref="editSpaceModal" @success="listSpaces" />
+    <edit-community-space-open-time ref="editOpenTimeModal" />
+    <delete-community-space ref="deleteSpaceModal" @success="listSpaces" />
+    <add-community-venue ref="addVenueModal" @success="listVenues" />
+    <edit-community-venue ref="editVenueModal" @success="listVenues" />
+    <delete-community-venue ref="deleteVenueModal" @success="listVenues" />
+  </div>
+</template>
+
+<script>
+import { listCommunityVenue, listCommunitySpace } from '@/api/community/communitySpaceManageApi'
+import AddCommunitySpace from '@/components/community/AddCommunitySpace'
+import EditCommunitySpace from '@/components/community/EditCommunitySpace'
+import EditCommunitySpaceOpenTime from '@/components/community/EditCommunitySpaceOpenTime'
+import DeleteCommunitySpace from '@/components/community/DeleteCommunitySpace'
+import AddCommunityVenue from '@/components/community/AddCommunityVenue'
+import EditCommunityVenue from '@/components/community/EditCommunityVenue'
+import DeleteCommunityVenue from '@/components/community/DeleteCommunityVenue'
+
+export default {
+  name: 'CommunitySpaceManage',
+  components: {
+    AddCommunitySpace,
+    EditCommunitySpace,
+    EditCommunitySpaceOpenTime,
+    DeleteCommunitySpace,
+    AddCommunityVenue,
+    EditCommunityVenue,
+    DeleteCommunityVenue
+  },
+  data() {
+    return {
+      venues: [],
+      spaces: [],
+      conditions: {
+        spaceId: '',
+        name: '',
+        state: '',
+        venueId: '',
+        page: 1,
+        row: 10
+      },
+      page: {
+        current: 1,
+        size: 10,
+        total: 0
+      }
+    }
+  },
+  computed: {
+    total() {
+      return this.page.total
+    }
+  },
+  created() {
+    this.listVenues()
+  },
+  methods: {
+    async listVenues() {
+      try {
+        const res = await listCommunityVenue({
+          page: 1,
+          row: 100
+        })
+        this.venues = res.data
+        if (this.venues.length > 0) {
+          this.selectVenue(this.venues[0])
+        }
+      } catch (error) {
+        console.error('获取场馆列表失败:', error)
+      }
+    },
+
+    async listSpaces() {
+      try {
+        const res = await listCommunitySpace(this.conditions)
+        this.spaces = res.data
+        this.page.total = res.total
+      } catch (error) {
+        console.error('获取场地列表失败:', error)
+      }
+    },
+
+    selectVenue(venue) {
+      this.conditions.venueId = venue.venueId
+      this.listSpaces()
+    },
+
+    querySpaces() {
+      this.conditions.page = 1
+      this.listSpaces()
+    },
+
+    resetConditions() {
+      this.conditions.spaceId = ''
+      this.conditions.name = ''
+      this.conditions.state = ''
+      this.querySpaces()
+    },
+
+    handlePageChange(page) {
+      this.conditions.page = page
+      this.listSpaces()
+    },
+
+    handleSizeChange(size) {
+      this.conditions.row = size
+      this.listSpaces()
+    },
+
+    openAddSpaceModal() {
+      if (!this.conditions.venueId) {
+        this.$message.warning(this.$t('communitySpaceManage.selectVenue'))
+        return
+      }
+      this.$refs.addSpaceModal.open(this.conditions.venueId)
+    },
+
+    openEditSpaceModal(space) {
+      this.$refs.editSpaceModal.open(space)
+    },
+
+    openEditOpenTime(space) {
+      this.$refs.editOpenTimeModal.open(space)
+    },
+
+    openDeleteSpaceModal(space) {
+      this.$refs.deleteSpaceModal.open(space)
+    },
+
+    openAddVenueModal() {
+      this.$refs.addVenueModal.open()
+    },
+
+    openEditVenueModal() {
+      if (!this.conditions.venueId) {
+        this.$message.warning(this.$t('communitySpaceManage.selectVenue'))
+        return
+      }
+      const venue = this.venues.find(v => v.venueId === this.conditions.venueId)
+      if (venue) {
+        this.$refs.editVenueModal.open(venue)
+      }
+    },
+
+    openDeleteVenueModal() {
+      if (!this.conditions.venueId) {
+        this.$message.warning(this.$t('communitySpaceManage.selectVenue'))
+        return
+      }
+      const venue = this.venues.find(v => v.venueId === this.conditions.venueId)
+      if (venue) {
+        this.$refs.deleteVenueModal.open(venue)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.venue-list {
+  height: 100%;
+}
+
+.button-group {
+  margin-bottom: 15px;
+}
+
+.venue-scrollbar {
+  height: calc(100vh - 200px);
+}
+
+.venue-items {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.venue-items li {
+  padding: 12px 15px;
+  border-bottom: 1px solid #eee;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+
+.venue-items li:hover {
+  background-color: #f5f7fa;
+}
+
+.venue-items li.active {
+  background-color: #ecf5ff;
+  color: #409eff;
+  font-weight: bold;
+}
+
+.search-form {
+  display: flex;
+  flex-wrap: wrap;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/community/communitySpacePersonManageLang.js b/src/views/community/communitySpacePersonManageLang.js
new file mode 100644
index 0000000..589dc16
--- /dev/null
+++ b/src/views/community/communitySpacePersonManageLang.js
@@ -0,0 +1,92 @@
+export const messages = {
+  en: {
+    communitySpacePersonManage: {
+      searchConditions: 'Search Conditions',
+      more: 'More',
+      hide: 'Hide',
+      appointmentTimePlaceholder: 'Please select appointment time',
+      appointmentPersonPlaceholder: 'Please select appointment person',
+      appointmentTelPlaceholder: 'Please select appointment phone',
+      search: 'Search',
+      reset: 'Reset',
+      statePlaceholder: 'Please select state',
+      spacePlaceholder: 'Please select appointment space',
+      appointmentOrder: 'Appointment Order',
+      orderId: 'Order ID',
+      venue: 'Venue',
+      space: 'Space',
+      appointmentPerson: 'Appointment Person',
+      appointmentTel: 'Appointment Phone',
+      appointmentDate: 'Appointment Date',
+      appointmentTime: 'Appointment Time',
+      receivableAmount: 'Receivable Amount',
+      receivedAmount: 'Received Amount',
+      payWay: 'Payment Method',
+      state: 'State',
+      createTime: 'Create Time',
+      remark: 'Remark',
+      operation: 'Operation',
+      cancelAppointment: 'Cancel Appointment',
+      stateOptions: {
+        S: 'Appointment Success',
+        F: 'Appointment Failed',
+        W: 'Pending Review',
+        P: 'Pending Payment'
+      }
+    },
+    deleteCommunitySpacePerson: {
+      confirmTitle: 'Please confirm your operation!',
+      confirmContent: 'Confirm to cancel the site reservation? If it is an online reservation, it will be automatically refunded to the reservation account',
+      cancel: 'Cancel',
+      confirmCancel: 'Confirm Cancel'
+    },
+    common: {
+      total: 'Total'
+    }
+  },
+  zh: {
+    communitySpacePersonManage: {
+      searchConditions: '查询条件',
+      more: '更多',
+      hide: '隐藏',
+      appointmentTimePlaceholder: '请选择预约时间',
+      appointmentPersonPlaceholder: '请选择预约人',
+      appointmentTelPlaceholder: '请选择预约电话',
+      search: '查询',
+      reset: '重置',
+      statePlaceholder: '请选择状态',
+      spacePlaceholder: '请选择预约场地',
+      appointmentOrder: '预约订单',
+      orderId: '订单编号',
+      venue: '场馆',
+      space: '场地',
+      appointmentPerson: '预约人',
+      appointmentTel: '预约电话',
+      appointmentDate: '预约日期',
+      appointmentTime: '预约时间',
+      receivableAmount: '应收金额',
+      receivedAmount: '实收金额',
+      payWay: '支付方式',
+      state: '状态',
+      createTime: '创建时间',
+      remark: '备注',
+      operation: '操作',
+      cancelAppointment: '取消预约',
+      stateOptions: {
+        S: '预约成功',
+        F: '预约失败',
+        W: '待审核',
+        P: '待支付'
+      }
+    },
+    deleteCommunitySpacePerson: {
+      confirmTitle: '请确认您的操作！',
+      confirmContent: '确定取消场地预约，如果是线上预约，自动会退款到预约人账户',
+      cancel: '点错了',
+      confirmCancel: '确认取消'
+    },
+    common: {
+      total: '共'
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/community/communitySpacePersonManageList.vue b/src/views/community/communitySpacePersonManageList.vue
new file mode 100644
index 0000000..2b991b3
--- /dev/null
+++ b/src/views/community/communitySpacePersonManageList.vue
@@ -0,0 +1,232 @@
+<template>
+  <div class="app-container">
+    <!-- 查询条件 -->
+    <el-card class="box-card">
+      <div slot="header" class=" flex justify-between">
+        <span>{{ $t('communitySpacePersonManage.searchConditions') }}</span>
+        <el-button type="text" style="float: right; padding: 3px 0" @click="moreCondition = !moreCondition">{{
+          moreCondition ? $t('communitySpacePersonManage.hide') : $t('communitySpacePersonManage.more') }}</el-button>
+      </div>
+      <el-row :gutter="20">
+        <el-col :span="6">
+          <el-date-picker v-model="conditions.appointmentTime" type="datetime"
+            :placeholder="$t('communitySpacePersonManage.appointmentTimePlaceholder')" style="width:100%;"
+            value-format="yyyy-MM-dd HH:mm:ss" />
+        </el-col>
+        <el-col :span="6">
+          <el-input v-model="conditions.personName"
+            :placeholder="$t('communitySpacePersonManage.appointmentPersonPlaceholder')" clearable />
+        </el-col>
+        <el-col :span="6">
+          <el-input v-model="conditions.personTel"
+            :placeholder="$t('communitySpacePersonManage.appointmentTelPlaceholder')" clearable />
+        </el-col>
+        <el-col :span="6">
+          <el-button type="primary" @click="_queryCommunitySpacePersonMethod">{{ $t('communitySpacePersonManage.search')
+          }}</el-button>
+          <el-button @click="_resetCommunitySpacePersonMethod">{{ $t('communitySpacePersonManage.reset') }}</el-button>
+        </el-col>
+      </el-row>
+      <el-row v-show="moreCondition" :gutter="20" style="margin-top: 20px;">
+        <el-col :span="6">
+          <el-select v-model="conditions.state" :placeholder="$t('communitySpacePersonManage.statePlaceholder')" clearable
+            style="width:100%;">
+            <el-option v-for="(value, key) in stateOptions" :key="key" :label="value" :value="key" />
+          </el-select>
+        </el-col>
+        <el-col :span="6">
+          <el-select v-model="conditions.spaceId" :placeholder="$t('communitySpacePersonManage.spacePlaceholder')"
+            clearable style="width:100%;">
+            <el-option v-for="item in spaces" :key="item.spaceId" :label="item.name" :value="item.spaceId" />
+          </el-select>
+        </el-col>
+      </el-row>
+    </el-card>
+
+    <!-- 预约订单列表 -->
+    <el-card class="box-card" style="margin-top:20px;">
+      <div slot="header" class="flex justify-between">
+        <span>{{ $t('communitySpacePersonManage.appointmentOrder') }}</span>
+      </div>
+      <el-table v-loading="loading" :data="communitySpacePersons" border style="width: 100%">
+        <el-table-column prop="cspId" :label="$t('communitySpacePersonManage.orderId')" align="center" />
+        <el-table-column prop="venueName" :label="$t('communitySpacePersonManage.venue')" align="center" />
+        <el-table-column prop="spaceName" :label="$t('communitySpacePersonManage.space')" align="center" />
+        <el-table-column prop="personName" :label="$t('communitySpacePersonManage.appointmentPerson')" align="center" />
+        <el-table-column prop="personTel" :label="$t('communitySpacePersonManage.appointmentTel')" align="center" />
+        <el-table-column prop="appointmentTime" :label="$t('communitySpacePersonManage.appointmentDate')"
+          align="center" />
+        <el-table-column :label="$t('communitySpacePersonManage.appointmentTime')" align="center">
+          <template slot-scope="scope">
+            <div v-for="(time, index) in scope.row.times" :key="index">
+              <span> {{ formatTimes(scope.row.times) }}</span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="receivableAmount" :label="$t('communitySpacePersonManage.receivableAmount')"
+          align="center" />
+        <el-table-column prop="receivedAmount" :label="$t('communitySpacePersonManage.receivedAmount')" align="center" />
+        <el-table-column prop="payWayName" :label="$t('communitySpacePersonManage.payWay')" align="center" />
+        <el-table-column prop="stateName" :label="$t('communitySpacePersonManage.state')" align="center" />
+        <el-table-column prop="createTime" :label="$t('communitySpacePersonManage.createTime')" align="center" />
+        <el-table-column prop="remark" :label="$t('communitySpacePersonManage.remark')" align="center" />
+        <el-table-column :label="$t('communitySpacePersonManage.operation')" align="center" width="150">
+          <template slot-scope="scope">
+            <el-button v-if="scope.row.state === 'S'" type="text" size="small"
+              @click="_openDeleteCommunitySpacePersonModel(scope.row)">
+              {{ $t('communitySpacePersonManage.cancelAppointment') }}
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination :current-page="page.current" :page-sizes="[10, 20, 30, 50]" :page-size="page.size"
+        layout="total, sizes, prev, pager, next, jumper" :total="page.total" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange" />
+    </el-card>
+
+    <!-- 删除确认对话框 -->
+    <delete-community-space-person ref="deleteDialog" @success="handleSuccess" />
+  </div>
+</template>
+
+<script>
+import DeleteCommunitySpacePerson from '@/components/community/deleteCommunitySpacePerson'
+import { listCommunitySpacePerson, listCommunitySpace } from '@/api/community/communitySpacePersonManageApi'
+import { getCommunityId } from '@/api/community/communityApi'
+
+export default {
+  name: 'CommunitySpacePersonManageList',
+  components: {
+    DeleteCommunitySpacePerson
+  },
+  data() {
+    return {
+      loading: false,
+      moreCondition: false,
+      conditions: {
+        spaceId: '',
+        personName: '',
+        personTel: '',
+        appointmentTime: '',
+        state: '',
+        communityId: ''
+      },
+      communitySpacePersons: [],
+      spaces: [],
+      page: {
+        current: 1,
+        size: 10,
+        total: 0
+      },
+      stateOptions: {
+        'S': this.$t('communitySpacePersonManage.stateOptions.S'),
+        'F': this.$t('communitySpacePersonManage.stateOptions.F'),
+        'W': this.$t('communitySpacePersonManage.stateOptions.W'),
+        'P': this.$t('communitySpacePersonManage.stateOptions.P')
+      }
+    }
+  },
+  created() {
+    this.conditions.communityId = getCommunityId()
+    this._listCommunitySpacePersonCommunitySpaces()
+    this._listCommunitySpacePersons(this.page.current, this.page.size)
+  },
+  methods: {
+    // 获取预约订单列表
+    async _listCommunitySpacePersons(page, size) {
+      this.loading = true
+      try {
+        const params = {
+          ...this.conditions,
+          page,
+          row: size
+        }
+        const res = await listCommunitySpacePerson(params )
+        this.communitySpacePersons = res.data
+        this.page.total = res.total
+        this.page.current = page
+      } catch (error) {
+        this.$message.error(error.message || this.$t('common.fetchError'))
+      } finally {
+        this.loading = false
+      }
+    },
+    // 获取场地列表
+    async _listCommunitySpacePersonCommunitySpaces() {
+      try {
+        const params = {
+          page: 1,
+          row: 100,
+          communityId: this.conditions.communityId
+        }
+        const res = await listCommunitySpace( params )
+        this.spaces = res.data
+      } catch (error) {
+        this.$message.error(error.message || this.$t('common.fetchError'))
+      }
+    },
+    // 查询
+    _queryCommunitySpacePersonMethod() {
+      this.page.current = 1
+      this._listCommunitySpacePersons(this.page.current, this.page.size)
+    },
+    // 重置
+    _resetCommunitySpacePersonMethod() {
+      this.conditions = {
+        spaceId: '',
+        personName: '',
+        personTel: '',
+        appointmentTime: '',
+        state: '',
+        communityId: this.conditions.communityId
+      }
+      this._queryCommunitySpacePersonMethod()
+    },
+    // 打开删除确认模态框
+    _openDeleteCommunitySpacePersonModel(row) {
+      this.$refs.deleteDialog.open(row)
+    },
+    // 删除成功后刷新列表
+    handleSuccess() {
+      this._listCommunitySpacePersons(this.page.current, this.page.size)
+    },
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.page.size = val
+      this._listCommunitySpacePersons(this.page.current, val)
+    },
+    // 当前页改变
+    handleCurrentChange(val) {
+      this.page.current = val
+      this._listCommunitySpacePersons(val, this.page.size)
+    },
+    formatTimes(times) {
+      return times.map(t => t.hours).join(', ');
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  padding: 20px;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+.box-card {
+  margin-bottom: 20px;
+}
+
+.el-row {
+  margin-bottom: 10px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/community/reportCommunitySpaceLang.js b/src/views/community/reportCommunitySpaceLang.js
new file mode 100644
index 0000000..808526c
--- /dev/null
+++ b/src/views/community/reportCommunitySpaceLang.js
@@ -0,0 +1,72 @@
+export const messages = {
+    en: {
+        reportCommunitySpace: {
+            selectMonth: 'Select month',
+            appointmentTime: 'Appointment Time',
+            noSpace: 'No space set',
+            available: 'Available',
+            notAvailable: 'Not available'
+        },
+        addCommunitySpacePerson: {
+            title: 'Venue Reservation',
+            personName: 'Reserver Name',
+            personTel: 'Reserver Phone',
+            receivableAmount: 'Receivable Amount',
+            receivedAmount: 'Received Amount',
+            payWay: 'Payment Method',
+            appointmentTime: 'Appointment Time',
+            remark: 'Remark',
+            requiredPersonName: 'Required, please enter reserver name',
+            requiredPersonTel: 'Required, please enter reserver phone',
+            requiredReceivableAmount: 'Required, please enter receivable amount',
+            requiredReceivedAmount: 'Required, please enter received amount',
+            selectPayWay: 'Please select payment method',
+            requiredAppointmentTime: 'Required, please enter appointment time',
+            requiredRemark: 'Required, please enter remark',
+            maxPersonName: 'Reserver name cannot exceed 64 characters',
+            maxPersonTel: 'Reserver phone cannot exceed 11 characters',
+            maxReceivableAmount: 'Receivable amount cannot exceed 10 characters',
+            maxReceivedAmount: 'Received amount cannot exceed 10 characters',
+            maxRemark: 'Remark cannot exceed 512 characters',
+            cash: 'Cash',
+            wechat: 'WeChat',
+            alipay: 'Alipay',
+            requiredPayWay: 'Please select payment method'
+        }
+    },
+    zh: {
+        reportCommunitySpace: {
+            selectMonth: '请选择月份',
+            appointmentTime: '预约时间',
+            noSpace: '未设置场地',
+            available: '可预约',
+            notAvailable: '不可预约'
+        },
+        addCommunitySpacePerson: {
+            title: '场地预约',
+            personName: '预约人',
+            personTel: '预约电话',
+            receivableAmount: '应收金额',
+            receivedAmount: '实收金额',
+            payWay: '支付方式',
+            appointmentTime: '预约时间',
+            remark: '备注',
+            requiredPersonName: '必填，请填写预约人',
+            requiredPersonTel: '必填，请填写预约电话',
+            requiredReceivableAmount: '必填，请填写应收金额',
+            requiredReceivedAmount: '必填，请填写实收金额',
+            selectPayWay: '请选择支付方式',
+            requiredAppointmentTime: '必填，请填写预约时间',
+            requiredRemark: '必填，请填写备注',
+            maxPersonName: '预约人不能超过64个字符',
+            maxPersonTel: '预约电话不能超过11个字符',
+            maxReceivableAmount: '应收金额不能超过10个字符',
+            maxReceivedAmount: '实收金额不能超过10个字符',
+            maxRemark: '备注不能超过512个字符',
+            cash: '现金',
+            wechat: '微信',
+            alipay: '支付宝',
+            requiredPayWay: '请选择支付方式'
+        }
+    }
+}
diff --git a/src/views/community/reportCommunitySpaceList.vue b/src/views/community/reportCommunitySpaceList.vue
new file mode 100644
index 0000000..28b7c0d
--- /dev/null
+++ b/src/views/community/reportCommunitySpaceList.vue
@@ -0,0 +1,208 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="4">
+        <el-card class="box-card">
+          <div class="filter-container">
+            <el-date-picker v-model="queryParams.appointmentTime" type="month"
+              :placeholder="$t('reportCommunitySpace.selectMonth')" value-format="yyyy-MM" @change="fetchData" />
+          </div>
+          <el-scrollbar class="venue-scrollbar">
+            <ul class="venue-items">
+              <li v-for="(item, index) in venues" :key="index" :class="{ 'active': queryParams.venueId === item.venueId }"
+                @click="selectVenue(item)">
+                {{ item.name }}
+              </li>
+            </ul>
+          </el-scrollbar>
+        </el-card>
+      </el-col>
+
+      <el-col :span="20">
+        <el-card class="box-card">
+          <el-table :data="tableData" border style="width: 100%">
+            <el-table-column prop="time" :label="$t('reportCommunitySpace.appointmentTime')" width="100" align="center" />
+            <template v-if="communitySpaces.length > 0">
+              <el-table-column v-for="space in communitySpaces" :key="space.spaceId" :label="space.name" align="center">
+                <template slot-scope="{ $index }">
+                  <div v-if="getSpaceStatus($index, space) === 'available'">
+                    <el-button type="text" @click="openAddModal(space.spaceId, $index)">
+                      {{ $t('reportCommunitySpace.available') }}
+                    </el-button>
+                  </div>
+                  <div v-else>
+                    {{ getSpaceStatus($index, space) }}
+                  </div>
+                </template>
+              </el-table-column>
+            </template>
+            <el-table-column v-else :label="$t('reportCommunitySpace.noSpace')" align="center" />
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <add-community-space-person ref="addPersonDialog" @success="fetchData" />
+  </div>
+</template>
+
+<script>
+import { listCommunityVenue, listCommunitySpace, listCommunitySpacePerson } from '@/api/community/reportCommunitySpaceApi'
+import AddCommunitySpacePerson from '@/components/community/addCommunitySpacePerson'
+import { getCommunityId } from '@/api/community/communityApi'
+import { getDateYYYYMMDD } from '@/utils/dateUtil'
+
+export default {
+  name: 'ReportCommunitySpaceList',
+  components: { AddCommunitySpacePerson },
+  data() {
+    return {
+      queryParams: {
+        venueId: '',
+        appointmentTime: getDateYYYYMMDD(),
+        communityId: getCommunityId()
+      },
+      venues: [],
+      communitySpaces: [],
+      spacePersons: [],
+      tableData: Array.from({ length: 24 }, (_, i) => ({ time: `${i}` }))
+    }
+  },
+  created() {
+    this.fetchVenues()
+  },
+  methods: {
+    selectVenue(venue) {
+      this.queryParams.venueId = venue.venueId
+      this.fetchData()
+    },
+    async fetchVenues() {
+      try {
+        const params = {
+          page: 1,
+          row: 100,
+          communityId: this.queryParams.communityId
+        }
+        this.venues = await listCommunityVenue(params)
+        if (this.venues.length > 0) {
+          this.queryParams.venueId = this.venues[0].venueId
+          this.fetchData()
+        }
+      } catch (error) {
+        this.$message.error(this.$t('common.fetchFailed'))
+      }
+    },
+    async fetchData() {
+      if (!this.queryParams.venueId) return
+
+      try {
+        // 获取场地列表
+        const spaceParams = {
+          page: 1,
+          row: 100,
+          venueId: this.queryParams.venueId,
+          communityId: this.queryParams.communityId
+        }
+        this.communitySpaces = await listCommunitySpace(spaceParams)
+
+        // 获取预约记录
+        const personParams = {
+          page: 1,
+          row: 100,
+          venueId: this.queryParams.venueId,
+          appointmentTime: this.queryParams.appointmentTime,
+          communityId: this.queryParams.communityId,
+          state: 'S'
+        }
+        this.spacePersons = await listCommunitySpacePerson(personParams)
+      } catch (error) {
+        this.$message.error(this.$t('common.fetchFailed'))
+      }
+    },
+    getSpaceStatus(hour, space) {
+      // 检查场地是否在该小时不可用
+      const openTime = space.openTimes.find(t => t.hours == hour)
+      if (openTime && openTime.isOpen === 'N') {
+        return this.$t('reportCommunitySpace.notAvailable')
+      }
+
+      // 检查是否有预约
+      const person = this.spacePersons.find(p => p.spaceId === space.spaceId)
+      if (person) {
+        const timeSlot = person.times.find(t => t.hours == hour)
+        if (timeSlot) {
+          return `${person.personName} > ${person.personTel}`
+        }
+      }
+
+      return 'available'
+    },
+    openAddModal(spaceId, hour) {
+      const data = {
+        spaceId: spaceId,
+        hours: hour,
+        appointmentTime: this.queryParams.appointmentTime,
+        openTime: hour
+      }
+      this.$refs.addPersonDialog.open(data)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  padding: 20px;
+}
+
+.box-card {
+  margin-bottom: 20px;
+}
+
+.filter-container {
+  margin-bottom: 20px;
+}
+
+.venue-list {
+  max-height: calc(100vh - 200px);
+  overflow-y: auto;
+}
+
+.venue-items {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.venue-items li {
+  padding: 12px 15px;
+  border-bottom: 1px solid #eee;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+
+.venue-items li:hover {
+  background-color: #f5f7fa;
+}
+
+.venue-items li.active {
+  background-color: #ecf5ff;
+  color: #409eff;
+  font-weight: bold;
+}
+
+.venue-radio {
+  margin-bottom: 10px;
+  padding: 10px;
+  border-radius: 4px;
+  background: #f5f7fa;
+
+  &:hover {
+    background: #e4e7ed;
+  }
+
+  ::v-deep .el-radio__label {
+    padding-left: 10px;
+  }
+}
+</style>
\ No newline at end of file
--
libgit2 0.21.4