From 5786bd4f769a6883901babfa77d265fad2432102 Mon Sep 17 00:00:00 2001
From: lxd <1004405501@qq.com>
Date: Wed, 25 Jun 2025 16:35:23 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=88=90=E5=91=98=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E5=A2=9E=E5=8A=A0=E6=8E=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/person/index.ts               |  4 +-
 src/views/person/Personmember.vue     | 14 +++++--
 src/views/person/index.vue            | 17 ++++++---
 src/views/vip/components/becomvip.vue | 54 ++++++++++++++-------------
 4 files changed, 53 insertions(+), 36 deletions(-)

diff --git a/src/api/person/index.ts b/src/api/person/index.ts
index c1d2be39f..d405962ef 100644
--- a/src/api/person/index.ts
+++ b/src/api/person/index.ts
@@ -65,8 +65,8 @@ export const PersonApi = {
   },
 
   // 根据用户ID移除家庭组号
-  removeMembers: async (id: number) => {
-    return await request.put({ url: `/system/person/remove-members?id=` + id })
+  removeMembers: async (id: number,familyid:number) => {
+    return await request.put({ url: `/system/person/remove-members?id=` + id + `&familyid=` + familyid })
   },
 
   // 根据家庭组号查询成员
diff --git a/src/views/person/Personmember.vue b/src/views/person/Personmember.vue
index d839dea84..2197618e1 100644
--- a/src/views/person/Personmember.vue
+++ b/src/views/person/Personmember.vue
@@ -4,6 +4,7 @@
     title="成员列表"
     width="700px"
     destroy-on-close
+    @close="handleClose"
   >
     <div class="mb-15px">
       <el-button
@@ -62,6 +63,9 @@ import { PersonApi, PersonVO } from '@/api/person'
 import { ElMessage, ElMessageBox } from 'element-plus'
 
 defineOptions({ name: 'PersonMember' })
+
+const emit = defineEmits(['refresh'])
+
 // 成员列表弹窗
 const dialogVisible = ref(false)
 // 添加成员抽屉
@@ -72,8 +76,7 @@ const loading = ref(false)
 const memberList = ref<FamilyMember[]>([])
 // 当前成员
 const currentMember = ref<FamilyMember | null>(null)
-// 表单引用
-const formRef = ref()
+
 
 // 家庭成员接口
 interface FamilyMember {
@@ -196,7 +199,7 @@ const handleRemove = async (row: FamilyMember) => {
   try {
     loading.value = true
     // 调用后端API移除成员关联
-    await PersonApi.removeMembers(row.id)
+    await PersonApi.removeMembers(row.id,Number(row.familyid))
     
     // 从列表中移除
     const index = memberList.value.findIndex(member => member.id === row.id)
@@ -256,6 +259,11 @@ const handleCreateFamily = async () => {
   }
 }
 
+const handleClose = () => {
+  // 弹窗关闭时触发刷新事件
+  emit('refresh')
+}
+
 defineExpose({
   open
 })
diff --git a/src/views/person/index.vue b/src/views/person/index.vue
index b95559093..744d157da 100644
--- a/src/views/person/index.vue
+++ b/src/views/person/index.vue
@@ -40,27 +40,32 @@
           <el-form-item>
             <el-button @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
             <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
-            <el-button
+            <!-- <el-button
               type="primary"
               plain
               @click="openForm('create')"
             >
               <Icon icon="ep:plus" /> 新增
-            </el-button>
-            <el-button
+            </el-button> -->
+            <!-- <el-button
               type="success"
               plain
               @click="handleExport"
               :loading="exportLoading"
             >
               <Icon icon="ep:download" />导出
-            </el-button>
+            </el-button> -->
           </el-form-item>
         </el-form>
       </ContentWrap>
       <ContentWrap>
         <el-table v-loading="loading" :data="list">
-          <el-table-column label="编号" align="center" key="id" prop="id" width="80" />
+          <el-table-column label="编号" align="center" width="80">
+            <template #default="scope">
+              {{ (queryParams.pageNo - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+          <!-- <el-table-column label="编号" align="center" key="id" prop="id" width="80" /> -->
           <el-table-column
             label="姓名"
             align="center"
@@ -150,7 +155,7 @@
   <!-- 添加/修改表单 -->
   <PersonForm ref="formRef" @success="handleSuccess" />
   <!-- 成员列表弹窗 -->
-  <PersonMember ref="memberRef" />
+  <PersonMember ref="memberRef" @refresh="getList" />
   <!-- 设备绑定弹窗 -->
   <DeviceBind ref="deviceBindRef" />
 </template>
diff --git a/src/views/vip/components/becomvip.vue b/src/views/vip/components/becomvip.vue
index 1aa92f724..87dfd8a2a 100644
--- a/src/views/vip/components/becomvip.vue
+++ b/src/views/vip/components/becomvip.vue
@@ -342,8 +342,8 @@ const handleSubmit = async () => {
 .member-info-card {
   background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   border-radius: 12px;
-  padding: 20px;
-  margin-bottom: 24px;
+  padding: 16px;
+  margin-bottom: 16px;
   color: white;
   box-shadow: 0 8px 32px rgba(102, 126, 234, 0.3);
 }
@@ -355,8 +355,8 @@ const handleSubmit = async () => {
 }
 
 .avatar {
-  width: 50px;
-  height: 50px;
+  width: 40px;
+  height: 40px;
   background: rgba(255, 255, 255, 0.2);
   border-radius: 50%;
   display: flex;
@@ -366,7 +366,7 @@ const handleSubmit = async () => {
 }
 
 .avatar-icon {
-  font-size: 24px;
+  font-size: 20px;
   color: white;
 }
 
@@ -375,13 +375,13 @@ const handleSubmit = async () => {
 }
 
 .member-name {
-  font-size: 18px;
+  font-size: 16px;
   font-weight: 600;
   margin-bottom: 4px;
 }
 
 .member-phone {
-  font-size: 14px;
+  font-size: 13px;
   opacity: 0.8;
 }
 
@@ -401,7 +401,7 @@ const handleSubmit = async () => {
 .vip-duration-settings {
   background: #f8fafc;
   border-radius: 12px;
-  padding: 24px;
+  padding: 16px;
   border: 1px solid #e2e8f0;
 }
 
@@ -409,29 +409,29 @@ const handleSubmit = async () => {
   display: flex;
   align-items: center;
   gap: 8px;
-  font-size: 16px;
+  font-size: 15px;
   font-weight: 600;
   color: #1e293b;
-  margin-bottom: 20px;
+  margin-bottom: 16px;
 }
 
 .title-icon {
   color: #3b82f6;
-  font-size: 18px;
+  font-size: 16px;
 }
 
 .duration-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
-  gap: 20px;
-  margin-bottom: 20px;
+  gap: 16px;
+  margin-bottom: 16px;
 }
 
 /* 快速选择区域 */
 .quick-select {
   background: white;
   border-radius: 10px;
-  padding: 20px;
+  padding: 16px;
   border: 1px solid #e2e8f0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
   transition: all 0.3s ease;
@@ -449,7 +449,7 @@ const handleSubmit = async () => {
   font-size: 14px;
   font-weight: 500;
   color: #64748b;
-  margin-bottom: 16px;
+  margin-bottom: 12px;
 }
 
 .quick-icon {
@@ -464,9 +464,9 @@ const handleSubmit = async () => {
 }
 
 .quick-btn {
-  padding: 8px 12px;
+  padding: 6px 10px;
   border-radius: 8px;
-  font-size: 13px;
+  font-size: 12px;
   font-weight: 500;
   transition: all 0.3s ease;
 }
@@ -482,7 +482,7 @@ const handleSubmit = async () => {
 .custom-duration {
   background: white;
   border-radius: 10px;
-  padding: 20px;
+  padding: 16px;
   border: 1px solid #e2e8f0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
   transition: all 0.3s ease;
@@ -500,7 +500,7 @@ const handleSubmit = async () => {
   font-size: 14px;
   font-weight: 500;
   color: #64748b;
-  margin-bottom: 16px;
+  margin-bottom: 12px;
 }
 
 .custom-icon {
@@ -525,7 +525,7 @@ const handleSubmit = async () => {
 .duration-preview {
   background: linear-gradient(135deg, #10b981 0%, #059669 100%);
   border-radius: 10px;
-  padding: 20px;
+  padding: 16px;
   color: white;
   box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);
 }
@@ -536,7 +536,7 @@ const handleSubmit = async () => {
   gap: 8px;
   font-size: 14px;
   font-weight: 500;
-  margin-bottom: 16px;
+  margin-bottom: 12px;
   opacity: 0.9;
 }
 
@@ -547,14 +547,14 @@ const handleSubmit = async () => {
 .preview-content {
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: 6px;
 }
 
 .preview-item {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 8px 0;
+  padding: 6px 0;
   border-bottom: 1px solid rgba(255, 255, 255, 0.1);
 }
 
@@ -572,6 +572,10 @@ const handleSubmit = async () => {
   font-weight: 500;
   font-family: 'Courier New', monospace;
 }
+/* 按钮间距 */
+.el-button+.el-button{
+    margin-left: 0;
+}
 
 .preview-item .value.highlight {
   font-size: 16px;
@@ -584,7 +588,7 @@ const handleSubmit = async () => {
   display: flex;
   justify-content: flex-end;
   gap: 12px;
-  padding-top: 20px;
+  padding-top: 16px;
 }
 
 .cancel-btn,
@@ -592,7 +596,7 @@ const handleSubmit = async () => {
   display: flex;
   align-items: center;
   gap: 6px;
-  padding: 10px 20px;
+  padding: 8px 16px;
   border-radius: 8px;
   font-weight: 500;
   transition: all 0.3s ease;