diff --git a/SafeCampus.WEB/src/api/interface/sys/usermanage/dormitory.ts b/SafeCampus.WEB/src/api/interface/sys/usermanage/dormitory.ts
new file mode 100644
index 0000000..c521a1a
--- /dev/null
+++ b/SafeCampus.WEB/src/api/interface/sys/usermanage/dormitory.ts
@@ -0,0 +1,50 @@
+/**
+ * @description 用户管理接口
+ * @license Apache License Version 2.0
+ * @Copyright (c) 2022-Now 少林寺驻北固山办事处大神父王喇嘛
+ * @remarks
+ * SimpleAdmin 基于 Apache License Version 2.0 协议发布，可用于商业项目，但必须遵守以下补充条款:
+ * 1.请不要删除和修改根目录下的LICENSE文件。
+ * 2.请不要删除和修改SimpleAdmin源码头部的版权声明。
+ * 3.分发源码时候，请注明软件出处 https://gitee.com/dotnetmoyu/SimpleAdmin
+ * 4.基于本软件的作品，只能使用 SimpleAdmin 作为后台服务，除外情况不可商用且不允许二次分发或开源。
+ * 5.请不得将本软件应用于危害国家安全、荣誉和利益的行为，不能以任何形式用于非法为目的的行为不要删除和修改作者声明。
+ * 6.任何基于本软件而产生的一切法律纠纷和责任，均于我司无关
+ */
+
+import { ReqPage } from "@/api";
+/**
+ * @Description: 寝室管理接口
+ * @Author: wwp
+ * @Date: 2024-07-24 15:34:54
+ */
+
+export namespace SysDormitory {
+  // 宿舍楼树信息
+  export interface DormitoryInfo {
+    id?: string | number | undefined;
+    name?: string | undefined;
+    gender?: boolean | undefined;
+    createTime?: string | undefined;
+  }
+  // 寝室列表传参
+  export interface Page extends ReqPage {
+    buildId?: string | undefined | number;
+    gender?: any;
+    name?: string | undefined;
+  }
+  // 寝室列表信息
+  export interface ChamberInfo {
+    id?: string | undefined | number;
+    name?: string | undefined;
+    gender?: boolean | undefined;
+    buildId?: string | undefined | number;
+    personCount?: string | undefined | number;
+    createTime?: string | undefined;
+  }
+  // 寝室分配人员
+  export interface ChamberPersonnel {
+    dormitoryId: string | undefined | number;
+    personIds: Array<string | number>;
+  }
+}
diff --git a/SafeCampus.WEB/src/api/interface/sys/usermanage/index.ts b/SafeCampus.WEB/src/api/interface/sys/usermanage/index.ts
index ee39b36..16330cf 100644
--- a/SafeCampus.WEB/src/api/interface/sys/usermanage/index.ts
+++ b/SafeCampus.WEB/src/api/interface/sys/usermanage/index.ts
@@ -14,3 +14,4 @@
  */
 export * from "./personnel";
 export * from "./clothing";
+export * from "./dormitory";
diff --git a/SafeCampus.WEB/src/api/modules/monitor/live.ts b/SafeCampus.WEB/src/api/modules/monitor/live.ts
index 7df33f7..52a0e20 100644
--- a/SafeCampus.WEB/src/api/modules/monitor/live.ts
+++ b/SafeCampus.WEB/src/api/modules/monitor/live.ts
@@ -86,9 +86,7 @@ const monitorLiveButtonCode = {
   /** 删除监控 */
   delete: "monitorLiveDelete",
   /** 批量删除监控 */
-  batchDelete: "monitorLiveBatchDelete",
-  /** 复制监控 */
-  copy: "monitorLiveCopy"
+  batchDelete: "monitorLiveBatchDelete"
 };
 
 export { monitorLIVEApi, monitorLiveButtonCode };
diff --git a/SafeCampus.WEB/src/api/modules/usermanage/dormitory.ts b/SafeCampus.WEB/src/api/modules/usermanage/dormitory.ts
new file mode 100644
index 0000000..2f20d08
--- /dev/null
+++ b/SafeCampus.WEB/src/api/modules/usermanage/dormitory.ts
@@ -0,0 +1,77 @@
+/**
+ * @description  单页管理接口
+ * @license Apache License Version 2.0
+ * @Copyright (c) 2022-Now 少林寺驻北固山办事处大神父王喇嘛
+ * @remarks
+ * SimpleAdmin 基于 Apache License Version 2.0 协议发布，可用于商业项目，但必须遵守以下补充条款:
+ * 1.请不要删除和修改根目录下的LICENSE文件。
+ * 2.请不要删除和修改SimpleAdmin源码头部的版权声明。
+ * 3.分发源码时候，请注明软件出处 https://gitee.com/dotnetmoyu/SimpleAdmin
+ * 4.基于本软件的作品，只能使用 SimpleAdmin 作为后台服务，除外情况不可商用且不允许二次分发或开源。
+ * 5.请不得将本软件应用于危害国家安全、荣誉和利益的行为，不能以任何形式用于非法为目的的行为不要删除和修改作者声明。
+ * 6.任何基于本软件而产生的一切法律纠纷和责任，均于我司无关
+ * @see https://gitee.com/dotnetmoyu/SimpleAdmin
+ */
+import { moduleRequest } from "@/api/request";
+import { ReqId, ResPage, ReqPersonId, SysDormitory } from "@/api/interface";
+const http = moduleRequest("/business/building/");
+const httpChamber = moduleRequest("/business/dormitory/");
+
+/**
+ * @Description: 单页管理
+ * @Author: wwp
+ * @Date: 2023-12-15 15:34:54
+ */
+const userManageDormitoryApi = {
+  // 获取宿舍楼树
+  list(params: any) {
+    return http.get("getNoPageList", params);
+  },
+  // 新增宿舍楼
+  addDormitory(params: any) {
+    return http.post("add", params);
+  },
+  // 修改宿舍楼
+  updateDormitory(params: any) {
+    return http.put("update", params);
+  },
+  // 删除宿舍楼
+  deleteDormitory(params: ReqId) {
+    return http.delete("delete", params);
+  },
+  // 获取寝室列表
+  page(params: SysDormitory.Page) {
+    return httpChamber.get("getPageList", params);
+  },
+  /** 新增寝室 */
+  add(params: SysDormitory.ChamberInfo) {
+    return httpChamber.post("add", params);
+  },
+  /** 修改寝室 */
+  update(params: SysDormitory.ChamberInfo) {
+    return httpChamber.put("update", params);
+  },
+  /** 删除寝室 */
+  delete(params: ReqId) {
+    return httpChamber.delete("delete", params);
+  },
+  /**寝室分配人员*/
+  assignPersonnel(params: SysDormitory.ChamberPersonnel) {
+    return httpChamber.post("assignPersonnel", params);
+  }
+  /** 获取单页详情 */
+  // detail(params: ReqId) {
+  //   return http.get("getPersionById", params);
+  // },
+};
+
+const dormitoryButtonCode = {
+  /** 新增人员 */
+  add: "userManageDormitoryAdd",
+  /** 删除人员 */
+  edit: "userManageDormitoryEdit",
+  /** 删除人员 */
+  delete: "userManageDormitoryDelete"
+};
+
+export { userManageDormitoryApi, dormitoryButtonCode };
diff --git a/SafeCampus.WEB/src/api/modules/usermanage/index.ts b/SafeCampus.WEB/src/api/modules/usermanage/index.ts
index 1252d8b..4021a98 100644
--- a/SafeCampus.WEB/src/api/modules/usermanage/index.ts
+++ b/SafeCampus.WEB/src/api/modules/usermanage/index.ts
@@ -17,3 +17,4 @@ export * from "./classManage";
 export * from "./clothing";
 export * from "./teacher";
 export * from "./keyPersonnel";
