From 6d68eb11b733d2d0815e29575b906cfbed43cea4 Mon Sep 17 00:00:00 2001
From: owenchen <owenchen@1010printing.com>
Date: Fri, 4 Sep 2026 15:54:15 +0800
Subject: [PATCH] ow

---
 .../src/views/master/FamilyTreeOperation.vue  | 2069 ++++++++++-------
 1 file changed, 1226 insertions(+), 843 deletions(-)

diff --git a/WebVue/src/views/master/FamilyTreeOperation.vue b/WebVue/src/views/master/FamilyTreeOperation.vue
index 1612f55..18ada09 100644
--- a/WebVue/src/views/master/FamilyTreeOperation.vue
+++ b/WebVue/src/views/master/FamilyTreeOperation.vue
@@ -1,331 +1,675 @@
 <template>
-    <a-spin size="large" :spinning="loading">
-        <div class="page-container">
-            <div class="page-header">
-                <a-row :gutter="[16, 8]">
-                    <a-col :lg="8" :sm="24">
-                        <a-row :wrap="false">
-                            <a-col flex="none">
-                                <div style="padding: 0 "><a-input flex="none" readonly value="族谱编号"
-                                        class="site-input-split" style="width: 160px;border-radius:0; border-top-left-radius: 5pt 5pt;
-                                    border-bottom-left-radius: 5pt 5pt;
-                                 pointer-events: none" /></div>
-                            </a-col>
-                            <a-col flex="auto">
-                                <a-input-search :disabled="isEdit" v-model:value="treeId" flex="auto"
-                                    @search="onModalSearch" />
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                    <a-col :lg="12" :sm="24">
-                        <a-space>
-                            <a-button type="primary" :disabled="isEdit" :icon="h(FileSearchOutlined)"
-                                @click.prevent="onSearch">查询</a-button>
-                            <a-button type="primary" :disabled="isEdit" :icon="h(ClearOutlined)"
-                                @click.prevent="onReset">重置</a-button>
-                            <a-button type="primary" :disabled="isEdit" :icon="h(FileAddOutlined)"
-                                @click.prevent="onCreate">新增</a-button>              
-                        </a-space>
-                    </a-col>
-                </a-row>
-            </div>
-            <div class="page-main" :style="{ height: resultH }">
-                <a-row :gutter="[16, 8]">
-                    <a-col :lg="8" :sm="24">
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>族谱编号:</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-input required :readonly="true"
-                                    v-model:value="data.FamilyTree.TreeId" />
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                    <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>族谱名称:</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-input required :readonly="!isEdit"
-                                    v-model:value="data.FamilyTree.TreeName" />
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                </a-row>
-                <a-row :gutter="[16, 8]" style="margin-top: 8px;">
-                    <a-col :lg="8" :sm="24">
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>简介:</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-input :readonly="!isEdit" v-model:value="data.FamilyTree.Brief" />
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                    <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>封面文件名:</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-input :readonly="!isEdit" v-model:value="data.FamilyTree.TreeCoverFilename"
-                                    flex="auto" />
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                </a-row>
-                <a-row :gutter="[16, 8]" style="margin-top: 8px;">
-                    <a-col :lg="8" :sm="24">   
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>祖先:</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-input-group compact style="display: flex; width: 100%;">
-                                    <a-input :disabled="true"
-                                        v-model:value="data.FamilyTree.AncestorPersonGenealogyName" placeholder="族谱名"
-                                        style="width: 50%;" />
-                                    <a-input-search required :disabled="!isEdit" style="width: 50%;"
-                                        v-model:value="data.FamilyTree.AncestorPersonId"
-                                        @search="onModalPerson" />
-                                        <a-input-search style="flex: 1; min-width: 0;"
-                                        v-model:value="data.CurrentPerson.FamilyPerson.PersonId"
-                                        @search="onModalCurrentPerson" />
-                                                      <a-button type="primary" :disabled="!hasData" :icon="h(ApartmentOutlined)"
-                                @click.prevent="onShowAncestryChart">祖谱系图</a-button>
-                                </a-input-group>
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                    <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
-                     
-                        <a-row :wrap="false" align="middle">
-                            <a-col :lg="6" :sm="6" style="min-width: 80px;">
-                                <span>公开?</span>
-                            </a-col>
-                            <a-col :lg="18" :sm="18" style="min-width: 300px;">
-                                <a-select v-model:value="data.FamilyTree.PublicIndc" :disabled="!isEdit"
-                                    style="width: 100%;min-width:124px;">
-                                    <a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{
-                                        o.DisplayName }}</a-select-option>
-                                </a-select>
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                </a-row>
-                <a-divider orientation="left" orientation-margin="0px" dashed style="background-color: silver">
-                </a-divider>
-                <a-row :gutter="[16, 8]">
-                    <a-col :lg="18" :sm="24">
-                        <a-row :wrap="false">
-                            <a-col flex="auto">
-                                <a-input-group compact style="display: flex; width: 100%;">
-                                    <a-input readonly value="当前族员" class="site-input-split"
-                                        style="width: 160px; pointer-events: none;" />
-                                    <a-input :disabled="!isEdit"
-                                        v-model:value="data.CurrentPerson.FamilyPerson.GenealogyName" placeholder="族谱名"
-                                        style="flex: 1; min-width: 0;" />
-                                        <a-input :disabled="!isEdit"
-                                        v-model:value="data.CurrentPerson.FamilyPerson.CommonName" placeholder="常用名"
-                                        style="flex: 1; min-width: 0;" />
-                                    <a-select v-model:value="data.CurrentPerson.FamilyPerson.Gender" :disabled="!isEdit"
-                                        placeholder="性别" style="width: 140px; flex: none;">
-                                        <a-select-option v-for="o in genderOptions" :value="o.BindValue">{{
-                                            o.DisplayName }}</a-select-option>
-                                    </a-select>
-                                    <a-input-search style="flex: 1; min-width: 0;"
-                                        v-model:value="data.CurrentPerson.FamilyPerson.PersonId"
-                                        @search="onModalCurrentPerson" />
-                                                      <a-button type="primary" :disabled="!hasData" :icon="h(ApartmentOutlined)"
-                                @click.prevent="onShowChart">谱系图</a-button>
-                                </a-input-group>
-                            </a-col>
-                        </a-row>
-                    </a-col>
-                </a-row>
-                  <a-divider orientation="left" orientation-margin="0px" dashed style="background-color: silver">
-                </a-divider>
-                <a-collapse v-model:activeKey="activeKey">
-                    <a-collapse-panel key="1" header="夫妻关系">
-                        <a-table bordered :data-source="data.CurrentPerson.FamilyTreeSpouseMaps"
-                            :columns="columnParents" :row-class-name="rowParentClassName" :pagination="false"
-                            :scroll="{ x: 1200, y: 600 }">
-                            <template #bodyCell="datas">
-                                <template v-if="datas.column.dataIndex === 'index'">
-                                    <span>{{ datas.index + 1 }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.GENDER">
-                                    <span>{{ getPolicyText(genderOptions, datas.record.Gender) }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.MARRY_DATE_TEXT">
-                                    <a-input v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.MarryDateText" placeholder="结婚日期文本" />
-                                    <span v-else>{{ datas.record.MarryDateText }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.MARRY_DATE">
-                                    <a-date-picker v-if="isEdit" size="small" style="width: 100%"
-                                        :value="datas.record.MarryDate ? dayjs(datas.record.MarryDate) : null"
-                                        @change="onMarryDateChange(datas.record, $event)" />
-                                    <span v-else>{{ formatDate(datas.record.MarryDate) }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.DIVORCE_DATE_TEXT">
-                                    <a-input v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.DivorceDateText" placeholder="离婚日期文本" />
-                                    <span v-else>{{ datas.record.DivorceDateText }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.DIVORCE_DATE">
-                                    <a-date-picker v-if="isEdit" size="small" style="width: 100%"
-                                        :value="datas.record.DivorceDate ? dayjs(datas.record.DivorceDate) : null"
-                                        @change="onDivorceDateChange(datas.record, $event)" />
-                                    <span v-else>{{ formatDate(datas.record.DivorceDate) }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.MARRY_TYPE">
-                                    <a-input v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.MarryType" placeholder="婚配类型" />
-                                    <span v-else>{{ datas.record.MarryType }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.IS_CURRENT">
-                                    <a-select v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.IsCurrent">
-                                        <a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{
-                                            o.DisplayName }}</a-select-option>
-                                    </a-select>
-                                    <span v-else>{{ getPolicyText(yesNoPolicy, datas.record.IsCurrent) }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === FamilyTreeSpouseMapViewEntity.REMARK">
-                                    <a-input v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.Remark" placeholder="备注" />
-                                    <span v-else>{{ datas.record.Remark }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === 'operation' && isEdit">
-                                    <UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
-                                        @click="upParent(datas.index)" />
-                                    <DownSquareTwoTone
-                                        :style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
-                                        @click="downParent(datas.index)" />
-                                    <DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
-                                        @click="deleteParent(datas.record.SpouseId)" />
-                                </template>
-                            </template>
-                        </a-table>
-                        <template #extra
-                            v-if="isEdit">
-                            <PlusSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }" @click="addSpouse" />
-                        </template>
-                    </a-collapse-panel>
-                    <a-collapse-panel key="2" header="孩子关系">
-                        <a-table bordered :data-source="data.CurrentPerson.FamilyTreeChildrenMaps"
-                            :columns="columnSons" :row-class-name="rowSonClassName" :pagination="false"
-                            :scroll="{ x: 950, y: 600 }">
-                            <template #bodyCell="datas">
-                                <template v-if="datas.column.dataIndex === 'index'">
-                                    <span>{{ datas.index + 1 }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === FamilyTreeChildrenMapViewEntity.GENDER">
-                                    <span>{{ getPolicyText(genderOptions, datas.record.Gender) }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === FamilyTreeChildrenMapViewEntity.SPOUSE_ID">
-                                    <a-select v-if="isEdit" size="small" style="width: 100%" allow-clear
-                                        show-search :options="spouseOptions" v-model:value="datas.record.SpouseId"
-                                        placeholder="选择父母" />
-                                    <span v-else>{{ getSpouseName(datas.record.SpouseId) }}</span>
-                                </template>
-                                <template
-                                    v-else-if="datas.column.dataIndex === FamilyTreeChildrenMapViewEntity.RELATION_TYPE">
-                                    <a-select v-if="isEdit" size="small" style="width: 100%" allow-clear
-                                        show-search :options="relationTypeSelectOptions"
-                                        v-model:value="datas.record.RelationType" placeholder="关系类型" />
-                                    <span v-else>{{ getPolicyText(relationTypeOptions, datas.record.RelationType) }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === FamilyTreeChildrenMapViewEntity.REMARK">
-                                    <a-input v-if="isEdit" size="small" style="width: 100%"
-                                        v-model:value="datas.record.Remark" placeholder="备注" />
-                                    <span v-else>{{ datas.record.Remark }}</span>
-                                </template>
-                                <template v-else-if="datas.column.dataIndex === 'operation' && isEdit">
-                                    <UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
-                                        @click="upSon(datas.index)" />
-                                    <DownSquareTwoTone
-                                        :style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
-                                        @click="downSon(datas.index)" />
-                                    <DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
-                                        @click="deleteSon(datas.record.ChildrenId)" />
-                                </template>
-                            </template>
-                        </a-table>
-                        <template #extra v-if="isEdit">
-                            <PlusSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }" @click="addSon" />
-                        </template>
-                    </a-collapse-panel>
-                </a-collapse>
-            </div>
-            <div class="page-footer">
-                <div style="">
-                    <a-row :gutter="24">
-                        <a-col :lg="24" :sm="24">
-                            <div>
-                                <a-row v-if="isEdit" :gutter="[16, 8]">
-                                    <a-space>
-                                        <a-popconfirm v-if="data.FamilyTree.CreatedBy" title="确定是否取消修改?"
-                                            ok-text="是" cancel-text="否" @confirm="onCancel">
-                                            <a-button type="primary" ghost :icon="h(UndoOutlined)">取消</a-button>
-                                        </a-popconfirm>
-                                        <a-button v-if="!data.FamilyTree.CreatedBy" type="primary" ghost
-                                            :icon="h(UndoOutlined)" @click.prevent="onCancel">取消</a-button>
-                                        <a-button type="primary" ghost :icon="h(SaveOutlined)"
-                                            @click.prevent="onSave">保存</a-button>
-                                    </a-space>
-                                </a-row>
-                                <a-row v-else :gutter="[16, 8]">
-                                    <a-space>
-                                        <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
-                                            :disabled="!hasData" @click.prevent="onAmend">修改</a-button>
-                                        <a-popconfirm :disabled="!hasData" title="确定是否删除这条记录?" ok-text="是"
-                                            cancel-text="否" @confirm="onDelete">
-                                            <a-button type="primary" danger :icon="h(DeleteOutlined)"
-                                                :disabled="!hasData" v-if="canDelete">删除</a-button>
-                                        </a-popconfirm>
-                                    </a-space>
-                                </a-row>
-                            </div>
-                        </a-col>
-                    </a-row>
+  <a-spin size="large" :spinning="loading">
+    <div class="page-container">
+      <div class="page-header">
+        <a-row :gutter="[16, 8]">
+          <a-col :lg="8" :sm="24">
+            <a-row :wrap="false">
+              <a-col flex="none">
+                <div style="padding: 0">
+                  <a-input
+                    flex="none"
+                    readonly
+                    value="族谱编号"
+                    class="site-input-split"
+                    style="
+                      width: 160px;
+                      border-radius: 0;
+                      border-top-left-radius: 5pt 5pt;
+                      border-bottom-left-radius: 5pt 5pt;
+                      pointer-events: none;
+                    "
+                  />
                 </div>
-            </div>
+              </a-col>
+              <a-col flex="auto">
+                <a-input-search
+                  :disabled="isEdit"
+                  v-model:value="treeId"
+                  flex="auto"
+                  @search="onModalSearch"
+                />
+              </a-col>
+            </a-row>
+          </a-col>
+          <a-col :lg="12" :sm="24">
+            <a-space>
+              <a-button
+                type="primary"
+                :disabled="isEdit"
+                :icon="h(FileSearchOutlined)"
+                @click.prevent="onSearch"
+                >查询</a-button
+              >
+              <a-button
+                type="primary"
+                :disabled="isEdit"
+                :icon="h(ClearOutlined)"
+                @click.prevent="onReset"
+                >重置</a-button
+              >
+              <a-button
+                type="primary"
+                :disabled="isEdit"
+                :icon="h(FileAddOutlined)"
+                @click.prevent="onCreate"
+                >新增</a-button
+              >
+            </a-space>
+          </a-col>
+        </a-row>
+      </div>
+      <div class="page-main" :style="{ height: resultH }">
+        <a-row :gutter="[16, 8]">
+          <a-col :lg="8" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>族谱编号:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input
+                  required
+                  :readonly="true"
+                  v-model:value="data.FamilyTree.TreeId"
+                />
+              </a-col>
+            </a-row>
+          </a-col>
+          <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>族谱名称:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input
+                  required
+                  :readonly="!isEdit"
+                  v-model:value="data.FamilyTree.TreeName"
+                />
+              </a-col>
+            </a-row>
+          </a-col>
+        </a-row>
+        <a-row :gutter="[16, 8]" style="margin-top: 8px">
+          <a-col :lg="8" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>简介:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input
+                  :readonly="!isEdit"
+                  v-model:value="data.FamilyTree.Brief"
+                />
+              </a-col>
+            </a-row>
+          </a-col>
+          <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>封面文件名:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input
+                  :readonly="!isEdit"
+                  v-model:value="data.FamilyTree.TreeCoverFilename"
+                  flex="auto"
+                />
+              </a-col>
+            </a-row>
+          </a-col>
+        </a-row>
+        <a-row :gutter="[16, 8]" style="margin-top: 8px">
+          <a-col :lg="8" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>祖先:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input-group compact style="display: flex; width: 100%">
+                  <a-input
+                    :disabled="true"
+                    v-model:value="data.FamilyTree.AncestorPersonGenealogyName"
+                    placeholder="族谱名"
+                    style="width: 50%"
+                  />
+                  <a-input-search
+                    required
+                    :disabled="!isEdit"
+                    style="width: 50%"
+                    v-model:value="data.FamilyTree.AncestorPersonId"
+                    @search="onModalPerson"
+                  />
+                  <a-button
+                    type="primary"
+                    :disabled="!hasData"
+                    :icon="h(ApartmentOutlined)"
+                    @click.prevent="onShowAncestryChart"
+                    >祖谱系图</a-button
+                  >
+                </a-input-group>
+              </a-col>
+            </a-row>
+          </a-col>
+          <a-col :lg="{ span: 8, offset: 2 }" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>公开?</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-select
+                  v-model:value="data.FamilyTree.PublicIndc"
+                  :disabled="!isEdit"
+                  style="width: 100%; min-width: 124px"
+                >
+                  <a-select-option
+                    v-for="o in yesNoPolicy"
+                    :value="o.BindValue"
+                    >{{ o.DisplayName }}</a-select-option
+                  >
+                </a-select>
+              </a-col>
+            </a-row>
+          </a-col>
+        </a-row>
+        <a-divider
+          orientation="left"
+          orientation-margin="0px"
+          dashed
+          style="background-color: silver"
+        >
+        </a-divider>
+        <a-row :gutter="[16, 8]">
+          <a-col :lg="18" :sm="24">
+            <a-row :wrap="false">
+              <a-col flex="auto">
+                <a-input-group compact style="display: flex; width: 100%">
+                  <a-input
+                    readonly
+                    value="当前族员"
+                    class="site-input-split"
+                    style="width: 160px; pointer-events: none"
+                  />
+                  <a-select
+                    v-model:value="data.CurrentPerson.FamilyPerson.Gender"
+                    :disabled="!isEdit"
+                    placeholder="性别"
+                    style="width: 140px; flex: none"
+                  >
+                    <a-select-option
+                      v-for="o in genderOptions"
+                      :value="o.BindValue"
+                      >{{ o.DisplayName }}</a-select-option
+                    >
+                  </a-select>
+                  <a-input
+                    :disabled="!isEdit"
+                    v-model:value="
+                      data.CurrentPerson.FamilyPerson.GenealogyName
+                    "
+                    placeholder="族谱名"
+                    style="flex: 1; min-width: 0"
+                  />
+                  <a-input
+                    :disabled="!isEdit"
+                    v-model:value="data.CurrentPerson.FamilyPerson.CommonName"
+                    placeholder="常用名"
+                    style="flex: 1; min-width: 0"
+                  />
+
+                  <a-input-search
+                    style="flex: 1; min-width: 0"
+                    v-model:value="data.CurrentPerson.FamilyPerson.PersonId"
+                    @search="onModalCurrentPerson"
+                  />
+                  <a-button
+                    type="primary"
+                    :disabled="!hasData"
+                    :icon="h(ApartmentOutlined)"
+                    @click.prevent="onShowChart"
+                    >谱系图</a-button
+                  >
+                </a-input-group>
+              </a-col>
+            </a-row>
+          </a-col>
+        </a-row>
+        <a-divider
+          orientation="left"
+          orientation-margin="0px"
+          dashed
+          style="background-color: silver"
+        >
+        </a-divider>
+        <a-collapse v-model:activeKey="activeKey">
+          <a-collapse-panel key="1" header="夫妻关系">
+            <a-table
+              bordered
+              :data-source="data.CurrentPerson.FamilyTreeSpouseMaps"
+              :columns="columnParents"
+              :row-class-name="rowParentClassName"
+              :pagination="false"
+              :scroll="{ x: 1200, y: 600 }"
+            >
+              <template #bodyCell="datas">
+                <template v-if="datas.column.dataIndex === 'index'">
+                  <span>{{ datas.index + 1 }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.GENDER
+                  "
+                >
+                  <span>{{
+                    getPolicyText(genderOptions, datas.record.Gender)
+                  }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.MARRY_DATE_TEXT
+                  "
+                >
+                  <a-input
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.MarryDateText"
+                    placeholder="结婚日期文本"
+                  />
+                  <span v-else>{{ datas.record.MarryDateText }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.MARRY_DATE
+                  "
+                >
+                  <a-date-picker
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    :value="
+                      datas.record.MarryDate
+                        ? dayjs(datas.record.MarryDate)
+                        : null
+                    "
+                    @change="onMarryDateChange(datas.record, $event)"
+                  />
+                  <span v-else>{{ formatDate(datas.record.MarryDate) }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.DIVORCE_DATE_TEXT
+                  "
+                >
+                  <a-input
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.DivorceDateText"
+                    placeholder="离婚日期文本"
+                  />
+                  <span v-else>{{ datas.record.DivorceDateText }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.DIVORCE_DATE
+                  "
+                >
+                  <a-date-picker
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    :value="
+                      datas.record.DivorceDate
+                        ? dayjs(datas.record.DivorceDate)
+                        : null
+                    "
+                    @change="onDivorceDateChange(datas.record, $event)"
+                  />
+                  <span v-else>{{ formatDate(datas.record.DivorceDate) }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.MARRY_TYPE
+                  "
+                >
+                  <a-input
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.MarryType"
+                    placeholder="婚配类型"
+                  />
+                  <span v-else>{{ datas.record.MarryType }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.IS_CURRENT
+                  "
+                >
+                  <a-select
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.IsCurrent"
+                  >
+                    <a-select-option
+                      v-for="o in yesNoPolicy"
+                      :value="o.BindValue"
+                      >{{ o.DisplayName }}</a-select-option
+                    >
+                  </a-select>
+                  <span v-else>{{
+                    getPolicyText(yesNoPolicy, datas.record.IsCurrent)
+                  }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeSpouseMapViewEntity.REMARK
+                  "
+                >
+                  <a-input
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.Remark"
+                    placeholder="备注"
+                  />
+                  <span v-else>{{ datas.record.Remark }}</span>
+                </template>
+                <template
+                  v-else-if="datas.column.dataIndex === 'operation' && isEdit"
+                >
+                  <UpSquareTwoTone
+                    :style="{ fontSize: '24px', color: '#08c' }"
+                    @click="upParent(datas.index)"
+                  />
+                  <DownSquareTwoTone
+                    :style="{
+                      fontSize: '24px',
+                      color: '#08c',
+                      marginLeft: '20px',
+                      marginRight: '20px',
+                    }"
+                    @click="downParent(datas.index)"
+                  />
+                  <DeleteOutlined
+                    :style="{ fontSize: '24px', color: 'red' }"
+                    @click="deleteParent(datas.record.SpouseId)"
+                  />
+                </template>
+              </template>
+            </a-table>
+            <template #extra v-if="isEdit">
+              <PlusSquareTwoTone
+                :style="{ fontSize: '24px', color: '#08c' }"
+                @click="addSpouse"
+              />
+            </template>
+          </a-collapse-panel>
+          <a-collapse-panel key="2" header="孩子关系">
+            <a-table
+              bordered
+              :data-source="data.CurrentPerson.FamilyTreeChildrenMaps"
+              :columns="columnSons"
+              :row-class-name="rowSonClassName"
+              :pagination="false"
+              :scroll="{ x: 950, y: 600 }"
+            >
+              <template #bodyCell="datas">
+                <template v-if="datas.column.dataIndex === 'index'">
+                  <span>{{ datas.index + 1 }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeChildrenMapViewEntity.GENDER
+                  "
+                >
+                  <span>{{
+                    getPolicyText(genderOptions, datas.record.Gender)
+                  }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeChildrenMapViewEntity.SPOUSE_ID
+                  "
+                >
+                  <a-select
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    allow-clear
+                    show-search
+                    :options="spouseOptions"
+                    v-model:value="datas.record.SpouseId"
+                    placeholder="选择父母"
+                  />
+                  <span v-else>{{ getSpouseName(datas.record.SpouseId) }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeChildrenMapViewEntity.RELATION_TYPE
+                  "
+                >
+                  <a-select
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    allow-clear
+                    show-search
+                    :options="relationTypeSelectOptions"
+                    v-model:value="datas.record.RelationType"
+                    placeholder="关系类型"
+                  />
+                  <span v-else>{{
+                    getPolicyText(
+                      relationTypeOptions,
+                      datas.record.RelationType,
+                    )
+                  }}</span>
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyTreeChildrenMapViewEntity.REMARK
+                  "
+                >
+                  <a-input
+                    v-if="isEdit"
+                    size="small"
+                    style="width: 100%"
+                    v-model:value="datas.record.Remark"
+                    placeholder="备注"
+                  />
+                  <span v-else>{{ datas.record.Remark }}</span>
+                </template>
+                <template
+                  v-else-if="datas.column.dataIndex === 'operation' && isEdit"
+                >
+                  <UpSquareTwoTone
+                    :style="{ fontSize: '24px', color: '#08c' }"
+                    @click="upSon(datas.index)"
+                  />
+                  <DownSquareTwoTone
+                    :style="{
+                      fontSize: '24px',
+                      color: '#08c',
+                      marginLeft: '20px',
+                      marginRight: '20px',
+                    }"
+                    @click="downSon(datas.index)"
+                  />
+                  <DeleteOutlined
+                    :style="{ fontSize: '24px', color: 'red' }"
+                    @click="deleteSon(datas.record.ChildrenId)"
+                  />
+                </template>
+              </template>
+            </a-table>
+            <template #extra v-if="isEdit">
+              <PlusSquareTwoTone
+                :style="{ fontSize: '24px', color: '#08c' }"
+                @click="addSon"
+              />
+            </template>
+          </a-collapse-panel>
+        </a-collapse>
+      </div>
+      <div class="page-footer">
+        <div style="">
+          <a-row :gutter="24">
+            <a-col :lg="24" :sm="24">
+              <div>
+                <a-row v-if="isEdit" :gutter="[16, 8]">
+                  <a-space>
+                    <a-popconfirm
+                      v-if="data.FamilyTree.CreatedBy"
+                      title="确定是否取消修改?"
+                      ok-text="是"
+                      cancel-text="否"
+                      @confirm="onCancel"
+                    >
+                      <a-button type="primary" ghost :icon="h(UndoOutlined)"
+                        >取消</a-button
+                      >
+                    </a-popconfirm>
+                    <a-button
+                      v-if="!data.FamilyTree.CreatedBy"
+                      type="primary"
+                      ghost
+                      :icon="h(UndoOutlined)"
+                      @click.prevent="onCancel"
+                      >取消</a-button
+                    >
+                    <a-button
+                      type="primary"
+                      ghost
+                      :icon="h(SaveOutlined)"
+                      @click.prevent="onSave"
+                      >保存</a-button
+                    >
+                  </a-space>
+                </a-row>
+                <a-row v-else :gutter="[16, 8]">
+                  <a-space>
+                    <a-button
+                      type="primary"
+                      v-if="canAmend"
+                      :icon="h(EditOutlined)"
+                      :disabled="!hasData"
+                      @click.prevent="onAmend"
+                      >修改</a-button
+                    >
+                    <a-popconfirm
+                      :disabled="!hasData"
+                      title="确定是否删除这条记录?"
+                      ok-text="是"
+                      cancel-text="否"
+                      @confirm="onDelete"
+                    >
+                      <a-button
+                        type="primary"
+                        danger
+                        :icon="h(DeleteOutlined)"
+                        :disabled="!hasData"
+                        v-if="canDelete"
+                        >删除</a-button
+                      >
+                    </a-popconfirm>
+                  </a-space>
+                </a-row>
+              </div>
+            </a-col>
+          </a-row>
         </div>
-        <dragModal v-model:open="modelOption.isModalTree" width="80%" title="族谱查询" @cancel="handleCance"
-            :fullscreen="width < 640" :mask-closable="false" @ok="handleSelect">
-            <FamilyTreeEnquiry ref="enquiry" @on-row-dblclick="handleSelect"></FamilyTreeEnquiry>
-        </dragModal>
-        <dragModal v-model:open="modelOption.isModalPerson" width="80%" title="人员查询" @cancel="handleCance"
-            :fullscreen="width < 640" :mask-closable="false" @ok="handleSelectPerson">
-            <FamilyPersonEnquiry ref="personEnquiry"
-                @on-row-dblclick="handleSelectPerson"></FamilyPersonEnquiry>
-        </dragModal>
-        <FamilyTreeChartModal v-model:open="chartVisible" :data="data" :loaded-nodes="loadedNodes" title="谱系图"
-            @select-child="onChartSelectChild" />
-        <AncestryTreeChartModal v-model:open="ancestryChartVisible" :tree-id="treeId" title="祖谱系图" />
-    </a-spin>
+      </div>
+    </div>
+    <dragModal
+      v-model:open="modelOption.isModalTree"
+      width="80%"
+      title="族谱查询"
+      @cancel="handleCance"
+      :fullscreen="width < 640"
+      :mask-closable="false"
+      @ok="handleSelect"
+    >
+      <FamilyTreeEnquiry
+        ref="enquiry"
+        @on-row-dblclick="handleSelect"
+      ></FamilyTreeEnquiry>
+    </dragModal>
+    <dragModal
+      v-model:open="modelOption.isModalPerson"
+      width="80%"
+      title="人员查询"
+      @cancel="handleCance"
+      :fullscreen="width < 640"
+      :mask-closable="false"
+      @ok="handleSelectPerson"
+    >
+      <FamilyPersonEnquiry
+        ref="personEnquiry"
+        @on-row-dblclick="handleSelectPerson"
+      ></FamilyPersonEnquiry>
+    </dragModal>
+    <FamilyTreeChartModal
+      v-model:open="chartVisible"
+      :data="data"
+      :loaded-nodes="loadedNodes"
+      title="谱系图"
+      @select-child="onChartSelectChild"
+    />
+    <AncestryTreeChartModal
+      v-model:open="ancestryChartVisible"
+      :tree-id="treeId"
+      title="祖谱系图"
+    />
+  </a-spin>
 </template>
 <script lang="ts" setup>
-import { ref, unref, onBeforeMount, inject, provide, h, onMounted, computed } from "vue";
+import {
+  ref,
+  unref,
+  onBeforeMount,
+  inject,
+  provide,
+  h,
+  onMounted,
+  computed,
+} from "vue";
 import { notification } from "ant-design-vue";
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute, useRouter } from "vue-router";
 import dayjs from "dayjs";
 import type { Dayjs } from "dayjs";
-import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone, ApartmentOutlined } from "@ant-design/icons-vue";
-import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
-import dragModal from "@/components/basic/DragModal.vue"
+import {
+  DeleteOutlined,
+  EditOutlined,
+  ClearOutlined,
+  FileSearchOutlined,
+  FileAddOutlined,
+  UndoOutlined,
+  SaveOutlined,
+  PlusSquareTwoTone,
+  DownSquareTwoTone,
+  UpSquareTwoTone,
+  ApartmentOutlined,
+} from "@ant-design/icons-vue";
+import {
+  PermissionContext,
+  usePermissionContext,
+} from "@/hooks/PermissionContext";
+import dragModal from "@/components/basic/DragModal.vue";
 import FamilyTreeEnquiry from "./FamilyTreeEnquiry.vue";
 import FamilyPersonEnquiry from "./FamilyPersonEnquiry.vue";
 import FamilyTreeChartModal from "@/components/master/FamilyTreeChartModal.vue";
@@ -334,25 +678,28 @@ import { FamilyTreeData } from "@/data/auto/familyTreeData";
 import { FamilyTreeSpouseMapViewEntity } from "@/data/auto/familyTreeSpouseMapViewEntity";
 import { FamilyTreeChildrenMapViewEntity } from "@/data/auto/familyTreeChildrenMapViewEntity";
 import familyTreeService from "@/service/master/familyTreeService";
-import { useYesNoPolicy } from "@/hooks/useYesNoPolicy"
-import { useLocalePolicy } from "@/hooks/useLocalePolicy"
+import { useYesNoPolicy } from "@/hooks/useYesNoPolicy";
+import { useLocalePolicy } from "@/hooks/useLocalePolicy";
 import { SelectOption } from "@/data/auto/selectOption";
-import { useWindowSize } from '@vueuse/core'
+import { useWindowSize } from "@vueuse/core";
 import { FamilyTreeViewEntity } from "@/data/auto/familyTreeViewEntity";
 import { FamilyPersonEntity } from "@/data/auto/familyPersonEntity";
-import { operationToEnquiryMethodKey, OperationToEnquiryModelOption } from "@/injections"
+import {
+  operationToEnquiryMethodKey,
+  OperationToEnquiryModelOption,
+} from "@/injections";
 
 //================inject================
 const loading = ref<boolean>(false);
 //================inject================
 
-const { width, height } = useWindowSize()
+const { width, height } = useWindowSize();
 
 const route = useRoute();
 const router = useRouter();
 
-const treeId = ref<string>(route.params.id as string)
-const mode = ref<string>(route.params.mode as string)
+const treeId = ref<string>(route.params.id as string);
+const mode = ref<string>(route.params.mode as string);
 
 const isEdit = ref<boolean>(false);
 const canAmend = ref<boolean>(false);
@@ -367,492 +714,517 @@ const data = ref<FamilyTreeData>(new FamilyTreeData());
 const hasData = ref<boolean>(false);
 
 const yesNoPolicy = ref<SelectOption[]>([]);
-const resultH = ref('');
+const resultH = ref("");
 const oldTreeId = ref<string>(treeId.value);
 
-
 interface TreeEnquiry {
-    keys: FamilyTreeViewEntity[],
-    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+  keys: FamilyTreeViewEntity[];
+  setBindOptionValue(
+    bindValue: string,
+    value: string,
+    value1: string,
+    values: string[],
+  ): void;
 }
 
-
 interface PersonEnquiry {
-    keys: FamilyPersonEntity[],
-    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+  keys: FamilyPersonEntity[];
+  setBindOptionValue(
+    bindValue: string,
+    value: string,
+    value1: string,
+    values: string[],
+  ): void;
 }
 
-const enquiry = ref<TreeEnquiry | null>(null)
-const personEnquiry = ref<PersonEnquiry | null>(null)
+const enquiry = ref<TreeEnquiry | null>(null);
+const personEnquiry = ref<PersonEnquiry | null>(null);
 
-const activeKey = ref(['1', '2']);
+const activeKey = ref(["1", "2"]);
 
 const columnParents = ref([
-    {
-        title: '序号',
-        dataIndex: 'index',
-        width: '8%',
-        align: 'center',
-        fixed: 'left',
-        sequence: 0,
-        hidden: 'N',
-        format: ''
-    },
-    {
-        title: "配偶姓氏",
-        dataIndex: FamilyTreeSpouseMapViewEntity.SPOUSE_SURNAME,
-        width: '10%',
-        sequence: 1,
-        hidden: 'N'
-    },
-    {
-        title: "配偶谱名",
-        dataIndex: FamilyTreeSpouseMapViewEntity.SPOUSE_GENEALOGY_NAME,
-        width: '10%',
-        sequence: 2,
-        hidden: 'N'
-    },
-    {
-        title: "性别",
-        dataIndex: FamilyTreeSpouseMapViewEntity.GENDER,
-        width: '8%',
-        sequence: 3,
-        hidden: 'N'
-    },
-    {
-        title: "结婚日期文本",
-        dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_DATE_TEXT,
-        width: '11%',
-        sequence: 4,
-        hidden: 'N'
-    },
-    {
-        title: "结婚日期",
-        dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_DATE,
-        width: '11%',
-        sequence: 5,
-        hidden: 'N'
-    },
-    {
-        title: "离婚日期文本",
-        dataIndex: FamilyTreeSpouseMapViewEntity.DIVORCE_DATE_TEXT,
-        width: '11%',
-        sequence: 6,
-        hidden: 'N'
-    },
-    {
-        title: "离婚日期",
-        dataIndex: FamilyTreeSpouseMapViewEntity.DIVORCE_DATE,
-        width: '11%',
-        sequence: 7,
-        hidden: 'N'
-    },
-    {
-        title: "婚配类型",
-        dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_TYPE,
-        width: '8%',
-        sequence: 8,
-        hidden: 'N'
-    },
-    {
-        title: "当前?",
-        dataIndex: FamilyTreeSpouseMapViewEntity.IS_CURRENT,
-        width: '8%',
-        sequence: 9,
-        hidden: 'N'
-    },
-    {
-        title: "备注",
-        dataIndex: FamilyTreeSpouseMapViewEntity.REMARK,
-        width: '11%',
-        sequence: 10,
-        hidden: 'N'
-    },
-    {
-        title: "",
-        dataIndex: 'operation',
-        width: '12%',
-        sequence: 11,
-        hidden: 'N'
-    }
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "8%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "配偶姓氏",
+    dataIndex: FamilyTreeSpouseMapViewEntity.SPOUSE_SURNAME,
+    width: "10%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "配偶谱名",
+    dataIndex: FamilyTreeSpouseMapViewEntity.SPOUSE_GENEALOGY_NAME,
+    width: "10%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "性别",
+    dataIndex: FamilyTreeSpouseMapViewEntity.GENDER,
+    width: "8%",
+    sequence: 3,
+    hidden: "N",
+  },
+  {
+    title: "结婚日期文本",
+    dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_DATE_TEXT,
+    width: "11%",
+    sequence: 4,
+    hidden: "N",
+  },
+  {
+    title: "结婚日期",
+    dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_DATE,
+    width: "11%",
+    sequence: 5,
+    hidden: "N",
+  },
+  {
+    title: "离婚日期文本",
+    dataIndex: FamilyTreeSpouseMapViewEntity.DIVORCE_DATE_TEXT,
+    width: "11%",
+    sequence: 6,
+    hidden: "N",
+  },
+  {
+    title: "离婚日期",
+    dataIndex: FamilyTreeSpouseMapViewEntity.DIVORCE_DATE,
+    width: "11%",
+    sequence: 7,
+    hidden: "N",
+  },
+  {
+    title: "婚配类型",
+    dataIndex: FamilyTreeSpouseMapViewEntity.MARRY_TYPE,
+    width: "8%",
+    sequence: 8,
+    hidden: "N",
+  },
+  {
+    title: "当前?",
+    dataIndex: FamilyTreeSpouseMapViewEntity.IS_CURRENT,
+    width: "8%",
+    sequence: 9,
+    hidden: "N",
+  },
+  {
+    title: "备注",
+    dataIndex: FamilyTreeSpouseMapViewEntity.REMARK,
+    width: "11%",
+    sequence: 10,
+    hidden: "N",
+  },
+  {
+    title: "",
+    dataIndex: "operation",
+    width: "12%",
+    sequence: 11,
+    hidden: "N",
+  },
 ]);
 
 const columnSons = ref([
-    {
-        title: '序号',
-        dataIndex: 'index',
-        width: '8%',
-        align: 'center',
-        fixed: 'left',
-        sequence: 0,
-        hidden: 'N',
-        format: ''
-    },
-    {
-        title: "姓氏",
-        dataIndex: FamilyTreeChildrenMapViewEntity.CHILDREN_SURNAME,
-        width: '10%',
-        sequence: 1,
-        hidden: 'N'
-    },
-    {
-        title: "谱名",
-        dataIndex: FamilyTreeChildrenMapViewEntity.CHILDREN_GENEALOGY_NAME,
-        width: '10%',
-        sequence: 2,
-        hidden: 'N'
-    },
-    {
-        title: "性别",
-        dataIndex: FamilyTreeChildrenMapViewEntity.GENDER,
-        width: '8%',
-        sequence: 3,
-        hidden: 'N'
-    },
-    {
-        title: "父母",
-        dataIndex: FamilyTreeChildrenMapViewEntity.SPOUSE_ID,
-        width: '14%',
-        sequence: 4,
-        hidden: 'N'
-    },
-    {
-        title: "关系",
-        dataIndex: FamilyTreeChildrenMapViewEntity.RELATION_TYPE,
-        width: '12%',
-        sequence: 5,
-        hidden: 'N'
-    },
-    {
-        title: "备注",
-        dataIndex: FamilyTreeChildrenMapViewEntity.REMARK,
-        width: '14%',
-        sequence: 6,
-        hidden: 'N'
-    },
-    {
-        title: "",
-        dataIndex: 'operation',
-        width: '12%',
-        sequence: 7,
-        hidden: 'N'
-    }
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "8%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "姓氏",
+    dataIndex: FamilyTreeChildrenMapViewEntity.CHILDREN_SURNAME,
+    width: "10%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "谱名",
+    dataIndex: FamilyTreeChildrenMapViewEntity.CHILDREN_GENEALOGY_NAME,
+    width: "10%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "性别",
+    dataIndex: FamilyTreeChildrenMapViewEntity.GENDER,
+    width: "8%",
+    sequence: 3,
+    hidden: "N",
+  },
+  {
+    title: "父母",
+    dataIndex: FamilyTreeChildrenMapViewEntity.SPOUSE_ID,
+    width: "14%",
+    sequence: 4,
+    hidden: "N",
+  },
+  {
+    title: "关系",
+    dataIndex: FamilyTreeChildrenMapViewEntity.RELATION_TYPE,
+    width: "12%",
+    sequence: 5,
+    hidden: "N",
+  },
+  {
+    title: "备注",
+    dataIndex: FamilyTreeChildrenMapViewEntity.REMARK,
+    width: "14%",
+    sequence: 6,
+    hidden: "N",
+  },
+  {
+    title: "",
+    dataIndex: "operation",
+    width: "12%",
+    sequence: 7,
+    hidden: "N",
+  },
 ]);
 //================provide================
-const modelOption = ref<OperationToEnquiryModelOption>(new OperationToEnquiryModelOption());
+const modelOption = ref<OperationToEnquiryModelOption>(
+  new OperationToEnquiryModelOption(),
+);
 modelOption.value.isModalTree = false;
 modelOption.value.isModalPerson = false;
 
-modelOption.value.selectionTypeTree = 'radio';
-modelOption.value.selectionTypePerson = 'radio';
+modelOption.value.selectionTypeTree = "radio";
+modelOption.value.selectionTypePerson = "radio";
 
 modelOption.value.initBindOptionsTree = [];
 modelOption.value.initBindOptionsPerson = [];
 
-
 const getOperationToEnquiryModelOption = () => {
-    return modelOption.value
-}
-provide(
-    operationToEnquiryMethodKey,
-    {
-        getOperationToEnquiryModelOption,
-    }
-);
+  return modelOption.value;
+};
+provide(operationToEnquiryMethodKey, {
+  getOperationToEnquiryModelOption,
+});
 //================provide================
 
 onBeforeMount(async () => {
-    yesNoPolicy.value = await useYesNoPolicy().getSelectOption(false);
-})
+  yesNoPolicy.value = await useYesNoPolicy().getSelectOption(false);
+});
 
 onMounted(() => {
-    let pContext: PermissionContext = usePermissionContext();
-    canAmend.value = pContext.canAmend(route.meta.permission as string);
-    canDelete.value = pContext.canDelete(route.meta.permission as string);
-    canCreate.value = pContext.canCreate(route.meta.permission as string);
-    computResultTableHeight();
+  let pContext: PermissionContext = usePermissionContext();
+  canAmend.value = pContext.canAmend(route.meta.permission as string);
+  canDelete.value = pContext.canDelete(route.meta.permission as string);
+  canCreate.value = pContext.canCreate(route.meta.permission as string);
+  computResultTableHeight();
 
-    if (treeId.value && treeId.value.trim().length > 0) {
-        onSearch();
-    }
-    if (mode.value && mode.value == 'create') {
-        onCreate();
-        isEdit.value = true;
-    }
-    else if (mode.value && mode.value == 'amend') {
-        isEdit.value = true;
-    }
-})
+  if (treeId.value && treeId.value.trim().length > 0) {
+    onSearch();
+  }
+  if (mode.value && mode.value == "create") {
+    onCreate();
+    isEdit.value = true;
+  } else if (mode.value && mode.value == "amend") {
+    isEdit.value = true;
+  }
+});
 
 const computResultTableHeight = () => {
-    if (width.value > 640) {
-        resultH.value = 'calc(100vh -  220px )';
-    }
-    else {
-        resultH.value = 'calc(100vh -  250px )';
-    }
-}
+  if (width.value > 640) {
+    resultH.value = "calc(100vh -  220px )";
+  } else {
+    resultH.value = "calc(100vh -  250px )";
+  }
+};
 
-const onModalSearch = (() => {
-    modelOption.value.isModalTree = true;
-    modelOption.value.selectionTypeTree = 'radio';
+const onModalSearch = () => {
+  modelOption.value.isModalTree = true;
+  modelOption.value.selectionTypeTree = "radio";
 
-    showModalType.value = 0;
-})
+  showModalType.value = 0;
+};
 
-const onShowChart = (() => {
-    if (!hasData.value) return;
-    chartVisible.value = true;
-})
+const onShowChart = () => {
+  if (!hasData.value) return;
+  chartVisible.value = true;
+};
 
-const onShowAncestryChart = (() => {
-    if (!hasData.value || !treeId.value) return;
-    ancestryChartVisible.value = true;
-})
+const onShowAncestryChart = () => {
+  if (!hasData.value || !treeId.value) return;
+  ancestryChartVisible.value = true;
+};
 
 /** 谱系图中已加载的族员节点（personId -> { person, spouses, children }），不清空原 data，只追加 */
 const loadedNodes = ref<Record<string, any>>({});
 
-const onChartSelectChild = (async (personId: string) => {
-    if (!personId || !treeId.value) return;
-    if (loadedNodes.value[personId]) return;
+const onChartSelectChild = async (personId: string) => {
+  if (!personId || !treeId.value) return;
+  if (loadedNodes.value[personId]) return;
 
-    try {
-        loading.value = true;
-        const childData = await familyTreeService.FindByCurrentPerson({
-            key: treeId.value.trim(),
-            personId,
-        });
-
-        if (childData?.CurrentPerson?.FamilyPerson) {
-            loadedNodes.value = {
-                ...loadedNodes.value,
-                [personId]: {
-                    person: childData.CurrentPerson.FamilyPerson,
-                    spouses: childData.CurrentPerson.FamilyTreeSpouseMaps ?? [],
-                    children: childData.CurrentPerson.FamilyTreeChildrenMaps ?? [],
-                },
-            };
-        } else {
-            notification.info({
-                message: '系统提示：',
-                description: '未找到该族员的谱系数据',
-                placement: "topRight",
-            });
-        }
-    } catch (error) {
-        console.log(error);
-    } finally {
-        loading.value = false;
-    }
-})
-
-
-const onSearch = (async () => {
-
-    if (!treeId.value || treeId.value.trim().length == 0) {
-        notification.info({
-            message: '系统提示：',
-            description: '请输入族谱编号',
-            placement: "topRight",
-        });
-        hasData.value = false;
-        return;
-    }
-
-    data.value = await familyTreeService.FindByCurrentPerson({
-        key: treeId.value.trim(),
-        personId: data.value.CurrentPerson.FamilyPerson.PersonId,
+  try {
+    loading.value = true;
+    const childData = await familyTreeService.FindByCurrentPerson({
+      key: treeId.value.trim(),
+      personId,
     });
 
-    if (data.value.FamilyTree == null) {
-        notification.info({
-            message: '系统提示：',
-            description: '记录不存在',
-            placement: "topRight",
-        });
-        data.value = new FamilyTreeData();
-        hasData.value = false;
-        return;
+    if (childData?.CurrentPerson?.FamilyPerson) {
+      loadedNodes.value = {
+        ...loadedNodes.value,
+        [personId]: {
+          person: childData.CurrentPerson.FamilyPerson,
+          spouses: childData.CurrentPerson.FamilyTreeSpouseMaps ?? [],
+          children: childData.CurrentPerson.FamilyTreeChildrenMaps ?? [],
+        },
+      };
+    } else {
+      notification.info({
+        message: "系统提示：",
+        description: "未找到该族员的谱系数据",
+        placement: "topRight",
+      });
+    }
+  } catch (error) {
+    console.log(error);
+  } finally {
+    loading.value = false;
+  }
+};
+
+const onSearch = async () => {
+  if (!treeId.value || treeId.value.trim().length == 0) {
+    notification.info({
+      message: "系统提示：",
+      description: "请输入族谱编号",
+      placement: "topRight",
+    });
+    hasData.value = false;
+    return;
+  }
+
+  data.value = await familyTreeService.FindByCurrentPerson({
+    key: treeId.value.trim(),
+    personId: data.value.CurrentPerson.FamilyPerson.PersonId,
+  });
+
+  if (data.value.FamilyTree == null) {
+    notification.info({
+      message: "系统提示：",
+      description: "记录不存在",
+      placement: "topRight",
+    });
+    data.value = new FamilyTreeData();
+    hasData.value = false;
+    return;
+  }
+
+  hasData.value = true;
+};
+
+const onReset = () => {
+  data.value = new FamilyTreeData();
+  data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
+  data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
+  treeId.value = "";
+  hasData.value = false;
+  loadedNodes.value = {};
+  selectedSonIndex.value = -1;
+  selectedParentIndex.value = -1;
+};
+
+const onCreate = () => {
+  onReset();
+  isEdit.value = true;
+};
+
+const onAmend = () => {
+  isEdit.value = true;
+  oldTreeId.value = unref(data.value.FamilyTree.TreeId);
+};
+
+const onSave = async () => {
+  try {
+    loading.value = true;
+
+    if (!data.value.CurrentPerson.FamilyTreeSpouseMaps)
+      data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
+    if (!data.value.CurrentPerson.FamilyTreeChildrenMaps)
+      data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
+
+    if (data.value.FamilyTree?.CreatedBy)
+      data.value = await familyTreeService.Update(data.value);
+    else {
+      data.value = await familyTreeService.Insert(data.value);
     }
 
-    hasData.value = true;
-})
+    treeId.value = data.value.FamilyTree.TreeId;
 
-const onReset = (() => {
-    data.value = new FamilyTreeData();
-    data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
-    data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
-    treeId.value = '';
-    hasData.value = false;
-    loadedNodes.value = {};
+    loading.value = false;
+    hasData.value = true;
+    isEdit.value = false;
     selectedSonIndex.value = -1;
     selectedParentIndex.value = -1;
-})
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const onCancel = () => {
+  onReset();
+  if (oldTreeId.value && oldTreeId.value.length > 0) {
+    treeId.value = oldTreeId.value;
+    onSearch();
+  }
+  isEdit.value = false;
+};
+
+const onDelete = async () => {
+  try {
+    loading.value = true;
+
+    await familyTreeService.Delete(data.value.FamilyTree.TreeId);
 
-const onCreate = (() => {
     onReset();
-    isEdit.value = true;
-})
+    loading.value = false;
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
 
-const onAmend = (() => {
-    isEdit.value = true;
-    oldTreeId.value = unref(data.value.FamilyTree.TreeId);
-})
-
-const onSave = (async () => {
-
-    try {
-        loading.value = true;
-
-        if (!data.value.CurrentPerson.FamilyTreeSpouseMaps) data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
-        if (!data.value.CurrentPerson.FamilyTreeChildrenMaps) data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
-
-        if (data.value.FamilyTree?.CreatedBy)
-            data.value = await familyTreeService.Update(data.value);
-        else {
-            data.value = await familyTreeService.Insert(data.value);
-        }
-
-        treeId.value = data.value.FamilyTree.TreeId;
-
-        loading.value = false;
-        hasData.value = true;
-        isEdit.value = false;
-        selectedSonIndex.value = -1;
-        selectedParentIndex.value = -1;
-
-    } catch (error) {
-        loading.value = false;
-        console.log(error);
-    }
-
-})
-
-const onCancel = (() => {
-    onReset();
-    if (oldTreeId.value && oldTreeId.value.length > 0) {
-        treeId.value = oldTreeId.value;
-        onSearch();
-    }
-    isEdit.value = false;
-})
-
-const onDelete = (async () => {
-    try {
-        loading.value = true;
-
-        await familyTreeService.Delete(data.value.FamilyTree.TreeId);
-
-        onReset();
-        loading.value = false;
-
-    } catch (error) {
-        loading.value = false;
-        console.log(error);
-    }
-})
-
-const handleCance = (async () => {
-
-})
+const handleCance = async () => {};
 
 const addSpouse = (event: MouseEvent) => {
-    modelOption.value.isModalPerson = true;
-    modelOption.value.selectionTypePerson = 'radio';
-    showModalType.value = 1;
+  modelOption.value.isModalPerson = true;
+  modelOption.value.selectionTypePerson = "radio";
+  showModalType.value = 1;
 
-    // If you don't want click extra trigger collapse, you can prevent this:
-    event.stopPropagation();
+  // If you don't want click extra trigger collapse, you can prevent this:
+  event.stopPropagation();
 };
 
 const deleteParent = (key: string) => {
-    data.value.CurrentPerson.FamilyTreeSpouseMaps = data.value.CurrentPerson.FamilyTreeSpouseMaps.filter(item => item.SpouseId !== key);
+  data.value.CurrentPerson.FamilyTreeSpouseMaps =
+    data.value.CurrentPerson.FamilyTreeSpouseMaps.filter(
+      (item) => item.SpouseId !== key,
+    );
 };
 
 const formatDate = (value?: Date | null) => {
-    return value ? dayjs(value).format('YYYY-MM-DD') : '';
+  return value ? dayjs(value).format("YYYY-MM-DD") : "";
 };
 
-const onMarryDateChange = (record: FamilyTreeSpouseMapViewEntity, date: Dayjs | null) => {
-    record.MarryDate = date ? date.toDate() : null!;
-    record.MarryDateText = date ? date.format('YYYY-MM-DD') : '';
+const onMarryDateChange = (
+  record: FamilyTreeSpouseMapViewEntity,
+  date: Dayjs | null,
+) => {
+  record.MarryDate = date ? date.toDate() : null!;
+  record.MarryDateText = date ? date.format("YYYY-MM-DD") : "";
 };
 
-const onDivorceDateChange = (record: FamilyTreeSpouseMapViewEntity, date: Dayjs | null) => {
-    record.DivorceDate = date ? date.toDate() : null!;
-    record.DivorceDateText = date ? date.format('YYYY-MM-DD') : '';
+const onDivorceDateChange = (
+  record: FamilyTreeSpouseMapViewEntity,
+  date: Dayjs | null,
+) => {
+  record.DivorceDate = date ? date.toDate() : null!;
+  record.DivorceDateText = date ? date.format("YYYY-MM-DD") : "";
 };
 
 const getPolicyText = (options: SelectOption[], value?: string | null) => {
-    const o = options.find(x => x.BindValue === value);
-    return o ? o.DisplayName : value;
+  const o = options.find((x) => x.BindValue === value);
+  return o ? o.DisplayName : value;
 };
 
 const selectedParentIndex = ref<number>(-1);
 
-const rowParentClassName = (record: FamilyTreeSpouseMapViewEntity, index: number) => {
-    return index === selectedParentIndex.value ? 'parent-row-selected' : '';
+const rowParentClassName = (
+  record: FamilyTreeSpouseMapViewEntity,
+  index: number,
+) => {
+  return index === selectedParentIndex.value ? "parent-row-selected" : "";
 };
 
 const upParent = (index: number) => {
-    if (index > 0) {
-        const item = data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index, 1)[0];
-        data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index - 1, 0, item);
-        selectedParentIndex.value = index - 1;
-        refreshParentOrderby();
-    }
+  if (index > 0) {
+    const item = data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(
+      index,
+      1,
+    )[0];
+    data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index - 1, 0, item);
+    selectedParentIndex.value = index - 1;
+    refreshParentOrderby();
+  }
 };
 
 const downParent = (index: number) => {
-    if (index < data.value.CurrentPerson.FamilyTreeSpouseMaps.length) {
-        const item = data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index, 1)[0];
-        data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index + 1, 0, item);
-        selectedParentIndex.value = index + 1;
+  if (index < data.value.CurrentPerson.FamilyTreeSpouseMaps.length) {
+    const item = data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(
+      index,
+      1,
+    )[0];
+    data.value.CurrentPerson.FamilyTreeSpouseMaps.splice(index + 1, 0, item);
+    selectedParentIndex.value = index + 1;
 
-        refreshParentOrderby();
-    }
+    refreshParentOrderby();
+  }
 };
 
 const refreshParentOrderby = () => {
-    data.value.CurrentPerson.FamilyTreeSpouseMaps.forEach((item, idx) => {
-        item.Orderby = idx + 1;
-    });
+  data.value.CurrentPerson.FamilyTreeSpouseMaps.forEach((item, idx) => {
+    item.Orderby = idx + 1;
+  });
 };
 
 const addSon = (event: MouseEvent) => {
-    modelOption.value.isModalPerson = true;
-    modelOption.value.selectionTypePerson = 'checkbox';
+  modelOption.value.isModalPerson = true;
+  modelOption.value.selectionTypePerson = "checkbox";
 
-    showModalType.value = 2;
+  showModalType.value = 2;
 
-    // If you don't want click extra trigger collapse, you can prevent this:
-    event.stopPropagation();
+  // If you don't want click extra trigger collapse, you can prevent this:
+  event.stopPropagation();
 };
 
 const selectedSonIndex = ref<number>(-1);
 
-const rowSonClassName = (record: FamilyTreeChildrenMapViewEntity, index: number) => {
-    return index === selectedSonIndex.value ? 'son-row-selected' : '';
+const rowSonClassName = (
+  record: FamilyTreeChildrenMapViewEntity,
+  index: number,
+) => {
+  return index === selectedSonIndex.value ? "son-row-selected" : "";
 };
 
 const upSon = (index: number) => {
-    if (index > 0) {
-        const item = data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index, 1)[0];
-        data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index - 1, 0, item);
-        selectedSonIndex.value = index - 1;
-        refreshSonOrderby();
-    }
+  if (index > 0) {
+    const item = data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(
+      index,
+      1,
+    )[0];
+    data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index - 1, 0, item);
+    selectedSonIndex.value = index - 1;
+    refreshSonOrderby();
+  }
 };
 
 const downSon = (index: number) => {
-    if (index < data.value.CurrentPerson.FamilyTreeChildrenMaps.length) {
-        const item = data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index, 1)[0];
-        data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index + 1, 0, item);
-        selectedSonIndex.value = index + 1;
+  if (index < data.value.CurrentPerson.FamilyTreeChildrenMaps.length) {
+    const item = data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(
+      index,
+      1,
+    )[0];
+    data.value.CurrentPerson.FamilyTreeChildrenMaps.splice(index + 1, 0, item);
+    selectedSonIndex.value = index + 1;
 
-        refreshSonOrderby();
-    }
+    refreshSonOrderby();
+  }
 };
 
 const refreshSonOrderby = () => {
@@ -862,193 +1234,204 @@ const refreshSonOrderby = () => {
 };
 
 const deleteSon = (key: string) => {
-    data.value.CurrentPerson.FamilyTreeChildrenMaps = data.value.CurrentPerson.FamilyTreeChildrenMaps.filter(item => item.ChildrenId !== key);
+  data.value.CurrentPerson.FamilyTreeChildrenMaps =
+    data.value.CurrentPerson.FamilyTreeChildrenMaps.filter(
+      (item) => item.ChildrenId !== key,
+    );
 };
 
-const { getPolicyOptionsComputed, getPolicySelectOptionsComputed } = useLocalePolicy();
-const relationTypeOptions = getPolicyOptionsComputed('RelationTypePolicy');
-const relationTypeSelectOptions = getPolicySelectOptionsComputed('RelationTypePolicy');
-const genderOptions = getPolicyOptionsComputed('GenderPolicy');
+const { getPolicyOptionsComputed, getPolicySelectOptionsComputed } =
+  useLocalePolicy();
+const relationTypeOptions = getPolicyOptionsComputed("RelationTypePolicy");
+const relationTypeSelectOptions =
+  getPolicySelectOptionsComputed("RelationTypePolicy");
+const genderOptions = getPolicyOptionsComputed("GenderPolicy");
 
 const spouseOptions = computed(() => {
-    return (data.value.CurrentPerson.FamilyTreeSpouseMaps || []).map(s => ({
-        label: (s.SpouseSurname || '') + (s.SpouseGenealogyName || ''),
-        value: s.SpouseId,
-    }));
+  return (data.value.CurrentPerson.FamilyTreeSpouseMaps || []).map((s) => ({
+    label: (s.SpouseSurname || "") + (s.SpouseGenealogyName || ""),
+    value: s.SpouseId,
+  }));
 });
 
 const getSpouseName = (spouseId?: string) => {
-    if (!spouseId) return '';
-    const s = (data.value.CurrentPerson.FamilyTreeSpouseMaps || []).find(x => x.SpouseId === spouseId);
-    return s ? (s.SpouseSurname || '') + (s.SpouseGenealogyName || '') : spouseId;
+  if (!spouseId) return "";
+  const s = (data.value.CurrentPerson.FamilyTreeSpouseMaps || []).find(
+    (x) => x.SpouseId === spouseId,
+  );
+  return s ? (s.SpouseSurname || "") + (s.SpouseGenealogyName || "") : spouseId;
 };
 
-const handleSelect = (async () => {
-    if (enquiry.value) {
-        if (enquiry.value.keys.length > 0) {
-            //查询弹出
-            if (showModalType.value == 0) {
-                treeId.value = enquiry.value.keys[0].TreeId;
-                data.value = new FamilyTreeData();
-                data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
-                data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
+const handleSelect = async () => {
+  if (enquiry.value) {
+    if (enquiry.value.keys.length > 0) {
+      //查询弹出
+      if (showModalType.value == 0) {
+        treeId.value = enquiry.value.keys[0].TreeId;
+        data.value = new FamilyTreeData();
+        data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
+        data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
 
-                onSearch();
-            }
+        onSearch();
+      }
 
-            modelOption.value.isModalTree = false;
-        }
-        else {
-            notification.info({
-                message: '系统提示：',
-                description: '请选择一条记录',
-                placement: "topRight",
-            });
-        }
+      modelOption.value.isModalTree = false;
+    } else {
+      notification.info({
+        message: "系统提示：",
+        description: "请选择一条记录",
+        placement: "topRight",
+      });
     }
-})
+  }
+};
 
-const onModalPerson = (() => {
-    modelOption.value.isModalPerson = true;
-    modelOption.value.selectionTypePerson = 'radio';
-    showModalType.value = 3;
-})
+const onModalPerson = () => {
+  modelOption.value.isModalPerson = true;
+  modelOption.value.selectionTypePerson = "radio";
+  showModalType.value = 3;
+};
 
-const onModalCurrentPerson = (() => {
-    modelOption.value.isModalPerson = true;
-    modelOption.value.selectionTypePerson = 'radio';
-    showModalType.value = 4;
-})
+const onModalCurrentPerson = () => {
+  modelOption.value.isModalPerson = true;
+  modelOption.value.selectionTypePerson = "radio";
+  showModalType.value = 4;
+};
 
-const handleSelectPerson = (async () => {
-    if (personEnquiry.value) {
-        if (personEnquiry.value.keys.length > 0) {
-            //祖先人员选择
-            if (showModalType.value == 3) {
-                data.value.FamilyTree.AncestorPersonId = personEnquiry.value.keys[0].PersonId;
-                data.value.FamilyTree.AncestorPersonGenealogyName = personEnquiry.value.keys[0].GenealogyName;
-            }
-            //当前族员选择
-            else if (showModalType.value == 4) {
-                data.value.CurrentPerson.FamilyPerson.GenealogyName = personEnquiry.value.keys[0].GenealogyName;
-                data.value.CurrentPerson.FamilyPerson.PersonId = personEnquiry.value.keys[0].PersonId;
+const handleSelectPerson = async () => {
+  if (personEnquiry.value) {
+    if (personEnquiry.value.keys.length > 0) {
+      //祖先人员选择
+      if (showModalType.value == 3) {
+        data.value.FamilyTree.AncestorPersonId =
+          personEnquiry.value.keys[0].PersonId;
+        data.value.FamilyTree.AncestorPersonGenealogyName =
+          personEnquiry.value.keys[0].GenealogyName;
+      }
+      //当前族员选择
+      else if (showModalType.value == 4) {
+        data.value.CurrentPerson.FamilyPerson.GenealogyName =
+          personEnquiry.value.keys[0].GenealogyName;
+        data.value.CurrentPerson.FamilyPerson.PersonId =
+          personEnquiry.value.keys[0].PersonId;
 
-                onSearch();
-            }
-            //添加夫妻关系
-            else if (showModalType.value == 1) {
-                if (!data.value.CurrentPerson.FamilyTreeSpouseMaps) data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
-                let spouse: FamilyTreeSpouseMapViewEntity = new FamilyTreeSpouseMapViewEntity();
-                spouse.SpouseId = personEnquiry.value.keys[0].PersonId;
-                spouse.SpouseSurname = personEnquiry.value.keys[0].Surname;
-                spouse.SpouseCommonName = personEnquiry.value.keys[0].CommonName;
-                spouse.SpouseGenealogyName = personEnquiry.value.keys[0].GenealogyName;
+        onSearch();
+      }
+      //添加夫妻关系
+      else if (showModalType.value == 1) {
+        if (!data.value.CurrentPerson.FamilyTreeSpouseMaps)
+          data.value.CurrentPerson.FamilyTreeSpouseMaps = [];
+        let spouse: FamilyTreeSpouseMapViewEntity =
+          new FamilyTreeSpouseMapViewEntity();
+        spouse.SpouseId = personEnquiry.value.keys[0].PersonId;
+        spouse.SpouseSurname = personEnquiry.value.keys[0].Surname;
+        spouse.SpouseCommonName = personEnquiry.value.keys[0].CommonName;
+        spouse.SpouseGenealogyName = personEnquiry.value.keys[0].GenealogyName;
 
-                data.value.CurrentPerson.FamilyTreeSpouseMaps.push(spouse);
-            }
-            //添加孩子关系
-            else if (showModalType.value == 2) {
-                if (!data.value.CurrentPerson.FamilyTreeChildrenMaps) data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
-                personEnquiry.value.keys.forEach(element => {
-                    let child: FamilyTreeChildrenMapViewEntity = new FamilyTreeChildrenMapViewEntity();
-                    child.ChildrenId = element.PersonId;
-                    child.ChildrenSurname = element.Surname;
-                    child.ChildrenCommonName = element.CommonName;
-                    child.ChildrenGenealogyName = element.GenealogyName;
+        data.value.CurrentPerson.FamilyTreeSpouseMaps.push(spouse);
+      }
+      //添加孩子关系
+      else if (showModalType.value == 2) {
+        if (!data.value.CurrentPerson.FamilyTreeChildrenMaps)
+          data.value.CurrentPerson.FamilyTreeChildrenMaps = [];
+        personEnquiry.value.keys.forEach((element) => {
+          let child: FamilyTreeChildrenMapViewEntity =
+            new FamilyTreeChildrenMapViewEntity();
+          child.ChildrenId = element.PersonId;
+          child.ChildrenSurname = element.Surname;
+          child.ChildrenCommonName = element.CommonName;
+          child.ChildrenGenealogyName = element.GenealogyName;
 
-                    data.value.CurrentPerson.FamilyTreeChildrenMaps.push(child);
-                });
-            }
+          data.value.CurrentPerson.FamilyTreeChildrenMaps.push(child);
+        });
+      }
 
-            modelOption.value.isModalPerson = false;
-        }
-        else {
-            notification.info({
-                message: '系统提示：',
-                description: '请选择一条记录',
-                placement: "topRight",
-            });
-        }
+      modelOption.value.isModalPerson = false;
+    } else {
+      notification.info({
+        message: "系统提示：",
+        description: "请选择一条记录",
+        placement: "topRight",
+      });
     }
-})
-
+  }
+};
 </script>
 <style lang="less">
 .page-container {
-    margin-right: 0px;
-
+  margin-right: 0px;
 }
 
 .page-header {
-    padding-top: 4px;
-    padding-bottom: 8px;
-    padding-right: 12px;
-    border-bottom: 1px solid silver;
-    margin-left: 6px;
+  padding-top: 4px;
+  padding-bottom: 8px;
+  padding-right: 12px;
+  border-bottom: 1px solid silver;
+  margin-left: 6px;
 }
 
 .page-header .ant-input-search .ant-input {
-    border-radius: 0;
-    border-left: 0;
-    text-align: left
+  border-radius: 0;
+  border-left: 0;
+  text-align: left;
 }
 
 .page-main {
-    overflow-y: auto;
-    padding-top: 24px;
-    padding-bottom: 4px;
-    padding-right: 32px;
-    padding-left: 12px;
+  overflow-y: auto;
+  padding-top: 24px;
+  padding-bottom: 4px;
+  padding-right: 32px;
+  padding-left: 12px;
 }
 
 .ant-input-search .ant-input {
-    border-radius: 0;
-    border-left: 0;
-    text-align: left
+  border-radius: 0;
+  border-left: 0;
+  text-align: left;
 }
 
 .page-footer {
-    z-index: 999;
-    padding-left: 8px;
-    padding-right: 18px;
-    padding-top: 8px;
-    width: 100%;
-    position: fixed;
-    bottom: 8px;
-    border-top: 1px solid silver;
+  z-index: 999;
+  padding-left: 8px;
+  padding-right: 18px;
+  padding-top: 8px;
+  width: 100%;
+  position: fixed;
+  bottom: 8px;
+  border-top: 1px solid silver;
 }
 
 .son-row-selected td {
-    border-top: 2px solid #1677ff !important;
-    border-bottom: 2px solid #1677ff !important;
+  border-top: 2px solid #1677ff !important;
+  border-bottom: 2px solid #1677ff !important;
 }
 
 .son-row-selected td:first-child {
-    border-left: 2px solid #1677ff !important;
+  border-left: 2px solid #1677ff !important;
 }
 
 .son-row-selected td:last-child {
-    border-right: 2px solid #1677ff !important;
+  border-right: 2px solid #1677ff !important;
 }
 
 .son-row-selected > td {
-    background-color: #e6f4ff !important;
+  background-color: #e6f4ff !important;
 }
 
 .parent-row-selected td {
-    border-top: 2px solid #1677ff !important;
-    border-bottom: 2px solid #1677ff !important;
+  border-top: 2px solid #1677ff !important;
+  border-bottom: 2px solid #1677ff !important;
 }
 
 .parent-row-selected td:first-child {
-    border-left: 2px solid #1677ff !important;
+  border-left: 2px solid #1677ff !important;
 }
 
 .parent-row-selected td:last-child {
-    border-right: 2px solid #1677ff !important;
+  border-right: 2px solid #1677ff !important;
 }
 
 .parent-row-selected > td {
-    background-color: #e6f4ff !important;
+  background-color: #e6f4ff !important;
 }
-</style>
\ No newline at end of file
+</style>