修改成员管理 增加接口

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 })
   },
 
   // 根据家庭组号查询成员

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
 })

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>

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;