+export * from "./dormitory";
diff --git a/SafeCampus.WEB/src/views/home/index.vue b/SafeCampus.WEB/src/views/home/index.vue
index aac05c4..83e372a 100644
--- a/SafeCampus.WEB/src/views/home/index.vue
+++ b/SafeCampus.WEB/src/views/home/index.vue
@@ -27,7 +27,7 @@
                   </div>
                   <div class="home-bg-content-item-content">
                     <div class="home-bg-content-item-title">告警信息总量</div>
-                    <div class="home-bg-content-item-value">197218</div>
+                    <div class="home-bg-content-item-value">1972</div>
                   </div>
                 </div></el-col
               >
@@ -350,27 +350,27 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
 const tableData = ref([
   {
     type: "今日",
-    warntotal: "828",
-    lowrisk: "675",
-    highrisk: "153"
+    warntotal: "20",
+    lowrisk: "10",
+    highrisk: "10"
   },
   {
     type: "本周",
-    warntotal: "828",
-    lowrisk: "675",
-    highrisk: "153"
+    warntotal: "50",
+    lowrisk: "20",
+    highrisk: "30"
   },
   {
     type: "本月",
-    warntotal: "19813",
-    lowrisk: "17671",
-    highrisk: "2129"
+    warntotal: "198",
+    lowrisk: "176",
+    highrisk: "22"
   },
   {
     type: "上月",
-    warntotal: "21789",
-    lowrisk: "0",
-    highrisk: "0"
+    warntotal: "10",
+    lowrisk: "5",
+    highrisk: "5"
   },
 
   {
diff --git a/SafeCampus.WEB/src/views/monitor/live/index.scss b/SafeCampus.WEB/src/views/monitor/live/index.scss
index 819b8c5..0bb21c2 100644
--- a/SafeCampus.WEB/src/views/monitor/live/index.scss
+++ b/SafeCampus.WEB/src/views/monitor/live/index.scss
@@ -30,7 +30,8 @@
       .node-label {
         width: 100px;
         overflow: hidden;
-        font-size: 16px;
+
+        // font-size: 16px;
         text-overflow: ellipsis;
         white-space: nowrap;
       }
@@ -50,7 +51,7 @@
       }
     }
     :deep(.el-tree-node__content) {
-      height: 50px;
+      height: 33px;
     }
   }
   .el-input {
diff --git a/SafeCampus.WEB/src/views/monitor/live/index.vue b/SafeCampus.WEB/src/views/monitor/live/index.vue
index 4bdf96b..385582f 100644
--- a/SafeCampus.WEB/src/views/monitor/live/index.vue
+++ b/SafeCampus.WEB/src/views/monitor/live/index.vue
@@ -30,12 +30,12 @@
             <span class="custom-tree-node">
               <span class="node-label" :title="node.label">{{ node.label }}</span>
               <span v-if="data.id && data.id != '-1'">
-                <!-- <el-icon size="16" title="添加" @click.stop="append('add', data)"><CirclePlus /></el-icon> -->
-                <el-icon size="16" title="编辑" @click.stop="append('edit', data)" style="margin-left: 8px"><Edit /></el-icon>
+                <el-icon size="16" title="添加分组" @click.stop="append('addChild', data)"><CirclePlus /></el-icon>
+                <el-icon size="16" title="编辑分组" @click.stop="append('edit', data)" style="margin-left: 8px"><Edit /></el-icon>
                 <el-icon size="16" title="设置推送人" @click.stop="pushPerson(FormOptEnum.GroupPushPerson, data)" style="margin-left: 8px"
                   ><UserFilled
                 /></el-icon>
-                <el-icon size="16" title="删除" @click.stop="remove(data.id, '删除该分组')" style="margin-left: 8px"><Delete /></el-icon>
+                <el-icon size="16" title="删除分组" @click.stop="remove(data.id, '删除该分组')" style="margin-left: 8px"><Delete /></el-icon>
               </span>
             </span>
           </template>
@@ -235,7 +235,10 @@ const groupVisible = ref(false); //是否显示表单
 const groupTitle = ref("新增分组");
 const groupForm = reactive({
   name: "",
-  id: ""
+  id: "",
+  parentId: ""
+});
+const groupFormRules = ref({
 });
 const groupRules = ref({
   name: [{ required: true, message: "请输入分组名称", trigger: "blur" }]
@@ -245,13 +248,19 @@ const closeGroup = () => {
   groupVisible.value = false;
   groupFormRef.value.resetFields();
   groupForm.name = "";
+  groupForm.id = "";
+  groupForm.parentId = "";
 };
+const groupFormType = ref<any>(null);
 // 新增编辑分组
 const append = (type: string, data: Tree) => {
   groupVisible.value = true;
+  groupFormType.value = type
   if (type == "edit") {
     groupForm.name = data.name;
     groupForm.id = data.id;
+  } else if(type == "addChild") {
+    groupForm.parentId = data.id
   }
 };
 // 删除分组
@@ -265,18 +274,30 @@ const onSubmit = () => {
     if (valid) {
       let params: any = reactive({
         id: "",
-        name: groupForm.name
+        name: groupForm.name,
+        parentId: groupForm.parentId
       });
-      if (!groupForm.id) {
-        monitorLIVEApi.addGroup(params).then(res => {
+      console.log(groupFormType)
+      if (groupFormType.value == 'add') {
+        delete params.parentId;
+        monitorLIVEApi.addGroup(params).then((res:any) => {
           if (res.code == 200) {
             getGroupList();
             closeGroup();
           }
         });
-      } else {
+      } else if(groupFormType.value == 'edit') {
         params.id = groupForm.id;
-        monitorLIVEApi.updateGroup(params).then(res => {
+        delete params.parentId;
+        monitorLIVEApi.updateGroup(params).then((res:any) => {
+          if (res.code == 200) {
+            getGroupList();
+            closeGroup();
+          }
+        });
+      } else if(groupFormType.value == 'addChild') {
+        delete params.id;
+        monitorLIVEApi.addGroup(params).then((res:any) => {
           if (res.code == 200) {
             getGroupList();
             closeGroup();
diff --git a/SafeCampus.WEB/src/views/sysconfig/ability/index.vue b/SafeCampus.WEB/src/views/sysconfig/ability/index.vue
index 802862e..66424b0 100644
--- a/SafeCampus.WEB/src/views/sysconfig/ability/index.vue
+++ b/SafeCampus.WEB/src/views/sysconfig/ability/index.vue
@@ -4,63 +4,73 @@
  * @Date: 2023-12-15 15:44:05
 !-->
 <template>
-  <div class="abilityBox">
-    <TreeFilter ref="treeFilter" title="摄像头分组" label="name" id="id" width="300px" :request-api="monitorLIVEApi.groupList" @change="changeGroup">
-    </TreeFilter>
+  <div class="table-box">
+    <div class="abilityBox">
+      <TreeFilter
+        ref="treeFilter"
+        title="摄像头分组"
+        label="name"
+        id="id"
+        width="300px"
+        :request-api="monitorLIVEApi.groupList"
+        @change="changeGroup"
+      >
+      </TreeFilter>
 
-    <TreeFilter
-      ref="treeFilters"
-      title="摄像头列表"
-      label="sensorName"
-      id="sensorId"
-      :isData="true"
-      width="300px"
-      :data="videoList"
-      @change="changeVideo"
-    >
-    </TreeFilter>
+      <TreeFilter
+        ref="treeFilters"
+        title="摄像头列表"
+        label="sensorName"
+        id="sensorId"
+        :isData="true"
+        width="300px"
+        :data="videoList"
+        @change="changeVideo"
+      >
+      </TreeFilter>
 
-    <div class="card content-main">
-      <el-collapse accordion>
-        <el-collapse-item :name="ins" v-for="(item, ins) in warnGroupList" :key="item.cameraId[0]">
-          <template #title>
-            <div class="collapse-title" @click.stop="">
-              <div class="titlemodel">
-                <div style="width: 220px; text-align: left">{{ item.name }} {{ item.cameraId[0] }}</div>
-                <div style="margin-left: 20px">
-                  <el-button @click="pushPerson(FormOptEnum.VideoPushPerson, item)" type="primary" size="small">设置推送人</el-button>
+      <div class="card content-main">
+        <el-collapse accordion>
+          <el-collapse-item :name="ins" v-for="(item, ins) in warnGroupList" :key="item.code">
+            <template #title>
+              <div class="collapse-title" @click.stop="">
+                <div class="titlemodel">
+                  <div style="width: 220px; text-align: left">{{ item.name }}</div>
+                  <div style="margin-left: 20px">
+                    <el-button @click="pushPerson(FormOptEnum.VideoPushPerson, item)" type="primary" size="small">设置推送人</el-button>
+                  </div>
+                </div>
+                <div class="btns">
+                  <el-switch v-model="item.state" @change="stateChange" />
                 </div>
               </div>
-              <div class="btns">
-                <el-switch v-model="item.state" @change="stateChange" />
-              </div>
-            </div>
-          </template>
-          <div class="collapse-content">
-            <!-- <div class="contentinfo" v-for="(v, index) in item.subset" :key="v.code">
+            </template>
+            <div class="collapse-content">
+              <!-- <div class="contentinfo" v-for="(v, index) in item.subset" :key="v.code">
             <div class="modellabel">{{ v.name }}</div>
 
             <div class="btns">
               <el-switch v-model="v.state" active-text="开启" inactive-text="关闭" />
             </div>
           </div> -->
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="6" v-for="v in item.subset" :key="v.code">
-                <div class="contentinfo">
-                  <div class="modellabel">{{ v.name }}</div>
+              <el-row :gutter="20">
+                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="6" v-for="v in item.subset" :key="v.code">
+                  <div class="contentinfo">
+                    <div class="modellabel">{{ v.name }}</div>
 
-                  <div class="btns">
-                    <el-switch :disabled="item.state == false" v-model="v.state" @change="stateChange" />
+                    <div class="btns">
+                      <el-switch :disabled="item.state == false" v-model="v.state" @change="stateChange" />
+                    </div>
                   </div>
-                </div>
-              </el-col>
-            </el-row>
-          </div>
-        </el-collapse-item>
-      </el-collapse>
+                </el-col>
+              </el-row>
+            </div>
+          </el-collapse-item>
+        </el-collapse>
+      </div>
+      <!-- 人员选择 -->
+      <userForm ref="userFormRef" />
     </div>
-    <!-- 人员选择 -->
-    <userForm ref="userFormRef" />
   </div>
 </template>
 
@@ -92,7 +102,7 @@ enum FormOptEnum {
 }
 onMounted(() => {
   // 在这里执行其他需要在组件挂载后运行的代码
-  getwarnGroup();
+  getwarnGroup('');
   getVideoList('')
 });
 const treeFilter = ref<InstanceType<typeof TreeFilter> | null>(null);
@@ -111,6 +121,7 @@ function getVideoList(id:any) {
 }
 function changeVideo(val: number | string) {
   console.log(val)
+  getwarnGroup(val);
   // personSetId.value = val
   // proTable.value!.pageable.pageNum = 1;
   // proTable.value!.searchParam.personSetId = val;
@@ -121,9 +132,9 @@ function changeVideo(val: number | string) {
 
 // 获取配置树
 let warnGroupList = ref<any>([]);
-function getwarnGroup() {
+function getwarnGroup(id) {
   setTimeout(async () => {
-    await abilityApi.warnGroup({}).then((res:any) => {
+    await abilityApi.warnGroup({cameraId: id}).then((res:any) => {
       let { code, data } = res;
       if (code == 200) {
         warnGroupList.value = data;
diff --git a/SafeCampus.WEB/src/views/userManage/dormitory/components/form/form_basic.vue b/SafeCampus.WEB/src/views/userManage/dormitory/components/form/form_basic.vue
new file mode 100644
index 0000000..fa85a84
--- /dev/null
+++ b/SafeCampus.WEB/src/views/userManage/dormitory/components/form/form_basic.vue
@@ -0,0 +1,137 @@
+<!-- 
+ * @Description: 人员表单
+ * @Author: syy 
+ * @Date: 2023-12-15 15:45:50
+-->
+<template>
+  <div class="userManageForm">
+    <div>
+      <el-row :gutter="16">
+        <el-col :span="12">
+          <s-form-item label="寝室名称" prop="name">
+            <s-input v-model="userInfo.name"></s-input>
+          </s-form-item>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { SysUserPersonnel, userManagePersonnelApi, userManageClassManageApi } from "@/api";
+import { Plus } from "@element-plus/icons-vue";
+import { useUserStore } from "@/stores/modules";
+import type { UploadProps } from "element-plus";
+import { ElMessage } from "element-plus";
+import { TokenEnum } from "@/enums";
+// props
+interface FormProps {
+  modelValue: Partial<SysUserPersonnel.SysUserPerInfo>;
+}
+const emit = defineEmits(["update:modelValue"]); //定义emit
+const props = defineProps<FormProps>(); //定义props
+// 人员信息
+const userInfo = computed({
+  get: () => props.modelValue,
+  set: val => emit("update:modelValue", val)
+});
+/*  */
+const userStore = useUserStore();
+const { accessToken } = userStore;
+const fileList = ref<any>([]);
+const faces = ref<SysUserPersonnel.SysUserAvatar[]>([]);
+const dialogImageUrl = ref("");
+const dialogVisible = ref(false);
+const treeData = ref<any>([]);
+const handleRemove: UploadProps["onRemove"] = (uploadFile: any) => {
+  const index = faces.value.findIndex(item => item.uid === uploadFile.uid);
+  if (index > -1) {
+    faces.value.splice(index, 1);
+  }
+  userInfo.value.faces = faces.value;
+  if (uploadFile.personId) {
+    userManagePersonnelApi.deleteFace({ personId: uploadFile.personId, faceIds: [uploadFile.uid] }).then(res => {});
+  }
+};
+
+const handlePictureCardPreview: UploadProps["onPreview"] = uploadFile => {
+  dialogImageUrl.value = uploadFile.url!;
+  dialogVisible.value = true;
+};
+const handleAvatarSuccess: UploadProps["onSuccess"] = (response, uploadFile) => {
+  if (response.code === 200) {
+    faces.value.push({ faceUrl: response.data, uid: uploadFile.uid });
+    userInfo.value.faces = faces.value;
+    ElMessage.success(response.msg);
+  } else {
+    ElMessage.error(response.msg);
+    fileList.value = fileList.value.splice(0, fileList.value.length - 1);
+  }
+};
+const handleAvatarError: UploadProps["onError"] = (error, uploadFile, uploadFiles) => {
+  console.log(error, uploadFile, uploadFiles, "err");
+};
+// 通用状态选项
+const genderOptions = ref([
+  {
+    label: "未知",
+    value: "GENDER_UNKNOWN"
+  },
+  {
+    label: "男",
+    value: "GENDER_MALE"
+  },
+  {
+    label: "女",
+    value: "GENDER_FEMALE"
+  }
+]);
+const getRequestData = async () => {
+  const { data } = await userManageClassManageApi.page();
+  treeData.value = data;
+};
+onMounted(() => {
+  // 初始化
+  userInfo.value.gender = userInfo.value.gender ? userInfo.value.gender : genderOptions.value[0].value;
+  getRequestData();
+  if (userInfo.value.personId) {
+    if (userInfo.value.faces?.length > 0) {
+      fileList.value = [
+        ...JSON.parse(JSON.stringify(userInfo.value.faces)).map((item: any) => {
+          return {
+            url: item.faceUrl,
+            uid: item.faceId,
+            personId: userInfo.value.personId
+          };
+        })
+      ];
+      faces.value = [
+        ...JSON.parse(JSON.stringify(userInfo.value.faces)).map((item: any) => {
+          return {
+            faceUrl: item.faceUrl,
+            uid: item.faceId,
+            personId: userInfo.value.personId
+          };
+        })
+      ];
+    }
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-input__wrapper) {
+  width: 100% !important;
+}
+:deep(.el-date-editor.el-input) {
+  width: 92% !important;
+}
+:deep(.el-upload-list--picture-card .el-upload-list__item) {
+  width: 100px !important;
+  height: 100px !important;
+}
+:deep(.el-upload--picture-card) {
+  width: 100px !important;
+  height: 100px !important;
+}
+</style>
diff --git a/SafeCampus.WEB/src/views/userManage/dormitory/components/form/index.vue b/SafeCampus.WEB/src/views/userManage/dormitory/components/form/index.vue
new file mode 100644
index 0000000..5237eb1
--- /dev/null
+++ b/SafeCampus.WEB/src/views/userManage/dormitory/components/form/index.vue
@@ -0,0 +1,119 @@
+<!-- 
+ * @Description: 表单
+ * @Author: syy 
+ * @Date: 2023-12-15 15:45:59
+-->
+<template>
+  <div>
+    <form-container v-model="visible" :title="`${sysUserProps.opt}人员`" form-size="800px" @close="onClose">
+      <el-form
+        ref="sysUserFormRef"
+        :rules="rules"
+        :disabled="sysUserProps.disabled"
+        :model="sysUserProps.record"
+        :hide-required-asterisk="sysUserProps.disabled"
+        label-width="auto"
+        label-suffix=" :"
+      >
+        <el-tabs v-model="activeName">
+          <Basic v-model="sysUserProps.record"></Basic>
+        </el-tabs>
+      </el-form>
+      <template #footer>
+        <el-button @click="onClose"> 取消 </el-button>
+        <el-button v-show="!sysUserProps.disabled" type="primary" @click="handleSubmit"> 确定 </el-button>
+      </template>
+    </form-container>
+  </div>
+</template>
+
+<script setup lang="ts" name="SysUserPersonnelForm">
+import { SysUserPersonnel, userManagePersonnelApi } from "@/api";
+import { FormOptEnum } from "@/enums";
+import { required } from "@/utils/formRules";
+import { FormInstance } from "element-plus";
+import Basic from "./form_basic.vue";
+
+const visible = ref(false); //是否显示表单
+const activeName = ref("basic");
+// 表单参数
+const sysUserProps = reactive<FormProps.Base<SysUserPersonnel.SysUserPerInfo>>({
+  opt: FormOptEnum.ADD,
+  record: {},
+  disabled: false
+});
+
+// 表单验证规则
+const rules = reactive({
+  // personId: [required("请输入人员ID")],
+  name: [required("请输入姓名")],
+  gender: [required("请选择性别")],
+  faces: [required("请上传人脸图片")],
+  phone: [required("请输入手机号")]
+  // extData: [required("请输入扩展数据")]
+});
+
+/**
+ * 打开表单
+ * @param props 表单参数
+ */
+function onOpen(props: FormProps.Base<SysUserPersonnel.SysUserPerInfo>) {
+  Object.assign(sysUserProps, props); //合并参数
+  if (props.opt == FormOptEnum.ADD) {
+    //如果是新增,设置默认值
+    // sysUserProps.record.sortCode = 99;
+  }
+  visible.value = true; //显示表单
+  if (props.record.personId) {
+    //如果传了id，就去请求api获取record
+    userManagePersonnelApi.detail({ id: props.record.personId }).then((res: any) => {
+      sysUserProps.record = res.data;
+    });
+  }
+}
+
+// 提交数据（新增/编辑）
+const sysUserFormRef = ref<FormInstance>();
+/** 提交表单 */
+async function handleSubmit() {
+  sysUserFormRef.value?.validate(async valid => {
+    if (!valid) return; //表单验证失败
+    //提交表单
+    if (sysUserProps.record.faces.length === 0) {
+      return ElMessage.error("请上传人脸图片");
+    }
+    if (sysUserProps.record.personId) {
+      await userManagePersonnelApi
+        .update(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    } else {
+      await userManagePersonnelApi
+        .add(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    }
+  });
+}
+
+/** 关闭表单*/
+function onClose() {
+  visible.value = false;
+  activeName.value = "basic";
+}
+
+// 暴露给父组件的方法
+defineExpose({
+  onOpen
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/SafeCampus.WEB/src/views/userManage/dormitory/components/formClass/index.vue b/SafeCampus.WEB/src/views/userManage/dormitory/components/formClass/index.vue
new file mode 100644
index 0000000..27ecf4a
--- /dev/null
+++ b/SafeCampus.WEB/src/views/userManage/dormitory/components/formClass/index.vue
@@ -0,0 +1,107 @@
+<!-- 
+ * @Description: 表单
+ * @Author: syy 
+ * @Date: 2023-12-15 15:45:59
+-->
+<template>
+  <div>
+    <form-container v-model="visibleClass" :title="`${sysUserProps.opt}宿舍楼`" form-size="400px" @close="onClose">
+      <el-form
+        ref="sysUserFormRef"
+        :rules="rules"
+        :disabled="sysUserProps.disabled"
+        :model="sysUserProps.record"
+        :hide-required-asterisk="sysUserProps.disabled"
+        label-width="auto"
+        label-suffix=" :"
+      >
+        <div>
+          <el-row :gutter="16">
+            <el-col :span="22">
+              <s-form-item label="宿舍楼名称" prop="personSetName">
+                <s-input v-model="sysUserProps.record.personSetName"></s-input>
+              </s-form-item>
+            </el-col>
+          </el-row>
+        </div>
+      </el-form>
+      <template #footer>
+        <el-button @click="onClose"> 取消 </el-button>
+        <el-button v-show="!sysUserProps.disabled" type="primary" @click="handleSubmit"> 确定 </el-button>
+      </template>
+    </form-container>
+  </div>
+</template>
+
+<script setup lang="ts" name="SysUserPerformClass">
+import { ref } from "vue";
+import { SysDormitory, userManageClassManageApi } from "@/api";
+import { FormOptEnum } from "@/enums";
+import { required } from "@/utils/formRules";
+import { FormInstance } from "element-plus";
+
+const visibleClass = ref(false); //是否显示表单
+// 表单参数
+const sysUserProps = reactive<FormProps.Base<SysDormitory.DormitoryInfo>>({
+  opt: FormOptEnum.ADD,
+  record: {},
+  disabled: false
+});
+// 表单验证规则
+const rules = reactive({
+  personSetName: [required("请输入班级名称")]
+});
+
+/**
+ * 打开表单
+ * @param props 表单参数
+ */
+function onOpen(props: FormProps.Base<SysDormitory.DormitoryInfo>) {
+  Object.assign(sysUserProps, props); //合并参数
+  visibleClass.value = true; //显示表单
+  sysUserProps.record = props.record;
+}
+
+// 提交数据（新增/编辑）
+const sysUserFormRef = ref<FormInstance>();
+/** 提交表单 */
+async function handleSubmit() {
+  sysUserFormRef.value?.validate(async valid => {
+    if (!valid) return; //表单验证失败
+    sysUserProps.record.name = sysUserProps.record.personSetName;
+    //提交表单
+    if (sysUserProps.record.personSetId) {
+      sysUserProps.record.id = sysUserProps.record.personSetId;
+      await userManageClassManageApi
+        .update(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    } else {
+      await userManageClassManageApi
+        .add(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    }
+  });
+}
+
+/** 关闭表单*/
+function onClose() {
+  visibleClass.value = false;
+}
+
+// 暴露给父组件的方法
+defineExpose({
+  onOpen
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/SafeCampus.WEB/src/views/userManage/dormitory/components/formTeacher/index.vue b/SafeCampus.WEB/src/views/userManage/dormitory/components/formTeacher/index.vue
new file mode 100644
index 0000000..bb94ca5
--- /dev/null
+++ b/SafeCampus.WEB/src/views/userManage/dormitory/components/formTeacher/index.vue
@@ -0,0 +1,116 @@
+<!-- 
+ * @Description: 表单
+ * @Author: syy 
+ * @Date: 2023-12-15 15:45:59
+-->
+<template>
+  <div>
+    <form-container v-model="visibleClass" :title="`${sysUserProps.opt}`" form-size="400px" @close="onClose">
+      <el-form
+        ref="sysUserFormRef"
+        :rules="rules"
+        :disabled="sysUserProps.disabled"
+        :model="sysUserProps.record"
+        :hide-required-asterisk="sysUserProps.disabled"
+        label-width="auto"
+        label-suffix=" :"
+      >
+        <div>
+          <el-row :gutter="16">
+            <el-col :span="22">
+              <s-form-item label="班主任" prop="userId">
+                <s-select v-model="sysUserProps.record.userId" :options="teacherData" label="name" value="userId"></s-select>
+              </s-form-item>
+            </el-col>
+          </el-row>
+        </div>
+      </el-form>
+      <template #footer>
+        <el-button @click="onClose"> 取消 </el-button>
+        <el-button v-show="!sysUserProps.disabled" type="primary" @click="handleSubmit"> 确定 </el-button>
+      </template>
+    </form-container>
+  </div>
+</template>
+
+<script setup lang="ts" name="SysUserPerformClass">
+import { ref } from "vue";
+import { SysUserPersonnel, userManageTeacherApi } from "@/api";
+import { required } from "@/utils/formRules";
+import { FormInstance } from "element-plus";
+const teacherData = ref<any>([]);
+const visibleClass = ref(false); //是否显示表单
+// 表单参数
+enum FormOptEnum {
+  /** 新增 */
+  AddTeacher = "绑定班主任",
+  /** 编辑 */
+  UpdateTeacher = "修改班主任"
+}
+const sysUserProps = reactive<FormProps.Base<SysUserPersonnel.ClassPage>>({
+  opt: FormOptEnum.AddTeacher,
+  record: {},
+  disabled: false
+});
+// 表单验证规则
+const rules = reactive({
+  userId: [required("请选择班主任名称")]
+});
+
+/**
+ * 打开表单
+ * @param props 表单参数
+ */
+function onOpen(props: FormProps.Base<SysUserPersonnel.ClassPage>) {
+  getRequestData();
+  Object.assign(sysUserProps, props); //合并参数
+  visibleClass.value = true; //显示表单
+  sysUserProps.record = props.record;
+}
+
+const getRequestData = async () => {
+  const { data } = await userManageTeacherApi.page();
+  teacherData.value = data;
+};
+
+// 提交数据（新增/编辑）
+const sysUserFormRef = ref<FormInstance>();
+/** 提交表单 */
+async function handleSubmit() {
+  sysUserFormRef.value?.validate(async valid => {
+    if (!valid) return; //表单验证失败
+    console.log(sysUserProps);
+    //提交表单
+    if (sysUserProps.opt === FormOptEnum.UpdateTeacher) {
+      await userManageTeacherApi
+        .update(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    } else {
+      await userManageTeacherApi
+        .add(sysUserProps.record)
+        .then(() => {
+          sysUserProps.successful!(); //调用父组件的successful方法
+        })
+        .finally(() => {
+          onClose();
+        });
+    }
+  });
+}
+
+/** 关闭表单*/
+function onClose() {
+  visibleClass.value = false;
+}
+// 暴露给父组件的方法
+defineExpose({
+  onOpen
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/SafeCampus.WEB/src/views/userManage/dormitory/index.vue b/SafeCampus.WEB/src/views/userManage/dormitory/index.vue
new file mode 100644
index 0000000..06ce807
--- /dev/null
+++ b/SafeCampus.WEB/src/views/userManage/dormitory/index.vue
@@ -0,0 +1,285 @@
+<!-- 
+ * @Description: 寝室管理
+ * @Author: syy 
+ * @Date: 2024-7-15
+-->
+<template>
+  <div class="main-box">
+    <TreeFilter
+      ref="treeFilter"
+      title="宿舍楼管理"
+      label="name"
+      id="id"
+      width="300px"
+      :show-all="true"
+      :request-api="userManageDormitoryApi.list"
+      @change="changeTreeFilter"
+    >
+      <template v-slot:header>
+        <s-button suffix="宿舍楼" @click="addDormitory(FormOptEnum.ADD)" style="margin-bottom: 15px" />
+      </template>
+      <template v-slot:label="{ row }">
+        <span class="custom-tree-node">
+          <span>{{ row.node.label }}</span>
+          <span v-if="row.node.label != '全部'">
+            <a :title="FormOptEnum.EDIT" @click.stop="addDormitory(FormOptEnum.EDIT, row.node.data)">
+              <el-icon><Edit /></el-icon>
+            </a>
+            <a :title="FormOptEnum.DELETE" style="margin-left: 8px" @click.stop="addDelete(row.node.data.personSetId, '删除宿舍楼')">
+              <el-icon><Delete /></el-icon>
+            </a>
+          </span>
+        </span>
+      </template>
+    </TreeFilter>
+    <div class="table-box">
+      <ProTable ref="proTable" title="寝室管理" :columns="columns" rowKey="personId" :request-api="userManageDormitoryApi.page">
+        <!-- 表格 header 按钮 -->
+        <template #tableHeader="scope">
+          <s-button v-auth="dormitoryButtonCode.add" suffix="寝室" @click="onOpen(FormOptEnum.ADD, { personSetId: personSetId })" />
+          <s-button
+            v-auth="dormitoryButtonCode.delete"
+            type="danger"
+            :opt="FormOptEnum.DELETE"
+            plain
+            suffix="寝室"
+            :disabled="!scope.isSelected"
+            @click="onDelete(scope.selectedListIds, '删除所选寝室')"
+          />
+        </template>
+        <!-- 表格操作栏 -->
+        <template #operation="scope">
+          <el-space>
+            <s-button v-auth="dormitoryButtonCode.edit" link :opt="FormOptEnum.EDIT" @click="onOpen(FormOptEnum.EDIT, scope.row)" />
+            <s-button v-auth="dormitoryButtonCode.delete" link :opt="FormOptEnum.DELETE" @click="onDelete([scope.row.personId], `删除寝室`)" />
+            <!-- <el-dropdown @command="handleCommand">
+              <el-link type="primary" :underline="false" :icon="ArrowDown"> 更多 </el-link>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item :command="command(scope.row, cmdEnum.AddFace)"
+                    ><el-upload
+                      ref="upload"
+                      class="upload-demo"
+                      action="/api/business/personApi/uploadFile"
+                      :show-file-list="false"
+                      :on-success="handleAvatarSuccess"
+                      accept=".jpg, .jpeg, .png"
+                      :headers="{
+                        Authorization: `${TokenEnum.TOKEN_PREFIX} ${accessToken}`
+                      }"
+                    >
+                      <template #trigger>
+                        {{ cmdEnum.AddFace }}
+                      </template>
+                    </el-upload>
+                  </el-dropdown-item>
+                  <el-dropdown-item :command="command(scope.row, cmdEnum.UnderpantsUnBinding)">
+                    {{ cmdEnum.UnderpantsUnBinding }}
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown> -->
+          </el-space>
+        </template>
+      </ProTable>
+    </div>
+    <!-- 寝室新增/编辑表单 -->
+    <Form ref="formRef"></Form>
+    <!-- 宿舍楼新增/编辑表单 -->
+    <FormClass ref="formRefC" />
+    <!-- 班主任绑定/修改 -->
+    <FormTeacher ref="formRefT" />
+    <!-- 预览头像 -->
+    <el-dialog v-model="visible" title="查看头像" width="830px" :before-close="handleClose">
+      <div style="display: flex; align-items: center; justify-content: center">
+        <img style="max-width: 100%; max-height: 600px" class="detailpic" :src="faceUrl" alt="" />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script setup lang="tsx" name="SysDormitory">
+import { userManageDormitoryApi,dormitoryButtonCode,SysDormitory } from "@/api";
+import { useHandleData } from "@/hooks/useHandleData";
+import { FormOptEnum } from "@/enums";
+import Form from "./components/form/index.vue";
+import FormClass from "./components/formClass/index.vue";
+import FormTeacher from "./components/formTeacher/index.vue";
+import { ArrowDown,More } from "@element-plus/icons-vue";
+import { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
+import TreeFilter from "@/components/TreeFilter/index.vue";
+import { useUserStore } from "@/stores/modules";
+import { TokenEnum } from "@/enums";
+import type { UploadProps } from "element-plus";
+// 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
+const faceUrl = ref('');
+const visible = ref(false); //是否显示寝室表单
+const proTable = ref<ProTableInstance>();
+const treeFilter = ref<InstanceType<typeof TreeFilter> | null>(null);
+const userStore = useUserStore();
+const { accessToken } = userStore;
+// 表格配置项
+const columns: ColumnProps<SysDormitory.ChamberInfo>[] = [
+  { type: "selection", fixed: "left", width: 50 },
+  {
+    prop: "name",
+    label: "寝室名称"
+  },
+  {
+    prop: "personId",
+    label: "寝室数量"
+  },
+ 
+  // { prop: "operation", label: "操作", width: 250, fixed: "right" }
+];
+const viewHeadImage = (scope: any) => {
+  faceUrl.value = scope.row.faces[0].faceUrl;
+  visible.value = true
+  console.log(faceUrl);
+};
+const handleClose = () => {
+  visible.value = false;
+};
+const tableData = ref([
+  {
+    name: "203",
+    personId: "20",
+  },
+  
+]);
+
+// 寝室表单引用
+const formRef = ref<InstanceType<typeof Form> | null>(null);
+// 宿舍楼表单引用
+const formRefC = ref<InstanceType<typeof FormClass> | null>(null);
+// 宿舍楼表单引用
+const formRefT = ref<InstanceType<typeof FormTeacher> | null>(null);
+
+/**
+ * 打开表单
+ * @param opt  操作类型
+ * @param record  记录
+ */
+function onOpen(opt: FormOptEnum, record: {} | SysDormitory.ChamberInfo = {}) {
+  formRef.value?.onOpen({ opt: opt, record: record, successful: RefreshTable });
+}
+
+/**
+ * 打开宿舍楼表单
+ * @param opt  操作类型
+ * @param record  记录
+ */
+
+ function addDormitory(opt: FormOptEnum, record: {} | SysDormitory.DormitoryInfo = {}) {
+  formRefC.value?.onOpen({ opt: opt, record: JSON.parse(JSON.stringify(record)), successful: RefreshTable });
+}
+/**
+ * 宿舍楼删除
+ * @param ids  id数组
+ */
+ async function addDelete(id: string[],msg: string) {
+  // 二次确认 => 请求api => 刷新表格
+  await useHandleData(userManageClassManageApi.delete, { id }, msg);
+  RefreshTable(); //刷新表格
+}
+
+/**
+ * 寝室删除
+ * @param ids  id数组
+ */
+ async function onDelete(ids: string[], msg: string) {
+  if(ids.length === 0){
+    ElMessage({
+      message: '请选择要删除的寝室',
+      type: 'warning'
+    });
+    return
+  }
+  // 二次确认 => 请求api => 刷新表格
+  await useHandleData(userManagePersonnelApi.delete, {id: ids.join(",") }, msg);
+  RefreshTable(); //刷新表格
+}
+
+// 刷新表格
+const RefreshTable = () => {
+  proTable.value?.refresh();
+  treeFilter.value?.refresh(); //刷新树形筛选器
+}
+
+
+/** 更多下拉菜单命令枚举 */
+enum cmdEnum {
+  AddFace = "添加人脸",
+  UnderpantsUnBinding = "底库解绑"
+}
+/** 下拉菜单参数接口 */
+interface Command {
+  row: SysDormitory.ChamberInfo;
+  command: cmdEnum;
+}
+
+/**配置command的参数 */
+function command(row: SysDormitory.ChamberInfo, command: cmdEnum): Command {
+  return {
+    row: row,
+    command: command
+  };
+}
+/**
+ * 列表更多下拉菜单点击事件
+ * @param command
+ */
+const personId = ref<number | string>(); //寝室id
+function handleCommand(command: Command) {
+  switch (command.command) {
+    case cmdEnum.AddFace:
+      personId.value = command.row.personId; //获取寝室id
+      break
+    case cmdEnum.UnderpantsUnBinding:
+      userManagePersonnelApi.personUnBindDfie({
+        personId:command.row.personId,
+        personSetId: command.row.personSets[0].personSetId
+      }).then(res=>{
+          ElMessage.success('底库解绑成功');
+          RefreshTable()
+      })
+      break;
+  }
+}
+
+
+const handleAvatarSuccess: UploadProps["onSuccess"] = (response) => {
+  if (response.code === 200) {
+    userManagePersonnelApi.addFace({
+      personId: personId.value,
+      faceUrl: response.data
+    }).then(res=>{
+      RefreshTable()
+    })
+  } else {
+    ElMessage.error(response.msg);
+  }
+};
+
+/** 部门切换 */
+const personSetId = ref<number | string>()
+function changeTreeFilter(val: number | string) {
+  personSetId.value = val
+  proTable.value!.pageable.pageNum = 1;
+  proTable.value!.searchParam.personSetId = val;
+  proTable.value!.search();
+}
+</script>
+<style scoped lang="scss">
+.table-box {
+  width: 100%;
+  height: 100%;
+}
+.custom-tree-node {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-between;
+  padding-right: 8px;
+  font-size: 14px;
+}
+</style>
diff --git a/SafeCampus.WEB/src/views/warn/zjrq/index.vue b/SafeCampus.WEB/src/views/warn/zjrq/index.vue
index 71136fd..4e37b29 100644
--- a/SafeCampus.WEB/src/views/warn/zjrq/index.vue
+++ b/SafeCampus.WEB/src/views/warn/zjrq/index.vue
@@ -43,19 +43,26 @@
         <img class="detailpic" :src="detailData.snapshotUrl" alt="" />
         <el-row :gutter="20">
           <el-col :span="12">
-            <div class="linebox">告警内容：{{ detailData.alarmTypeDesc }}</div>
+            <div class="linebox">所属学校：演示学校</div>
           </el-col>
           <el-col :span="12">
-            <div class="linebox">告警时间：{{ detailData.tick }}</div>
+            <div class="linebox">班级：{{ detailData.personSetName ? detailData.personSetName : "暂无数据" }}</div>
+          </el-col>
+          <el-col :span="12">
+            <div class="linebox">姓名：{{ detailData.personName ? detailData.personName : "暂无数据" }}</div>
+          </el-col>
+          <el-col :span="12">
+            <div class="linebox">告警摄像头：{{ detailData.cameraName }}</div>
           </el-col>
           <el-col :span="12">
-            <div class="linebox">告警位置：{{ detailData.cameraName }}</div>
+            <div class="linebox">告警类型：{{ detailData.alarmTypeDesc }}</div>
           </el-col>
           <el-col :span="12">
-            <div class="linebox">所属门店：演示设备</div>
+            <div class="linebox">告警时间：{{ detailData.tick }}</div>
           </el-col>
+
           <el-col :span="12">
-            <div class="linebox">备注信息：{{ detailData.extend }}</div>
+            <div class="linebox">备注信息：{{ detailData.extend ? detailData.extend : "暂无数据" }}</div>
           </el-col>
           <el-col :span="12">
             <div class="linebox">
@@ -165,12 +172,20 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
       return "演示学校";
     }
   },
+  
   {
-    prop: "cameraId",
-    label: "所属摄像头",
-    render: () => {
-      return "楼道";
-    }
+    prop: "personSetName",
+    label: "班级",
+    // render: () => {
+    //   return "楼道";
+    // }
+  },
+  {
+    prop: "cameraName",
+    label: "告警摄像头",
+    // render: () => {
+    //   return "楼道";
+    // }
   },
   {
     prop: "snapshotUrl",
@@ -181,6 +196,14 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [
       );
     }
   },
+  {
+    prop: "personName",
+    label: "姓名",
+    // render: () => {
+    //   return "楼道";
+    // }
+  },
+  
   {
     prop: "alarmType",
     label: "告警类型",