修改页面设计

This commit is contained in:
itcsx committed 2026-09-12 22:06:54 +08:00
1 parent 0dd4ec814b
commit 7f5bf3c68d
31 files changed
+3133 -2562

No files matched your search

@@ -1,6 +1,7 @@
<template>
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
<search-card @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
:card-title-keys="[FamilyGroupEntity.FAMILY_NAME, FamilyGroupEntity.FAMILY_LOCAL_NAME]"
@on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
<template #control>
<a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
@@ -42,7 +43,7 @@
</a-row>
</div>
</template>
</search>
</search-card>
<dragModal v-model:open="showModalRequest" title="请输入申请原因" :fullscreen="width < 640" :mask-closable="false"
@ok="handleSelectRequest">
<a-row :wrap="false" align="middle">
@@ -59,7 +60,7 @@
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 searchCard from "@/components/basic/SearchCard.vue";
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
import { FamilyGroupResultData } from "@/data/auto/familyGroupResultData";
+345 -310
View File
@@ -60,327 +60,360 @@
</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
:maxlength="50"
:readonly="true"
v-model:value="data.FamilyGroup.FamilyName"
/>
</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
:maxlength="500"
required
:readonly="!isEdit"
v-model:value="data.FamilyGroup.FamilyLocalName"
/>
</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-textarea
:maxlength="256"
:readonly="!isEdit"
v-model:value="data.FamilyGroup.Notice"
/>
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 16px">
<a-col :lg="8" :sm="24">
<a-space direction="vertical">
<a-switch
v-model:checked="data.IsOpen"
:disabled="!isEdit"
checked-children="公开"
un-checked-children="隐私"
/>
<a-switch
v-model:checked="data.IsAdd"
:disabled="!isEdit"
checked-children="可申请"
un-checked-children="不可申请"
/>
</a-space>
</a-col>
<a-col :lg="{ span: 8, offset: 2 }" :sm="24"> </a-col>
</a-row>
<div
class="page-main ft-page"
:class="{ 'ft-readonly': !isEdit }"
:style="{ height: resultH }"
>
<!-- 顶部信息卡 -->
<div class="ft-hero">
<div class="ft-hero-icon">
<TeamOutlined />
</div>
<div class="ft-hero-main">
<div class="ft-hero-name">
{{ data.FamilyGroup.FamilyLocalName || "未填写群组名称" }}
</div>
<div class="ft-hero-meta">
<span class="ft-chip">
编号 {{ data.FamilyGroup.FamilyName || "-" }}
</span>
<span class="ft-chip" v-if="data.IsOpen">公开</span>
<span class="ft-chip" v-if="data.IsAdd">可申请</span>
</div>
</div>
</div>
<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.FamilyGroupFolders"
:columns="columnFamilyGroupFolders"
:pagination="false"
:scroll="{ x: 520, 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 ===
FamilyGroupFolderEntity.FOLDER_LOCAL_NAME && isEdit
"
>
<a-input
:maxlength="50"
required
v-model:value="datas.record.FolderLocalName"
/>
</template>
<template
v-else-if="
datas.column.dataIndex ===
FamilyGroupFolderEntity.FOLDER_LOCAL_NAME && !isEdit
"
>
{{ datas.record.FolderLocalName }}
</template>
<template
v-else-if="
datas.column.dataIndex === FamilyGroupFolderEntity.NOTICE &&
isEdit
"
>
<a-input
:maxlength="500"
required
v-model:value="datas.record.Notice"
/>
</template>
<template
v-else-if="
datas.column.dataIndex === FamilyGroupFolderEntity.NOTICE &&
!isEdit
"
>
{{ datas.record.Notice }}
</template>
<template
v-else-if="
datas.column.dataIndex === 'share' &&
!isEdit &&
datas.record.IsSharePermission
"
>
<UserAddOutlined
:style="{ fontSize: '24px', color: 'green' }"
@click="shareFamilyGroupPermission(datas.record.FolderName)"
/>
</template>
<template
v-else-if="datas.column.dataIndex === 'delete' && isEdit"
>
<DeleteOutlined
:style="{ fontSize: '24px', color: 'red' }"
@click="
deleteFamilyGroupFolder(
datas.record.FolderId,
datas.record.FolderName,
)
"
/>
</template>
</template>
</a-table>
<template #extra v-if="isEdit">
<PlusSquareTwoTone
:style="{ fontSize: '24px', color: '#08c' }"
@click="addFamilyGroupFolder"
<!-- 群组信息 -->
<div 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="50"
:readonly="true"
placeholder="群组代码"
v-model:value="data.FamilyGroup.FamilyName"
/>
</template>
</a-collapse-panel>
</a-collapse>
<a-collapse v-model:activeKey="activeKey">
<a-collapse-panel key="2" header="待审核成员名单">
<a-table
bordered
:data-source="data.FamilyGroupRequests"
:columns="columnFamilyGroupRequests"
:pagination="false"
:scroll="{ x: 520, 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 ===
FamilyGroupManagerDisplayData.USER_LOCAL_NAME
</div>
<div class="ft-field">
<div class="ft-label">
群组名称<span class="ft-required">*</span>
</div>
<a-input
size="large"
:maxlength="500"
required
:readonly="!isEdit"
placeholder="请输入群组名称"
v-model:value="data.FamilyGroup.FamilyLocalName"
/>
</div>
<div class="ft-field ft-field-full">
<div class="ft-label">群组描述</div>
<a-textarea
:auto-size="{ minRows: 3, maxRows: 5 }"
:maxlength="256"
:readonly="!isEdit"
placeholder="请输入群组描述"
v-model:value="data.FamilyGroup.Notice"
/>
</div>
<div class="ft-field">
<div class="ft-label">公开设置</div>
<div class="ft-check">
<a-switch
v-model:checked="data.IsOpen"
:disabled="!isEdit"
checked-children="公开"
un-checked-children="隐私"
/>
</div>
</div>
<div class="ft-field">
<div class="ft-label">加入申请</div>
<div class="ft-check">
<a-switch
v-model:checked="data.IsAdd"
:disabled="!isEdit"
checked-children="可申请"
un-checked-children="不可申请"
/>
</div>
</div>
</div>
</div>
<!-- 共享目录 -->
<div class="ft-card">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="1" header="共享目录">
<div class="ft-list">
<div
v-for="(record, index) in data.FamilyGroupFolders"
:key="record.FolderId || index"
class="ft-item"
>
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span class="ft-item-name">
{{ record.FolderLocalName || "未命名目录" }}
</span>
</div>
<div class="ft-item-actions">
<UserAddOutlined
v-if="!isEdit && record.IsSharePermission"
class="ft-action"
style="color: green"
@click="shareFamilyGroupPermission(record.FolderName)"
/>
<DeleteOutlined
v-if="isEdit"
class="ft-action ft-action-delete"
@click="
deleteFamilyGroupFolder(
record.FolderId,
record.FolderName,
)
"
/>
</div>
</div>
<div class="ft-item-body">
<div v-if="isEdit" class="ft-item-field">
<span class="ft-item-label">目录名称</span>
<a-input
size="large"
:maxlength="50"
required
placeholder="请输入目录名称"
v-model:value="record.FolderLocalName"
/>
</div>
<div class="ft-item-field">
<span class="ft-item-label">备注</span>
<a-input
v-if="isEdit"
size="large"
:maxlength="500"
required
placeholder="请输入备注"
v-model:value="record.Notice"
/>
<span v-else class="ft-item-text">
{{ record.Notice || "-" }}
</span>
</div>
</div>
</div>
<div
v-if="
!data.FamilyGroupFolders || !data.FamilyGroupFolders.length
"
class="ft-empty"
>
{{ datas.record.UserLocalName }}
</template>
<template
v-else-if="
datas.column.dataIndex ===
FamilyGroupManagerDisplayData.NOTICE
暂无共享目录
</div>
<a-button
v-if="isEdit"
class="ft-add-btn"
type="dashed"
block
@click="addFamilyGroupFolder"
>
<PlusSquareTwoTone /> 新增共享目录
</a-button>
</div>
</a-collapse-panel>
</a-collapse>
</div>
<!-- 待审核成员名单 -->
<div class="ft-card">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="2" header="待审核成员名单">
<div class="ft-list">
<div
v-for="(record, index) in data.FamilyGroupRequests"
:key="record.UserName || index"
class="ft-item"
>
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span class="ft-item-name">
{{
record.UserLocalName || record.UserName || "未命名成员"
}}
</span>
</div>
<div
v-if="data.IsManager && !isEdit"
class="ft-item-actions"
>
<CheckCircleTwoTone
class="ft-action"
@click="
okFamilyGroupRequest(
record.FamilyName,
record.UserName,
)
"
/>
<CloseCircleOutlined
class="ft-action ft-action-delete"
@click="
rejectFamilyGroupRequest(
record.FamilyName,
record.UserName,
)
"
/>
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">申请说明</span>
<span class="ft-item-text">{{ record.Notice || "-" }}</span>
</div>
</div>
</div>
<div
v-if="
!data.FamilyGroupRequests ||
!data.FamilyGroupRequests.length
"
class="ft-empty"
>
{{ datas.record.Notice }}
</template>
<template
v-else-if="data.IsManager && datas.column.dataIndex === 'ok' && !isEdit"
暂无待审核成员
</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="3" header="正式成员名单">
<div class="ft-list">
<div
v-for="(record, index) in data.FamilyGroupManagers"
:key="record.UserName || index"
class="ft-item"
>
<CheckCircleTwoTone
:style="{ fontSize: '24px', color: 'green' }"
@click="
okFamilyGroupRequest(
datas.record.FamilyName,
datas.record.UserName,
)
"
/>
</template>
<template
v-else-if="data.IsManager && datas.column.dataIndex === 'reject' && !isEdit"
>
<CloseCircleOutlined
:style="{ fontSize: '24px', color: 'red' }"
@click="
rejectFamilyGroupRequest(
datas.record.FamilyName,
datas.record.UserName,
)
"
/>
</template>
</template>
</a-table>
<template #extra v-if="isEdit"> </template>
</a-collapse-panel>
</a-collapse>
<a-collapse v-model:activeKey="activeKey">
<a-collapse-panel key="3" header="正式成员名单">
<a-table
bordered
:data-source="data.FamilyGroupManagers"
:columns="columnFamilyGroupManagers"
:pagination="false"
:scroll="{ x: 520, 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 ===
FamilyGroupManagerDisplayData.USER_LOCAL_NAME
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span class="ft-item-name">
{{
record.UserLocalName || record.UserName || "未命名成员"
}}
</span>
</div>
<div v-if="isEdit" class="ft-item-actions">
<DeleteOutlined
class="ft-action ft-action-delete"
@click="
deleteFamilyGroupManager(
record.FamilyName,
record.UserName,
)
"
/>
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">群组管理员</span>
<a-checkbox
:disabled="!isEdit"
v-model:checked="record.IsManager"
>
管理员
</a-checkbox>
</div>
</div>
</div>
<div
v-if="
!data.FamilyGroupManagers ||
!data.FamilyGroupManagers.length
"
class="ft-empty"
>
{{ datas.record.UserLocalName }}
</template>
<template
v-else-if="
datas.column.dataIndex ===
FamilyGroupManagerDisplayData.MANAGER_INDC
暂无正式成员
</div>
</div>
</a-collapse-panel>
</a-collapse>
</div>
<!-- 目录权限列表 -->
<div class="ft-card" v-if="data.IsManager">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="4" header="目录权限列表">
<div class="ft-list">
<div
v-for="(record, index) in data.FamilyGroupPermissions"
:key="
(record.FolderName || '') + '-' + (record.UserName || index)
"
class="ft-item"
>
<a-checkbox
:disabled="!isEdit"
v-model:checked="datas.record.IsManager"
/>
</template>
<template
v-else-if="datas.column.dataIndex === 'delete' && isEdit"
>
<DeleteOutlined
:style="{ fontSize: '24px', color: 'red' }"
@click="
deleteFamilyGroupManager(
datas.record.FamilyName,
datas.record.UserName,
)
"
/>
</template>
</template>
</a-table>
<template #extra v-if="isEdit"> </template>
</a-collapse-panel>
</a-collapse>
<a-collapse v-model:activeKey="activeKey">
<a-collapse-panel key="4" header="目录权限列表" v-if="data.IsManager">
<a-table
bordered
:data-source="data.FamilyGroupPermissions"
:columns="columnFamilyGroupPermissions"
:pagination="false"
:scroll="{ x: 520, 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 ===
FamilyGroupPermissionDisplayData.FOLDER_LOCAL_NAME
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span class="ft-item-name">
{{
record.FolderLocalName ||
record.FolderName ||
"未命名目录"
}}
</span>
</div>
<div v-if="isEdit" class="ft-item-actions">
<DeleteOutlined
class="ft-action ft-action-delete"
@click="
deleteFamilyGroupPermission(
record.FamilyName,
record.FolderName,
record.UserName,
)
"
/>
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">目录名称</span>
<span class="ft-item-text">
{{ record.FolderLocalName || "-" }}
</span>
</div>
<div class="ft-item-field">
<span class="ft-item-label">授权成员</span>
<span class="ft-item-text">
{{ record.UserLocalName || "-" }}
</span>
</div>
</div>
</div>
<div
v-if="
!data.FamilyGroupPermissions ||
!data.FamilyGroupPermissions.length
"
class="ft-empty"
>
{{ datas.record.FolderLocalName }}
</template>
<template
v-else-if="
datas.column.dataIndex ===
FamilyGroupPermissionDisplayData.USER_LOCAL_NAME
"
>
{{ datas.record.UserLocalName }}
</template>
<template
v-else-if="datas.column.dataIndex === 'delete' && isEdit"
>
<DeleteOutlined
:style="{ fontSize: '24px', color: 'red' }"
@click="
deleteFamilyGroupPermission(
datas.record.FamilyName,
datas.record.FolderName,
datas.record.UserName,
)
"
/>
</template>
</template>
</a-table>
<template #extra v-if="isEdit"> </template>
</a-collapse-panel>
</a-collapse>
暂无目录权限
</div>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</div>
<div class="page-footer">
<div style="">
@@ -453,7 +486,6 @@
</div>
<dragModal
v-model:open="showModal"
width="60%"
title="群组查询"
:mask-closable="false"
:fullscreen="width < 640"
@@ -466,7 +498,6 @@
</dragModal>
<dragModal
v-model:open="showModalUser"
width="60%"
title="成员查询"
:mask-closable="false"
:fullscreen="width < 640"
@@ -497,6 +528,7 @@ import {
PlusSquareTwoTone,
DownSquareTwoTone,
UpSquareTwoTone,
TeamOutlined,
} from "@ant-design/icons-vue";
import {
PermissionContext,
@@ -1025,6 +1057,9 @@ const handleSelectUser = async () => {
};
</script>
<style lang="less">
/* 移动端表单样式(与 FamilyTreeOperation 保持一致) */
@import "../../styles/ft-mobile.less";
.page-container {
margin-right: 0px;
}
+14 -4
View File
@@ -682,9 +682,19 @@ const onCreate = () => {
const onShareFolder = () => {
if (keys.value.length == 0) return;
if (
keys.value[0].FavoriteIndc == "N" &&
keys.value[0].PermissionIndc == "Y"
keys.value[0].PermissionIndc == "N"
) {
notification.info({
message: "系统提示:",
description: "您还没有权限",
placement: "topRight",
});
return;
}
if (
keys.value[0].FavoriteIndc == "N"
) {
onInsertFamilyFolderFavorite(keys.value[0].FileName);
} else {
@@ -923,9 +933,9 @@ const findBySearchCriteria = async (c: DmsFileSearchCriteria) => {
sound.value?.stop();
}
} catch (error) {
}
finally {
finally {
loading.value = false;
}
};
@@ -1,5 +1,5 @@
<template>
<search
<search-card
@on-submit="onSubmit"
@on-print="onPrint"
@on-reset="onReset"
@@ -8,6 +8,10 @@
:loading="loading"
:pagination="result"
:rowSelectionType="selectionType"
:card-title-keys="[
FamilyPersonEntity.SURNAME,
FamilyPersonEntity.GENEALOGY_NAME,
]"
@on-row-dblclick="onRowDblclick"
@on-select-change="onSelectChange"
>
@@ -68,7 +72,7 @@
</a-row>
</div>
</template>
</search>
</search-card>
</template>
<script setup lang="ts">
import {
@@ -83,7 +87,7 @@ import {
} from "vue";
import { BindOption } from "@/data/custom/bindOption";
import { SelectOption } from "@/data/auto/selectOption";
import search from "@/components/basic/Search.vue";
import searchCard from "@/components/basic/SearchCard.vue";
import {
DeleteOutlined,
EditOutlined,
File diff suppressed because it is too large. Load diff
@@ -1,14 +1,17 @@
<template>
<search
<search-card
@on-submit="onSubmit"
@on-print="onPrint"
@on-reset="onReset"
@use-pagination="onPagination"
:scrollx="400"
:is-modal="isModal"
:loading="loading"
:pagination="result"
:rowSelectionType="selectionType"
:card-title-keys="[
FamilyFolderFavoriteViewEntity.FAMILY_LOCAL_NAME,
FamilyFolderFavoriteViewEntity.TOP_FOLDER_LOCAL_NAME,
]"
@on-select-change="onSelectChange"
>
<template #control> </template>
@@ -49,7 +52,7 @@
</a-row>
</div>
</template>
</search>
</search-card>
</template>
<script setup lang="ts">
import {
@@ -64,7 +67,7 @@ import {
} from "vue";
import { BindOption } from "@/data/custom/bindOption";
import { SelectOption } from "@/data/auto/selectOption";
import search from "@/components/basic/Search.vue";
import searchCard from "@/components/basic/SearchCard.vue";
import {
DeleteOutlined,
FolderOutlined,
@@ -1,6 +1,7 @@
<template>
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
<search-card @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
:card-title-keys="[FamilyTreeViewEntity.TREE_NAME, FamilyTreeViewEntity.GENEALOGY_NAME]"
@on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
<template #control>
<a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
@@ -34,13 +35,13 @@
</a-row>
</div>
</template>
</search>
</search-card>
</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 searchCard from "@/components/basic/SearchCard.vue";
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
import { FamilyTreeResultData } from "@/data/auto/familyTreeResultData";
File diff suppressed because it is too large. Load diff
@@ -1,6 +1,7 @@
<template>
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
<search-card @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
:card-title-keys="[PublishAudioEntity.PUBLISH_NAME, PublishAudioEntity.PUBLISH_LOCAL_NAME]"
@on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
<template #control>
<a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
@@ -36,13 +37,13 @@
</a-row>
</div>
</template>
</search>
</search-card>
</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 searchCard from "@/components/basic/SearchCard.vue";
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
import { PublishAudioResultData } from "@/data/auto/publishAudioResultData";
+161 -183
View File
@@ -29,196 +29,171 @@
</a-col>
</a-row>
</div>
<div class="page-main" :style="{ height: resultH }">
<a-row :gutter="[16, 8]">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑编号:</span>
</a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px;">
<a-input :readonly="true" v-model:value="data.PublishAudio.PublishName" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑名称:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px;">
<a-input :maxlength="50" :readonly="!isEdit"
v-model:value="data.PublishAudio.PublishLocalName" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑描述:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px;">
<a-textarea :auto-size="{ minRows: 3, maxRows: 5 }" :maxlength="500" :readonly="!isEdit"
v-model:value="data.PublishAudio.Notice" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<div class="page-main ft-page" :class="{ 'ft-readonly': !isEdit }" :style="{ height: resultH }">
<!-- 顶部信息卡 -->
<div class="ft-hero">
<div class="ft-hero-icon">
<CustomerServiceOutlined />
</div>
<div class="ft-hero-main">
<div class="ft-hero-name">
{{ data.PublishAudio.PublishLocalName || "未填写专辑名称" }}
</div>
<div class="ft-hero-meta">
<span class="ft-chip">编号 {{ data.PublishAudio.PublishName || "-" }}</span>
<span class="ft-chip" v-if="data.PublishAudio.OpenIndc == 'Y'">公开</span>
</div>
</div>
</div>
</a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px;">
<!-- 专辑信息 -->
<div 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" :readonly="true" placeholder="专辑编号"
v-model:value="data.PublishAudio.PublishName" />
</div>
<div class="ft-field">
<div class="ft-label">专辑名称</div>
<a-input size="large" :maxlength="50" :readonly="!isEdit" placeholder="请输入专辑名称"
v-model:value="data.PublishAudio.PublishLocalName" />
</div>
<div class="ft-field ft-field-full">
<div class="ft-label">专辑描述</div>
<a-textarea :auto-size="{ minRows: 3, maxRows: 5 }" :maxlength="500" :readonly="!isEdit"
placeholder="请输入专辑描述" v-model:value="data.PublishAudio.Notice" />
</div>
<div class="ft-field">
<div class="ft-label">公开</div>
<div class="ft-check">
<Checkbox v-model:value="data.PublishAudio.OpenIndc" true-value="Y" false-value="N"
:disabled="!isEdit"><span
:style="{ color: (data.PublishAudio.OpenIndc == 'Y' ? 'red' : 'black') }">
:disabled="!isEdit">
<span :style="{ color: (data.PublishAudio.OpenIndc == 'Y' ? 'red' : 'black') }">
对所有人公开?
</span>
</Checkbox>
</a-col>
</a-row>
</a-col>
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="3">
</a-col>
<a-col :lg="3" :sm="18" style="min-width: 300px;">
</div>
</div>
<div class="ft-field">
<div class="ft-label">默认</div>
<div class="ft-check">
<Checkbox v-model:value="data.PublishAudio.DefaultIndc" true-value="Y" false-value="N"
:disabled="!isEdit">默认音乐厅专辑?
</Checkbox>
</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="2" header="专辑明细">
<a-table bordered :data-source="data.Details" :columns="columnDtls" :pagination="false"
:custom-row="customRow" style="margin-left: 0;margin-right: 0;"
:scroll="{ x: 360, y: 600 }">
<template #bodyCell="datas">
<a-card hoverable :style="cardStyle">
<template #cover>
<img v-if="!isEdit" style="height: 166px;width: 300px;"
:src="datas.record.FormattedPic" />
<span v-if="!isEdit">
{{ datas.record.Title }}
{{ datas.record.Author ? (' - ' + datas.record.Author) : '' }}
</span>
<div v-if="isEdit">
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>标题:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input v-if="isEdit" :readonly="!isEdit"
v-model:value="datas.record.Title" />
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>歌手:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input v-if="isEdit" :readonly="!isEdit"
v-model:value="datas.record.Author" />
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>封面:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input-search v-model:value="datas.record.Pic"
@search="onModalSearchPic" />
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>地址:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input-search v-model:value="datas.record.Url"
@search="onModalSearchUrl" />
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>歌词:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input-search v-model:value="datas.record.Lrc"
@search="onModalSearchLrc" />
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>备注:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input v-model:value="datas.record.Notice" />
</a-col>
</a-row>
:disabled="!isEdit">默认音乐厅专辑?</Checkbox>
</div>
</div>
</div>
</div>
<!-- 专辑明细 -->
<div class="ft-card">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="2" header="专辑明细">
<div class="ft-detail-list">
<div v-for="(record, index) in data.Details" :key="record.DetailId || index"
class="ft-detail" :class="{ 'ft-detail-selected': selected.includes(record) }"
@click="customRow(record).onclick($event)"
@dblclick="customRow(record).onDblclick($event)">
<img v-if="!isEdit" class="ft-detail-cover" :src="record.FormattedPic" />
<div class="ft-detail-main">
<div v-if="!isEdit" class="ft-detail-title">{{ record.Title || "未命名" }}</div>
<div v-if="!isEdit && record.Author" class="ft-detail-sub">{{ record.Author }}</div>
<div v-if="isEdit" class="ft-grid">
<div class="ft-field">
<div class="ft-label">标题</div>
<a-input size="large" v-model:value="record.Title" placeholder="请输入标题" />
</div>
<div class="ft-field">
<div class="ft-label">歌手</div>
<a-input size="large" v-model:value="record.Author" placeholder="请输入歌手" />
</div>
<div class="ft-field">
<div class="ft-label">封面</div>
<a-input-search size="large" v-model:value="record.Pic" placeholder="请选择封面文件"
@search="onModalSearchPic" />
</div>
<div class="ft-field">
<div class="ft-label">地址</div>
<a-input-search size="large" v-model:value="record.Url" placeholder="请选择音频文件"
@search="onModalSearchUrl" />
</div>
<div class="ft-field">
<div class="ft-label">歌词</div>
<a-input-search size="large" v-model:value="record.Lrc" placeholder="请选择歌词文件"
@search="onModalSearchLrc" />
</div>
<div class="ft-field">
<div class="ft-label">备注</div>
<a-input size="large" v-model:value="record.Notice" placeholder="请输入备注" />
</div>
</div>
</template>
<template #actions>
<span v-if="isEdit" @click="upSon(datas.index)">
<UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
/>上移
</div>
<div v-if="isEdit" class="ft-detail-actions">
<span @click.stop="upSon(index)">
<UpSquareTwoTone class="ft-action" />上移
</span>
<span v-if="isEdit" @click="downSon(datas.index)">
<DownSquareTwoTone
:style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
/>下移
<span @click.stop="downSon(index)">
<DownSquareTwoTone class="ft-action" />下移
</span>
<span v-if="isEdit" @click="deleteSon(datas.record.DetailId)" >
<DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
/>删除
<span class="ft-action-danger" @click.stop="deleteSon(record.DetailId)">
<DeleteOutlined class="ft-action" />删除
</span>
</template>
</a-card>
</template>
</a-table>
</a-collapse-panel>
</a-collapse>
<a-divider orientation="left" orientation-margin="0px" dashed style="background-color: silver">
</div>
</div>
<div v-if="!data.Details || !data.Details.length" class="ft-empty">暂无专辑明细</div>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</a-divider>
<a-collapse v-model:activeKey="activeKey" v-if="canAmend">
<a-collapse-panel key="3" header="公开群组明细">
<a-table bordered :data-source="data.FamilyGroups" :columns="columnFamilyGroups"
:pagination="false" :scroll="{ x: 520, 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 === 'operation' && isEdit">
<DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
@click="deleteFamilyGroup(datas.record.FamilyName)" />
</template>
<template
v-else-if="datas.column.dataIndex === FamilyGroupEntity.FAMILY_NAME && !isEdit">
<span style="color: blue;font-size:18px;cursor: pointer;"
@click="onViewActorOperation(datas.record.FamilyName)"> {{
datas.record.FamilyName
}}</span>
</template>
</template>
</a-table>
<template #extra v-if="isEdit">
<PlusSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }" @click="addFamilyGroup" />
</template>
</a-collapse-panel>
</a-collapse>
<!-- 公开群组明细 -->
<div class="ft-card" v-if="canAmend">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="3" header="公开群组明细">
<div class="ft-list">
<div v-for="(record, index) in data.FamilyGroups"
:key="record.FamilyName || index" class="ft-item">
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span v-if="!isEdit" class="ft-item-name ft-item-link"
@click="onViewActorOperation(record.FamilyName)">
{{ record.FamilyName || "未命名群组" }}
</span>
<span v-else class="ft-item-name">
{{ record.FamilyName || "未命名群组" }}
</span>
</div>
<div v-if="isEdit" class="ft-item-actions">
<DeleteOutlined class="ft-action ft-action-delete"
@click="deleteFamilyGroup(record.FamilyName)" />
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">群组名称</span>
<span class="ft-item-text">
{{ (record as any).FamilyLocalName || "-" }}
</span>
</div>
<div class="ft-item-field">
<span class="ft-item-label">群组描述</span>
<span class="ft-item-text">
{{ (record as any).Notice || "-" }}
</span>
</div>
</div>
</div>
<div v-if="!data.FamilyGroups || !data.FamilyGroups.length" class="ft-empty">
暂无公开群组
</div>
<a-button v-if="isEdit" class="ft-add-btn" type="dashed" block @click="addFamilyGroup">
<PlusSquareTwoTone /> 新增公开群组
</a-button>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</div>
<div class="page-footer">
<div style="">
@@ -256,16 +231,16 @@
</div>
</div>
</div>
<dragModal v-model:open="showModal" width="80%" title="作品发布查询" @cancel="handleCance" :mask-closable="false"
<dragModal v-model:open="showModal" title="作品发布查询" @cancel="handleCance" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelect">
<audioPublishEnquiry ref="enquiry" @on-row-dblclick="handleSelect"></audioPublishEnquiry>
</dragModal>
<dragModal v-model:open="showModalFamilyGroup" width="60%" title="群组查询" :mask-closable="false"
<dragModal v-model:open="showModalFamilyGroup" title="群组查询" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelectFamilyGroup">
<familyGroupEnquiry ref="groupEnquiry" @on-row-dblclick="handleSelectFamilyGroup">
</familyGroupEnquiry>
</dragModal>
<dragModal v-model:open="showModalDmsFile" width="60%" title="文件查询" :mask-closable="false"
<dragModal v-model:open="showModalDmsFile" title="文件查询" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelectDmsFile">
<dmsFileEnquiryModal ref="dmsFileEnquiry" @on-row-dblclick="handleSelectDmsFile">
</dmsFileEnquiryModal>
@@ -276,7 +251,7 @@
import { ref, unref, onBeforeMount, computed, inject, provide, h, onMounted } from "vue";
import { notification } from "ant-design-vue";
import { useRoute, useRouter } from 'vue-router'
import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone } from "@ant-design/icons-vue";
import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone, CustomerServiceOutlined } from "@ant-design/icons-vue";
import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
import dragModal from "@/components/basic/DragModal.vue"
import Checkbox from '@/components/basic/check-box/index.vue';
@@ -769,6 +744,9 @@ const columnFamilyGroups = ref([
</script>
<style lang="less">
/* 移动端表单样式(与 FamilyTreeOperation 保持一致) */
@import "../../styles/ft-mobile.less";
.page-container {
margin-right: 0px;
@@ -1,6 +1,7 @@
<template>
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
<search-card @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
:card-title-keys="[PublishPhotoEntity.PUBLISH_NAME, PublishPhotoEntity.PUBLISH_LOCAL_NAME]"
@on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
<template #control>
<a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
@@ -36,13 +37,13 @@
</a-row>
</div>
</template>
</search>
</search-card>
</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 searchCard from "@/components/basic/SearchCard.vue";
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
import { PublishPhotoResultData } from "@/data/auto/publishPhotoResultData";
+186 -177
View File
@@ -59,66 +59,74 @@
</a-col>
</a-row>
</div>
<div class="page-main" :style="{ height: resultH }">
<a-row :gutter="[16, 8]">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px; width: 60px">相册编号:</span>
</a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px">
<a-input
:readonly="true"
v-model:value="data.PublishPhoto.PublishName"
/>
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px; width: 60px">相册名称:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px">
<a-input
:maxlength="50"
:readonly="!isEdit"
v-model:value="data.PublishPhoto.PublishLocalName"
/>
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px; width: 60px">相册描述:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px">
<a-textarea
:auto-size="{ minRows: 3, maxRows: 5 }"
:maxlength="500"
:readonly="!isEdit"
v-model:value="data.PublishPhoto.Notice"
/>
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12"> </a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px">
<div
class="page-main ft-page"
:class="{ 'ft-readonly': !isEdit }"
:style="{ height: resultH }"
>
<!-- 顶部信息卡 -->
<div class="ft-hero">
<div class="ft-hero-icon">
<PictureOutlined />
</div>
<div class="ft-hero-main">
<div class="ft-hero-name">
{{ data.PublishPhoto.PublishLocalName || "未填写相册名称" }}
</div>
<div class="ft-hero-meta">
<span class="ft-chip">
编号 {{ data.PublishPhoto.PublishName || "-" }}
</span>
<span class="ft-chip" v-if="data.PublishPhoto.OpenIndc == 'Y'">
公开
</span>
</div>
</div>
</div>
<!-- 相册信息 -->
<div 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"
:readonly="true"
placeholder="相册编号"
v-model:value="data.PublishPhoto.PublishName"
/>
</div>
<div class="ft-field">
<div class="ft-label">相册名称</div>
<a-input
size="large"
:maxlength="50"
:readonly="!isEdit"
placeholder="请输入相册名称"
v-model:value="data.PublishPhoto.PublishLocalName"
/>
</div>
<div class="ft-field ft-field-full">
<div class="ft-label">相册描述</div>
<a-textarea
:auto-size="{ minRows: 3, maxRows: 5 }"
:maxlength="500"
:readonly="!isEdit"
placeholder="请输入相册描述"
v-model:value="data.PublishPhoto.Notice"
/>
</div>
<div class="ft-field">
<div class="ft-label">公开</div>
<div class="ft-check">
<Checkbox
v-model:value="data.PublishPhoto.OpenIndc"
true-value="Y"
false-value="N"
:disabled="!isEdit"
><span
>
<span
:style="{
color:
data.PublishPhoto.OpenIndc == 'Y' ? 'red' : 'black',
@@ -127,137 +135,136 @@
对所有人公开?
</span>
</Checkbox>
</a-col>
</a-row>
</a-col>
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="3"> </a-col>
<a-col :lg="3" :sm="18" style="min-width: 300px">
</div>
</div>
<div class="ft-field">
<div class="ft-label">默认</div>
<div class="ft-check">
<Checkbox
v-model:value="data.PublishPhoto.DefaultIndc"
true-value="Y"
false-value="N"
:disabled="!isEdit"
>默认相册展览?
</Checkbox>
</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="2" header="相册明细">
<a-table
bordered
:data-source="data.Details"
:columns="columnDtls"
:pagination="false"
:scroll="{ x: 360, y: 600 }"
>
<template #bodyCell="datas">
<a-card hoverable style="width: 300px">
<template #cover>
<a-image
style="height: 466px"
:src="datas.record.FileName"
>默认相册展览?</Checkbox
>
</div>
</div>
</div>
</div>
<!-- 相册明细 -->
<div class="ft-card">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="2" header="相册明细">
<div class="ft-detail-list">
<div
v-for="(record, index) in data.Details"
:key="record.DetailId || index"
class="ft-detail"
>
<a-image class="ft-detail-cover" :src="record.FileName" />
<div class="ft-detail-main">
<a-textarea
v-if="isEdit"
:rows="4"
:readonly="!isEdit"
placeholder="请输入图片描述"
v-model:value="record.Notice"
/>
</template>
<a-card-meta>
<template #description>
<a-textarea
v-if="isEdit"
:rows="4"
:readonly="!isEdit"
v-model:value="datas.record.Notice"
/>
<span v-if="!isEdit">{{ datas.record.Notice }}</span>
</template>
</a-card-meta>
<template #actions>
<span v-if="isEdit" @click="upSon(datas.index)">
<UpSquareTwoTone
:style="{ fontSize: '24px', color: '#08c' }"
/>上移
<div v-else class="ft-detail-sub">
{{ record.Notice || "无描述" }}
</div>
</div>
<div v-if="isEdit" class="ft-detail-actions">
<span @click="upSon(index)">
<UpSquareTwoTone class="ft-action" />上移
</span>
<span v-if="isEdit" @click="downSon(datas.index)">
<DownSquareTwoTone
:style="{
fontSize: '24px',
color: '#08c',
marginLeft: '20px',
marginRight: '20px',
}"
/>下移
<span @click="downSon(index)">
<DownSquareTwoTone class="ft-action" />下移
</span>
<span v-if="isEdit" @click="deleteSon(datas.record.DetailId)">
<span
class="ft-action-danger"
@click="deleteSon(record.DetailId)"
>
<DeleteOutlined class="ft-action" />删除
</span>
</div>
</div>
<div
v-if="!data.Details || !data.Details.length"
class="ft-empty"
>
暂无相册明细
</div>
</div>
</a-collapse-panel>
</a-collapse>
</div>
<!-- 公开群组明细 -->
<div class="ft-card" v-if="canAmend">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="3" header="公开群组明细">
<div class="ft-list">
<div
v-for="(record, index) in data.FamilyGroups"
:key="record.FamilyName || index"
class="ft-item"
>
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span
v-if="!isEdit"
class="ft-item-name ft-item-link"
@click="onViewActorOperation(record.FamilyName)"
>
{{ record.FamilyName || "未命名群组" }}
</span>
<span v-else class="ft-item-name">
{{ record.FamilyName || "未命名群组" }}
</span>
</div>
<div v-if="isEdit" class="ft-item-actions">
<DeleteOutlined
:style="{ fontSize: '24px', color: 'red' }"
/>删除
</span>
</template>
</a-card>
</template>
</a-table>
</a-collapse-panel>
</a-collapse>
<a-divider
orientation="left"
orientation-margin="0px"
dashed
style="background-color: silver"
>
</a-divider>
<a-collapse v-model:activeKey="activeKey" v-if="canAmend">
<a-collapse-panel key="3" header="公开群组明细">
<a-table
bordered
:data-source="data.FamilyGroups"
:columns="columnFamilyGroups"
:pagination="false"
:scroll="{ x: 520, 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 === 'operation' && isEdit"
class="ft-action ft-action-delete"
@click="deleteFamilyGroup(record.FamilyName)"
/>
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">群组名称</span>
<span class="ft-item-text">
{{ (record as any).FamilyLocalName || "-" }}
</span>
</div>
<div class="ft-item-field">
<span class="ft-item-label">群组描述</span>
<span class="ft-item-text">
{{ (record as any).Notice || "-" }}
</span>
</div>
</div>
</div>
<div
v-if="!data.FamilyGroups || !data.FamilyGroups.length"
class="ft-empty"
>
<DeleteOutlined
:style="{ fontSize: '24px', color: 'red' }"
@click="deleteFamilyGroup(datas.record.FamilyName)"
/>
</template>
<template
v-else-if="
datas.column.dataIndex === FamilyGroupEntity.FAMILY_NAME &&
!isEdit
"
暂无公开群组
</div>
<a-button
v-if="isEdit"
class="ft-add-btn"
type="dashed"
block
@click="addFamilyGroup"
>
<span
style="color: blue; font-size: 18px; cursor: pointer"
@click="onViewActorOperation(datas.record.FamilyName)"
>
{{ datas.record.FamilyName }}</span
>
</template>
</template>
</a-table>
<template #extra v-if="isEdit">
<PlusSquareTwoTone
:style="{ fontSize: '24px', color: '#08c' }"
@click="addFamilyGroup"
/>
</template>
</a-collapse-panel>
</a-collapse>
<PlusSquareTwoTone /> 新增公开群组
</a-button>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</div>
<div class="page-footer">
<div style="">
@@ -338,7 +345,6 @@
</div>
<dragModal
v-model:open="showModal"
width="80%"
title="作品发布查询"
@cancel="handleCance"
:mask-closable="false"
@@ -352,7 +358,6 @@
</dragModal>
<dragModal
v-model:open="showModalFamilyGroup"
width="60%"
title="群组查询"
:mask-closable="false"
:fullscreen="width < 640"
@@ -381,6 +386,7 @@ import {
PlusSquareTwoTone,
DownSquareTwoTone,
UpSquareTwoTone,
PictureOutlined,
} from "@ant-design/icons-vue";
import {
PermissionContext,
@@ -755,6 +761,9 @@ const columnFamilyGroups = ref([
]);
</script>
<style lang="less">
/* 移动端表单样式(与 FamilyTreeOperation 保持一致) */
@import "../../styles/ft-mobile.less";
.page-container {
margin-right: 0px;
}
@@ -1,6 +1,7 @@
<template>
<search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
<search-card @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination"
:is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
:card-title-keys="[PublishVideoEntity.PUBLISH_NAME, PublishVideoEntity.PUBLISH_LOCAL_NAME]"
@on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
<template #control>
<a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
@@ -36,13 +37,13 @@
</a-row>
</div>
</template>
</search>
</search-card>
</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 searchCard from "@/components/basic/SearchCard.vue";
import { DeleteOutlined, EditOutlined, FileAddOutlined, FileTextOutlined } from "@ant-design/icons-vue";
import { PublishVideoResultData } from "@/data/auto/publishVideoResultData";
+136 -139
View File
@@ -29,152 +29,146 @@
</a-col>
</a-row>
</div>
<div class="page-main" :style="{ height: resultH }">
<a-row :gutter="[16, 8]">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑编号:</span>
</a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px;">
<a-input :readonly="true" v-model:value="data.PublishVideo.PublishName" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑名称:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px;">
<a-input :maxlength="50" :readonly="!isEdit"
v-model:value="data.PublishVideo.PublishLocalName" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<span style="min-width: 60px;width: 60px;">专辑描述:</span>
</a-col>
<a-col :lg="18" :sm="12" style="min-width: 300px;">
<a-textarea :auto-size="{ minRows: 3, maxRows: 5 }" :maxlength="500" :readonly="!isEdit"
v-model:value="data.PublishVideo.Notice" />
</a-col>
</a-row>
</a-col>
</a-row>
<a-row :gutter="[16, 8]" style="margin-top: 8px;">
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="12">
<div class="page-main ft-page" :class="{ 'ft-readonly': !isEdit }" :style="{ height: resultH }">
<!-- 顶部信息卡 -->
<div class="ft-hero">
<div class="ft-hero-icon">
<VideoCameraOutlined />
</div>
<div class="ft-hero-main">
<div class="ft-hero-name">
{{ data.PublishVideo.PublishLocalName || "未填写专辑名称" }}
</div>
<div class="ft-hero-meta">
<span class="ft-chip">编号 {{ data.PublishVideo.PublishName || "-" }}</span>
<span class="ft-chip" v-if="data.PublishVideo.OpenIndc == 'Y'">公开</span>
</div>
</div>
</div>
</a-col>
<a-col :lg="3" :sm="12" style="min-width: 300px;">
<!-- 专辑信息 -->
<div 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" :readonly="true" placeholder="专辑编号"
v-model:value="data.PublishVideo.PublishName" />
</div>
<div class="ft-field">
<div class="ft-label">专辑名称</div>
<a-input size="large" :maxlength="50" :readonly="!isEdit" placeholder="请输入专辑名称"
v-model:value="data.PublishVideo.PublishLocalName" />
</div>
<div class="ft-field ft-field-full">
<div class="ft-label">专辑描述</div>
<a-textarea :auto-size="{ minRows: 3, maxRows: 5 }" :maxlength="500" :readonly="!isEdit"
placeholder="请输入专辑描述" v-model:value="data.PublishVideo.Notice" />
</div>
<div class="ft-field">
<div class="ft-label">公开</div>
<div class="ft-check">
<Checkbox v-model:value="data.PublishVideo.OpenIndc" true-value="Y" false-value="N"
:disabled="!isEdit"><span
:style="{ color: (data.PublishVideo.OpenIndc == 'Y' ? 'red' : 'black') }">
:disabled="!isEdit">
<span :style="{ color: (data.PublishVideo.OpenIndc == 'Y' ? 'red' : 'black') }">
对所有人公开?
</span>
</Checkbox>
</a-col>
</a-row>
</a-col>
<a-col :lg="24" :sm="24">
<a-row :wrap="true" align="middle">
<a-col :lg="3" :sm="3">
</a-col>
<a-col :lg="3" :sm="18" style="min-width: 300px;">
</div>
</div>
<div class="ft-field">
<div class="ft-label">默认</div>
<div class="ft-check">
<Checkbox v-model:value="data.PublishVideo.DefaultIndc" true-value="Y" false-value="N"
:disabled="!isEdit">默认音乐厅专辑?
</Checkbox>
</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="2" header="专辑明细">
<a-table bordered :data-source="data.Details" :columns="columnDtls" :pagination="false"
:custom-row="customRow" style="margin-left: 0;margin-right: 0;"
:scroll="{ x: 360, y: 600 }">
<template #bodyCell="datas">
<a-card hoverable :style="cardStyle">
<template #cover>
<img v-if="!isEdit" style="height: 166px;width: 300px;"
:src="datas.record.FormattedPic" />
<span v-if="!isEdit">
{{ datas.record.Title }}
{{ datas.record.Author ? (' - ' + datas.record.Author) : '' }}
</span>
<div v-if="isEdit">
<a-row :gutter="[16, 8]" style="margin-top: 2px;">
<a-col :offset="1" :lg="3" :sm="3">
<span>标题:</span>
</a-col>
<a-col :lg="18" :sm="18">
<a-input v-if="isEdit" :readonly="!isEdit"
v-model:value="datas.record.Title" />
</a-col>
</a-row>
:disabled="!isEdit">默认音乐厅专辑?</Checkbox>
</div>
</div>
</div>
</div>
<!-- 专辑明细 -->
<div class="ft-card">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="2" header="专辑明细">
<div class="ft-detail-list">
<div v-for="(record, index) in data.Details" :key="record.DetailId || index"
class="ft-detail" :class="{ 'ft-detail-selected': selected.includes(record) }"
@click="customRow(record).onclick($event)"
@dblclick="customRow(record).onDblclick($event)">
<img v-if="!isEdit" class="ft-detail-cover" :src="record.FormattedPic" />
<div class="ft-detail-main">
<div v-if="!isEdit" class="ft-detail-title">{{ record.Title || "未命名" }}</div>
<div v-if="!isEdit && record.Author" class="ft-detail-sub">{{ record.Author }}</div>
<div v-if="isEdit" class="ft-field">
<div class="ft-label">标题</div>
<a-input size="large" v-model:value="record.Title" placeholder="请输入标题" />
</div>
</template>
<template #actions>
<span v-if="isEdit" @click="upSon(datas.index)" >
<UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
/>上移
</div>
<div v-if="isEdit" class="ft-detail-actions">
<span @click.stop="upSon(index)">
<UpSquareTwoTone class="ft-action" />上移
</span>
<span v-if="isEdit" @click="downSon(datas.index)">
<DownSquareTwoTone
:style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
/>下移
<span @click.stop="downSon(index)">
<DownSquareTwoTone class="ft-action" />下移
</span>
<span v-if="isEdit" @click="deleteSon(datas.record.DetailId)">
<DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
/>删除
<span class="ft-action-danger" @click.stop="deleteSon(record.DetailId)">
<DeleteOutlined class="ft-action" />删除
</span>
</template>
</a-card>
</template>
</a-table>
</a-collapse-panel>
</a-collapse>
<a-divider orientation="left" orientation-margin="0px" dashed style="background-color: silver">
</div>
</div>
<div v-if="!data.Details || !data.Details.length" class="ft-empty">暂无专辑明细</div>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</a-divider>
<a-collapse v-model:activeKey="activeKey" v-if="canAmend">
<a-collapse-panel key="3" header="公开群组明细">
<a-table bordered :data-source="data.FamilyGroups" :columns="columnFamilyGroups"
:pagination="false" :scroll="{ x: 520, 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 === 'operation' && isEdit">
<DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
@click="deleteFamilyGroup(datas.record.FamilyName)" />
</template>
<template
v-else-if="datas.column.dataIndex === FamilyGroupEntity.FAMILY_NAME && !isEdit">
<span style="color: blue;font-size:18px;cursor: pointer;"
@click="onViewActorOperation(datas.record.FamilyName)"> {{
datas.record.FamilyName
}}</span>
</template>
</template>
</a-table>
<template #extra v-if="isEdit">
<PlusSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }" @click="addFamilyGroup" />
</template>
</a-collapse-panel>
</a-collapse>
<!-- 公开群组明细 -->
<div class="ft-card" v-if="canAmend">
<a-collapse v-model:activeKey="activeKey" class="ft-collapse">
<a-collapse-panel key="3" header="公开群组明细">
<div class="ft-list">
<div v-for="(record, index) in data.FamilyGroups"
:key="record.FamilyName || index" class="ft-item">
<div class="ft-item-head">
<span class="ft-item-index">{{ index + 1 }}</span>
<div class="ft-item-title">
<span v-if="!isEdit" class="ft-item-name ft-item-link"
@click="onViewActorOperation(record.FamilyName)">
{{ record.FamilyName || "未命名群组" }}
</span>
<span v-else class="ft-item-name">
{{ record.FamilyName || "未命名群组" }}
</span>
</div>
<div v-if="isEdit" class="ft-item-actions">
<DeleteOutlined class="ft-action ft-action-delete"
@click="deleteFamilyGroup(record.FamilyName)" />
</div>
</div>
<div class="ft-item-body">
<div class="ft-item-field">
<span class="ft-item-label">群组名称</span>
<span class="ft-item-text">
{{ (record as any).FamilyLocalName || "-" }}
</span>
</div>
<div class="ft-item-field">
<span class="ft-item-label">群组描述</span>
<span class="ft-item-text">
{{ (record as any).Notice || "-" }}
</span>
</div>
</div>
</div>
<div v-if="!data.FamilyGroups || !data.FamilyGroups.length" class="ft-empty">
暂无公开群组
</div>
<a-button v-if="isEdit" class="ft-add-btn" type="dashed" block @click="addFamilyGroup">
<PlusSquareTwoTone /> 新增公开群组
</a-button>
</div>
</a-collapse-panel>
</a-collapse>
</div>
</div>
<div class="page-footer">
<div style="">
@@ -212,16 +206,16 @@
</div>
</div>
</div>
<dragModal v-model:open="showModal" width="80%" title="作品发布查询" @cancel="handleCance" :mask-closable="false"
<dragModal v-model:open="showModal" title="作品发布查询" @cancel="handleCance" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelect">
<videoPublishEnquiry ref="enquiry" @on-row-dblclick="handleSelect"></videoPublishEnquiry>
</dragModal>
<dragModal v-model:open="showModalFamilyGroup" width="60%" title="群组查询" :mask-closable="false"
<dragModal v-model:open="showModalFamilyGroup" title="群组查询" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelectFamilyGroup">
<familyGroupEnquiry ref="groupEnquiry" @on-row-dblclick="handleSelectFamilyGroup">
</familyGroupEnquiry>
</dragModal>
<dragModal v-model:open="showModalDmsFile" width="60%" title="文件查询" :mask-closable="false"
<dragModal v-model:open="showModalDmsFile" title="文件查询" :mask-closable="false"
:fullscreen="width < 640" @ok="handleSelectDmsFile">
<dmsFileEnquiryModal ref="dmsFileEnquiry" @on-row-dblclick="handleSelectDmsFile">
</dmsFileEnquiryModal>
@@ -232,7 +226,7 @@
import { ref, unref, onBeforeMount, computed, inject, provide, h, onMounted } from "vue";
import { notification } from "ant-design-vue";
import { useRoute, useRouter } from 'vue-router'
import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone } from "@ant-design/icons-vue";
import { DeleteOutlined, EditOutlined, ClearOutlined, FileSearchOutlined, FileAddOutlined, UndoOutlined, SaveOutlined, PlusSquareTwoTone, DownSquareTwoTone, UpSquareTwoTone, VideoCameraOutlined } from "@ant-design/icons-vue";
import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
import dragModal from "@/components/basic/DragModal.vue"
import Checkbox from '@/components/basic/check-box/index.vue';
@@ -725,6 +719,9 @@ const columnFamilyGroups = ref([
</script>
<style lang="less">
/* 移动端表单样式(与 FamilyTreeOperation 保持一致) */
@import "../../styles/ft-mobile.less";
.page-container {
margin-right: 0px;