From 9429fe96c7e88f989108e54073060b389b128b42 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=AA=E5=B0=91=E4=BC=9F?= <wsw.sun@qq.com>
Date: Tue, 18 Mar 2025 15:33:54 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=AA=E4=BA=BA=E4=B8=AD=E5=BF=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../PersonalCenter 2/Detail/EarlyWarning.vue  |  39 ++
 .../Detail/EarlyWarningDetail.vue             | 106 +++
 .../Detail/EarlyWarningOrganization.vue       |  61 ++
 .../Detail/EarlyWarningPerson.vue             |  60 ++
 .../Detail/InvitationNoticeList.vue           |  74 +++
 .../Detail/OrgSubscription.vue                |  42 ++
 .../Detail/PersonageSubscription.vue          |  41 ++
 .../PersonalCenter 2/Detail/SubscribeList.vue |  21 +
 .../OrganizationManage/OrganizationManage.vue | 466 ++++++++++++++
 src/views/Jyh/PersonalCenter 2/index.vue      | 288 +++++++++
 .../Detail/EarlyWarningDetail.vue             |  63 +-
 .../Detail/PersonalSettings.vue               |  39 ++
 .../OrganizationManage/OrganizationManage.vue | 603 ++++++++----------
 .../Jyh/PersonalCenter/PersonalBasic.vue      |  58 ++
 src/views/Jyh/PersonalCenter/index.vue        |  31 +-
 15 files changed, 1618 insertions(+), 374 deletions(-)
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/EarlyWarning.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningDetail.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningOrganization.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningPerson.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/InvitationNoticeList.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/OrgSubscription.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/PersonageSubscription.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/Detail/SubscribeList.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/OrganizationManage/OrganizationManage.vue
 create mode 100644 src/views/Jyh/PersonalCenter 2/index.vue
 create mode 100644 src/views/Jyh/PersonalCenter/Detail/PersonalSettings.vue
 create mode 100644 src/views/Jyh/PersonalCenter/PersonalBasic.vue

