ow
This commit is contained in:
itcsx committed
1 parent
57201f2860
commit
554a5a4a2c
19 files changed
+1150
-931
No files matched your search
@@ -1,24 +1,23 @@
|
||||
<template>
|
||||
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
|
||||
<searchCard @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
|
||||
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
|
||||
@on-select-change="onSelectChange">
|
||||
<template #control>
|
||||
|
||||
<template #cardTitle="{ record }">
|
||||
{{ record.FamilyLocalName }}
|
||||
<span style="margin-left: 6px"><FolderOutlined style="margin-right: 2px" />{{ getSharePath(record) }}</span>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
|
||||
<template v-if="column.dataIndex === FamilyFolderFavoriteViewEntity.TOP_FOLDER_LOCAL_NAME">
|
||||
<FolderOutlined style="margin-right: 2px" /><span>{{ getSharePath(record) }}</span>
|
||||
</template>
|
||||
</template>
|
||||
<template #footer>
|
||||
|
||||
</template>
|
||||
</search>
|
||||
</searchCard>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { reactive, inject, defineComponent, onMounted, ref, unref, provide, h } from "vue";
|
||||
import { BindOption } from "@/data/custom/bindOption";
|
||||
import { SelectOption } from "@/data/auto/selectOption";
|
||||
import search from "@/components/basic/Search.vue";
|
||||
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
|
||||
import searchCard from "@/components/basic/SearchCard.vue";
|
||||
|
||||
import { FamilyGroupResultData } from "@/data/auto/familyGroupResultData";
|
||||
import { FamilyFolderFavoriteViewEntity } from "@/data/auto/familyFolderFavoriteViewEntity";
|
||||
@@ -41,6 +40,14 @@ import { title } from "process";
|
||||
import { enquiryMethodKey, searchCriteriaManagerKey, masterOperationToEnquiryMethodKey, MasterOperationToEnquiryModelOption, layoutProviderMethodKey } from "@/injections";
|
||||
import { useOrderedChildren } from "@/hooks/use-ordered-children";
|
||||
import { SearchCriteriaContext } from "@/injections";
|
||||
import {
|
||||
HomeOutlined,
|
||||
ArrowLeftOutlined,
|
||||
ReloadOutlined,
|
||||
LaptopOutlined,
|
||||
FolderOutlined,
|
||||
SearchOutlined,
|
||||
} from "@ant-design/icons-vue";
|
||||
//page from-----------------------------------------------------------------------------------------------------------------------------------
|
||||
//================inject================
|
||||
//报表名称
|
||||
@@ -64,6 +71,15 @@ const canCreate = ref<boolean>(false);
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
//共享路径展示：上级目录与当前目录同名时只显示一次，避免出现"ddd>ddd"
|
||||
const getSharePath = (record: any) => {
|
||||
const top = record.TopFolderLocalName;
|
||||
const folder = record.FolderLocalName;
|
||||
if (!folder || folder === top) return top || '-';
|
||||
if (!top) return folder;
|
||||
return `${top}>${folder}`;
|
||||
};
|
||||
|
||||
const columns = ref([
|
||||
{
|
||||
title: '序号',
|
||||
|
||||
@@ -899,43 +899,3 @@ const handleSelectUser = async () => {
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
padding-right: 12px;
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
|
||||
.page-header .ant-input-search .ant-input {
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
@@ -38,84 +38,84 @@
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="page-main" :class="{ 'fp-readonly': !isEdit }" :style="{ height: resultH }">
|
||||
<div class="page-main ft-page" :class="{ 'ft-readonly': !isEdit }" :style="{ height: resultH }">
|
||||
<!-- 顶部：头像 / 姓名 / 编号 -->
|
||||
<div class="fp-hero">
|
||||
<FileUpload class="fp-hero-upload" accept="image/*" file-path="FamilyPersonAvatar"
|
||||
<div class="ft-hero">
|
||||
<FileUpload class="ft-hero-upload" accept="image/*" file-path="FamilyPersonAvatar"
|
||||
:disabled="!isEdit || avatarUploading" @start="onAvatarUploadStart" @progress="onAvatarUploadProgress"
|
||||
@success="onAvatarUploadSuccess" @error="onAvatarUploadError">
|
||||
<div class="fp-hero-avatar-wrap" :class="{ 'is-editing': isEdit }">
|
||||
<a-avatar class="fp-hero-avatar" :size="72" :src="avatarSrc">
|
||||
<div class="ft-hero-avatar-wrap" :class="{ 'is-editing': isEdit }">
|
||||
<a-avatar class="ft-hero-avatar" :size="72" :src="avatarSrc">
|
||||
<template #icon>
|
||||
<UserOutlined />
|
||||
</template>
|
||||
</a-avatar>
|
||||
<div v-if="isEdit" class="fp-hero-avatar-mask">
|
||||
<div v-if="isEdit" class="ft-hero-avatar-mask">
|
||||
<span v-if="avatarUploading">{{ avatarUploadPercent }}%</span>
|
||||
<CameraOutlined v-else />
|
||||
</div>
|
||||
</div>
|
||||
</FileUpload>
|
||||
<div class="fp-hero-main">
|
||||
<div class="fp-hero-name">
|
||||
<div class="ft-hero-main">
|
||||
<div class="ft-hero-name">
|
||||
{{
|
||||
(data.FamilyPerson.Surname || "") +
|
||||
(data.FamilyPerson.GenealogyName || "") || "未填写姓名"
|
||||
}}
|
||||
</div>
|
||||
<div class="fp-hero-meta">
|
||||
<span class="fp-chip">编号 {{ data.FamilyPerson.PersonId || "-" }}</span>
|
||||
<div class="ft-hero-meta">
|
||||
<span class="ft-chip">编号 {{ data.FamilyPerson.PersonId || "-" }}</span>
|
||||
</div>
|
||||
<div class="fp-hero-meta">
|
||||
<span class="fp-chip">族谱编号 {{ data.FamilyPerson.TreeId || "-" }}</span>
|
||||
<div class="ft-hero-meta">
|
||||
<span class="ft-chip">族谱编号 {{ data.FamilyPerson.TreeId || "-" }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<a-button v-if="
|
||||
isEdit &&
|
||||
(data.FamilyPerson.AvatarUrl || data.FamilyPerson.AvatarFilename)
|
||||
" class="fp-hero-clear" type="text" size="small" @click.prevent="onClearAvatar">清除头像</a-button>
|
||||
" class="ft-hero-clear" type="text" size="small" @click.prevent="onClearAvatar">清除头像</a-button>
|
||||
</div>
|
||||
<!-- 基本资料 -->
|
||||
<div class="fp-card">
|
||||
<div class="fp-card-title">基本资料</div>
|
||||
<div class="fp-grid">
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">姓氏<span class="fp-required">*</span></div>
|
||||
<div class="ft-card">
|
||||
<div class="ft-card-title">基本资料</div>
|
||||
<div class="ft-grid">
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">姓氏<span class="ft-required">*</span></div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.Surname"
|
||||
placeholder="请输入姓氏" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">谱名<span class="fp-required">*</span></div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">谱名<span class="ft-required">*</span></div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.GenealogyName"
|
||||
placeholder="请输入谱名" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">常用名</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">常用名</div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.CommonName"
|
||||
placeholder="请输入常用名" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">别名</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">别名</div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.Alias"
|
||||
placeholder="请输入别名" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">字</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">字</div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.Zi"
|
||||
placeholder="请输入字" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">号</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">号</div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.Hao"
|
||||
placeholder="请输入号" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">行第</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">行第</div>
|
||||
<a-input size="large" :maxlength="32" :readonly="!isEdit" v-model:value="data.FamilyPerson.BirthOrder"
|
||||
placeholder="如：三" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">性别</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">性别</div>
|
||||
<a-select size="large" v-model:value="data.FamilyPerson.Gender" :disabled="!isEdit" style="width: 100%"
|
||||
placeholder="请选择性别" :options="genderSelectOptions">
|
||||
</a-select>
|
||||
@@ -123,84 +123,84 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- 家庭与学业 -->
|
||||
<div v-if="!readonlyBasicOnly" class="fp-card">
|
||||
<div class="fp-card-title">家庭与学业</div>
|
||||
<div class="fp-grid">
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">婚姻</div>
|
||||
<div v-if="!readonlyBasicOnly" class="ft-card">
|
||||
<div class="ft-card-title">家庭与学业</div>
|
||||
<div class="ft-grid">
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">婚姻</div>
|
||||
<a-select size="large" v-model:value="data.FamilyPerson.MaritalStatus" :disabled="!isEdit"
|
||||
style="width: 100%" placeholder="请选择">
|
||||
<a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{ o.DisplayName }}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">父亲姓名</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">父亲姓名</div>
|
||||
<a-input size="large" :maxlength="50" :readonly="!isEdit" v-model:value="data.FamilyPerson.FatherId"
|
||||
placeholder="请输入父亲姓名" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">母亲姓名</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">母亲姓名</div>
|
||||
<a-input size="large" :maxlength="100" :readonly="!isEdit" v-model:value="data.FamilyPerson.MotherName"
|
||||
placeholder="请输入母亲姓名" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">学校</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">学校</div>
|
||||
<a-input size="large" :maxlength="256" :readonly="!isEdit" v-model:value="data.FamilyPerson.School"
|
||||
placeholder="请输入毕业学校" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">专业</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">专业</div>
|
||||
<a-input size="large" :maxlength="256" :readonly="!isEdit" v-model:value="data.FamilyPerson.Major"
|
||||
placeholder="请输入所学专业" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">学历</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">学历</div>
|
||||
<a-input size="large" :maxlength="128" :readonly="!isEdit" v-model:value="data.FamilyPerson.Education"
|
||||
placeholder="请输入学历" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">毕业</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">毕业</div>
|
||||
<a-select size="large" v-model:value="data.FamilyPerson.GraduationStatus" :disabled="!isEdit"
|
||||
style="width: 100%" placeholder="请选择">
|
||||
<a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{ o.DisplayName }}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">职务</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">职务</div>
|
||||
<a-input size="large" :maxlength="256" :readonly="!isEdit" v-model:value="data.FamilyPerson.Duty"
|
||||
placeholder="请输入职务" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 任职与状态 -->
|
||||
<div v-if="!readonlyBasicOnly" class="fp-card">
|
||||
<div class="fp-card-title">任职与状态</div>
|
||||
<div class="fp-grid">
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">头衔</div>
|
||||
<div v-if="!readonlyBasicOnly" class="ft-card">
|
||||
<div class="ft-card-title">任职与状态</div>
|
||||
<div class="ft-grid">
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">头衔</div>
|
||||
<a-input size="large" :maxlength="256" :readonly="!isEdit" v-model:value="data.FamilyPerson.Title"
|
||||
placeholder="请输入头衔" />
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">公开</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">公开</div>
|
||||
<a-select size="large" v-model:value="data.FamilyPerson.Privacy" :disabled="!isEdit" style="width: 100%"
|
||||
placeholder="请选择">
|
||||
<a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{ o.DisplayName }}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">状态</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">状态</div>
|
||||
<a-select size="large" v-model:value="data.FamilyPerson.LiveStatus" :disabled="!isEdit"
|
||||
style="width: 100%" placeholder="请选择">
|
||||
<a-select-option v-for="o in yesNoPolicy" :value="o.BindValue">{{ o.DisplayName }}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">绑定用户ID</div>
|
||||
<div class="fp-inline">
|
||||
<a-input class="fp-inline-main" size="large" :maxlength="50" :readonly="!isEdit"
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">绑定用户ID</div>
|
||||
<div class="ft-inline">
|
||||
<a-input class="ft-inline-main" size="large" :maxlength="50" :readonly="!isEdit"
|
||||
v-model:value="data.FamilyPerson.BindUserId" placeholder="请输入用户ID" />
|
||||
<a-button class="fp-inline-btn" size="large" type="primary" ghost
|
||||
<a-button class="ft-inline-btn" size="large" type="primary" ghost
|
||||
:disabled="data.FamilyPerson.IsBindUser === 'Y'" @click.prevent="
|
||||
data.FamilyPerson.IsBindUser =
|
||||
data.FamilyPerson.IsBindUser === 'Y' ? 'N' : 'Y'
|
||||
@@ -211,31 +211,31 @@
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">生于</div>
|
||||
<div class="fp-inline">
|
||||
<a-input class="fp-inline-main" size="large" :maxlength="128" :readonly="!isEdit"
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">生于</div>
|
||||
<div class="ft-inline">
|
||||
<a-input class="ft-inline-main" size="large" :maxlength="128" :readonly="!isEdit"
|
||||
v-model:value="data.FamilyPerson.BirthText" placeholder="如：乙丑年正月初一" />
|
||||
<a-date-picker class="fp-inline-date" size="large" :disabled="!isEdit" v-model:value="birthDate"
|
||||
<a-date-picker class="ft-inline-date" size="large" :disabled="!isEdit" v-model:value="birthDate"
|
||||
placeholder="选择日期" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">离世</div>
|
||||
<div class="fp-inline">
|
||||
<a-input class="fp-inline-main" size="large" :maxlength="128" :readonly="!isEdit"
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">离世</div>
|
||||
<div class="ft-inline">
|
||||
<a-input class="ft-inline-main" size="large" :maxlength="128" :readonly="!isEdit"
|
||||
v-model:value="data.FamilyPerson.DeathText" placeholder="如：戊辰年八月十五" />
|
||||
<a-date-picker class="fp-inline-date" size="large" :disabled="!isEdit" v-model:value="deathDate"
|
||||
<a-date-picker class="ft-inline-date" size="large" :disabled="!isEdit" v-model:value="deathDate"
|
||||
placeholder="选择日期" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 生平简介 -->
|
||||
<div v-if="!readonlyBasicOnly" class="fp-card">
|
||||
<div class="fp-card-title">生平简介</div>
|
||||
<div class="fp-field">
|
||||
<div class="fp-label">简介</div>
|
||||
<div v-if="!readonlyBasicOnly" class="ft-card">
|
||||
<div class="ft-card-title">生平简介</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-label">简介</div>
|
||||
<a-textarea size="large" :auto-size="{ minRows: 4, maxRows: 8 }" :maxlength="3000" :readonly="!isEdit"
|
||||
v-model:value="data.FamilyPerson.Introduction" placeholder="请输入生平简介" />
|
||||
</div>
|
||||
@@ -648,62 +648,26 @@ const handleSelect = async () => {
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
padding-right: 12px;
|
||||
border-bottom: 1px solid silver;
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.page-header :deep(.ant-input-search .ant-input) {
|
||||
border-radius: 0;
|
||||
border-left: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding: 12px 12px 96px 12px;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
/* ==================== 顶部信息卡 ==================== */
|
||||
.page-main .fp-hero {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 14px;
|
||||
margin-bottom: 12px;
|
||||
border: 1px solid #e8f1ff;
|
||||
border-radius: 14px;
|
||||
background: linear-gradient(135deg, #f2f8ff 0%, #ffffff 70%);
|
||||
box-shadow: 0 2px 10px rgba(22, 119, 255, 0.06);
|
||||
}
|
||||
|
||||
.page-main .fp-hero-avatar {
|
||||
/* ==================== 头像上传遮罩（FamilyPerson 独有） ==================== */
|
||||
.ft-hero-avatar {
|
||||
flex: 0 0 auto;
|
||||
border: 2px solid #fff;
|
||||
background: #1677ff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.page-main .fp-hero-upload {
|
||||
.ft-hero-upload {
|
||||
flex: 0 0 auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-avatar-wrap {
|
||||
.ft-hero-avatar-wrap {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-avatar-mask {
|
||||
.ft-hero-avatar-mask {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
@@ -716,194 +680,20 @@ const handleSelect = async () => {
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-avatar-wrap.is-editing:hover .fp-hero-avatar-mask {
|
||||
.ft-hero-avatar-wrap.is-editing:hover .ft-hero-avatar-mask {
|
||||
background: rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
|
||||
.page-main .fp-hero-main {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-name {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
line-height: 1.35;
|
||||
color: #1f2329;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.page-main .fp-chip {
|
||||
display: inline-block;
|
||||
padding: 1px 10px;
|
||||
border-radius: 10px;
|
||||
background: rgba(22, 119, 255, 0.08);
|
||||
color: #1677ff;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.page-main .fp-hero-clear {
|
||||
/* 清除头像按钮 */
|
||||
.ft-hero-clear {
|
||||
flex: 0 0 auto;
|
||||
padding: 0 4px;
|
||||
color: #ff4d4f;
|
||||
}
|
||||
|
||||
/* ==================== 分组卡片 ==================== */
|
||||
.page-main .fp-card {
|
||||
padding: 12px 14px 14px;
|
||||
margin-bottom: 12px;
|
||||
border: 1px solid #eef0f4;
|
||||
border-radius: 14px;
|
||||
background: #fff;
|
||||
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.page-main .fp-card-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding-bottom: 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.page-main .fp-card-title::before {
|
||||
content: "";
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
border-radius: 2px;
|
||||
background: #1677ff;
|
||||
}
|
||||
|
||||
/* ============ 字段栅格：手机单列，宽屏自动多列 ============ */
|
||||
.page-main .fp-grid {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
gap: 10px 16px;
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.page-main .fp-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.page-main .fp-grid {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
.page-main .fp-field {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.page-main .fp-label {
|
||||
margin-bottom: 4px;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.page-main .fp-required {
|
||||
margin-left: 2px;
|
||||
color: #ff4d4f;
|
||||
}
|
||||
|
||||
.page-main .fp-inline {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.page-main .fp-inline .fp-inline-main {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.page-main .fp-inline .fp-inline-date {
|
||||
/* 日期框在 ft-inline 中限制最大宽度，避免两端日期横向撑爆 */
|
||||
.ft-inline .ft-inline-date {
|
||||
flex: 0 0 auto;
|
||||
max-width: 48%;
|
||||
}
|
||||
|
||||
.page-main .fp-inline .fp-inline-btn {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
/* ==================== 控件外观 ==================== */
|
||||
.page-main :deep(.ant-input),
|
||||
.page-main :deep(.ant-input-affix-wrapper),
|
||||
.page-main :deep(.ant-select-selector),
|
||||
.page-main :deep(.ant-picker),
|
||||
.page-main :deep(.ant-input-number) {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
/* 查看态：弱化边框与底色，像纯文本一样易读 */
|
||||
.page-main.fp-readonly :deep(.ant-input),
|
||||
.page-main.fp-readonly :deep(textarea.ant-input),
|
||||
.page-main.fp-readonly :deep(.ant-input-affix-wrapper),
|
||||
.page-main.fp-readonly :deep(.ant-select-selector),
|
||||
.page-main.fp-readonly :deep(.ant-picker) {
|
||||
border-color: #f0f1f3;
|
||||
background: #fafbfc;
|
||||
color: #1f2329;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.page-main.fp-readonly :deep(.ant-input[readonly]),
|
||||
.page-main.fp-readonly :deep(.ant-input[disabled]) {
|
||||
color: #1f2329;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.page-main.fp-readonly :deep(.ant-select-disabled .ant-select-selector) {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.page-main.fp-readonly :deep(.ant-select-disabled .ant-select-arrow),
|
||||
.page-main.fp-readonly :deep(.ant-picker-disabled .ant-picker-suffix) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ============ 底部操作栏（与 FamilyTreeOperation 保持一致） ============ */
|
||||
.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;
|
||||
}
|
||||
|
||||
/* ==================== 手机端 ==================== */
|
||||
@media (max-width: 575px) {
|
||||
.page-main {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
/* 16px 字号可避免 iOS 聚焦输入框时页面被自动放大 */
|
||||
.page-main :deep(.ant-input),
|
||||
.page-main :deep(.ant-input-affix-wrapper),
|
||||
.page-main :deep(.ant-select-selector),
|
||||
.page-main :deep(.ant-select-selection-item),
|
||||
.page-main :deep(.ant-select-selection-placeholder),
|
||||
.page-main :deep(.ant-picker) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,37 +1,19 @@
|
||||
<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 class="page-container family-tree-op">
|
||||
<div class="page-header fto-toolbar">
|
||||
<div class="fto-search">
|
||||
<span class="fto-search-label">族谱编号</span>
|
||||
<a-input-search :disabled="isEdit" v-model:value="treeId" class="fto-search-input" placeholder="请输入族谱编号"
|
||||
@search="onModalSearch" />
|
||||
</div>
|
||||
<div class="fto-actions">
|
||||
<a-button type="primary" :disabled="isEdit" :icon="h(FileSearchOutlined)"
|
||||
@click.prevent="onSearch">查询</a-button>
|
||||
<a-button :disabled="isEdit" :icon="h(ClearOutlined)" @click.prevent="onReset">重置</a-button>
|
||||
<a-button type="primary" :disabled="isEdit" :icon="h(FileAddOutlined)"
|
||||
@click.prevent="onCreate">新增</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page-main ft-page" :class="{ 'ft-readonly': !isEdit }" :style="{ height: resultH }">
|
||||
<!-- 顶部信息卡 -->
|
||||
@@ -89,9 +71,9 @@
|
||||
<div class="ft-label">祖先</div>
|
||||
<div class="ft-inline">
|
||||
<a-input-group compact class="ft-inline-main" style="display: flex; width: 100%">
|
||||
<a-input :disabled="true" v-model:value="data.FamilyTree.AncestorPersonGenealogyName"
|
||||
<a-input size="large" :disabled="true" v-model:value="data.FamilyTree.AncestorPersonGenealogyName"
|
||||
placeholder="族谱名" style="width: 50%" />
|
||||
<a-input-search required :disabled="!isCreate" style="width: 50%"
|
||||
<a-input-search size="large" required :disabled="!isCreate" style="width: 50%"
|
||||
v-model:value="data.FamilyTree.AncestorPersonId" @search="onModalPerson" />
|
||||
</a-input-group>
|
||||
<a-button class="ft-inline-btn" size="large" type="primary" :disabled="!hasData"
|
||||
@@ -127,10 +109,10 @@
|
||||
placeholder="请输入族员" @search="onModalCurrentPerson" />
|
||||
</div>
|
||||
<div class="ft-field">
|
||||
<div class="ft-inline">
|
||||
<a-button class="ft-full-btn" size="large" type="primary" :disabled="!hasData"
|
||||
<div class="ft-inline fto-btn-row">
|
||||
<a-button class="fto-flex-btn" size="large" type="primary" :disabled="!hasData"
|
||||
:icon="h(ApartmentOutlined)" @click.prevent="onShowChart">谱系图</a-button>
|
||||
<a-button class="ft-inline-btn" size="large" type="primary" :disabled="!hasData"
|
||||
<a-button class="fto-flex-btn" size="large" :disabled="!hasData || isEdit"
|
||||
:icon="h(FileProtectOutlined)" @click.prevent="onRequestPermission">申请管理</a-button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -139,13 +121,19 @@
|
||||
<!-- 关系维护 -->
|
||||
<div class="ft-card">
|
||||
<div class="ft-card-title">关系维护</div>
|
||||
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
|
||||
<a-collapse-panel key="1" header="夫妻关系">
|
||||
<a-collapse v-model:activeKey="activeKeyRelations" class="ft-collapse">
|
||||
<a-collapse-panel key="1">
|
||||
<template #header>
|
||||
<span class="fto-panel-title">夫妻关系</span>
|
||||
<span class="fto-panel-count">{{ data.CurrentPerson.FamilyTreeSpouseMaps?.length ?? 0 }}</span>
|
||||
</template>
|
||||
<div class="ft-list">
|
||||
<div v-for="(record, index) in data.CurrentPerson
|
||||
.FamilyTreeSpouseMaps" :key="record.SpouseId || index" class="ft-item"
|
||||
:class="{ 'ft-item-selected': index === selectedParentIndex }">
|
||||
<div class="ft-item-head">
|
||||
.FamilyTreeSpouseMaps" :key="record.SpouseId || index" class="ft-item" :class="{
|
||||
'ft-item-selected': index === selectedParentIndex,
|
||||
'ft-item-collapsed': !isItemOpen(itemKey('sp', record.SpouseId, index)),
|
||||
}">
|
||||
<div class="ft-item-head" @click="toggleItem(itemKey('sp', record.SpouseId, index))">
|
||||
<span class="ft-item-index">{{ index + 1 }}</span>
|
||||
<div class="ft-item-title">
|
||||
<span class="ft-item-name">
|
||||
@@ -160,13 +148,15 @@
|
||||
{{ getPolicyText(genderOptions, record.Gender) }}
|
||||
</a-tag>
|
||||
</div>
|
||||
<div v-if="isEdit" class="ft-item-actions">
|
||||
<div v-if="isEdit" class="ft-item-actions" @click.stop>
|
||||
<UpSquareTwoTone class="ft-action" @click="upParent(index)" />
|
||||
<DownSquareTwoTone class="ft-action" @click="downParent(index)" />
|
||||
<DeleteOutlined class="ft-action ft-action-delete" @click="deleteParent(record.SpouseId)" />
|
||||
</div>
|
||||
<RightOutlined class="ft-item-arrow"
|
||||
:class="{ 'ft-item-arrow-open': isItemOpen(itemKey('sp', record.SpouseId, index)) }" />
|
||||
</div>
|
||||
<div class="ft-item-body">
|
||||
<div v-show="isItemOpen(itemKey('sp', record.SpouseId, index))" class="ft-item-body">
|
||||
<div class="ft-item-field">
|
||||
<span class="ft-item-label">结婚日期文本</span>
|
||||
<a-input v-if="isEdit" size="large" v-model:value="record.MarryDateText" placeholder="结婚日期文本" />
|
||||
@@ -234,12 +224,18 @@
|
||||
</a-button>
|
||||
</div>
|
||||
</a-collapse-panel>
|
||||
<a-collapse-panel key="2" header="孩子关系">
|
||||
<a-collapse-panel key="2">
|
||||
<template #header>
|
||||
<span class="fto-panel-title">孩子关系</span>
|
||||
<span class="fto-panel-count">{{ data.CurrentPerson.FamilyTreeChildrenMaps?.length ?? 0 }}</span>
|
||||
</template>
|
||||
<div class="ft-list">
|
||||
<div v-for="(record, index) in data.CurrentPerson
|
||||
.FamilyTreeChildrenMaps" :key="record.ChildrenId || index" class="ft-item"
|
||||
:class="{ 'ft-item-selected': index === selectedSonIndex }">
|
||||
<div class="ft-item-head">
|
||||
.FamilyTreeChildrenMaps" :key="record.ChildrenId || index" class="ft-item" :class="{
|
||||
'ft-item-selected': index === selectedSonIndex,
|
||||
'ft-item-collapsed': !isItemOpen(itemKey('ch', record.ChildrenId, index)),
|
||||
}">
|
||||
<div class="ft-item-head" @click="toggleItem(itemKey('ch', record.ChildrenId, index))">
|
||||
<span class="ft-item-index">{{ index + 1 }}</span>
|
||||
<div class="ft-item-title">
|
||||
<span class="ft-item-name">
|
||||
@@ -254,13 +250,15 @@
|
||||
{{ getPolicyText(genderOptions, record.Gender) }}
|
||||
</a-tag>
|
||||
</div>
|
||||
<div v-if="isEdit" class="ft-item-actions">
|
||||
<div v-if="isEdit" class="ft-item-actions" @click.stop>
|
||||
<UpSquareTwoTone class="ft-action" @click="upSon(index)" />
|
||||
<DownSquareTwoTone class="ft-action" @click="downSon(index)" />
|
||||
<DeleteOutlined class="ft-action ft-action-delete" @click="deleteSon(record.ChildrenId)" />
|
||||
</div>
|
||||
<RightOutlined class="ft-item-arrow"
|
||||
:class="{ 'ft-item-arrow-open': isItemOpen(itemKey('ch', record.ChildrenId, index)) }" />
|
||||
</div>
|
||||
<div class="ft-item-body">
|
||||
<div v-show="isItemOpen(itemKey('ch', record.ChildrenId, index))" class="ft-item-body">
|
||||
<div class="ft-item-field">
|
||||
<span class="ft-item-label">父母</span>
|
||||
<a-select v-if="isEdit" size="large" style="width: 100%" allow-clear show-search
|
||||
@@ -299,27 +297,34 @@
|
||||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
</div>
|
||||
<!-- 待审核成员名单 -->
|
||||
<!-- 权限维护 -->
|
||||
<div class="ft-card">
|
||||
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
|
||||
<a-collapse-panel key="3" header="待审核成员名单">
|
||||
<div class="ft-card-title">权限维护</div>
|
||||
<a-collapse v-model:activeKey="activeKeyPermissions" class="ft-collapse">
|
||||
<a-collapse-panel key="3">
|
||||
<template #header>
|
||||
<span class="fto-panel-title">待审核成员名单</span>
|
||||
<span class="fto-panel-count">{{ pendingPermissions.length }}</span>
|
||||
</template>
|
||||
<div class="ft-list">
|
||||
<div v-for="(record, index) in pendingPermissions" :key="(record.UserName || '') + '-' + (record.PersonId || index)
|
||||
" class="ft-item">
|
||||
<div class="ft-item-head">
|
||||
" class="ft-item" :class="{ 'ft-item-collapsed': !isItemOpen(permItemKey('pd', record, index)) }">
|
||||
<div class="ft-item-head" @click="toggleItem(permItemKey('pd', record, index))">
|
||||
<span class="ft-item-index">{{ index + 1 }}</span>
|
||||
<div class="ft-item-title">
|
||||
<span class="ft-item-name">
|
||||
{{ record.UserLocalName || "未命名成员" }}
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="data.IsManager && !isEdit" class="ft-item-actions">
|
||||
<div v-if="data.IsManager && !isEdit" class="ft-item-actions" @click.stop>
|
||||
<CheckCircleTwoTone class="ft-action" @click="approvePermission(record, 'N')" />
|
||||
<CrownOutlined class="ft-action" style="color: #faad14" @click="approvePermission(record, 'Y')" />
|
||||
<CloseCircleOutlined class="ft-action ft-action-delete" @click="rejectPermission(record)" />
|
||||
</div>
|
||||
<RightOutlined class="ft-item-arrow"
|
||||
:class="{ 'ft-item-arrow-open': isItemOpen(permItemKey('pd', record, index)) }" />
|
||||
</div>
|
||||
<div class="ft-item-body">
|
||||
<div v-show="isItemOpen(permItemKey('pd', record, index))" class="ft-item-body">
|
||||
<div class="ft-item-field">
|
||||
<span class="ft-item-label">授权族员节点</span>
|
||||
<span class="ft-item-text">{{ record.PersonLocalName || "-" }}</span>
|
||||
@@ -335,16 +340,15 @@
|
||||
</div>
|
||||
</div>
|
||||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
</div>
|
||||
<!-- 管理名单 -->
|
||||
<div class="ft-card">
|
||||
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
|
||||
<a-collapse-panel key="4" header="管理名单">
|
||||
<a-collapse-panel key="4">
|
||||
<template #header>
|
||||
<span class="fto-panel-title">管理名单</span>
|
||||
<span class="fto-panel-count">{{ validPermissions.length }}</span>
|
||||
</template>
|
||||
<div class="ft-list">
|
||||
<div v-for="(record, index) in validPermissions" :key="(record.UserName || '') + '-' + (record.PersonId || index)
|
||||
" class="ft-item">
|
||||
<div class="ft-item-head">
|
||||
" class="ft-item" :class="{ 'ft-item-collapsed': !isItemOpen(permItemKey('vd', record, index)) }">
|
||||
<div class="ft-item-head" @click="toggleItem(permItemKey('vd', record, index))">
|
||||
<span class="ft-item-index">{{ index + 1 }}</span>
|
||||
<div class="ft-item-title">
|
||||
<span class="ft-item-name">
|
||||
@@ -352,11 +356,13 @@
|
||||
</span>
|
||||
<a-tag v-if="record.ManagerIndc == 'Y'" class="ft-item-tag">管理员</a-tag>
|
||||
</div>
|
||||
<div v-if="data.IsManager && !isEdit" class="ft-item-actions">
|
||||
<div v-if="data.IsManager && !isEdit" class="ft-item-actions" @click.stop>
|
||||
<DeleteOutlined class="ft-action ft-action-delete" @click="rejectPermission(record)" />
|
||||
</div>
|
||||
<RightOutlined class="ft-item-arrow"
|
||||
:class="{ 'ft-item-arrow-open': isItemOpen(permItemKey('vd', record, index)) }" />
|
||||
</div>
|
||||
<div class="ft-item-body">
|
||||
<div v-show="isItemOpen(permItemKey('vd', record, index))" class="ft-item-body">
|
||||
<div class="ft-item-field">
|
||||
<span class="ft-item-label">授权族员节点</span>
|
||||
<span class="ft-item-text">{{ record.PersonLocalName || "-" }}</span>
|
||||
@@ -456,6 +462,7 @@ import {
|
||||
CheckCircleTwoTone,
|
||||
CloseCircleOutlined,
|
||||
CrownOutlined,
|
||||
RightOutlined,
|
||||
} from "@ant-design/icons-vue";
|
||||
import {
|
||||
PermissionContext,
|
||||
@@ -541,7 +548,37 @@ interface PersonEnquiry {
|
||||
const enquiry = ref<TreeEnquiry | null>(null);
|
||||
const personEnquiry = ref<PersonEnquiry | null>(null);
|
||||
|
||||
const activeKey = ref(["1", "2"]);
|
||||
/**
|
||||
* 两个折叠区各自维护开合状态（原先三个折叠区共用一个 activeKey，点一个会把别的也带走），默认全部展开：
|
||||
* 关系维护（夫妻关系 / 孩子关系）、权限维护（待审核成员名单 / 管理名单）。
|
||||
*/
|
||||
const activeKeyRelations = ref(["1", "2"]);
|
||||
const activeKeyPermissions = ref(["3", "4"]);
|
||||
|
||||
/**
|
||||
* 成员卡片默认只显示标题行（序号 + 姓名 + 性别/标签 + 操作图标），
|
||||
* 点标题行或右侧箭头才展开下面的字段内容；这里存的是"已展开"的卡片 key，空数组即全部收起。
|
||||
*/
|
||||
const openItemKeys = ref<string[]>([]);
|
||||
|
||||
/** 生成卡片 key：优先用记录自身 Id，取不到时退回下标（与 v-for 的 :key 语义保持一致） */
|
||||
const itemKey = (prefix: string, id: unknown, index: number) =>
|
||||
`${prefix}-${id || index}`;
|
||||
|
||||
/** 权限卡片的 key（与 v-for 的 :key 写法一致，避免同一人多次申请时互相串开合状态） */
|
||||
const permItemKey = (
|
||||
prefix: string,
|
||||
record: { UserName?: string | null; PersonId?: string | null },
|
||||
index: number,
|
||||
) => `${prefix}-${(record.UserName || "") + "-" + (record.PersonId || index)}`;
|
||||
|
||||
const isItemOpen = (key: string) => openItemKeys.value.includes(key);
|
||||
|
||||
const toggleItem = (key: string) => {
|
||||
const at = openItemKeys.value.indexOf(key);
|
||||
if (at >= 0) openItemKeys.value.splice(at, 1);
|
||||
else openItemKeys.value.push(key);
|
||||
};
|
||||
|
||||
const columnParents = ref([
|
||||
{
|
||||
@@ -1752,4 +1789,298 @@ const onPersonQuickCreated = (person: FamilyPersonDisplayData) => {
|
||||
border-style: dashed;
|
||||
color: #1677ff;
|
||||
}
|
||||
|
||||
/* ==================== 族谱设置：界面美化 ====================
|
||||
* 全部规则收在根类 .family-tree-op 下，保证不影响其他 Operation 页面；
|
||||
* 需要覆盖 ft-mobile.less 里带 !important 的规则时，靠更长的选择器提高优先级。
|
||||
*/
|
||||
.family-tree-op {
|
||||
--fto-blue: #1677ff;
|
||||
--fto-line: #eef1f6;
|
||||
--fto-text: #1f2329;
|
||||
--fto-sub: #646a73;
|
||||
}
|
||||
|
||||
/* ---------- 顶部工具条 ---------- */
|
||||
.family-tree-op .page-header.fto-toolbar {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 10px 12px;
|
||||
padding: 10px 12px;
|
||||
margin: 0 0 12px;
|
||||
border: 1px solid #e8f1ff;
|
||||
border-radius: 14px;
|
||||
background: linear-gradient(135deg, #f5f9ff 0%, #ffffff 78%);
|
||||
box-shadow: 0 2px 10px rgba(22, 119, 255, 0.06);
|
||||
}
|
||||
|
||||
.family-tree-op .fto-search {
|
||||
flex: 1 1 300px;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-search-label {
|
||||
flex: 0 0 auto;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 32px;
|
||||
padding: 0 12px;
|
||||
border-radius: 9px;
|
||||
background: rgba(22, 119, 255, 0.1);
|
||||
color: var(--fto-blue);
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-search-input {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
/* 查询框：外层统一圆角（后缀图标 / 附加按钮两种结构都覆盖） */
|
||||
.family-tree-op .page-header .fto-search-input .ant-input,
|
||||
.family-tree-op .page-header .fto-search-input .ant-input-affix-wrapper {
|
||||
border-radius: 9px !important;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.family-tree-op .page-header .fto-search-input .ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled) {
|
||||
border-color: #dbe5f5;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.family-tree-op .page-header .fto-search-input .ant-input-group > .ant-input {
|
||||
border-radius: 9px 0 0 9px !important;
|
||||
}
|
||||
|
||||
.family-tree-op .page-header .fto-search-input .ant-input-group-addon .ant-input-search-button {
|
||||
border-radius: 0 9px 9px 0 !important;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-actions {
|
||||
flex: 0 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-actions .ant-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 32px;
|
||||
padding: 0 14px;
|
||||
border-radius: 9px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* ---------- 卡片与标题 ---------- */
|
||||
.family-tree-op .page-main.ft-page .ft-hero {
|
||||
padding: 16px;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-hero-name {
|
||||
font-size: 19px;
|
||||
letter-spacing: 0.2px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-card {
|
||||
padding: 14px 16px 16px;
|
||||
border-color: #edf0f5;
|
||||
border-radius: 16px;
|
||||
box-shadow:
|
||||
0 1px 2px rgba(15, 23, 42, 0.03),
|
||||
0 10px 30px -24px rgba(15, 23, 42, 0.45);
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-card-title {
|
||||
padding-bottom: 12px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-card-title::before {
|
||||
width: 4px;
|
||||
height: 15px;
|
||||
border-radius: 3px;
|
||||
background: linear-gradient(180deg, #1677ff 0%, #69b1ff 100%);
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-label {
|
||||
color: #8a919f;
|
||||
font-size: 12.5px;
|
||||
}
|
||||
|
||||
/* 「祖先」行：两个输入框拼成一个整块，用外层圆角 + 裁切代替方块拼接 */
|
||||
.family-tree-op .page-main.ft-page .ft-inline-main.ant-input-group {
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-inline-main.ant-input-group .ant-input,
|
||||
.family-tree-op .page-main.ft-page .ft-inline-main.ant-input-group .ant-input-affix-wrapper {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-inline-main .ant-input-search .ant-input-affix-wrapper {
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
/* 「当前族员」两个按钮等宽 */
|
||||
.family-tree-op .page-main.ft-page .fto-btn-row {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .fto-btn-row .fto-flex-btn {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* ---------- 折叠面板标题 + 数量徽标 ---------- */
|
||||
.family-tree-op .page-main.ft-page .ft-collapse .ant-collapse-header {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-collapse .ant-collapse-header-text {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-panel-title {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-panel-count {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 8px;
|
||||
padding: 0 7px;
|
||||
border-radius: 10px;
|
||||
background: #f0f5ff;
|
||||
color: var(--fto-blue);
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* ---------- 关系维护列表卡 ---------- */
|
||||
.family-tree-op .page-main.ft-page .ft-item {
|
||||
border-color: #edf0f5;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-head {
|
||||
background: linear-gradient(180deg, #f9fbfe 0%, #f4f7fc 100%);
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-index {
|
||||
background: linear-gradient(135deg, #1677ff 0%, #69b1ff 100%);
|
||||
color: #fff;
|
||||
box-shadow: 0 2px 6px rgba(22, 119, 255, 0.3);
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-selected {
|
||||
border-color: var(--fto-blue);
|
||||
box-shadow: 0 0 0 3px rgba(22, 119, 255, 0.12);
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-action {
|
||||
transition:
|
||||
transform 0.16s ease,
|
||||
opacity 0.16s ease;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-action:hover {
|
||||
transform: translateY(-1px);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
/* 卡片默认只显示标题行，点标题行（或右侧箭头）展开/收起字段内容 */
|
||||
.family-tree-op .page-main.ft-page .ft-item-head {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-head:hover {
|
||||
background: #eef4ff;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-collapsed .ft-item-head {
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-arrow {
|
||||
flex: 0 0 auto;
|
||||
margin-left: 2px;
|
||||
color: #98a1b0;
|
||||
font-size: 12px;
|
||||
transition:
|
||||
transform 0.18s ease,
|
||||
color 0.18s ease;
|
||||
}
|
||||
|
||||
.family-tree-op .page-main.ft-page .ft-item-arrow-open {
|
||||
transform: rotate(90deg);
|
||||
color: var(--fto-blue);
|
||||
}
|
||||
|
||||
/* ---------- 底部操作条：白色底 + 模糊，避免下方内容透出来 ---------- */
|
||||
.family-tree-op .page-footer {
|
||||
padding: 10px 16px;
|
||||
border-top: 1px solid var(--fto-line);
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
backdrop-filter: blur(8px);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
box-shadow: 0 -8px 24px -18px rgba(15, 23, 42, 0.5);
|
||||
}
|
||||
|
||||
.family-tree-op .page-footer .ant-btn {
|
||||
height: 38px;
|
||||
padding: 0 18px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* ---------- 手机端 ---------- */
|
||||
@media (max-width: 575px) {
|
||||
.family-tree-op .page-header.fto-toolbar {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-search {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
/* 手机端输入框字号变大后高度会变，让标签跟着撑满，保证与输入框齐平 */
|
||||
.family-tree-op .fto-search-label {
|
||||
align-self: stretch;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.family-tree-op .fto-actions .ant-btn {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
.family-tree-op .page-footer .ant-btn {
|
||||
flex: 1 1 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -338,7 +338,7 @@ interface DmsFileEnquiry {
|
||||
|
||||
const dmsFileEnquiry = ref<DmsFileEnquiry | null>(null)
|
||||
|
||||
const activeKey = ref(['1', '2']);
|
||||
const activeKey = ref(['2', '3']);
|
||||
|
||||
const columnDtls = ref([
|
||||
{
|
||||
@@ -742,49 +742,4 @@ const columnFamilyGroups = ref([
|
||||
]);
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
padding-right: 12px;
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
|
||||
.page-header .ant-input-search .ant-input {
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.ant-collapse-content-box {
|
||||
padding: 0 !important;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -464,7 +464,7 @@ interface FamilyGroupEnquiry {
|
||||
|
||||
const groupEnquiry = ref<FamilyGroupEnquiry | null>(null);
|
||||
|
||||
const activeKey = ref(["1", "2"]);
|
||||
const activeKey = ref(["2", "3"]);
|
||||
|
||||
const columnDtls = ref([
|
||||
{
|
||||
@@ -760,43 +760,3 @@ const columnFamilyGroups = ref([
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
padding-right: 12px;
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
|
||||
.page-header .ant-input-search .ant-input {
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
@@ -312,7 +312,7 @@ interface DmsFileEnquiry {
|
||||
|
||||
const dmsFileEnquiry = ref<DmsFileEnquiry | null>(null)
|
||||
|
||||
const activeKey = ref(['1', '2']);
|
||||
const activeKey = ref(['2', '3']);
|
||||
|
||||
const columnDtls = ref([
|
||||
{
|
||||
@@ -717,49 +717,4 @@ const columnFamilyGroups = ref([
|
||||
]);
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 8px;
|
||||
padding-right: 12px;
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
|
||||
.page-header .ant-input-search .ant-input {
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.ant-collapse-content-box {
|
||||
padding: 0 !important;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -589,46 +589,4 @@ const onViewUserOperation = ((userName: string) => {
|
||||
router.push({ name: "UserOperation", params: { id: userName, mode: 'view' } });
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -661,63 +661,4 @@ const handleSelectPermission = (async () => {
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.son-row-selected td {
|
||||
border-top: 2px solid #1677ff !important;
|
||||
border-bottom: 2px solid #1677ff !important;
|
||||
}
|
||||
|
||||
.son-row-selected td:first-child {
|
||||
border-left: 2px solid #1677ff !important;
|
||||
}
|
||||
|
||||
.son-row-selected td:last-child {
|
||||
border-right: 2px solid #1677ff !important;
|
||||
}
|
||||
|
||||
.son-row-selected > td {
|
||||
background-color: #e6f4ff !important;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -826,48 +826,7 @@ const onViewPermissionOperation = ((permissionName: string) => {
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
<style lang="less" scoped>
|
||||
/* 权限明细：查看/新增/修改/删除 四个操作无论屏幕大小都保持在同一行 */
|
||||
.page-main.ft-page .ft-item-body .ft-perm-actions {
|
||||
grid-column: 1 / -1;
|
||||
|
||||
@@ -217,7 +217,6 @@ interface MasterEnquiry {
|
||||
}
|
||||
|
||||
const enquiry = ref<MasterEnquiry | null>(null)
|
||||
const activeKey = ref(['1']);
|
||||
|
||||
//================provide================
|
||||
const modelOption = ref<OperationToEnquiryModelOption>(new OperationToEnquiryModelOption());
|
||||
@@ -398,46 +397,4 @@ const handleSelect = (async () => {
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -444,46 +444,4 @@ const handleSelect = (async () => {
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
@@ -218,7 +218,7 @@ interface ActorEnquiry {
|
||||
const enquiry = ref<UserEnquiry | null>(null)
|
||||
const actorEnquiry = ref<ActorEnquiry | null>(null)
|
||||
|
||||
const activeKey = ref(['1', '2']);
|
||||
const activeKey = ref(['1']);
|
||||
|
||||
const columnActors = ref([
|
||||
{
|
||||
@@ -460,46 +460,4 @@ const onViewActorOperation = ((actorName: string) => {
|
||||
router.push({ name: "ActorOperation", params: { id: actorName, mode: 'view' } });
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
/* 移动端表单样式（与 FamilyTreeOperation 保持一致） */
|
||||
@import "../../styles/ft-mobile.less";
|
||||
|
||||
.page-container {
|
||||
margin-right: 0px;
|
||||
|
||||
}
|
||||
|
||||
.page-header {
|
||||
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
|
||||
}
|
||||
|
||||
.page-main {
|
||||
overflow-y: auto;
|
||||
padding-top: 24px;
|
||||
padding-bottom: 4px;
|
||||
padding-right: 32px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
Reference in new issue
Block a user