diff --git a/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarning.vue b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarning.vue
new file mode 100644
index 0000000..ca97a06
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarning.vue	
@@ -0,0 +1,39 @@
+<template>
+  <div class="version-info">
+    <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-4" type="wrapped" v-model="selectTab">
+      <d-tab id="gryj" title="个人预警通知列表"></d-tab>
+      <d-tab id="zzyj" title="组织预警通知列表"></d-tab>
+    </d-tabs>
+    <EarlyWarningPerson v-if="selectTab==='gryj'"/>
+    <EarlyWarningOrganization v-if="selectTab==='zzyj'"/>
+  </div>
+</template>
+
+<script setup lang="ts">
+
+import { ref } from 'vue';
+import EarlyWarningPerson from './EarlyWarningPerson.vue';
+import EarlyWarningOrganization from './EarlyWarningOrganization.vue';
+const selectTab = ref('gryj');
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+
+
+</style>
+
+<style lang="scss">
+.warning-modal {
+  width: auto;
+
+  .devui-modal__header {
+    font-size: 20px;
+    height: auto!important;
+  }
+
+  .devui-modal__body {
+    padding: 0;
+  }
+} 
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningDetail.vue b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningDetail.vue
new file mode 100644
index 0000000..bd51fd9
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningDetail.vue	
@@ -0,0 +1,106 @@
+<template>
+  <div class="warning-detail-container">
+    <div class="warning-title">
+      <div>{{ warningData.title }}</div>
+      <div class="sub-title mt-3">
+        <span>重要性</span>
+        <d-tag type="danger" size="sm">{{warningData.importance}}</d-tag>
+      </div>
+    </div>
+    <div class="warning-text">
+      <div class="text-box mb-5">
+        <div>一、概要</div>
+        <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ warningData.summary }}</p>
+      </div>
+      <div class="text-box">
+        <div>二、修复方案</div>
+        <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ warningData.fixMethod }}</p>
+      </div>
+    </div>
+    <div :style="{'border-radius': propsData.type === 'user' ? '6px' : 0}" class="warning-from">可信开源代码库运营团队 {{ warningData.fromTime }}</div>
+    <div v-if="propsData.type === 'system'" class="warning-operation">
+      <d-button @click="confirm" variant="solid" class="mr-2">确定</d-button>
+      <d-button @click="$emit('close')">取消</d-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+const emit = defineEmits(['close']);
+const propsData = defineProps(['type', 'warningData']);
+const warningData = ref({
+  title: '【漏洞排查预警】ApacheIgnite远程代码执行漏洞排查（CVE-2024-52577)',
+  importance: '高',
+  summary: '近日，安全中心发现Apache lgnite远程代码执行漏洞（CVE-2024-52577）。在 2.6.0<Apache Ignite< 2.17.0版本中，由于lgnite未能正确实施类序列化过滤器，攻击者能够利用恶意序列化对象绕过安全检查，从而在服务器端反序列化时触发任意代码的执行。经可信开源代码库运营团队评审漏洞技术定级2级/3级，若不满足利用条件可举证降为6级。请你按要求在XX时间内完成修复。',
+  fixMethod: '升级Apache Ignite至安全版本：2.17.0',
+  fromTime: '2025-2-20'
+});
+// warningData.value = propsData.warningData;
+const confirm = () => {
+  emit('close');
+};
+</script>
+
+<style scoped lang="scss">
+.warning-detail-container {
+  width: 600px;
+
+  .warning-title {
+    color: #000000;
+    font-family: HarmonyOS Sans SC;
+    font-weight: 600;
+    font-size: 20px;
+    line-height: 28px;
+    padding: 4px 20px 12px;
+
+    .sub-title {
+      >span {
+        margin-right: 12px;
+        color: #808080;
+        font-family: HarmonyOS Sans SC;
+        font-size: 12px;
+      }
+    }
+  }
+  
+  .warning-text {
+    padding: 20px;
+    background: #F6F6F8;
+
+    .text-box {
+
+      div {
+        margin-bottom: 8px;
+        color: #252B3A;
+        font-family: HarmonyOS Sans SC;
+        font-weight: 600;
+        font-size: 16px;
+        line-height: 24px;
+      }
+
+      p {
+        color: #252B3A;
+        font-family: 苹方-简;
+        font-size: 14px;
+        line-height: 24px;
+      }
+    }
+  }
+
+  .warning-from {
+    background: #F6F6F8;
+    color: #808080;
+    font-family: HarmonyOS Sans SC;
+    font-size: 14px;
+    text-align: center;
+    padding: 20px;
+  }
+
+  .warning-operation {
+    text-align: center;
+    padding: 20px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningOrganization.vue b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningOrganization.vue
new file mode 100644
index 0000000..2f7492a
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningOrganization.vue	
@@ -0,0 +1,61 @@
+<template>
+  <Card simple class="jyh-card mt-3">
+    <div class="card-title">组织预警通知列表</div>
+    <div class="mb-3">
+      <d-table class="jyh-table jyh-table-2" :header-bg="true" :data="licenseTableData">
+        <d-column field="code" header="时间"></d-column>
+        <d-column field="name" header="标题">
+          <template #default="scope">
+            <a @click="openWarningDetail(scope.row)">{{ scope.row.name }}</a>
+          </template>
+        </d-column>
+        <d-column field="detail" header="详情"></d-column>
+        <d-column field="owner" header="订阅人"></d-column>
+        <d-column field="level" header="级别">
+          <template #default="scope, text">
+            <d-status v-if="scope.row.level === 4" type="error">危险</d-status>
+            <d-status v-if="scope.row.level === 3" type="warning">严重</d-status>
+            <d-status v-if="scope.row.level === 2" class="yellow-status">一般</d-status>
+            <d-status v-if="scope.row.level === 1" type="running">提示</d-status>
+          </template>
+        </d-column>
+        <d-column field="status" header="状态">
+          <template #default="scope, text">
+            <d-tag v-if="scope.row.status === 1" type="danger" size="sm">未读</d-tag>
+            <d-tag v-if="scope.row.status === 2" type="success" size="sm">已读</d-tag>
+          </template>
+        </d-column>
+      </d-table>
+    </div>
+  </Card>
+
+  <d-modal class="warning-modal" v-model="warningModalVisable" title="主题：">
+    <EarlyWarningDetail @close="colseWarningDetail" :warningData="currentWarning" type="user"></EarlyWarningDetail>
+  </d-modal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import EarlyWarningDetail from '@/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue';
+
+const licenseTableData = ref([
+  { code: '05822156', name: 'MIT License', detail: 'integer', owner: 'admin', level: 4, status: 1 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', owner: 'admin', level: 3, status: 2 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', owner: 'admin', level: 2, status: 2 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', owner: 'admin', level: 1, status: 2 }
+]);
+
+const warningModalVisable = ref(false);
+const currentWarning = ref();
+const openWarningDetail = (row) => {
+  warningModalVisable.value = true;
+  currentWarning.value = row;
+};
+const colseWarningDetail = () => {
+  warningModalVisable.value = false;
+};
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningPerson.vue b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningPerson.vue
new file mode 100644
index 0000000..f74c7c3
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/EarlyWarningPerson.vue	
@@ -0,0 +1,60 @@
+<template>
+  <Card simple class="jyh-card mt-3">
+    <div class="card-title">个人预警通知列表</div>
+    <div class="mb-3">
+      <d-table class="jyh-table jyh-table-2" :header-bg="true" :data="licenseTableData">
+        <d-column field="code" header="时间"></d-column>
+        <d-column field="name" header="标题">
+          <template #default="scope">
+            <a @click="openWarningDetail(scope.row)">{{ scope.row.name }}</a>
+          </template>
+        </d-column>
+        <d-column field="detail" header="详情"></d-column>
+        <d-column field="level" header="级别">
+          <template #default="scope, text">
+            <d-status v-if="scope.row.level === 4" type="error">危险</d-status>
+            <d-status v-if="scope.row.level === 3" type="warning">严重</d-status>
+            <d-status v-if="scope.row.level === 2" class="yellow-status">一般</d-status>
+            <d-status v-if="scope.row.level === 1" type="running">提示</d-status>
+          </template>
+        </d-column>
+        <d-column field="status" header="状态">
+          <template #default="scope, text">
+            <d-tag v-if="scope.row.status === 1" type="danger" size="sm">未读</d-tag>
+            <d-tag v-if="scope.row.status === 2" type="success" size="sm">已读</d-tag>
+          </template>
+        </d-column>
+      </d-table>
+    </div>
+  </Card>
+
+  <d-modal class="warning-modal" v-model="warningModalVisable" title="主题：">
+    <EarlyWarningDetail @close="colseWarningDetail" :warningData="currentWarning" type="user"></EarlyWarningDetail>
+  </d-modal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import EarlyWarningDetail from '@/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue';
+
+const licenseTableData = ref([
+  { code: '05822156', name: 'MIT License', detail: 'integer', level: 4, status: 1 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', level: 3, status: 2 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', level: 2, status: 1 },
+  { code: '05822156', name: 'MIT License', detail: 'integer', level: 1, status: 2 }
+]);
+
+const warningModalVisable = ref(false);
+const currentWarning = ref();
+const openWarningDetail = (row) => {
+  warningModalVisable.value = true;
+  currentWarning.value = row;
+};
+const colseWarningDetail = () => {
+  warningModalVisable.value = false;
+};
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/InvitationNoticeList.vue b/src/views/Jyh/PersonalCenter 2/Detail/InvitationNoticeList.vue
new file mode 100644
index 0000000..08b08d2
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/InvitationNoticeList.vue	
@@ -0,0 +1,74 @@
+<template>
+  <div class="invitation-notice-container">
+    <Card simple class="jyh-card mt-3">
+      <div class="card-title">邀请通知列表</div>
+      <div class="mb-3">
+        <d-table
+          class="jyh-table jyh-table-2"
+          :header-bg="true"
+          :data="noticeTableData"
+        >
+          <d-column field="content" header="邀请内容"></d-column>
+          <d-column field="time" header="邀请时间" width="200"></d-column>
+          <d-column field="creator" header="邀请人" width="180"></d-column>
+          <d-column header="操作" width="150">
+            <template #default="scope">
+              <d-button
+                variant="text"
+                color="primary"
+                class="mr-2"
+              >
+                接收
+              </d-button>
+              <d-button
+                variant="text"
+                color="primary"
+              >
+                拒绝
+              </d-button>
+            </template>
+          </d-column>
+        </d-table>
+        <div class="invitation-pagination">
+          <d-pagination
+            style="display: inline-flex;"
+            :total="pager.total"
+            v-model:pageSize="pager.pageSize"
+            v-model:pageIndex="pager.pageIndex"
+            :can-view-total="true"
+            :can-change-page-size="true"
+            :can-jump-page="true"
+            :max-items="5"
+          />
+        </div>
+      </div>
+    </Card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, shallowReactive } from 'vue';
+
+const noticeTableData = ref([
+  {
+    content: '当您订阅的软件有漏洞预警通知时，将以应用号的方式通知。可在首页查看或取消订阅！',
+    time: '2025-03-15 17:29:30',
+    creator: '132456798',
+  }
+]);
+const pager = shallowReactive({
+  total: 1,
+  pageIndex: 1,
+  pageSize: 10,
+  pageSizeOptions: [10, 20, 30, 40, 50],
+});
+</script>
+
+<style lang="scss" scoped>
+.invitation-notice-container {
+  .invitation-pagination {
+    padding: 12px 0;
+    text-align: right;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/OrgSubscription.vue b/src/views/Jyh/PersonalCenter 2/Detail/OrgSubscription.vue
new file mode 100644
index 0000000..b147f2d
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/OrgSubscription.vue	
@@ -0,0 +1,42 @@
+<template>
+  <Card simple class="jyh-card mt-3">
+    <div class="card-title">组织订阅列表</div>
+    <div class="mb-3">
+      <d-table class="jyh-table jyh-table-2" :header-bg="true" :data="tableData">
+        <d-column field="code" header="订阅时间"></d-column>
+        <d-column field="name" header="软件/组件名称"></d-column>
+        <d-column field="detail" header="版本号"></d-column>
+        <d-column field="owner" header="订阅人"></d-column>
+        <d-column header="操作" width="100">
+          <template #default="scope">
+            <d-popover>
+              <d-button variant="text" color="primary"> 取消订阅 </d-button>
+              <template #content>
+                <div class="popover-content">
+                  <p>确定取消{{ scope.row.name }}订阅吗？</p>
+                  <footer>
+                    <d-button @click="hidden" size="sm">取消</d-button>
+                    <d-button @click="hidden" size="sm" color="danger" variant="solid">确认</d-button>
+                  </footer>
+                </div>
+              </template>
+            </d-popover>
+          </template>
+        </d-column>
+      </d-table>
+    </div>
+  </Card>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+const tableData = ref([{ code: '05822156', name: 'MIT License', detail: 'integer', owner: 'admin' }]);
+const hidden = () => {
+  // 模拟body点击操作
+  document.querySelector('body')?.click();
+};
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/PersonageSubscription.vue b/src/views/Jyh/PersonalCenter 2/Detail/PersonageSubscription.vue
new file mode 100644
index 0000000..256f89f
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/PersonageSubscription.vue	
@@ -0,0 +1,41 @@
+<template>
+  <Card simple class="jyh-card mt-3">
+    <div class="card-title">个人订阅列表</div>
+    <div class="mb-3">
+      <d-table class="jyh-table jyh-table-2" :header-bg="true" :data="tableData">
+        <d-column field="code" header="订阅时间"></d-column>
+        <d-column field="name" header="软件/组件名称"></d-column>
+        <d-column field="detail" header="版本号"></d-column>
+        <d-column header="操作" width="100">
+          <template #default="scope">
+            <d-popover>
+              <d-button variant="text" color="primary"> 取消订阅 </d-button>
+              <template #content>
+                <div class="popover-content">
+                  <p>确定取消{{ scope.row.name }}订阅吗？</p>
+                  <footer>
+                    <d-button @click="hidden" size="sm">取消</d-button>
+                    <d-button @click="hidden" size="sm" color="danger" variant="solid">确认</d-button>
+                  </footer>
+                </div>
+              </template>
+            </d-popover>
+          </template>
+        </d-column>
+      </d-table>
+    </div>
+  </Card>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+const tableData = ref([{ code: '05822156', name: 'MIT License', detail: 'integer' }]);
+const hidden = () => {
+  // 模拟body点击操作
+  document.querySelector('body')?.click();
+};
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/Detail/SubscribeList.vue b/src/views/Jyh/PersonalCenter 2/Detail/SubscribeList.vue
new file mode 100644
index 0000000..f794160
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/Detail/SubscribeList.vue	
@@ -0,0 +1,21 @@
+<template>
+  <div class="version-info">
+    <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-4" type="wrapped" v-model="selectTab">
+      <d-tab id="gryj" title="个人订阅列表"></d-tab>
+      <d-tab id="zzyj" title="组织订阅列表"></d-tab>
+    </d-tabs>
+    <OrgSubscription v-if="selectTab === 'zzyj'" />
+    <PersonageSubscription v-else />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import OrgSubscription from './OrgSubscription.vue';
+import PersonageSubscription from './PersonageSubscription.vue';
+const selectTab = ref('gryj');
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/OrganizationManage/OrganizationManage.vue b/src/views/Jyh/PersonalCenter 2/OrganizationManage/OrganizationManage.vue
new file mode 100644
index 0000000..079e5ac
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/OrganizationManage/OrganizationManage.vue	
@@ -0,0 +1,466 @@
+<template>
+    <div>
+        <div v-if="hasOrganization">
+            <d-card class="mb-[16px] bg-white" shadow="never">
+                <div class="text-[14px] w-full flex items-center justify-between">
+                    <div class="font-bold mb-[16px]">基础信息</div>
+                    <div>
+                        <d-icon
+                            v-if="!isEdit"
+                            class="font-normal"
+                            name="edit"
+                            operable
+                            @click="editIconClick"
+                        >
+                            <template #suffix>
+                                <span>编辑</span>
+                            </template>
+                        </d-icon>
+                    </div>
+                </div>
+                <d-form
+                    ref="baseInfoFormRef"
+                    :data="createFormData"
+                    message-type="none"
+                >
+                    <d-form-item
+                      field="organizationName"
+                      label="组织名称"
+                    >
+                        <d-input v-if="isEdit" v-model="createFormData.organizationName" />
+                        <div v-else>{{ organizationInfo.organizationName }}</div>
+                    </d-form-item>
+                    <d-form-item field="organizationProfile" label="组织简介">
+                        <d-textarea
+                            v-if="isEdit"
+                            v-model="createFormData.organizationProfile"
+                            show-count
+                            maxlength="200"
+                        />
+                        <div v-else>{{ organizationInfo.organizationProfile }}</div>
+                    </d-form-item>
+                </d-form>
+                <div v-if="isEdit">
+                    <d-button
+                        variant="solid"
+                        class="mr-[8px]"
+                        @click="editOrganizationConfirm"
+                    >完成</d-button>
+                    <d-button @click="editOrganizationCancel">取消</d-button>
+                </div>
+            </d-card>
+
+
+            <d-card class="mb-[16px] bg-white" shadow="never">
+                <div class="font-bold text-[14px] mb-[12px]">成员管理</div>
+                <div class="flex mb-[12px]">
+                    <d-button
+                        icon="add"
+                        variant="solid"
+                        class="mr-[8px]"
+                        @click="openInviteMemberModal"
+                    >邀请成员</d-button>
+                    <d-search
+                        icon-position="left"
+                        class="w-[296px]"
+                        placeholder="请输入搜索内容"
+                    />
+                </div>
+                    <d-table
+                        v-if="memberTableData.length"
+                        :data="memberTableData"
+                        class="w-full mb-[20px]"
+                        fix-header
+                        header-bg
+                        max-height="500px"
+                    >
+                        <d-column field="userName" header="成员名" />
+                        <d-column field="role" header="角色">
+                            <template #default="{ row }">
+                                {{ memberRoleMap[row.role] ?? '' }}
+                            </template>
+                        </d-column>
+                        <d-column field="email" header="邮箱" />
+                        <d-column field="joinDate" header="加入时间" />
+                        <d-column header="操作">
+                            <template #default="{row}">
+                                <d-button
+                                    variant="text"
+                                    color="primary"
+                                    @click="openDeleteModal(row)"
+                                >删除</d-button>
+                            </template>
+                        </d-column>
+                    </d-table>
+                    <NoData v-else />
+                <d-pagination
+                    class="flex justify-end"
+                    :total="pager.total"
+                    v-model:pageSize="pager.pageSize"
+                    v-model:pageIndex="pager.pageIndex"
+                    :can-view-total="true"
+                    :can-change-page-size="true"
+                    :max-items="5"
+                />
+            </d-card>
+        </div>
+
+        <div v-else>
+            <NoData :small="false">
+                <div class="font-bold mb-[20px]">很抱歉，当前无任何组织，赶快去</div>
+                <d-button
+                    size="lg"
+                    variant="solid"
+                    @click="openCreateOrganizationModal"
+                >新建组织</d-button>
+            </NoData>
+        </div>
+    </div>
+
+    <d-modal
+        v-model="createOrganizationModalCtrl"
+        title="新建组织"
+        class="w-[600px]"
+    >
+        <d-form
+            ref="createFormRef"
+            layout="vertical"
+            :data="createFormData"
+            message-type="none"
+        >
+            <d-form-item
+                field="organizationName"
+                label="组织名称"
+                required
+            >
+                <d-input v-model="createFormData.organizationName" />
+            </d-form-item>
+            <d-form-item field="organizationProfile" label="组织简介" required>
+                <d-textarea
+                    v-model="createFormData.organizationProfile"
+                    show-count
+                    maxlength="200"
+                />
+            </d-form-item>
+        </d-form>
+
+        <div class="flex justify-center">
+            <d-button
+                variant="solid"
+                class="mr-[8px]"
+                @click="confirmCreateOrganizationBtnClick"
+            >确定</d-button>
+            <d-button @click="closeOrganizationModal">取消</d-button>
+        </div>
+    </d-modal>
+
+    <d-modal
+        v-model="inviteMemberModalCtrl"
+        title="邀请成员"
+        class="w-[600px]"
+    >
+        <d-form
+            ref="inviteMemberFormRef"
+            layout="vertical"
+            :data="inviteMemberFormData"
+            message-type="none"
+        >
+            <d-form-item
+                field="userName"
+                label="成员"
+                required
+            >
+                <d-input v-model="inviteMemberFormData.userName" placeholder="请输入" />
+            </d-form-item>
+            <d-form-item field="role" label="角色" required>
+                <d-select v-model="inviteMemberFormData.role">
+                    <d-option
+                        v-for="item of inviteMemberSelectOptions"
+                        :key="item.value"
+                        :value="item.value"
+                        :name="item.name"
+                    />
+                </d-select>
+            </d-form-item>
+        </d-form>
+
+        <div class="flex justify-center">
+            <d-button
+                variant="solid"
+                class="mr-[8px]"
+                @click="inviteMemberConfirmBtnClick"
+            >确定</d-button>
+            <d-button @click="closeInviteMemberModal">取消</d-button>
+        </div>
+    </d-modal>
+
+
+    <d-modal
+      v-model="deleteMemberModalCtrl"
+      title="删除成员"
+      class="w-[600px]"
+    >
+        <div>
+            即将删除成员‘{{ deleteRow.userName }}’，请确认是否继续？
+        </div>
+        <div class="flex justify-center">
+            <d-button
+                variant="solid"
+                class="mr-[8px]"
+                @click="deleteMember"
+            >确定</d-button>
+            <d-button @click="closeDeleteMemberModal">取消</d-button>
+        </div>
+    </d-modal>
+</template>
+
+<script setup lang="ts">
+import {reactive, ref, shallowRef} from "vue";
+import NoData from "@/components/NoData/NoData.vue";
+import {
+  createOrganizationApi, deleteOrganizationMemberApi,
+  getOrganizationInfoApi, getOrganizationMemberListApi, inviteOrganizationMemberApi,
+  updateOrganizationInfoApi
+} from "@/api/organizationManage/organizationManageApi";
+import {
+    type OrganizationInfoType,
+    type OrganizationMemberItemType,
+} from "@/api/organizationManage/organizationManageType";
+import table from "@/components/AIRepair/Table.vue";
+
+const searchOrganizationLoading = ref(false);
+const hasOrganization = ref(false);
+const organizationInfo = shallowRef<OrganizationInfoType>({
+    organizationName: '',
+    organizationProfile: '',
+});
+
+const createOrganizationModalCtrl = ref(false);
+const createFormData = reactive({
+    organizationName: '',
+    organizationProfile: '', // 组织简介
+});
+const createFormRef = ref();
+const createOrganizationLoading = ref(false);
+
+const isEdit = ref(false);
+const editLoading = ref(false);
+
+const memberListSearchLoading = ref(false);
+const memberListSearchParam = ref('');
+const memberTableData = shallowRef<OrganizationMemberItemType[]>([]);
+const pager = reactive({
+    pageSize: 10,
+    pageIndex: 1,
+    total: 0,
+});
+
+const deleteRow = shallowRef<OrganizationMemberItemType>(null);
+const deleteMemberModalCtrl = ref(false);
+const deleteMemberLoading = ref(false);
+
+const inviteMemberFormRef = ref();
+const inviteMemberModalCtrl = ref(false);
+const inviteMemberLoading = ref(false);
+const inviteMemberFormData = reactive({
+    userName: '',
+    role: '',
+});
+const inviteMemberSelectOptions = [
+    { name: '创建者', value: 'creator' },
+    { name: '成员', value: 'member' },
+];
+const memberRoleMap = {
+    creator: '创建者',
+    member: '成员',
+};
+
+const mockTableData = [
+    { userName: '张三', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '1' },
+    { userName: '李四', role: 'creator', email: '111@gmail.com', joinDate: '2090-02-30', id: '2' },
+    { userName: '王五', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '3' },
+    { userName: '赵六', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '4' },
+    { userName: '秦七', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '5' },
+];
+
+// -------------------- 获取组织信息 --------------------
+async function getOrganizationInfo() {
+    const params = {
+        organizationName: createFormData.organizationName,
+        organizationProfile: createFormData.organizationProfile,
+    };
+    searchOrganizationLoading.value = true;
+    try {
+       const res = await getOrganizationInfoApi(params);
+    } catch (e) {
+
+    }
+    searchOrganizationLoading.value = false;
+    getMemberList();
+    // TODO 待接口定义好后删除下面两行固定赋值语句
+    hasOrganization.value = true;
+    organizationInfo.value = { organizationName: createFormData.organizationName, organizationProfile: createFormData.organizationProfile };
+}
+
+// -------------------- 获取成员信息 --------------------
+async function getOrganizationMember(organizationId: string) {
+    const params = {};
+}
+
+// -------------------- 创建组织 --------------------
+function confirmCreateOrganizationBtnClick() {
+    createFormRef.value.validate((isValid: boolean) => {
+        if (isValid) {
+            createOrganization();
+        }
+    });
+}
+
+async function createOrganization() {
+    const params = {
+        organizationName: createFormData.organizationName,
+        organizationProfile: createFormData.organizationProfile,
+    };
+    createOrganizationLoading.value = true;
+    try {
+        const res = await createOrganizationApi(params);
+    } catch (e) {
+
+    }
+    closeOrganizationModal();
+    // TODO 待接口定义好后删除下面调用逻辑
+    getOrganizationInfo();
+    createOrganizationLoading.value = false;
+}
+
+function openCreateOrganizationModal() {
+    createOrganizationModalCtrl.value = true;
+}
+
+function closeOrganizationModal() {
+    createOrganizationModalCtrl.value = false;
+}
+
+// -------------------- 编辑组织信息 --------------------
+function editIconClick() {
+    isEdit.value = true;
+}
+
+async function editOrganizationConfirm() {
+    editLoading.value = true;
+    const params = {
+        organizationName: createFormData.organizationName,
+        organizationProfile: createFormData.organizationProfile,
+    };
+    try {
+        const res = await updateOrganizationInfoApi(params);
+    } catch (e) {
+
+    }
+    editLoading.value = false;
+    isEdit.value = false;
+    // TODO 待接口定义好后删除下面两行固定赋值语句
+    hasOrganization.value = true;
+    organizationInfo.value = { organizationName: createFormData.organizationName, organizationProfile: createFormData.organizationProfile };
+}
+
+function editOrganizationCancel() {
+    isEdit.value = false;
+    createFormData.organizationName = organizationInfo.value.organizationName;
+    createFormData.organizationProfile = organizationInfo.value.organizationProfile;
+}
+
+// -------------------- 邀请、查询成员 --------------------
+async function getMemberList() {
+    const params = {
+        organizationName: createFormData.organizationName,
+        pageIndex: pager.pageIndex,
+        pageSize: pager.pageSize,
+        searchParam: memberListSearchParam.value,
+    };
+    memberListSearchLoading.value = true;
+    try {
+        const res = await getOrganizationMemberListApi(params);
+    } catch (e) {
+
+    }
+    memberTableData.value = mockTableData;
+    pager.total = 6;
+    memberListSearchLoading.value = false;
+}
+
+function openInviteMemberModal() {
+    inviteMemberModalCtrl.value = true;
+}
+
+function openDeleteModal(row: any) {
+    deleteRow.value = row;
+    deleteMemberModalCtrl.value = true;
+}
+
+function inviteMemberConfirmBtnClick() {
+    inviteMemberFormRef.value.validate((isValid: boolean) => {
+        if (isValid) {
+          console.log('aaaaaaaa')
+            inviteMember();
+        }
+    });
+}
+
+async function inviteMember() {
+    const params = {
+        userName: inviteMemberFormData.userName,
+        role: inviteMemberFormData.role,
+    };
+    inviteMemberLoading.value = true;
+    try {
+        const res = await inviteOrganizationMemberApi(params);
+    } catch (e) {
+
+    }
+    inviteMemberLoading.value = false;
+    closeInviteMemberModal();
+    // TODO 待接口定义好后删除下面调用逻辑
+    mockTableData.unshift({
+        userName: inviteMemberFormData.userName,
+        role: inviteMemberFormData.role,
+        joinDate: new Date().toDateString(),
+        id: String(pager.total++),
+        email: `${inviteMemberFormData.userName}@gmail.com`,
+    });
+    memberTableData.value = [...mockTableData];
+}
+
+function closeInviteMemberModal() {
+    inviteMemberModalCtrl.value = false;
+}
+
+async function deleteMember() {
+    const params = {
+        id: deleteRow.value.id,
+    };
+    deleteMemberLoading.value = true;
+    try {
+        const res = await deleteOrganizationMemberApi(params);
+    } catch (e) {
+
+    }
+    deleteMemberLoading.value = false;
+    closeDeleteMemberModal();
+    // TODO 待接口定义好后删除下面调用逻辑
+    const index = mockTableData.findIndex(item => item.id === deleteRow.value.id);
+    mockTableData.splice(index, 1);
+    memberTableData.value = [...mockTableData];
+    pager.total--;
+}
+
+function closeDeleteMemberModal() {
+    deleteMemberModalCtrl.value = false;
+}
+</script>
+
+<style scoped lang="scss">
+:deep(.devui-table__row td) {
+  padding: 10px 16px;
+}
+</style>
diff --git a/src/views/Jyh/PersonalCenter 2/index.vue b/src/views/Jyh/PersonalCenter 2/index.vue
new file mode 100644
index 0000000..fab8244
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter 2/index.vue	
@@ -0,0 +1,288 @@
+<template>
+  <div class="version-detail">
+    <div class="version-header">
+      <d-breadcrumb class="secret-breadcrumb">
+        <gc-breadcrumb-item :to="{ name: 'home' }"><span class="title">首页</span></gc-breadcrumb-item>
+<!--        <gc-breadcrumb-item :to="{ name: 'home' }"><span class="title">高级搜索</span></gc-breadcrumb-item>-->
+        <gc-breadcrumb-item><span class="cur-title">个人中心</span></gc-breadcrumb-item>
+      </d-breadcrumb>
+      <div class="version-detail-header">
+        <div class="header-top">
+          <GAvatar style="margin-right: 16px" :name="accountInfo.username" :src="accountInfo.avatar" name="Vue" :width="72" :height="72"></GAvatar>
+          <div class="pt-24">
+            <div class="header-title1">{{ accountInfo.username || '--' }}</div>
+            <div class="header-div">
+              <span class="span1">介绍：包含项目管理、代码托管、CI/CD 和制品库等功能，提供完整的研发流程建议的新的团队…</span>
+            </div>
+          </div>
+<!--          <div class="fr">-->
+<!--            <d-button class="mr-2" variant="solid">订阅</d-button>-->
+<!--          </div>-->
+        </div>
+        <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-3" type="wrapped" v-model="selectTab">
+          <d-tab id="yjtzlb" title="预警通知列表"></d-tab>
+          <d-tab id="dylb" title="订阅列表"></d-tab>
+          <d-tab id="organizationManage" title="组织管理"></d-tab>
+          <d-tab id="invitation" title="邀请通知"></d-tab>
+        </d-tabs>
+      </div>
+    </div>
+    <div class="version-detail-content">
+      <early-warning v-if="selectTab==='yjtzlb'"/>
+      <subscribe-list v-if="selectTab==='dylb'"/>
+      <OrganizationManage v-if="selectTab === 'organizationManage'" />
+      <InvitationNoticeList v-if="selectTab === 'invitation'" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+import { getOrgInfo } from '@/views/Org/hooks/orgInfo';
+import EarlyWarning from './Detail/EarlyWarning.vue';
+import SubscribeList from './Detail/SubscribeList.vue';
+import OrganizationManage from './OrganizationManage/OrganizationManage.vue';
+import InvitationNoticeList from './Detail/InvitationNoticeList.vue';
+import { useAccount } from '@/utils/hooks/useAccount';
+
+const { namespace } = getOrgInfo();
+const avatarUrl = '/src/assets/imgs/avatar/male.png';
+
+const selectTab = ref('yjtzlb');
+const { accountInfo, RemoveInfo } = useAccount();
+
+// 删除弹窗
+const item = ref('');
+const deleteModal = ref();
+const deletevModels = ref(false);
+const openDelete = (row: any) => {
+  item.value = row;
+  deleteModal.value.showFlag = true;
+  deletevModels.value = true;
+};
+
+const router = useRouter();
+
+// 分页
+const changeIndex = () => {
+  // getGroupClaListData();
+};
+
+const changeSize = () => {
+  pager.value.pageIndex = 1;
+  // getGroupClaListData();
+};
+
+const repoFun = (arr: any) => {
+  return arr ? (arr.length > 3 ? arr.slice(0, 3) : arr) : [];
+};
+
+// 编辑
+const editRow = (row: any) => {
+  // 后续请换成params，暂时params传参没传过去
+  router.push({
+    path: 'cla/edit/' + row.object_id,
+    query: { cla: row.cla, pageType: 'edit' }
+  });
+};
+
+// 确认删除
+const confirmDelete = async (e: any) => {
+  // const res = await reqCatch(deleteGroupCla, { group_id: namespace.value, cla_id: item.value.object_id });
+  // if (!res.error) {
+  //   getGroupClaListData();
+  // }
+};
+
+// 去成员页
+const goMember = (row: any) => {
+  // 后续请换成params，暂时params传参没传过去,注意路由有个:claID
+  router.push({
+    path: 'cla/claId/member',
+    query: { claId: row.object_id, claName: row.cla_name, group_path: namespace.value, pageType: 'edit' }
+  });
+};
+const getGroupClaListData = async () => {
+  // const params = {
+  //   group_id: namespace.value,
+  //   page: pager.value.pageIndex,
+  //   per_page: pager.value.pageSize
+  // };
+  // const res = await reqCatch(getGroupClaList, params);
+  // if (!res.error) {
+  //   tableData.value = res?.data?.data?.content;
+  //   pager.value.total = res.data.data.total;
+  // }
+};
+getGroupClaListData();
+
+const setClaStatus = async (row: any) => {
+  // const params = {
+  //   group_id: namespace.value,
+  //   cla_id: row.object_id,
+  //   status: row.status
+  // };
+  // const res = await reqCatch(setGroupClaStatus, params);
+  // if (!res.error) {
+  //   Message.success('操作成功!');
+  //   getGroupClaListData();
+  // }
+};
+
+const signCla = (row: any) => {
+  router.push('/cla/' + row.object_id);
+};
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+
+.version-detail {
+  position: relative;
+
+  .secret-op {
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
+}
+
+.error {
+  color: $devui-contrast;
+}
+
+:deep(.devui-table__row td) {
+  padding-top: 16px;
+  padding-bottom: 16px;
+}
+
+:deep(.devui-tag .devui-tag--default) {
+  background-color: #fff;
+  border-radius: 12px;
+  padding: 4px 8px;
+  font-size: 12px;
+  line-height: 16px;
+  margin-right: 8px;
+  border: 1px solid #e3e3ee;
+}
+
+.one-line {
+  word-break: break-all;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.title {
+  font-size: 14px;
+  font-weight: 400;
+  color: #9a9b9c;
+  line-height: 20px;
+}
+
+.cur-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #2d2d2e;
+  line-height: 20px;
+}
+
+.search-form {
+  position: relative;
+  padding: 12px 20px 12px 0;
+  border-radius: 8px 0px 8px 8px;
+  background: #f2f5fc;
+
+  .output-btn {
+    position: absolute;
+    right: 28px;
+    bottom: 4px;
+    color: #191919;
+    font-family: HarmonyOS Sans SC;
+    font-weight: regular;
+    font-size: 14px;
+    line-height: 22px;
+    letter-spacing: 0px;
+    text-align: left;
+  }
+}
+
+.secret-breadcrumb {
+  padding: 7px 20px 12px;
+  background: transparent;
+}
+
+.version-header {
+  background: url('/src/assets/imgs/jyh/grzxBg.png') no-repeat center center; // 使用 url() 包裹路径
+  background-size: cover; // 确保背景图片覆盖整个区域
+  width: 100%;
+  height: 170px;
+}
+
+.version-detail-header {
+  position: relative;
+  padding: 0 16%;
+  width: 100%;
+  //box-shadow: inset 0px -1px 0px 0px #EEF0F5;
+  .header-top {
+    display: flex;
+    width: 100%;
+  }
+  .header-title1 {
+    color: #191919;
+    font-family: HarmonyOS Sans;
+    font-weight: bold;
+    font-size: 18px;
+    line-height: 26px;
+    letter-spacing: 0px;
+    text-align: left;
+    margin-bottom: 4px;
+  }
+  .header-div {
+    display: flex;
+    height: 20px;
+    margin-bottom: 12px;
+    .span1 {
+      color: #808080;
+      font-family: HarmonyOS Sans SC;
+      font-weight: regular;
+      font-size: 12px;
+      line-height: 20px;
+      letter-spacing: 0px;
+      text-align: left;
+    }
+    .span2 {
+      color: #191919;
+      font-family: HarmonyOS Sans;
+      font-weight: regular;
+      font-size: 12px;
+      line-height: 20px;
+      letter-spacing: 0px;
+      text-align: left;
+    }
+
+    ::v-deep .devui-tag {
+      .devui-tag--md {
+        color: #f6933b;
+        font-family: HarmonyOS Sans SC;
+        font-weight: regular;
+        font-size: 12px;
+        line-height: 20px;
+        letter-spacing: 0px;
+        text-align: left;
+        height: 20px;
+      }
+    }
+  }
+  .jyh-tabs-3 {
+    padding-top: 8px;
+  }
+}
+
+.version-detail-content {
+  padding: 0 16%;
+  width: 100%;
+  margin-top: 12px;
+}
+</style>
diff --git a/src/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue b/src/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue
index bd51fd9..6ab0c7b 100644
--- a/src/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue
+++ b/src/views/Jyh/PersonalCenter/Detail/EarlyWarningDetail.vue
@@ -3,19 +3,32 @@
     <div class="warning-title">
       <div>{{ warningData.title }}</div>
       <div class="sub-title mt-3">
-        <span>重要性</span>
-        <d-tag type="danger" size="sm">{{warningData.importance}}</d-tag>
+        <div>
+          <span>重要性</span>
+          <d-tag type="danger" size="sm">{{warningData.importance}}</d-tag>
+        </div>
+        <div>
+          <d-button v-show="mode === 'readonly'" class="edit-btn" icon="icon-edit" variant="text" title="编辑" @click="handleModeChange"/>
+          <d-button v-show="mode === 'editonly'" class="edit-btn" @click="handleModeChange">预览</d-button>
+        </div>
       </div>
     </div>
     <div class="warning-text">
-      <div class="text-box mb-5">
+      <!-- <div class="text-box mb-5">
         <div>一、概要</div>
         <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ warningData.summary }}</p>
+        <d-textarea v-model="warningData.summary" id="textArea" autosize></d-textarea>
       </div>
       <div class="text-box">
         <div>二、修复方案</div>
         <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ warningData.fixMethod }}</p>
-      </div>
+        <d-textarea v-model="warningData.fixMethod" id="textArea2"></d-textarea>
+      </div> -->
+      <d-editor-md
+        v-model="warningData.text"
+        :mode="mode"
+        :toolbar-config="toolbarConfig"
+      ></d-editor-md>
     </div>
     <div :style="{'border-radius': propsData.type === 'user' ? '6px' : 0}" class="warning-from">可信开源代码库运营团队 {{ warningData.fromTime }}</div>
     <div v-if="propsData.type === 'system'" class="warning-operation">
@@ -35,12 +48,29 @@ const warningData = ref({
   importance: '高',
   summary: '近日，安全中心发现Apache lgnite远程代码执行漏洞（CVE-2024-52577）。在 2.6.0<Apache Ignite< 2.17.0版本中，由于lgnite未能正确实施类序列化过滤器，攻击者能够利用恶意序列化对象绕过安全检查，从而在服务器端反序列化时触发任意代码的执行。经可信开源代码库运营团队评审漏洞技术定级2级/3级，若不满足利用条件可举证降为6级。请你按要求在XX时间内完成修复。',
   fixMethod: '升级Apache Ignite至安全版本：2.17.0',
-  fromTime: '2025-2-20'
+  fromTime: '2025-2-20',
+  text: `## 一、概要
+近日，安全中心发现Apache lgnite远程代码执行漏洞（CVE-2024-52577）。在 2.6.0<Apache Ignite< 2.17.0版本中，由于lgnite未能正确实施类序列化过滤器，攻击者能够利用恶意序列化对象绕过安全检查，从而在服务器端反序列化时触发任意代码的执行。经可信开源代码库运营团队评审漏洞技术定级2级/3级，若不满足利用条件可举证降为6级。请你按要求在XX时间内完成修复。
+## 二、修复方案
+升级Apache Ignite至安全版本：2.17.0`
 });
+const toolbarConfig = [
+  ['undo', 'redo'],
+  ['h1', 'h2', 'bold', 'italic', 'strike', 'underline', 'color', 'font'],
+  ['ul', 'ol', 'checklist', 'code', 'link', 'image', 'table'],
+];
+const mode = ref('readonly');
 // warningData.value = propsData.warningData;
 const confirm = () => {
   emit('close');
 };
+const handleModeChange = () => {
+  if (mode.value === 'editonly') {
+    mode.value = 'readonly';
+  } else {
+    mode.value = 'editonly';
+  }
+};
 </script>
 
 <style scoped lang="scss">
@@ -56,7 +86,9 @@ const confirm = () => {
     padding: 4px 20px 12px;
 
     .sub-title {
-      >span {
+      display: flex;
+      justify-content: space-between;
+      >div:first-of-type>span {
         margin-right: 12px;
         color: #808080;
         font-family: HarmonyOS Sans SC;
@@ -68,6 +100,22 @@ const confirm = () => {
   .warning-text {
     padding: 20px;
     background: #F6F6F8;
+    color: initial;
+
+    ::v-deep .dp-md-view {
+      h2 {
+        font-size: 1.5em;
+        font-weight: bold;
+      }
+
+      p {
+        color: #252B3A;
+        font-family: 苹方-简;
+        font-size: 14px;
+        line-height: 24px;
+        font-weight: 400;
+      }
+    }
 
     .text-box {
 
@@ -80,11 +128,12 @@ const confirm = () => {
         line-height: 24px;
       }
 
-      p {
+      ::v-deep .devui-textarea {
         color: #252B3A;
         font-family: 苹方-简;
         font-size: 14px;
         line-height: 24px;
+        font-weight: 400;
       }
     }
   }
diff --git a/src/views/Jyh/PersonalCenter/Detail/PersonalSettings.vue b/src/views/Jyh/PersonalCenter/Detail/PersonalSettings.vue
new file mode 100644
index 0000000..ca6faec
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter/Detail/PersonalSettings.vue
@@ -0,0 +1,39 @@
+<template>
+  <div class="version-info">
+    <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-4" type="wrapped" v-model="selectTab">
+      <d-tab id="personalBasic" title="基本信息"></d-tab>
+      <d-tab id="organizationManage" title="组织管理"></d-tab>
+      <d-tab id="invitation" title="邀请通知"></d-tab>
+    </d-tabs>
+    <PersonalBasic v-if="selectTab === 'personalBasic'" />
+    <OrganizationManage v-if="selectTab === 'organizationManage'" />
+    <InvitationNoticeList v-if="selectTab === 'invitation'" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import PersonalBasic from '../PersonalBasic.vue';
+import OrganizationManage from '../OrganizationManage/OrganizationManage.vue';
+import InvitationNoticeList from '../Detail/InvitationNoticeList.vue';
+const selectTab = ref('personalBasic');
+</script>
+
+<style scoped lang="scss">
+@import 'devui-theme/styles-var/devui-var.scss';
+</style>
+
+<style lang="scss">
+.warning-modal {
+  width: auto;
+
+  .devui-modal__header {
+    font-size: 20px;
+    height: auto !important;
+  }
+
+  .devui-modal__body {
+    padding: 0;
+  }
+}
+</style>
diff --git a/src/views/Jyh/PersonalCenter/OrganizationManage/OrganizationManage.vue b/src/views/Jyh/PersonalCenter/OrganizationManage/OrganizationManage.vue
index 079e5ac..7cc72ba 100644
--- a/src/views/Jyh/PersonalCenter/OrganizationManage/OrganizationManage.vue
+++ b/src/views/Jyh/PersonalCenter/OrganizationManage/OrganizationManage.vue
@@ -1,244 +1,153 @@
 <template>
-    <div>
-        <div v-if="hasOrganization">
-            <d-card class="mb-[16px] bg-white" shadow="never">
-                <div class="text-[14px] w-full flex items-center justify-between">
-                    <div class="font-bold mb-[16px]">基础信息</div>
-                    <div>
-                        <d-icon
-                            v-if="!isEdit"
-                            class="font-normal"
-                            name="edit"
-                            operable
-                            @click="editIconClick"
-                        >
-                            <template #suffix>
-                                <span>编辑</span>
-                            </template>
-                        </d-icon>
-                    </div>
-                </div>
-                <d-form
-                    ref="baseInfoFormRef"
-                    :data="createFormData"
-                    message-type="none"
-                >
-                    <d-form-item
-                      field="organizationName"
-                      label="组织名称"
-                    >
-                        <d-input v-if="isEdit" v-model="createFormData.organizationName" />
-                        <div v-else>{{ organizationInfo.organizationName }}</div>
-                    </d-form-item>
-                    <d-form-item field="organizationProfile" label="组织简介">
-                        <d-textarea
-                            v-if="isEdit"
-                            v-model="createFormData.organizationProfile"
-                            show-count
-                            maxlength="200"
-                        />
-                        <div v-else>{{ organizationInfo.organizationProfile }}</div>
-                    </d-form-item>
-                </d-form>
-                <div v-if="isEdit">
-                    <d-button
-                        variant="solid"
-                        class="mr-[8px]"
-                        @click="editOrganizationConfirm"
-                    >完成</d-button>
-                    <d-button @click="editOrganizationCancel">取消</d-button>
-                </div>
-            </d-card>
-
-
-            <d-card class="mb-[16px] bg-white" shadow="never">
-                <div class="font-bold text-[14px] mb-[12px]">成员管理</div>
-                <div class="flex mb-[12px]">
-                    <d-button
-                        icon="add"
-                        variant="solid"
-                        class="mr-[8px]"
-                        @click="openInviteMemberModal"
-                    >邀请成员</d-button>
-                    <d-search
-                        icon-position="left"
-                        class="w-[296px]"
-                        placeholder="请输入搜索内容"
-                    />
-                </div>
-                    <d-table
-                        v-if="memberTableData.length"
-                        :data="memberTableData"
-                        class="w-full mb-[20px]"
-                        fix-header
-                        header-bg
-                        max-height="500px"
-                    >
-                        <d-column field="userName" header="成员名" />
-                        <d-column field="role" header="角色">
-                            <template #default="{ row }">
-                                {{ memberRoleMap[row.role] ?? '' }}
-                            </template>
-                        </d-column>
-                        <d-column field="email" header="邮箱" />
-                        <d-column field="joinDate" header="加入时间" />
-                        <d-column header="操作">
-                            <template #default="{row}">
-                                <d-button
-                                    variant="text"
-                                    color="primary"
-                                    @click="openDeleteModal(row)"
-                                >删除</d-button>
-                            </template>
-                        </d-column>
-                    </d-table>
-                    <NoData v-else />
-                <d-pagination
-                    class="flex justify-end"
-                    :total="pager.total"
-                    v-model:pageSize="pager.pageSize"
-                    v-model:pageIndex="pager.pageIndex"
-                    :can-view-total="true"
-                    :can-change-page-size="true"
-                    :max-items="5"
-                />
-            </d-card>
+  <div class="mt-3">
+    <div v-if="hasOrganization">
+      <d-card class="mb-[16px] bg-white" shadow="never">
+        <div class="text-[14px] w-full flex items-center justify-between">
+          <div class="font-bold mb-[16px]">基础信息</div>
+          <div>
+            <d-icon v-if="!isEdit" class="font-normal" name="edit" operable @click="editIconClick">
+              <template #suffix>
+                <span>编辑</span>
+              </template>
+            </d-icon>
+          </div>
         </div>
-
-        <div v-else>
-            <NoData :small="false">
-                <div class="font-bold mb-[20px]">很抱歉，当前无任何组织，赶快去</div>
-                <d-button
-                    size="lg"
-                    variant="solid"
-                    @click="openCreateOrganizationModal"
-                >新建组织</d-button>
-            </NoData>
+        <d-form ref="baseInfoFormRef" :data="createFormData" message-type="none">
+          <d-form-item field="organizationName" label="组织名称">
+            <d-input v-if="isEdit" v-model="createFormData.organizationName" />
+            <div v-else>{{ organizationInfo.organizationName }}</div>
+          </d-form-item>
+          <d-form-item field="organizationProfile" label="组织简介">
+            <d-textarea v-if="isEdit" v-model="createFormData.organizationProfile" show-count maxlength="200" />
+            <div v-else>{{ organizationInfo.organizationProfile }}</div>
+          </d-form-item>
+        </d-form>
+        <div v-if="isEdit">
+          <d-button variant="solid" class="mr-[8px]" @click="editOrganizationConfirm">完成</d-button>
+          <d-button @click="editOrganizationCancel">取消</d-button>
         </div>
+      </d-card>
+
+      <d-card class="mb-[16px] bg-white" shadow="never">
+        <div class="font-bold text-[14px] mb-[12px]">成员管理</div>
+        <div class="flex mb-[12px]">
+          <d-button icon="add" variant="solid" class="mr-[8px]" @click="openInviteMemberModal">邀请成员</d-button>
+          <d-search icon-position="left" class="w-[296px]" placeholder="请输入搜索内容" />
+        </div>
+        <d-table
+          v-if="memberTableData.length"
+          :data="memberTableData"
+          class="w-full mb-[20px]"
+          fix-header
+          header-bg
+          max-height="500px"
+        >
+          <d-column field="userName" header="成员名" />
+          <d-column field="role" header="角色">
+            <template #default="{ row }">
+              {{ memberRoleMap[row.role] ?? '' }}
+            </template>
+          </d-column>
+          <d-column field="email" header="邮箱" />
+          <d-column field="joinDate" header="加入时间" />
+          <d-column header="操作">
+            <template #default="{ row }">
+              <d-button variant="text" color="primary" @click="openDeleteModal(row)">删除</d-button>
+            </template>
+          </d-column>
+        </d-table>
+        <NoData v-else />
+        <d-pagination
+          class="flex justify-end"
+          :total="pager.total"
+          v-model:pageSize="pager.pageSize"
+          v-model:pageIndex="pager.pageIndex"
+          :can-view-total="true"
+          :can-change-page-size="true"
+          :max-items="5"
+        />
+      </d-card>
     </div>
 
-    <d-modal
-        v-model="createOrganizationModalCtrl"
-        title="新建组织"
-        class="w-[600px]"
-    >
-        <d-form
-            ref="createFormRef"
-            layout="vertical"
-            :data="createFormData"
-            message-type="none"
-        >
-            <d-form-item
-                field="organizationName"
-                label="组织名称"
-                required
-            >
-                <d-input v-model="createFormData.organizationName" />
-            </d-form-item>
-            <d-form-item field="organizationProfile" label="组织简介" required>
-                <d-textarea
-                    v-model="createFormData.organizationProfile"
-                    show-count
-                    maxlength="200"
-                />
-            </d-form-item>
-        </d-form>
+    <div v-else>
+      <NoData :small="false">
+        <div class="font-bold mb-[20px]">很抱歉，当前无任何组织，赶快去</div>
+        <d-button size="lg" variant="solid" @click="openCreateOrganizationModal">新建组织</d-button>
+      </NoData>
+    </div>
+  </div>
 
-        <div class="flex justify-center">
-            <d-button
-                variant="solid"
-                class="mr-[8px]"
-                @click="confirmCreateOrganizationBtnClick"
-            >确定</d-button>
-            <d-button @click="closeOrganizationModal">取消</d-button>
-        </div>
-    </d-modal>
+  <d-modal v-model="createOrganizationModalCtrl" title="新建组织" class="w-[600px]">
+    <d-form ref="createFormRef" layout="vertical" :data="createFormData" message-type="none">
+      <d-form-item field="organizationName" label="组织名称" required>
+        <d-input v-model="createFormData.organizationName" />
+      </d-form-item>
+      <d-form-item field="organizationProfile" label="组织简介" required>
+        <d-textarea v-model="createFormData.organizationProfile" show-count maxlength="200" />
+      </d-form-item>
+    </d-form>
 
-    <d-modal
-        v-model="inviteMemberModalCtrl"
-        title="邀请成员"
-        class="w-[600px]"
-    >
-        <d-form
-            ref="inviteMemberFormRef"
-            layout="vertical"
-            :data="inviteMemberFormData"
-            message-type="none"
-        >
-            <d-form-item
-                field="userName"
-                label="成员"
-                required
-            >
-                <d-input v-model="inviteMemberFormData.userName" placeholder="请输入" />
-            </d-form-item>
-            <d-form-item field="role" label="角色" required>
-                <d-select v-model="inviteMemberFormData.role">
-                    <d-option
-                        v-for="item of inviteMemberSelectOptions"
-                        :key="item.value"
-                        :value="item.value"
-                        :name="item.name"
-                    />
-                </d-select>
-            </d-form-item>
-        </d-form>
+    <div class="flex justify-center">
+      <d-button variant="solid" class="mr-[8px]" @click="confirmCreateOrganizationBtnClick">确定</d-button>
+      <d-button @click="closeOrganizationModal">取消</d-button>
+    </div>
+  </d-modal>
 
-        <div class="flex justify-center">
-            <d-button
-                variant="solid"
-                class="mr-[8px]"
-                @click="inviteMemberConfirmBtnClick"
-            >确定</d-button>
-            <d-button @click="closeInviteMemberModal">取消</d-button>
-        </div>
-    </d-modal>
+  <d-modal v-model="inviteMemberModalCtrl" title="邀请成员" class="w-[600px]">
+    <d-form ref="inviteMemberFormRef" layout="vertical" :data="inviteMemberFormData" message-type="none">
+      <d-form-item field="userName" label="成员" required>
+        <d-input v-model="inviteMemberFormData.userName" placeholder="请输入" />
+      </d-form-item>
+      <d-form-item field="role" label="角色" required>
+        <d-select v-model="inviteMemberFormData.role">
+          <d-option v-for="item of inviteMemberSelectOptions" :key="item.value" :value="item.value" :name="item.name" />
+        </d-select>
+      </d-form-item>
+    </d-form>
 
+    <div class="flex justify-center">
+      <d-button variant="solid" class="mr-[8px]" @click="inviteMemberConfirmBtnClick">确定</d-button>
+      <d-button @click="closeInviteMemberModal">取消</d-button>
+    </div>
+  </d-modal>
 
-    <d-modal
-      v-model="deleteMemberModalCtrl"
-      title="删除成员"
-      class="w-[600px]"
-    >
-        <div>
-            即将删除成员‘{{ deleteRow.userName }}’，请确认是否继续？
-        </div>
-        <div class="flex justify-center">
-            <d-button
-                variant="solid"
-                class="mr-[8px]"
-                @click="deleteMember"
-            >确定</d-button>
-            <d-button @click="closeDeleteMemberModal">取消</d-button>
-        </div>
-    </d-modal>
+  <d-modal v-model="deleteMemberModalCtrl" title="删除成员" class="w-[600px]">
+    <div>即将删除成员‘{{ deleteRow.userName }}’，请确认是否继续？</div>
+    <div class="flex justify-center">
+      <d-button variant="solid" class="mr-[8px]" @click="deleteMember">确定</d-button>
+      <d-button @click="closeDeleteMemberModal">取消</d-button>
+    </div>
+  </d-modal>
 </template>
 
 <script setup lang="ts">
-import {reactive, ref, shallowRef} from "vue";
-import NoData from "@/components/NoData/NoData.vue";
+import { reactive, ref, shallowRef } from 'vue';
+import NoData from '@/components/NoData/NoData.vue';
 import {
-  createOrganizationApi, deleteOrganizationMemberApi,
-  getOrganizationInfoApi, getOrganizationMemberListApi, inviteOrganizationMemberApi,
+  createOrganizationApi,
+  deleteOrganizationMemberApi,
+  getOrganizationInfoApi,
+  getOrganizationMemberListApi,
+  inviteOrganizationMemberApi,
   updateOrganizationInfoApi
-} from "@/api/organizationManage/organizationManageApi";
+} from '@/api/organizationManage/organizationManageApi';
 import {
-    type OrganizationInfoType,
-    type OrganizationMemberItemType,
-} from "@/api/organizationManage/organizationManageType";
-import table from "@/components/AIRepair/Table.vue";
+  type OrganizationInfoType,
+  type OrganizationMemberItemType
+} from '@/api/organizationManage/organizationManageType';
+import table from '@/components/AIRepair/Table.vue';
 
 const searchOrganizationLoading = ref(false);
 const hasOrganization = ref(false);
 const organizationInfo = shallowRef<OrganizationInfoType>({
-    organizationName: '',
-    organizationProfile: '',
+  organizationName: '',
+  organizationProfile: ''
 });
 
 const createOrganizationModalCtrl = ref(false);
 const createFormData = reactive({
-    organizationName: '',
-    organizationProfile: '', // 组织简介
+  organizationName: '',
+  organizationProfile: '' // 组织简介
 });
 const createFormRef = ref();
 const createOrganizationLoading = ref(false);
@@ -250,9 +159,9 @@ const memberListSearchLoading = ref(false);
 const memberListSearchParam = ref('');
 const memberTableData = shallowRef<OrganizationMemberItemType[]>([]);
 const pager = reactive({
-    pageSize: 10,
-    pageIndex: 1,
-    total: 0,
+  pageSize: 10,
+  pageIndex: 1,
+  total: 0
 });
 
 const deleteRow = shallowRef<OrganizationMemberItemType>(null);
@@ -263,199 +172,193 @@ const inviteMemberFormRef = ref();
 const inviteMemberModalCtrl = ref(false);
 const inviteMemberLoading = ref(false);
 const inviteMemberFormData = reactive({
-    userName: '',
-    role: '',
+  userName: '',
+  role: ''
 });
 const inviteMemberSelectOptions = [
-    { name: '创建者', value: 'creator' },
-    { name: '成员', value: 'member' },
+  { name: '创建者', value: 'creator' },
+  { name: '成员', value: 'member' }
 ];
 const memberRoleMap = {
-    creator: '创建者',
-    member: '成员',
+  creator: '创建者',
+  member: '成员'
 };
 
 const mockTableData = [
-    { userName: '张三', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '1' },
-    { userName: '李四', role: 'creator', email: '111@gmail.com', joinDate: '2090-02-30', id: '2' },
-    { userName: '王五', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '3' },
-    { userName: '赵六', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '4' },
-    { userName: '秦七', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '5' },
+  { userName: '张三', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '1' },
+  { userName: '李四', role: 'creator', email: '111@gmail.com', joinDate: '2090-02-30', id: '2' },
+  { userName: '王五', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '3' },
+  { userName: '赵六', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '4' },
+  { userName: '秦七', role: 'member', email: '111@gmail.com', joinDate: '2090-02-30', id: '5' }
 ];
 
 // -------------------- 获取组织信息 --------------------
 async function getOrganizationInfo() {
-    const params = {
-        organizationName: createFormData.organizationName,
-        organizationProfile: createFormData.organizationProfile,
-    };
-    searchOrganizationLoading.value = true;
-    try {
-       const res = await getOrganizationInfoApi(params);
-    } catch (e) {
-
-    }
-    searchOrganizationLoading.value = false;
-    getMemberList();
-    // TODO 待接口定义好后删除下面两行固定赋值语句
-    hasOrganization.value = true;
-    organizationInfo.value = { organizationName: createFormData.organizationName, organizationProfile: createFormData.organizationProfile };
+  const params = {
+    organizationName: createFormData.organizationName,
+    organizationProfile: createFormData.organizationProfile
+  };
+  searchOrganizationLoading.value = true;
+  try {
+    const res = await getOrganizationInfoApi(params);
+  } catch (e) {}
+  searchOrganizationLoading.value = false;
+  getMemberList();
+  // TODO 待接口定义好后删除下面两行固定赋值语句
+  hasOrganization.value = true;
+  organizationInfo.value = {
+    organizationName: createFormData.organizationName,
+    organizationProfile: createFormData.organizationProfile
+  };
 }
 
 // -------------------- 获取成员信息 --------------------
 async function getOrganizationMember(organizationId: string) {
-    const params = {};
+  const params = {};
 }
 
 // -------------------- 创建组织 --------------------
 function confirmCreateOrganizationBtnClick() {
-    createFormRef.value.validate((isValid: boolean) => {
-        if (isValid) {
-            createOrganization();
-        }
-    });
+  createFormRef.value.validate((isValid: boolean) => {
+    if (isValid) {
+      createOrganization();
+    }
+  });
 }
 
 async function createOrganization() {
-    const params = {
-        organizationName: createFormData.organizationName,
-        organizationProfile: createFormData.organizationProfile,
-    };
-    createOrganizationLoading.value = true;
-    try {
-        const res = await createOrganizationApi(params);
-    } catch (e) {
-
-    }
-    closeOrganizationModal();
-    // TODO 待接口定义好后删除下面调用逻辑
-    getOrganizationInfo();
-    createOrganizationLoading.value = false;
+  const params = {
+    organizationName: createFormData.organizationName,
+    organizationProfile: createFormData.organizationProfile
+  };
+  createOrganizationLoading.value = true;
+  try {
+    const res = await createOrganizationApi(params);
+  } catch (e) {}
+  closeOrganizationModal();
+  // TODO 待接口定义好后删除下面调用逻辑
+  getOrganizationInfo();
+  createOrganizationLoading.value = false;
 }
 
 function openCreateOrganizationModal() {
-    createOrganizationModalCtrl.value = true;
+  createOrganizationModalCtrl.value = true;
 }
 
 function closeOrganizationModal() {
-    createOrganizationModalCtrl.value = false;
+  createOrganizationModalCtrl.value = false;
 }
 
 // -------------------- 编辑组织信息 --------------------
 function editIconClick() {
-    isEdit.value = true;
+  isEdit.value = true;
 }
 
 async function editOrganizationConfirm() {
-    editLoading.value = true;
-    const params = {
-        organizationName: createFormData.organizationName,
-        organizationProfile: createFormData.organizationProfile,
-    };
-    try {
-        const res = await updateOrganizationInfoApi(params);
-    } catch (e) {
-
-    }
-    editLoading.value = false;
-    isEdit.value = false;
-    // TODO 待接口定义好后删除下面两行固定赋值语句
-    hasOrganization.value = true;
-    organizationInfo.value = { organizationName: createFormData.organizationName, organizationProfile: createFormData.organizationProfile };
+  editLoading.value = true;
+  const params = {
+    organizationName: createFormData.organizationName,
+    organizationProfile: createFormData.organizationProfile
+  };
+  try {
+    const res = await updateOrganizationInfoApi(params);
+  } catch (e) {}
+  editLoading.value = false;
+  isEdit.value = false;
+  // TODO 待接口定义好后删除下面两行固定赋值语句
+  hasOrganization.value = true;
+  organizationInfo.value = {
+    organizationName: createFormData.organizationName,
+    organizationProfile: createFormData.organizationProfile
+  };
 }
 
 function editOrganizationCancel() {
-    isEdit.value = false;
-    createFormData.organizationName = organizationInfo.value.organizationName;
-    createFormData.organizationProfile = organizationInfo.value.organizationProfile;
+  isEdit.value = false;
+  createFormData.organizationName = organizationInfo.value.organizationName;
+  createFormData.organizationProfile = organizationInfo.value.organizationProfile;
 }
 
 // -------------------- 邀请、查询成员 --------------------
 async function getMemberList() {
-    const params = {
-        organizationName: createFormData.organizationName,
-        pageIndex: pager.pageIndex,
-        pageSize: pager.pageSize,
-        searchParam: memberListSearchParam.value,
-    };
-    memberListSearchLoading.value = true;
-    try {
-        const res = await getOrganizationMemberListApi(params);
-    } catch (e) {
-
-    }
-    memberTableData.value = mockTableData;
-    pager.total = 6;
-    memberListSearchLoading.value = false;
+  const params = {
+    organizationName: createFormData.organizationName,
+    pageIndex: pager.pageIndex,
+    pageSize: pager.pageSize,
+    searchParam: memberListSearchParam.value
+  };
+  memberListSearchLoading.value = true;
+  try {
+    const res = await getOrganizationMemberListApi(params);
+  } catch (e) {}
+  memberTableData.value = mockTableData;
+  pager.total = 6;
+  memberListSearchLoading.value = false;
 }
 
 function openInviteMemberModal() {
-    inviteMemberModalCtrl.value = true;
+  inviteMemberModalCtrl.value = true;
 }
 
 function openDeleteModal(row: any) {
-    deleteRow.value = row;
-    deleteMemberModalCtrl.value = true;
+  deleteRow.value = row;
+  deleteMemberModalCtrl.value = true;
 }
 
 function inviteMemberConfirmBtnClick() {
-    inviteMemberFormRef.value.validate((isValid: boolean) => {
-        if (isValid) {
-          console.log('aaaaaaaa')
-            inviteMember();
-        }
-    });
+  inviteMemberFormRef.value.validate((isValid: boolean) => {
+    if (isValid) {
+      console.log('aaaaaaaa');
+      inviteMember();
+    }
+  });
 }
 
 async function inviteMember() {
-    const params = {
-        userName: inviteMemberFormData.userName,
-        role: inviteMemberFormData.role,
-    };
-    inviteMemberLoading.value = true;
-    try {
-        const res = await inviteOrganizationMemberApi(params);
-    } catch (e) {
-
-    }
-    inviteMemberLoading.value = false;
-    closeInviteMemberModal();
-    // TODO 待接口定义好后删除下面调用逻辑
-    mockTableData.unshift({
-        userName: inviteMemberFormData.userName,
-        role: inviteMemberFormData.role,
-        joinDate: new Date().toDateString(),
-        id: String(pager.total++),
-        email: `${inviteMemberFormData.userName}@gmail.com`,
-    });
-    memberTableData.value = [...mockTableData];
+  const params = {
+    userName: inviteMemberFormData.userName,
+    role: inviteMemberFormData.role
+  };
+  inviteMemberLoading.value = true;
+  try {
+    const res = await inviteOrganizationMemberApi(params);
+  } catch (e) {}
+  inviteMemberLoading.value = false;
+  closeInviteMemberModal();
+  // TODO 待接口定义好后删除下面调用逻辑
+  mockTableData.unshift({
+    userName: inviteMemberFormData.userName,
+    role: inviteMemberFormData.role,
+    joinDate: new Date().toDateString(),
+    id: String(pager.total++),
+    email: `${inviteMemberFormData.userName}@gmail.com`
+  });
+  memberTableData.value = [...mockTableData];
 }
 
 function closeInviteMemberModal() {
-    inviteMemberModalCtrl.value = false;
+  inviteMemberModalCtrl.value = false;
 }
 
 async function deleteMember() {
-    const params = {
-        id: deleteRow.value.id,
-    };
-    deleteMemberLoading.value = true;
-    try {
-        const res = await deleteOrganizationMemberApi(params);
-    } catch (e) {
-
-    }
-    deleteMemberLoading.value = false;
-    closeDeleteMemberModal();
-    // TODO 待接口定义好后删除下面调用逻辑
-    const index = mockTableData.findIndex(item => item.id === deleteRow.value.id);
-    mockTableData.splice(index, 1);
-    memberTableData.value = [...mockTableData];
-    pager.total--;
+  const params = {
+    id: deleteRow.value.id
+  };
+  deleteMemberLoading.value = true;
+  try {
+    const res = await deleteOrganizationMemberApi(params);
+  } catch (e) {}
+  deleteMemberLoading.value = false;
+  closeDeleteMemberModal();
+  // TODO 待接口定义好后删除下面调用逻辑
+  const index = mockTableData.findIndex((item) => item.id === deleteRow.value.id);
+  mockTableData.splice(index, 1);
+  memberTableData.value = [...mockTableData];
+  pager.total--;
 }
 
 function closeDeleteMemberModal() {
-    deleteMemberModalCtrl.value = false;
+  deleteMemberModalCtrl.value = false;
 }
 </script>
 
diff --git a/src/views/Jyh/PersonalCenter/PersonalBasic.vue b/src/views/Jyh/PersonalCenter/PersonalBasic.vue
new file mode 100644
index 0000000..9b6fa2a
--- /dev/null
+++ b/src/views/Jyh/PersonalCenter/PersonalBasic.vue
@@ -0,0 +1,58 @@
+<template>
+  <div class="mt-3">
+    <d-card class="mb-[16px] bg-white" shadow="never">
+      <div class="text-[14px] w-full flex items-center justify-between">
+        <div class="font-bold mb-[16px]">基础信息</div>
+      </div>
+      <d-form layout="vertical" class="ml-3 mr-3" :data="forms">
+        <d-row :gutter="16">
+          <d-col span="8">
+            <d-form-item field="name" label="名称" required>
+              <d-input v-model="forms.name" />
+            </d-form-item>
+          </d-col>
+          <d-col span="8">
+            <d-form-item field="email" label="邮件" required>
+              <d-input v-model="forms.email" />
+            </d-form-item>
+          </d-col>
+          <d-col span="8">
+            <d-form-item field="phone" label="电话" required>
+              <d-input v-model="forms.phone" />
+            </d-form-item>
+          </d-col>
+        </d-row>
+      </d-form>
+    </d-card>
+    <d-card class="mb-[16px] bg-white" shadow="never">
+      <div class="text-[14px] w-full flex items-center justify-between">
+        <div class="font-bold mb-[16px]">预警通知设置</div>
+      </div>
+      <d-form layout="vertical">
+        <d-form-item field="radio" label="是否开启邮件通知">
+          <d-radio-group direction="row" v-model="radio">
+            <d-radio value="0">开启</d-radio>
+            <d-radio value="1">关闭</d-radio>
+          </d-radio-group>
+        </d-form-item>
+      </d-form>
+    </d-card>
+    <div class="flex">
+      <d-button variant="solid" class="mr-[8px]">提交</d-button>
+      <d-button color="secondary" class="mr-[8px]">保存草稿</d-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, shallowRef } from 'vue';
+const radio = ref('1');
+
+const forms = reactive({
+  name: '',
+  email: '',
+  phone: ''
+});
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/Jyh/PersonalCenter/index.vue b/src/views/Jyh/PersonalCenter/index.vue
index fab8244..255d3a4 100644
--- a/src/views/Jyh/PersonalCenter/index.vue
+++ b/src/views/Jyh/PersonalCenter/index.vue
@@ -3,35 +3,35 @@
     <div class="version-header">
       <d-breadcrumb class="secret-breadcrumb">
         <gc-breadcrumb-item :to="{ name: 'home' }"><span class="title">首页</span></gc-breadcrumb-item>
-<!--        <gc-breadcrumb-item :to="{ name: 'home' }"><span class="title">高级搜索</span></gc-breadcrumb-item>-->
+        <!--        <gc-breadcrumb-item :to="{ name: 'home' }"><span class="title">高级搜索</span></gc-breadcrumb-item>-->
         <gc-breadcrumb-item><span class="cur-title">个人中心</span></gc-breadcrumb-item>
       </d-breadcrumb>
       <div class="version-detail-header">
         <div class="header-top">
-          <GAvatar style="margin-right: 16px" :name="accountInfo.username" :src="accountInfo.avatar" name="Vue" :width="72" :height="72"></GAvatar>
+          <GAvatar style="margin-right: 16px" :src="avatarUrl" name="Vue" :width="72" :height="72"></GAvatar>
           <div class="pt-24">
-            <div class="header-title1">{{ accountInfo.username || '--' }}</div>
+            <div class="header-title1">UserName</div>
             <div class="header-div">
-              <span class="span1">介绍：包含项目管理、代码托管、CI/CD 和制品库等功能，提供完整的研发流程建议的新的团队…</span>
+              <span class="span1"
+                >介绍：包含项目管理、代码托管、CI/CD 和制品库等功能，提供完整的研发流程建议的新的团队…</span
+              >
             </div>
           </div>
-<!--          <div class="fr">-->
-<!--            <d-button class="mr-2" variant="solid">订阅</d-button>-->
-<!--          </div>-->
+          <!--          <div class="fr">-->
+          <!--            <d-button class="mr-2" variant="solid">订阅</d-button>-->
+          <!--          </div>-->
         </div>
         <d-tabs class="jyh-tabs jyh-tabs-2 jyh-tabs-3" type="wrapped" v-model="selectTab">
           <d-tab id="yjtzlb" title="预警通知列表"></d-tab>
           <d-tab id="dylb" title="订阅列表"></d-tab>
-          <d-tab id="organizationManage" title="组织管理"></d-tab>
-          <d-tab id="invitation" title="邀请通知"></d-tab>
+          <d-tab id="personalSettings" title="个人设置"></d-tab>
         </d-tabs>
       </div>
     </div>
     <div class="version-detail-content">
-      <early-warning v-if="selectTab==='yjtzlb'"/>
-      <subscribe-list v-if="selectTab==='dylb'"/>
-      <OrganizationManage v-if="selectTab === 'organizationManage'" />
-      <InvitationNoticeList v-if="selectTab === 'invitation'" />
+      <early-warning v-if="selectTab === 'yjtzlb'" />
+      <subscribe-list v-if="selectTab === 'dylb'" />
+      <personal-settings v-if="selectTab === 'personalSettings'" />
     </div>
   </div>
 </template>
@@ -42,15 +42,12 @@ import { useRouter, useRoute } from 'vue-router';
 import { getOrgInfo } from '@/views/Org/hooks/orgInfo';
 import EarlyWarning from './Detail/EarlyWarning.vue';
 import SubscribeList from './Detail/SubscribeList.vue';
-import OrganizationManage from './OrganizationManage/OrganizationManage.vue';
-import InvitationNoticeList from './Detail/InvitationNoticeList.vue';
-import { useAccount } from '@/utils/hooks/useAccount';
+import PersonalSettings from './Detail/PersonalSettings.vue';
 
 const { namespace } = getOrgInfo();
 const avatarUrl = '/src/assets/imgs/avatar/male.png';
 
 const selectTab = ref('yjtzlb');
-const { accountInfo, RemoveInfo } = useAccount();
 
 // 删除弹窗
 const item = ref('');