From b485837fc8764af887072a37278561ca24892a20 Mon Sep 17 00:00:00 2001
From: owenchen <owenchen@1010printing.com>
Date: Fri, 4 Sep 2026 11:43:11 +0800
Subject: [PATCH] ow

---
 .../FamilyGroupService.auto.cs                |    2 +-
 .../FolderProfile3.pubxml.user                |    2 +-
 .../src/views/master/DmsFileDeleteEnquiry.vue |  912 ++++++++++++
 WebVue/src/views/master/DmsFileEnquiry.vue    |   20 +-
 .../src/views/master/FamilyGroupEnquiry.vue   |  412 ++++++
 .../src/views/master/FamilyGroupOperation.vue | 1063 ++++++++++++++
 WebVue/src/views/master/FamilyGroupShare.vue  | 1274 +++++++++++++++++
 .../src/views/master/FamilyGroupUserModal.vue |  248 ++++
 .../src/views/master/FamilyShareOperation.vue |  316 ++++
 .../master/{VideoPlay.vue => PlayVideo.vue}   |    0
 WebVue/src/views/master/Preview.vue           |  190 +++
 WebVue/src/views/master/PreviewAudio.vue      |  148 ++
 WebVue/src/views/master/PreviewVideo.vue      |  177 +++
 .../views/master/PublishAudioOperation.vue    |  812 +++++++++++
 .../views/master/PublishVideoOperation.vue    |  812 +++++++++++
 15 files changed, 6377 insertions(+), 11 deletions(-)
 create mode 100644 WebVue/src/views/master/DmsFileDeleteEnquiry.vue
 create mode 100644 WebVue/src/views/master/FamilyGroupEnquiry.vue
 create mode 100644 WebVue/src/views/master/FamilyGroupOperation.vue
 create mode 100644 WebVue/src/views/master/FamilyGroupShare.vue
 create mode 100644 WebVue/src/views/master/FamilyGroupUserModal.vue
 create mode 100644 WebVue/src/views/master/FamilyShareOperation.vue
 rename WebVue/src/views/master/{VideoPlay.vue => PlayVideo.vue} (100%)
 create mode 100644 WebVue/src/views/master/Preview.vue
 create mode 100644 WebVue/src/views/master/PreviewAudio.vue
 create mode 100644 WebVue/src/views/master/PreviewVideo.vue
 create mode 100644 WebVue/src/views/master/PublishAudioOperation.vue
 create mode 100644 WebVue/src/views/master/PublishVideoOperation.vue

diff --git a/CloudBuilder/CloudBuilder.Master.Service/FamilyGroupService.auto.cs b/CloudBuilder/CloudBuilder.Master.Service/FamilyGroupService.auto.cs
index 09dc83d..ce9b160 100644
--- a/CloudBuilder/CloudBuilder.Master.Service/FamilyGroupService.auto.cs
+++ b/CloudBuilder/CloudBuilder.Master.Service/FamilyGroupService.auto.cs
@@ -529,7 +529,7 @@ namespace CloudBuilder.Master.Service
             }
 
             familyGroup = repository.DetachedEntities.Where(x => x.FamilyName != data.FamilyGroup.FamilyName && x.FamilyLocalName == data.FamilyGroup.FamilyLocalName).FirstOrDefault();
-            if (familyGroup == null)
+            if (familyGroup != null)
             {
                 throw new ValidatedException("群组名称已存在.");
             }
diff --git a/CloudBuilder/CloudBuilder.Web.Entry/Properties/PublishProfiles/FolderProfile3.pubxml.user b/CloudBuilder/CloudBuilder.Web.Entry/Properties/PublishProfiles/FolderProfile3.pubxml.user
index ffd60c3..6b60c79 100644
--- a/CloudBuilder/CloudBuilder.Web.Entry/Properties/PublishProfiles/FolderProfile3.pubxml.user
+++ b/CloudBuilder/CloudBuilder.Web.Entry/Properties/PublishProfiles/FolderProfile3.pubxml.user
@@ -3,7 +3,7 @@
 <Project>
   <PropertyGroup>
     <_PublishTargetUrl>C:\inetpub\wwwroot\dockwebapi2</_PublishTargetUrl>
-    <History>True|2026-09-03T08:05:52.5270232Z||;True|2026-09-03T14:52:56.8559144+08:00||;True|2026-09-02T11:08:23.8720038+08:00||;True|2026-09-02T10:58:16.8081797+08:00||;True|2026-08-26T13:34:12.3805892+08:00||;True|2026-08-25T08:31:30.7787234+08:00||;True|2026-08-20T13:10:46.4725468+08:00||;True|2026-08-20T13:10:28.3142576+08:00||;True|2026-08-19T16:10:27.3362887+08:00||;True|2026-08-19T16:01:12.6234971+08:00||;True|2026-08-19T15:42:46.6576265+08:00||;True|2026-08-19T13:39:59.9363522+08:00||;True|2026-08-19T13:36:53.0379313+08:00||;True|2026-08-19T13:31:36.0841398+08:00||;True|2026-08-19T11:44:37.5319626+08:00||;True|2026-08-19T09:36:45.6000047+08:00||;True|2026-08-19T09:34:36.8468631+08:00||;True|2026-08-19T08:35:41.2202300+08:00||;True|2026-08-18T16:20:59.0170916+08:00||;</History>
+    <History>True|2026-09-04T03:42:59.9356436Z||;True|2026-09-03T16:05:52.5270232+08:00||;True|2026-09-03T14:52:56.8559144+08:00||;True|2026-09-02T11:08:23.8720038+08:00||;True|2026-09-02T10:58:16.8081797+08:00||;True|2026-08-26T13:34:12.3805892+08:00||;True|2026-08-25T08:31:30.7787234+08:00||;True|2026-08-20T13:10:46.4725468+08:00||;True|2026-08-20T13:10:28.3142576+08:00||;True|2026-08-19T16:10:27.3362887+08:00||;True|2026-08-19T16:01:12.6234971+08:00||;True|2026-08-19T15:42:46.6576265+08:00||;True|2026-08-19T13:39:59.9363522+08:00||;True|2026-08-19T13:36:53.0379313+08:00||;True|2026-08-19T13:31:36.0841398+08:00||;True|2026-08-19T11:44:37.5319626+08:00||;True|2026-08-19T09:36:45.6000047+08:00||;True|2026-08-19T09:34:36.8468631+08:00||;True|2026-08-19T08:35:41.2202300+08:00||;True|2026-08-18T16:20:59.0170916+08:00||;</History>
     <LastFailureDetails />
   </PropertyGroup>
 </Project>
\ No newline at end of file
diff --git a/WebVue/src/views/master/DmsFileDeleteEnquiry.vue b/WebVue/src/views/master/DmsFileDeleteEnquiry.vue
new file mode 100644
index 0000000..1179624
--- /dev/null
+++ b/WebVue/src/views/master/DmsFileDeleteEnquiry.vue
@@ -0,0 +1,912 @@
+<template>
+  <a-spin size="large" :spinning="loading">
+    <search
+      @on-submit="onSubmit"
+      @on-print="onPrint"
+      @on-reset="onReset"
+      @use-pagination="onPagination"
+      rowSelectionType="checkbox"
+      :scrollx="200"
+      :loading="loading"
+      :pagination="result"
+      @on-select-change="onSelectChange"
+    >
+      <template #control> </template>
+
+      <template #headerCell="{ column }">
+        <template
+          v-if="column.dataIndex === DmsFileUploadDeleteLogViewDisplayData.URL"
+        >
+          <span
+            style="color: darkgoldenrod; font-size: large; cursor: pointer"
+            @click.prevent="onChangeFolder(rootPath)"
+          >
+            <LaptopOutlined
+              style="color: darkgoldenrod; font-size: larger"
+              title="返回顶层"
+            />返回顶层
+          </span>
+        </template>
+      </template>
+
+      <template #bodyCell="{ column, record, index }">
+        <template
+          v-if="column.dataIndex === DmsFileUploadDeleteLogViewDisplayData.URL"
+        >
+          <template v-if="!fileTypePolicy.isImage(record.OrderKey)">
+            <template v-if="record.IsDirectoryIndc == 'Y'">
+              <a-card hoverable style="width: 300px">
+                <a-card-meta>
+                  <template #description>
+                    <span
+                      style="
+                        color: darkgoldenrod;
+                        margin-left: 4pxr;
+                        cursor: pointer;
+                        font-size: 26px;
+                      "
+                      @click.prevent="onChangeFolder(record.FileName)"
+                    >
+                      <FolderOutlined
+                        style="color: darkgoldenrod; font-size: 48px"
+                        title="打开文件夹"
+                      />{{ record.OrgFileName }}
+                    </span>
+                  </template>
+                </a-card-meta>
+                <template #actions> </template>
+              </a-card>
+            </template>
+            <template v-else-if="fileTypePolicy.isVideo(record.OrderKey)">
+              <a-card style="width: 300px">
+                <template #cover>
+                  <img
+                    style="height: 200px"
+                    :src="record.FormattedPic.replace('.m3u8', '.png')"
+                    :title="record.OrgFileName"
+                  />
+                </template>
+                <a-card-meta>
+                  <template #description>
+                    <a-flex>
+                      <cust-icon-font
+                        size="26"
+                        type="icon-foldervideo"
+                        v-if="record.TranscodeIndc == 'Y'"
+                        @click.prevent="
+                          onUrlVideoPlay(record.Url, record.OrgFileName)
+                        "
+                      />
+                      <cust-icon-font
+                        v-else
+                        size="26"
+                        type="icon-mp3-play"
+                        @click.prevent="onVideoPlay(record.FileId)"
+                      />
+                      <span
+                        style="
+                          color: darkgoldenrod;
+                          margin-left: 4pxr;
+                          margin-top: 2px;
+                        "
+                      >
+                        {{ record.OrgFileName }}
+                      </span>
+                    </a-flex>
+                  </template>
+                </a-card-meta>
+                <template #actions> </template>
+              </a-card>
+            </template>
+            <template v-else>
+              <DownloadOutlined
+                style="color: rgb(19, 185, 190); font-size: larger"
+                title="下载"
+                @click.prevent="
+                  onDownloadFile(record.FileId, record.OrgFileName)
+                "
+              />
+              <span>{{ record.OrgFileName }}</span>
+            </template>
+          </template>
+          <template v-else>
+            <a-card hoverable style="width: 300px">
+              <template #cover>
+                <img
+                  style="height: 200px"
+                  :src="record.Url"
+                  :title="record.OrgFileName"
+                  @click.prevent="
+                    onViewPictureFile(record.FileId, record.OrgFileName)
+                  "
+                />
+              </template>
+              <a-card-meta>
+                <template #description>
+                  <span style="color: darkgoldenrod; margin-left: 4pxr">
+                    <DownloadOutlined
+                      style="color: rgb(19, 185, 190); font-size: larger"
+                      title="原图下载"
+                      @click.prevent="
+                        onDownloadFile(record.FileId, record.OrgFileName)
+                      "
+                    />
+                    {{ record.OrgFileName }}
+                  </span>
+                </template>
+              </a-card-meta>
+              <template #actions> </template>
+            </a-card>
+          </template>
+        </template>
+      </template>
+
+      <template #footer>
+        <div class="page-footer">
+          <a-row :gutter="24">
+            <a-col :lg="24" :sm="24">
+              <a-row v-if="isEdit" :gutter="[16, 8]">
+                <a-space>
+                  <a-button type="primary" @click.prevent="onCancel"
+                    >取消</a-button
+                  >
+                  <a-button type="primary" @click.prevent="onSave"
+                    >确定</a-button
+                  >
+                </a-space>
+              </a-row>
+              <a-row v-if="!isEdit" :gutter="[16, 8]">
+                <a-space>
+                  <!-- <a-button type="primary" v-if="canAmend" :icon="h(FileImageOutlined)"
+                                        :disabled="!(keys && keys.length > 0)" @click.prevent="onViewPic">预览</a-button> -->
+                  <a-popconfirm
+                    title="确定是否删除记录?"
+                    ok-text="是"
+                    cancel-text="否"
+                    @confirm="onDelete"
+                  >
+                    <a-button
+                      type="primary"
+                      danger
+                      :icon="h(DeleteOutlined)"
+                      v-if="canDelete"
+                      :disabled="!(keys && keys.length > 0)"
+                      >永久删除</a-button
+                    >
+                  </a-popconfirm>
+                </a-space>
+              </a-row>
+            </a-col>
+          </a-row>
+        </div>
+      </template>
+    </search>
+    <a-image
+      :width="1024"
+      :style="{ display: 'none' }"
+      :preview="{
+        visible,
+        onVisibleChange: setPicVisible,
+      }"
+      :src="imageSrc"
+    />
+    <dmsFolder @on-submit="onReload"></dmsFolder>
+    <videoPlay></videoPlay>
+  </a-spin>
+</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,
+  PictureOutlined,
+  LaptopOutlined,
+  ScissorOutlined,
+  UploadOutlined,
+  FolderAddOutlined,
+  DownloadOutlined,
+  FolderOutlined,
+  FileImageOutlined,
+} from "@ant-design/icons-vue";
+import { DmsFileEntity } from "@/data/auto/dmsFileEntity";
+import { DmsFileResultData } from "@/data/auto/dmsFileResultData";
+import { DmsFileUploadDeleteLogViewDisplayData } from "@/data/auto/dmsFileUploadDeleteLogViewDisplayData";
+import { SearchFilter } from "@/data/auto/searchFilter";
+import dmsFileService from "@/service/master/dmsFileService";
+import { DmsFileSearchCriteria } from "@/data/auto/dmsFileSearchCriteria";
+
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+import {
+  PermissionContext,
+  usePermissionContext,
+} from "@/hooks/PermissionContext";
+import { useRoute, useRouter } from "vue-router";
+
+import { useBindOption } from "@/hooks/useBindOption";
+import { SearchFilterOperatorPolicy } from "@/data/custom/searchFilterOperatorPolicy";
+import { SearchFilterTypePolicy } from "@/data/custom/searchFilterTypePolicy";
+import { notification } from "ant-design-vue";
+import { GridColumnInfo } from "@/data/auto/gridColumnInfo";
+import { useGridColumnInfo } from "@/hooks/gridColumnInfo";
+import dmsFolder from "./DmsFolderModal.vue";
+import { useLoginProfileStore } from "@/store/modules/loginProfile";
+import type { UploadProps } from "ant-design-vue";
+import { WebSitePolicy } from "@/policy/custom/webSitePolicy";
+import { orderBy } from "lodash-es";
+import { bsInfo } from "@/utils/browser";
+import axios from "axios";
+import { getuid } from "process";
+import VideoPlay from "./PlayVideo.vue";
+import {
+  enquiryMethodKey,
+  searchCriteriaManagerKey,
+  masterOperationToEnquiryMethodKey,
+  MasterOperationToEnquiryModelOption,
+  layoutProviderMethodKey,
+} from "@/injections";
+import { useOrderedChildren } from "@/hooks/use-ordered-children";
+import { SearchCriteriaContext } from "@/injections";
+import fileTypePolicy from "@/policy/custom/fileTypePolicy";
+//page from-----------------------------------------------------------------------------------------------------------------------------------
+//================inject================
+//报表名称
+const layoutProviderMethod = inject(layoutProviderMethodKey);
+
+//================inject================
+
+const widthColumn = ref<string>("3%");
+if (bsInfo.size.sm) {
+  widthColumn.value = "8%";
+} else {
+  widthColumn.value = "3%";
+}
+
+const loading = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const canView = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const modalTitle = ref<string>("新增文件夹");
+const rootPath = ref<string>("");
+const imageSrc = ref<string>("");
+const route = useRoute();
+const router = useRouter();
+const previousFilePath = ref<string>("");
+
+const fileList = ref<UploadProps["fileList"]>([]);
+const uploadUrl = ref<string>(WebSitePolicy.WebApiRoot + "DmsFile/UploadFile");
+if (process.env.NODE_ENV === "development") {
+  uploadUrl.value = WebSitePolicy.WebApiRootDev + "/DmsFile/UploadFile";
+} else {
+  uploadUrl.value = WebSitePolicy.WebApiRoot + "/DmsFile/UploadFile";
+}
+
+const currFilePath = ref<string>("");
+const headers = ref({
+  Authorization: useLoginProfileStore().getToken(),
+  "Content-Type": "multipart/form-data",
+  FilePath: currFilePath.value,
+});
+
+const columns = ref([
+  {
+    title: "",
+    dataIndex: DmsFileUploadDeleteLogViewDisplayData.URL,
+    sorter: false,
+    width: "50%",
+    sequence: 1,
+    hidden: "N",
+  },
+]);
+
+const viewOption = {
+  Value: "default",
+  SelectOptions: [{ BindValue: "default", DisplayName: "默认" }],
+  Columns: [{ BindValue: "default", BindColumn: columns }],
+};
+
+const bindOptions = ref<BindOption[]>([]);
+const datas = ref<DmsFileUploadDeleteLogViewDisplayData[]>([]);
+const pagingParams = ref<PagingParams>({ pageSize: 20, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+
+const data = ref<DmsFileResultData>(new DmsFileResultData());
+const currentFilter = ref<SearchFilter[]>([]);
+const isSearched = ref<boolean>(false);
+const currentSearchCriteria = ref<DmsFileSearchCriteria>(
+  new DmsFileSearchCriteria(),
+);
+
+const keys = ref<DmsFileUploadDeleteLogViewDisplayData[]>([]);
+const dmsFolderModal = ref<boolean>(false);
+const dmsFolderTitle = ref<string>("新增文件夹");
+const dmsFolderIsRename = ref<boolean>(false);
+const dmsFolderIsMove = ref<boolean>(false);
+const entity = ref<DmsFileEntity>(new DmsFileEntity());
+const videoPlayModal = ref<boolean>(false);
+const videoSrc = ref<string>("");
+const videoType = ref<string>("");
+const {
+  children: items,
+  addChild: addItem,
+  removeChild: removeItem,
+} = useOrderedChildren<SearchCriteriaContext>();
+
+//================provide================
+//初始化查询条件UI
+provide(enquiryMethodKey, {
+  getLayoutSetting: () => {
+    return {
+      controlLeft: 16,
+      controlRight: 8,
+      space: true,
+      soltLeft: 24,
+      soltRight: 24,
+    };
+  },
+  getBindOptions: () => {
+    return unref(bindOptions);
+  },
+  getViewOption: () => {
+    return unref(viewOption);
+  },
+  getDatas: () => {
+    return datas;
+  },
+});
+
+provide(
+  searchCriteriaManagerKey,
+  reactive({
+    items,
+    addItem,
+    removeItem,
+  }),
+);
+
+// provide("bindOptions", bindOptions);
+provide("dmsFolderModal", dmsFolderModal);
+provide("dmsFolderTitle", dmsFolderTitle);
+provide("dmsFolderIsRename", dmsFolderIsRename);
+provide("dmsFolderIsMove", dmsFolderIsMove);
+provide("DmsFileEntity", entity);
+//控制按键多行显示，可以单列24或者多列
+//provide("layoutSetting", { controlLeft: 20, controlRight: 4, soltLeft: 8, soltRight: 8 });
+//space: true 控制按键单行显示
+// provide("layoutSetting", { controlLeft: 16, controlRight: 8, space: true });
+// provide("viewOption", viewOption);
+provide("videoPlayModal", videoPlayModal);
+provide("videoSrc", videoSrc);
+provide("videoType", videoType);
+//table数据源
+// provide("datas", datas);
+//================provide================
+
+defineExpose({
+  keys,
+});
+
+onMounted(async () => {
+  let pContext: PermissionContext = usePermissionContext();
+  canView.value = pContext.canView(route.meta.permission as string);
+  canAmend.value = pContext.canAmend(route.meta.permission as string);
+  canDelete.value = pContext.canDelete(route.meta.permission as string);
+  canCreate.value = pContext.canCreate(route.meta.permission as string);
+
+  await initBindOption();
+
+  onSearchByFilePath(rootPath.value);
+});
+
+const beforeUpload: UploadProps["beforeUpload"] = (file) => {
+  fileList.value = [...(fileList.value || []), file];
+  const chunks = splitFile(file);
+
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+  )[0];
+  currFilePath.value = headers.value.FilePath = bindOption.Value;
+  let i = 1;
+  let fileSize = file.size;
+  let uid: string = file.uid;
+
+  uploadChunk(chunks, file.name, uid, i);
+
+  return false;
+};
+
+const uploadChunk = async (
+  chunks: any,
+  fileName: string,
+  uid: string,
+  index: number,
+) => {
+  const formData = new FormData();
+
+  const fileExtension = fileName.split(".").pop();
+  formData.append(
+    fileName,
+    chunks[index - 1],
+    uid +
+      "-" +
+      index.toString() +
+      "-" +
+      chunks.length.toString() +
+      "." +
+      fileExtension,
+  );
+
+  if (process.env.NODE_ENV === "development") {
+    axios.defaults.baseURL = WebSitePolicy.WebApiRootDev;
+    axios.defaults.withCredentials = true;
+  } else {
+    axios.defaults.baseURL = WebSitePolicy.WebApiRoot;
+  }
+  try {
+    let response = await axios.create().request({
+      url: "/DmsFile/UploadFile",
+      method: "post",
+      data: formData,
+      headers: headers.value,
+    });
+
+    if (response.status == 200 && index < chunks.length) {
+      uploadChunk(chunks, fileName, uid, index + 1);
+    } else if (index == chunks.length) {
+      onReSearch();
+      loading.value = false;
+    }
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const CHUNK_SIZE = 512 * 1024; // 设置每个分片的大小为1MB
+
+const splitFile = (file: any) => {
+  const chunks = [];
+  let start = 0;
+  while (start < file.size) {
+    const end = Math.min(start + CHUNK_SIZE, file.size);
+    const chunk = file.slice(start, end);
+    chunks.push(chunk);
+    start += CHUNK_SIZE;
+  }
+  return chunks;
+};
+
+const onSelectChange = (selected: DmsFileUploadDeleteLogViewDisplayData[]) => {
+  keys.value = selected;
+};
+
+const onLastFolder = async () => {
+  if (!datas.value || datas.value.length == 0) {
+    onSearchByFilePath(previousFilePath.value);
+  } else {
+    onPreviousFolder();
+  }
+};
+
+const onPreviousFolder = async () => {
+  let filePath: string = "";
+  if (datas.value && datas.value.length > 0) filePath = datas.value[0].FilePath;
+  dmsFileService.FindFolderNameParentByFolderName(filePath).then((res) => {
+    if (res && res.length > 0) onSearchByFilePath(res);
+  });
+};
+
+const onChangeFolder = async (fvalue: string) => {
+  onSearchByFilePath(fvalue);
+};
+
+const onVideoPlay = async (fid: number) => {
+  videoType.value = "video/mp4";
+  videoPlayModal.value = true;
+  //从服务器取出
+  dmsFileService
+    .FindDeleteLogM3u8Path(fid)
+    .then((res) => {
+      videoSrc.value = res;
+    })
+    .catch(() => {
+      videoPlayModal.value = false;
+    });
+};
+
+const onPreviewFile = async (username: string, orderKey: string) => {
+  loading.value = true;
+  getPreviewFile(username, orderKey);
+};
+
+const getPreviewFile = (username: string, fname: string) => {
+  let dms: DmsFileEntity = new DmsFileEntity();
+  dms.CreatedBy = username;
+  dms.OrderKey = fname;
+  dmsFileService
+    .DownloadFilePreview(dms)
+    .then((res) => {
+      const downloadUrl = window.URL.createObjectURL(new Blob([res]));
+      imageSrc.value = downloadUrl;
+      loading.value = false;
+      setPicVisible(true);
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+
+const DownloadFileCombine = (
+  fs: string[],
+  mergedData: Uint8Array,
+  index: number,
+  ttl: number,
+  total: number,
+  preview: boolean,
+  fname: string,
+) => {
+  loading.value = true;
+  fs[fs.length - 2] = index.toString();
+  dmsFileService
+    .DownloadFileCombine(fs.toString().replace(/,/g, "-"))
+    .then((res) => {
+      mergedData.set(new Uint8Array(res), ttl);
+      if (index < total) {
+        DownloadFileCombine(
+          fs,
+          mergedData,
+          index + 1,
+          ttl + res.byteLength,
+          total,
+          preview,
+          fname,
+        );
+      } else if (index == total) {
+        loading.value = false;
+        const downloadUrl = window.URL.createObjectURL(new Blob([mergedData]));
+        imageSrc.value = downloadUrl;
+        if (!preview) {
+          const link = document.createElement("a");
+          link.href = downloadUrl;
+          link.setAttribute("download", fname);
+          document.body.appendChild(link);
+          link.click();
+        } else {
+          setPicVisible(true);
+        }
+      }
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+
+const onDownloadFile = async (fid: number, fname: string) => {
+  GetOrgPictureFile(fid, fname, false);
+};
+
+const GetOrgPictureFile = async (
+  fid: number,
+  fname: string,
+  preview: boolean,
+) => {
+  if (fileTypePolicy.isVideo(fname)) {
+    // onVideoPlay(keys.value[0].FileId);
+    return;
+  }
+
+  loading.value = true;
+
+  dmsFileService
+    .FindDmsFileDeleteLogByKey(fid)
+    .then((res) => {
+      let fs: string[] = res.OrderKey.replace("scale_", "").split("-");
+      let index: string = fs[fs.length - 2];
+      let total: string = fs[fs.length - 1].split(".")[0];
+      var mergedData = new Uint8Array((res.FileSize + 1) * 1024);
+      let ttl: number = 0;
+      fs[fs.length - 2] = "1";
+      DownloadFileCombine(
+        fs,
+        mergedData,
+        1,
+        ttl,
+        parseInt(total),
+        preview,
+        fname,
+      );
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+
+const onViewPictureFile = async (fid: number, fname: string) => {
+  GetOrgPictureFile(fid, fname, true);
+};
+
+const onSearchByFilePath = async (fvalue: string) => {
+  setBindOptionValue(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    fvalue,
+    "",
+    [fvalue],
+    false,
+  );
+  previousFilePath.value = unref(currFilePath.value);
+  currFilePath.value = fvalue;
+  isSearched.value = true;
+  if (currentSearchCriteria.value && fvalue && fvalue.length > 0) {
+    currentSearchCriteria.value.Filter = [];
+    let filter: SearchFilter;
+    filter = new SearchFilter();
+    filter.Column = DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH;
+    filter.Type = "SingleSelection";
+    filter.Operator = "single";
+    filter.Value = fvalue;
+    currentSearchCriteria.value.Filter.push(filter);
+  } else {
+    currentSearchCriteria.value.Filter = [];
+  }
+
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+
+const onReset = () => {
+  keys.value = [];
+  result.value.Total = 0;
+  setBindOptionValue(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    rootPath.value,
+    "",
+    [rootPath.value],
+    false,
+  );
+};
+
+const onUrlVideoPlay = (url: string, title: string) => {
+  videoType.value = "m3u8";
+  videoSrc.value = url;
+  videoPlayModal.value = true;
+};
+
+const onViewPic = () => {
+  if (keys.value.length == 0) return;
+
+  if (keys.value[0].IsDirectoryIndc == "Y") {
+    onChangeFolder(keys.value[0].FileName);
+  } else if (
+    keys.value[0].OrgFileName.toLowerCase().indexOf("png") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("jpg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("jpeg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("gif") > 0
+  ) {
+    onPreviewFile(keys.value[0].CreatedBy, keys.value[0].OrderKey);
+  } else if (
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mp4") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("rm") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mpeg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mov") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("wmv") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("avi") > 0
+  ) {
+    onVideoPlay(keys.value[0].FileId);
+  } else {
+    notification.info({
+      message: "系统提示：",
+      description: "未知格式无法预览",
+      placement: "topRight",
+    });
+  }
+};
+
+const visible = ref<boolean>(false);
+const setPicVisible = (value: boolean): void => {
+  visible.value = value;
+};
+
+const onDelete = async () => {
+  if (keys.value.length == 0) return;
+
+  for (let element of keys.value) {
+    await dmsFileService.DeleteLog(element.FileId);
+  }
+
+  notification.info({
+    message: "系统提示：",
+    description: "记录删除成功",
+    placement: "topRight",
+  });
+  onReload();
+};
+
+const onSave = () => {
+  isEdit.value = false;
+};
+
+const onCancel = () => {
+  isEdit.value = false;
+};
+
+const setBindOptionValue = (
+  bindValue: string,
+  value: string,
+  value1: string,
+  values: string[],
+  disabled: boolean,
+) => {
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == bindValue,
+  )[0];
+  if (!bindOption) return;
+  bindOption.Value = value;
+  bindOption.Value1 = value1;
+  bindOption.Values = values;
+  bindOption.disabled = disabled;
+};
+
+//初始化查询条件
+const initBindOption = async () => {
+  let ubo = useBindOption();
+  bindOptions.value = [];
+  bindOptions.value.splice(0, bindOptions.value.length);
+  let bindOption: BindOption = ubo.getBindOption(
+    DmsFileUploadDeleteLogViewDisplayData.DB_ORG_FILE_NAME,
+    "名称",
+    SearchFilterTypePolicy.TEXT,
+    SearchFilterOperatorPolicy.CONTAIN,
+  );
+  bindOptions.value.push(bindOption);
+
+  let rps: SelectOption[] = await dmsFileService.FindDmsFolderDeleteLogs();
+  if (rps && rps.length > 1) {
+    rootPath.value = currFilePath.value = rps[0].BindValue;
+  }
+
+  bindOption = ubo.getBindSelectOption(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    "当前目录",
+    SearchFilterTypePolicy.SINGLE_SELECTION,
+    SearchFilterOperatorPolicy.SINGLE,
+    rps,
+  );
+
+  bindOptions.value.push(bindOption);
+
+  bindOption = ubo.getBindOption(
+    DmsFileUploadDeleteLogViewDisplayData.DB_CREATED_DATETIME,
+    "创建日期",
+    SearchFilterTypePolicy.DATE,
+    SearchFilterOperatorPolicy.DATE_BETWEEN,
+  );
+  bindOptions.value.push(bindOption);
+
+  setBindOptionValue(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    currFilePath.value,
+    "",
+    [currFilePath.value],
+    false,
+  );
+};
+
+//table from-----------------------------------------------------------------------------------------------------------------------------------
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+const onSubmit = async (filters: SearchFilter[]) => {
+  loading.value = true;
+  let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+  currentFilter.value = filters;
+  isSearched.value = true;
+  c.Filter = filters;
+  c.limit = pagingParams.value.pageSize;
+  c.page = pagingParams.value.page ?? 1;
+  c.GridColumns = [];
+  currentSearchCriteria.value = c;
+
+  await findBySearchCriteria(c);
+};
+
+const onPrint = async () => {
+  loading.value = true;
+  let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+  if (currentFilter.value.length > 0) c.Filter = currentFilter.value;
+  else c.Filter = [];
+
+  c.limit = pagingParams.value.pageSize;
+  c.page = pagingParams.value.page ?? 1;
+  c.GridColumns = useGridColumnInfo().getGridColumnInfo(unref(columns));
+  c.ReportName = layoutProviderMethod?.getLayoutProvider().layoutTitle!;
+  try {
+    let sss = await dmsFileService.PrintBySearchCriteria(c);
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+const findBySearchCriteria = async (c: DmsFileSearchCriteria) => {
+  keys.value = [];
+  try {
+    if (c.limit == 0) c.limit = pagingParams.value.pageSize;
+    if (c.page == 0) c.page = pagingParams.value.page ?? 1;
+    data.value = await dmsFileService.FindDeleteLogBySearchCriteria(c);
+    result.value.Total = data.value.Total;
+    result.value.Page = data.value.Page;
+    result.value.Limit = data.value.Limit;
+    if (data.value.Logs)
+      data.value.Logs = orderBy(
+        data.value.Logs,
+        (x) => x.IsDirectoryIndc,
+        "desc",
+      );
+
+    datas.value = data.value.Logs;
+    loading.value = false;
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const onPagination = async (params: PagingParams) => {
+  try {
+    if (!isSearched.value) return;
+    let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+
+    if (currentFilter.value.length > 0) c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = params.pageSize;
+    c.page = params.page ?? 1;
+    if (params.sortField) c.orderby = params.sortField!;
+    if (params.sortOrder)
+      c.orderbytag = params.sortOrder?.toString().substring(0, 4)!;
+    c.GridColumns = [];
+    loading.value = true;
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const onReSearch = async () => {
+  setBindOptionValue(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    currFilePath.value,
+    "",
+    [currFilePath.value],
+    false,
+  );
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+
+const onReload = async () => {
+  await initBindOption();
+  setBindOptionValue(
+    DmsFileUploadDeleteLogViewDisplayData.DB_FILE_PATH,
+    currFilePath.value,
+    "",
+    [currFilePath.value],
+    false,
+  );
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+//table end-----------------------------------------------------------------------------------------------------------------------------------
+</script>
diff --git a/WebVue/src/views/master/DmsFileEnquiry.vue b/WebVue/src/views/master/DmsFileEnquiry.vue
index e8e30e5..cea6801 100644
--- a/WebVue/src/views/master/DmsFileEnquiry.vue
+++ b/WebVue/src/views/master/DmsFileEnquiry.vue
@@ -129,7 +129,7 @@
                   <ShareAltOutlined
                     style="color: rgb(19, 185, 190); font-size: larger"
                     title="内部分享"
-                    @click.prevent="onShareFamily()"
+                    @click.prevent="onShareFamily(record)"
                   />
                   <NotificationOutlined
                     style="color: rgb(19, 185, 190); font-size: larger"
@@ -193,7 +193,7 @@
                   <ShareAltOutlined
                     style="color: rgb(19, 185, 190); font-size: larger"
                     title="内部分享"
-                    @click.prevent="onShareFamily()"
+                    @click.prevent="onShareFamily(record)"
                   />
                   <NotificationOutlined
                     style="color: rgb(19, 185, 190); font-size: larger"
@@ -257,7 +257,7 @@
                 <ShareAltOutlined
                   style="color: rgb(19, 185, 190); font-size: larger"
                   title="内部分享"
-                  @click.prevent="onShareFamily()"
+                  @click.prevent="onShareFamily(record)"
                 />
                 <NotificationOutlined
                   style="color: rgb(19, 185, 190); font-size: larger"
@@ -455,7 +455,6 @@ import { notification } from "ant-design-vue";
 import { GridColumnInfo } from "@/data/auto/gridColumnInfo";
 import { useGridColumnInfo } from "@/hooks/gridColumnInfo";
 import dmsFolder from "./DmsFolderModal.vue";
-import videoPlay from "./VideoPlay.vue";
 
 import { useLoginProfileStore } from "@/store/modules/loginProfile";
 import type { UploadProps } from "ant-design-vue";
@@ -464,7 +463,7 @@ import { orderBy } from "lodash-es";
 import { bsInfo } from "@/utils/browser";
 import axios from "axios";
 import { getuid } from "process";
-import VideoPlay from "./VideoPlay.vue";
+import VideoPlay from "./PlayVideo.vue";
 import {
   enquiryMethodKey,
   searchCriteriaManagerKey,
@@ -503,6 +502,8 @@ if (bsInfo.size.sm) {
   widthColumn.value = "3%";
 }
 const showModalShare = ref<boolean>(false);
+// 点击「内部分享」时所在行的 record，供 handleSelectShare 使用
+const sharedFileRecord = ref<DmsFileUploadViewDisplayData | null>(null);
 const showModalPublishPhoto = ref<boolean>(false);
 const showModalPublishAudio = ref<boolean>(false);
 const showModalPublishVideo = ref<boolean>(false);
@@ -1016,7 +1017,8 @@ const onPublishVideo = async (fid: number) => {
   showModalPublishVideo.value = true;
 };
 
-const onShareFamily = async () => {
+const onShareFamily = async (record: Record<string, any>) => {
+  sharedFileRecord.value = toUploadView(record);
   showModalShare.value = true;
 };
 
@@ -1378,7 +1380,7 @@ const onReSearch = async () => {
 };
 
 const onReload = async () => {
-  let cfp:string=currFilePath.value;
+  let cfp: string = currFilePath.value;
   await initBindOption();
   setBindOptionValue(
     DmsFileUploadViewDisplayData.DB_FILE_PATH,
@@ -1400,8 +1402,8 @@ const handleSelectShare = async () => {
         fgp = new FamilyGroupFolderEntity();
         fgp.FamilyName = element.FamilyName;
         fgp.TopFolderName = element.TopFolderName;
-        fgp.FolderName = keys.value[0].FileName;
-        fgp.FolderLocalName = keys.value[0].OrgFileName;
+        fgp.FolderName = sharedFileRecord.value?.FileName ?? "";
+        fgp.FolderLocalName = sharedFileRecord.value?.OrgFileName ?? "";
         fgp.FilePath = element.FolderName;
 
         fgps.push(fgp);
diff --git a/WebVue/src/views/master/FamilyGroupEnquiry.vue b/WebVue/src/views/master/FamilyGroupEnquiry.vue
new file mode 100644
index 0000000..79fbce6
--- /dev/null
+++ b/WebVue/src/views/master/FamilyGroupEnquiry.vue
@@ -0,0 +1,412 @@
+<template>
+    <search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
+        :is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
+        @on-row-dblclick="onRowDblclick" @on-select-change="onSelectChange">
+        <template #control>
+            <a-button type="primary" v-if="canCreate && !isModal" :icon="h(FileAddOutlined)"
+                @click.prevent="onCreate">新增</a-button>
+        </template>
+        <template #bodyCell="{ column, record, index }">
+            <template v-if="column.dataIndex === FamilyGroupEntity.VALID_INDC">
+                <template v-if="record.ValidIndc == 'Y'">
+                    <span>是</span>
+                </template>
+                <template v-else> <span>否</span></template>
+            </template>
+        </template>
+        <template #footer>
+            <div v-if="!isModal" class="page-footer">
+                <a-row :gutter="24">
+                    <a-col :lg="24" :sm="24">
+                        <a-row v-if="isEdit" :gutter="[16, 8]">
+                            <a-space>
+                                <a-button type="primary" @click.prevent="onCancel">取消</a-button>
+                                <a-button type="primary" @click.prevent="onSave">确定</a-button>
+                            </a-space>
+                        </a-row>
+                        <a-row v-if="!isEdit" :gutter="[16, 8]">
+                            <a-space>
+                                <a-button type="primary" v-if="canView" :icon="h(FileTextOutlined)"
+                                    :disabled="!(keys && keys.length > 0)" @click.prevent="onView">查看</a-button>
+                                <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
+                                    :disabled="!(keys && keys.length > 0)" @click.prevent="onAmend">修改</a-button>
+                                <a-popconfirm title="确定是否解散这条记录?" ok-text="是" cancel-text="否" @confirm="onDelete">
+                                    <a-button type="primary" danger :icon="h(DeleteOutlined)" v-if="canDelete"
+                                        :disabled="!(keys && keys.length > 0)">解散</a-button>
+                                </a-popconfirm>
+                                <a-button type="primary" v-if="canView" :icon="h(FileTextOutlined)"
+                                    :disabled="!(keys && keys.length > 0)" @click.prevent="onRequest">申请加入</a-button>
+                            </a-space>
+                        </a-row>
+                    </a-col>
+                </a-row>
+            </div>
+        </template>
+    </search>
+    <dragModal v-model:open="showModalRequest" title="请输入申请原因" :fullscreen="width < 640" :mask-closable="false"
+        @ok="handleSelectRequest">
+        <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" required v-model:value="notice" />
+            </a-col>
+        </a-row>
+    </dragModal>
+</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 { FamilyGroupResultData } from "@/data/auto/familyGroupResultData";
+import { FamilyGroupEntity } from "@/data/auto/familyGroupEntity";
+import { SearchFilter } from "@/data/auto/searchFilter"
+import familyGroupService from "@/service/master/familyGroupService";
+import { FamilyGroupSearchCriteria } from "@/data/auto/familyGroupSearchCriteria";
+import { FamilyGroupManagerEntity } from "@/data/auto/familyGroupManagerEntity";
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
+import { useRoute, useRouter } from "vue-router";
+
+import { useBindOption } from "@/hooks/useBindOption";
+import { SearchFilterOperatorPolicy } from "@/data/custom/searchFilterOperatorPolicy"
+import { SearchFilterTypePolicy } from "@/data/custom/searchFilterTypePolicy"
+import { notification } from "ant-design-vue";
+import { GridColumnInfo } from "@/data/auto/gridColumnInfo"
+import { useGridColumnInfo } from "@/hooks/gridColumnInfo"
+import { title } from "process";
+import { useYesNoPolicy } from "@/hooks/useYesNoPolicy"
+import dragModal from "@/components/basic/DragModal.vue"
+import { enquiryMethodKey, searchCriteriaManagerKey, masterOperationToEnquiryMethodKey, MasterOperationToEnquiryModelOption, layoutProviderMethodKey } from "@/injections";
+import { useOrderedChildren } from "@/hooks/use-ordered-children";
+import { SearchCriteriaContext } from "@/injections";
+import { useWindowSize } from '@vueuse/core'
+
+//page from-----------------------------------------------------------------------------------------------------------------------------------
+//================inject================
+//报表名称
+const layoutProviderMethod = inject(layoutProviderMethodKey);
+
+//当前是弹出的Modal,还是Page
+const isModal = ref(inject("isModalFamilyGroup", false) as boolean);
+//初始化查询条件的值
+const initBindOptions = ref(inject("initBindOptionsFamilyGroup", []) as BindOption[]);
+//记录单选还是多选
+const selectionType = ref(inject("selectionTypeFamilyGroup", 'radio') as string);
+//================inject================
+
+const emit = defineEmits(['onRowDblclick']);
+const { width, height } = useWindowSize()
+const showModalRequest = ref<boolean>(false);
+const loading = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const canView = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const notice = ref<string>('');
+
+const route = useRoute();
+const router = useRouter();
+
+const columns = ref([
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: '5%',
+        align: 'center',
+        fixed: 'left',
+        sequence: 0,
+        hidden: 'N',
+        format: ''
+    },
+    {
+        title: "群组代码",
+        dataIndex: FamilyGroupEntity.FAMILY_NAME,
+        sorter: true,
+        fixed: 'left',
+        width: '10%',
+        sequence: 1,
+        hidden: 'N'
+    },
+    {
+        title: "群组名称",
+        dataIndex: FamilyGroupEntity.FAMILY_LOCAL_NAME,
+        sorter: true,
+        width: '20%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "群组描述",
+        dataIndex: FamilyGroupEntity.NOTICE,
+        sorter: true,
+        width: '35%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "创建日期",
+        dataIndex: FamilyGroupEntity.CREATED_DATETIME,
+        sorter: true,
+        width: '20%',
+        sequence: 3,
+        hidden: 'N'
+    },
+]);
+
+const viewOption = {
+    Value: 'default',
+    SelectOptions: [{ BindValue: 'default', DisplayName: "默认" }],
+    Columns: [{ BindValue: 'default', BindColumn: columns }]
+};
+
+
+
+const bindOptions = ref<BindOption[]>([]);
+const datas = ref<FamilyGroupEntity[]>([]);
+const pagingParams = ref<PagingParams>({ pageSize: 20, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+
+const data = ref<FamilyGroupResultData>(new FamilyGroupResultData());
+const currentFilter = ref<SearchFilter[]>([]);
+const isSearched = ref<boolean>(false);
+const currentSearchCriteria = ref<FamilyGroupSearchCriteria>(new FamilyGroupSearchCriteria());
+
+const keys = ref<FamilyGroupEntity[]>([]);
+const {
+    children: items,
+    addChild: addItem,
+    removeChild: removeItem,
+} = useOrderedChildren<SearchCriteriaContext>();
+
+//================provide================
+provide(enquiryMethodKey, {
+    getLayoutSetting: () => { return { controlLeft: 16, controlRight: 8, space: true, soltLeft: 24, soltRight: 24 }; },
+    getBindOptions: () => { return unref(bindOptions); },
+    getViewOption: () => { return unref(viewOption); },
+    getDatas: () => { return datas; },
+});
+
+provide(
+    searchCriteriaManagerKey,
+    reactive({
+        items,
+        addItem,
+        removeItem,
+    })
+);
+//================provide================
+
+defineExpose({
+    keys,
+    initBindOptions,
+})
+
+onMounted(() => {
+    let pContext: PermissionContext = usePermissionContext();
+    canView.value = pContext.canView(route.meta.permission as string);
+    canAmend.value = pContext.canAmend(route.meta.permission as string);
+    canDelete.value = pContext.canDelete(route.meta.permission as string);
+    canCreate.value = pContext.canCreate(route.meta.permission as string);
+    initBindOption();
+    onSubmit(items.value[0].getFilter());
+})
+
+const onRowDblclick = ((e: any, record: FamilyGroupEntity) => {
+    if (isModal.value) {
+        emit('onRowDblclick', record);
+    }
+    else {
+        router.push({ name: "FamilyGroupOperation", params: { id: record.FamilyName, mode: 'view' } });
+    }
+})
+
+const onSelectChange = ((selected: FamilyGroupEntity[]) => {
+    keys.value = selected;
+})
+
+const onReset = (() => {
+    keys.value = [];
+    result.value.Total = 0;
+})
+
+const onView = (() => {
+    if (keys.value.length == 0) return;
+    router.push({ name: "FamilyGroupOperation", params: { id: keys.value[0].FamilyName, mode: 'view' } });
+})
+
+const onCreate = (() => {
+    router.push({ name: "FamilyGroupOperation", params: { id: '', mode: 'create' } });
+})
+
+const onRequest = (() => {
+    if (keys.value.length == 0) return;
+    notice.value = '';
+    showModalRequest.value = true;
+})
+
+const handleSelectRequest = (() => {
+    let m: FamilyGroupManagerEntity = new FamilyGroupManagerEntity();
+    m.FamilyName = keys.value[0].FamilyName;
+    m.Notice = notice.value;
+    if (!m.Notice || m.Notice.length == 0) {
+        notification.info({
+            message: '系统提示：',
+            description: '请输入申请原因方便审核',
+            placement: "topRight",
+        });
+        return;
+    }
+    submitRequest(m);
+})
+
+const submitRequest = ((m: FamilyGroupManagerEntity) => {
+    familyGroupService.InsertFamilyGroupManager(m).then(() => {
+        showModalRequest.value = false;
+        notification.info({
+            message: '系统提示：',
+            description: '申请加入成功,请等待审核。',
+            placement: "topRight",
+        });
+    }
+    );
+})
+
+const onAmend = (() => {
+    if (keys.value.length == 0) return;
+    router.push({ name: "FamilyGroupOperation", params: { id: keys.value[0].FamilyName, mode: 'amend' } });
+})
+
+const onDelete = (async () => {
+    await familyGroupService.Delete(keys.value[0].FamilyName);
+
+    notification.info({
+        message: '系统提示：',
+        description: '记录删除成功',
+        placement: "topRight",
+    });
+
+    onReload();
+})
+
+const onSave = (() => {
+    isEdit.value = false;
+})
+
+const onCancel = (() => {
+    isEdit.value = false;
+})
+
+const setBindOptionValue = ((bindValue: string, value: string, value1: string, values: string[], disabled: boolean) => {
+    let bindOption: BindOption = bindOptions.value.filter(x => x.BindValue == bindValue)[0];
+    if (!bindOption) return;
+    bindOption.Value = value;
+    bindOption.Value1 = value1;
+    bindOption.Values = values;
+    bindOption.disabled = disabled;
+})
+
+
+
+//初始化查询条件
+const initBindOption = (async () => {
+    let ubo = useBindOption();
+    let bindOption: BindOption = ubo.getBindOption(FamilyGroupEntity.DB_FAMILY_NAME, '群组代码', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CONTAIN);
+    bindOptions.value.push(bindOption);
+
+    bindOption = ubo.getBindOption(FamilyGroupEntity.DB_FAMILY_LOCAL_NAME, '群组名称', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CONTAIN);
+    bindOption.lg = 10;
+    bindOptions.value.push(bindOption);
+
+    bindOption = ubo.getBindOption(FamilyGroupEntity.DB_CREATED_DATETIME, '创建日期', SearchFilterTypePolicy.DATE, SearchFilterOperatorPolicy.DATE_BETWEEN);
+    bindOptions.value.push(bindOption);
+
+    // let rps: SelectOption[] = await useYesNoPolicy().getSelectOption(true);
+    // bindOption = ubo.getBindSelectOption(FamilyGroupEntity.DB_VALID_INDC, '有效?', SearchFilterTypePolicy.SINGLE_SELECTION, SearchFilterOperatorPolicy.SINGLE, rps);
+    // bindOption.lg = 6;
+    // bindOption.Value = 'Y';
+    // bindOptions.value.push(bindOption);
+
+    initBindOptions.value.forEach(element => {
+        setBindOptionValue(element.BindValue, element.Value, element.Value1, element.Values, element.disabled);
+    });
+})
+
+//table from-----------------------------------------------------------------------------------------------------------------------------------
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+const onSubmit = (async (filters: SearchFilter[]) => {
+
+    let c: FamilyGroupSearchCriteria = new FamilyGroupSearchCriteria();
+    currentFilter.value = filters;
+    isSearched.value = true;
+    c.Filter = filters;
+    c.limit = pagingParams.value.pageSize;
+    c.page = pagingParams.value.page ?? 1;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+})
+
+const onPrint = (async () => {
+    let c: FamilyGroupSearchCriteria = new FamilyGroupSearchCriteria();
+    if (currentFilter.value.length > 0)
+        c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = pagingParams.value.pageSize;
+    c.page = pagingParams.value.page ?? 1;
+    c.GridColumns = useGridColumnInfo().getGridColumnInfo(unref(columns));
+    c.ReportName = layoutProviderMethod?.getLayoutProvider().layoutTitle!;
+    try {
+        let sss = await familyGroupService.PrintBySearchCriteria(c);
+    } catch (error) {
+        console.log(error);
+    }
+
+})
+
+const findBySearchCriteria = (async (c: FamilyGroupSearchCriteria) => {
+    try {
+        data.value = await familyGroupService.FindBySearchCriteria(c);
+        result.value.Total = data.value.Total;
+        result.value.Page = data.value.Page;
+        result.value.Limit = data.value.Limit;
+        datas.value = data.value.Datas;
+    } catch (error) {
+        console.log(error);
+    }
+})
+
+const onPagination = (async (params: PagingParams) => {
+
+    if (!isSearched.value) return;
+    let c: FamilyGroupSearchCriteria = new FamilyGroupSearchCriteria();
+
+    if (currentFilter.value.length > 0)
+        c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = params.pageSize;
+    c.page = params.page ?? 1;
+    if (params.sortField)
+        c.orderby = params.sortField!;
+    if (params.sortOrder)
+        c.orderbytag = params.sortOrder?.toString().substring(0, 4)!;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+});
+
+const onReload = (async () => {
+    await findBySearchCriteria(unref(currentSearchCriteria));
+})
+//table end-----------------------------------------------------------------------------------------------------------------------------------
+</script>
diff --git a/WebVue/src/views/master/FamilyGroupOperation.vue b/WebVue/src/views/master/FamilyGroupOperation.vue
new file mode 100644
index 0000000..0f661f0
--- /dev/null
+++ b/WebVue/src/views/master/FamilyGroupOperation.vue
@@ -0,0 +1,1063 @@
+<template>
+  <a-spin size="large" :spinning="loading">
+    <div class="page-container">
+      <div class="page-header">
+        <a-row :gutter="[16, 8]">
+          <a-col :lg="9" :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="familyName"
+                  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"
+                v-if="canCreate"
+                >新增</a-button
+              >
+            </a-space>
+          </a-col>
+        </a-row>
+      </div>
+      <div class="page-main" :style="{ height: resultH }">
+        <a-row :gutter="[16, 8]">
+          <a-col :lg="8" :sm="24">
+            <a-row :wrap="false" align="middle">
+              <a-col :lg="6" :sm="6" style="min-width: 80px">
+                <span>群组代码:</span>
+              </a-col>
+              <a-col :lg="18" :sm="18" style="min-width: 300px">
+                <a-input
+                  :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>
+
+        <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"
+              />
+            </template>
+          </a-collapse-panel>
+        </a-collapse>
+        <a-collapse v-model:activeKey="activeKey" v-if="data.IsManager">
+          <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
+                  "
+                >
+                  {{ datas.record.UserLocalName }}
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyGroupManagerDisplayData.NOTICE
+                  "
+                >
+                  {{ datas.record.Notice }}
+                </template>
+                <template
+                  v-else-if="datas.column.dataIndex === 'ok' && !isEdit"
+                >
+                  <CheckCircleTwoTone
+                    :style="{ fontSize: '24px', color: 'green' }"
+                    @click="
+                      okFamilyGroupRequest(
+                        datas.record.FamilyName,
+                        datas.record.UserName,
+                      )
+                    "
+                  />
+                </template>
+                <template
+                  v-else-if="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
+                  "
+                >
+                  {{ datas.record.UserLocalName }}
+                </template>
+                <template
+                  v-else-if="
+                    datas.column.dataIndex ===
+                    FamilyGroupManagerDisplayData.MANAGER_INDC
+                  "
+                >
+                  <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
+                  "
+                >
+                  {{ 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 class="page-footer">
+        <div style="">
+          <a-row :gutter="24">
+            <a-col :lg="24" :sm="24">
+              <div>
+                <a-row v-if="isEdit" :gutter="[16, 8]">
+                  <a-space>
+                    <a-popconfirm
+                      v-if="data.FamilyGroup.CreatedBy"
+                      title="确定是否取消修改?"
+                      ok-text="是"
+                      cancel-text="否"
+                      @confirm="onCancel"
+                    >
+                      <a-button type="primary" ghost :icon="h(UndoOutlined)"
+                        >取消</a-button
+                      >
+                    </a-popconfirm>
+                    <a-button
+                      v-if="!data.FamilyGroup.CreatedBy"
+                      type="primary"
+                      ghost
+                      :icon="h(UndoOutlined)"
+                      @click.prevent="onCancel"
+                      >取消</a-button
+                    >
+                    <a-button
+                      type="primary"
+                      ghost
+                      :icon="h(SaveOutlined)"
+                      @click.prevent="onSave"
+                      >保存</a-button
+                    >
+                  </a-space>
+                </a-row>
+                <a-row v-else :gutter="[16, 8]">
+                  <a-space>
+                    <a-button
+                      type="primary"
+                      v-if="canAmend && data.IsManager"
+                      :icon="h(EditOutlined)"
+                      :disabled="!hasData"
+                      @click.prevent="onAmend"
+                      >修改</a-button
+                    >
+                    <a-popconfirm
+                      :disabled="!hasData"
+                      title="确定是否解散这条记录?"
+                      ok-text="是"
+                      cancel-text="否"
+                      @confirm="onDelete"
+                    >
+                      <a-button
+                        type="primary"
+                        danger
+                        :icon="h(DeleteOutlined)"
+                        :disabled="!hasData"
+                        v-if="canDelete && data.IsManager"
+                        >解散</a-button
+                      >
+                    </a-popconfirm>
+                  </a-space>
+                </a-row>
+              </div>
+            </a-col>
+          </a-row>
+        </div>
+      </div>
+    </div>
+    <dragModal
+      v-model:open="showModal"
+      width="60%"
+      title="群组查询"
+      :mask-closable="false"
+      :fullscreen="width < 640"
+      @ok="handleSelect"
+    >
+      <familyGroupEnquiry
+        ref="enquiry"
+        @on-row-dblclick="handleSelect"
+      ></familyGroupEnquiry>
+    </dragModal>
+    <dragModal
+      v-model:open="showModalUser"
+      width="60%"
+      title="成员查询"
+      :mask-closable="false"
+      :fullscreen="width < 640"
+      @ok="handleSelectUser"
+    >
+      <familyGroupUserModal
+        ref="userEnquiry"
+        @on-row-dblclick="handleSelectUser"
+      ></familyGroupUserModal>
+    </dragModal>
+  </a-spin>
+</template>
+<script lang="ts" setup>
+import { ref, unref, onBeforeMount, inject, provide, h, onMounted } from "vue";
+import { notification } from "ant-design-vue";
+import { useRoute, useRouter } from "vue-router";
+import {
+  DeleteOutlined,
+  EditOutlined,
+  CheckCircleTwoTone,
+  CloseCircleOutlined,
+  ClearOutlined,
+  UserAddOutlined,
+  FileSearchOutlined,
+  FileAddOutlined,
+  UndoOutlined,
+  SaveOutlined,
+  PlusSquareTwoTone,
+  DownSquareTwoTone,
+  UpSquareTwoTone,
+} from "@ant-design/icons-vue";
+import {
+  PermissionContext,
+  usePermissionContext,
+} from "@/hooks/PermissionContext";
+import dragModal from "@/components/basic/DragModal.vue";
+import familyGroupEnquiry from "./FamilyGroupEnquiry.vue";
+import familyGroupUserModal from "./FamilyGroupUserModal.vue";
+import { FamilyGroupData } from "@/data/auto/familyGroupData";
+import { FamilyGroupFolderEntity } from "@/data/auto/familyGroupFolderEntity";
+import { FamilyGroupManagerEntity } from "@/data/auto/familyGroupManagerEntity";
+import { FamilyGroupPermissionEntity } from "@/data/auto/familyGroupPermissionEntity";
+import { FamilyGroupManagerUserViewEntity } from "@/data/auto/familyGroupManagerUserViewEntity";
+import { FamilyGroupManagerDisplayData } from "@/data/auto/familyGroupManagerDisplayData";
+import { FamilyGroupPermissionDisplayData } from "@/data/auto/familyGroupPermissionDisplayData";
+import { FamilyGroupFolderDisplayData } from "@/data/auto/familyGroupFolderDisplayData";
+import FamilyGroupService from "@/service/master/familyGroupService";
+import { useYesNoPolicy } from "@/hooks/useYesNoPolicy";
+import { SelectOption } from "@/data/auto/selectOption";
+import { useWindowSize } from "@vueuse/core";
+import { FamilyGroupEntity } from "@/data/auto/familyGroupEntity";
+import { BindOption } from "@/data/custom/bindOption";
+import { nextTick } from "process";
+import { max } from "lodash-es";
+import { SecurityUserDisplayData } from "@/data/auto/securityUserDisplayData";
+import dmsFileService from "@/service/master/dmsFileService";
+
+const loading = ref<boolean>(false);
+const { width, height } = useWindowSize();
+
+const route = useRoute();
+const router = useRouter();
+
+const familyName = ref<string>(route.params.id as string);
+const mode = ref<string>(route.params.mode as string);
+
+const isEdit = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const showModal = ref<boolean>(false);
+const showModalUser = ref<boolean>(false);
+
+const currentfolderName = ref<string>("");
+const rowSelectionType = ref<string>("radio");
+const showModalType = ref<number>(0);
+
+const data = ref<FamilyGroupData>(new FamilyGroupData());
+const hasData = ref<boolean>(false);
+
+const yesNoPolicy = ref<SelectOption[]>([]);
+const resultH = ref("");
+const oldFamilyName = ref<string>(familyName.value);
+const initBindOptions = ref<BindOption[]>([]);
+
+interface FamilyGroupEnquiry {
+  keys: FamilyGroupEntity[];
+  setBindOptionValue(
+    bindValue: string,
+    value: string,
+    value1: string,
+    values: string[],
+  ): void;
+}
+
+interface UserEnquiry {
+  keys: FamilyGroupManagerUserViewEntity[];
+  setBindOptionValue(
+    bindValue: string,
+    value: string,
+    value1: string,
+    values: string[],
+  ): void;
+}
+
+const enquiry = ref<FamilyGroupEnquiry | null>(null);
+const userEnquiry = ref<UserEnquiry | null>(null);
+
+const activeKey = ref(["1"]);
+
+const columnFamilyGroupFolders = ref([
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "10%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "目录名称",
+    dataIndex: FamilyGroupFolderEntity.FOLDER_LOCAL_NAME,
+    width: "30%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "目录描述",
+    dataIndex: FamilyGroupFolderEntity.NOTICE,
+    width: "40%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "分配权限",
+    dataIndex: "share",
+    width: "10%",
+    sequence: 3,
+    hidden: "N",
+  },
+  {
+    title: "",
+    dataIndex: "delete",
+    width: "10%",
+    sequence: 3,
+    hidden: "N",
+  },
+]);
+
+const columnFamilyGroupRequests = ref([
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "10%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "用户名",
+    dataIndex: FamilyGroupManagerDisplayData.USER_LOCAL_NAME,
+    width: "30%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "申请原因",
+    dataIndex: FamilyGroupManagerDisplayData.NOTICE,
+    width: "50%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "同意",
+    dataIndex: "ok",
+    width: "5%",
+    sequence: 3,
+    hidden: "N",
+  },
+  {
+    title: "拒绝",
+    dataIndex: "reject",
+    width: "5%",
+    sequence: 3,
+    hidden: "N",
+  },
+]);
+
+const columnFamilyGroupManagers = ref([
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "10%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "用户名",
+    dataIndex: FamilyGroupManagerDisplayData.USER_LOCAL_NAME,
+    width: "30%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "管理员",
+    dataIndex: FamilyGroupManagerDisplayData.MANAGER_INDC,
+    width: "20%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "",
+    dataIndex: "delete",
+    width: "5%",
+    sequence: 3,
+    hidden: "N",
+  },
+]);
+const columnFamilyGroupPermissions = ref([
+  {
+    title: "序号",
+    dataIndex: "index",
+    width: "10%",
+    align: "center",
+    fixed: "left",
+    sequence: 0,
+    hidden: "N",
+    format: "",
+  },
+  {
+    title: "目录名称",
+    dataIndex: FamilyGroupPermissionDisplayData.FOLDER_LOCAL_NAME,
+    width: "50%",
+    sequence: 2,
+    hidden: "N",
+  },
+  {
+    title: "用户名",
+    dataIndex: FamilyGroupPermissionDisplayData.USER_LOCAL_NAME,
+    width: "30%",
+    sequence: 1,
+    hidden: "N",
+  },
+  {
+    title: "",
+    dataIndex: "delete",
+    width: "5%",
+    sequence: 3,
+    hidden: "N",
+  },
+]);
+
+//================provide================
+//弹出(Modal)
+provide("isModalFamilyGroup", showModal);
+provide("isModalUser", showModalUser);
+//记录单选还是多选(Modal)
+provide("selectionTypeFamilyGroup", rowSelectionType);
+provide("selectionTypeUser", "checkbox");
+//初始化查询条件的值(Modal)
+provide("initBindOptionsFamilyGroup", initBindOptions);
+
+provide("currentFolderName", currentfolderName);
+provide("currentFamilyName", familyName);
+//================provide================
+
+onBeforeMount(async () => {
+  yesNoPolicy.value = await useYesNoPolicy().getSelectOption(false);
+});
+
+onMounted(() => {
+  let pContext: PermissionContext = usePermissionContext();
+  canAmend.value = pContext.canAmend(route.meta.permission as string);
+  canDelete.value = pContext.canDelete(route.meta.permission as string);
+  canCreate.value = pContext.canCreate(route.meta.permission as string);
+  computResultTableHeight();
+
+  if (familyName.value && familyName.value.trim().length > 0) {
+    onSearch();
+  }
+  if (mode.value && mode.value == "create") {
+    onCreate();
+    isEdit.value = true;
+  } else if (mode.value && mode.value == "amend") {
+    isEdit.value = true;
+  }
+});
+
+const computResultTableHeight = () => {
+  if (width.value > 640) {
+    resultH.value = "calc(100vh -  220px )";
+  } else {
+    resultH.value = "calc(100vh -  250px )";
+  }
+};
+
+const onModalSearch = () => {
+  showModal.value = true;
+  rowSelectionType.value = "radio";
+  showModalType.value = 0;
+};
+
+const onSearch = async () => {
+  if (!familyName.value || familyName.value.trim().length == 0) {
+    notification.info({
+      message: "系统提示：",
+      description: "请输入权限名称",
+      placement: "topRight",
+    });
+    hasData.value = false;
+    return;
+  }
+  try {
+    data.value = await FamilyGroupService.FindByKey(familyName.value.trim());
+  } catch (error) {
+    return;
+  }
+
+  if (data.value.FamilyGroup == null) {
+    notification.info({
+      message: "系统提示：",
+      description: "记录不存在",
+      placement: "topRight",
+    });
+    data.value = new FamilyGroupData();
+    hasData.value = false;
+    return;
+  }
+
+  hasData.value = true;
+};
+
+const onReset = () => {
+  data.value = new FamilyGroupData();
+  data.value.IsManager = false;
+  data.value.IsAdd = true;
+  data.value.IsOpen = true;
+  data.value.FamilyGroupFolders = [];
+
+  familyName.value = "";
+  hasData.value = false;
+};
+
+const onCreate = () => {
+  onReset();
+  isEdit.value = true;
+};
+
+const onAmend = () => {
+  isEdit.value = true;
+  oldFamilyName.value = unref(data.value.FamilyGroup.FamilyName);
+};
+
+const onSave = async () => {
+  try {
+    loading.value = true;
+
+    if (!data.value.FamilyGroupFolders) data.value.FamilyGroupFolders = [];
+    if (!data.value.FamilyGroupManagers) data.value.FamilyGroupManagers = [];
+    if (!data.value.FamilyGroupRequests) data.value.FamilyGroupRequests = [];
+    if (!data.value.FamilyGroupPermissions)
+      data.value.FamilyGroupPermissions = [];
+
+    if (data.value.FamilyGroup?.CreatedBy)
+      data.value = await FamilyGroupService.Update(data.value);
+    else {
+      data.value = await FamilyGroupService.Insert(data.value);
+    }
+
+    familyName.value = data.value.FamilyGroup.FamilyName;
+
+    loading.value = false;
+    hasData.value = true;
+    isEdit.value = false;
+  } catch (error) {
+    loading.value = false;
+  }
+};
+
+const onCancel = () => {
+  onReset();
+  if (oldFamilyName.value && oldFamilyName.value.length > 0) {
+    familyName.value = oldFamilyName.value;
+    onSearch();
+  }
+  isEdit.value = false;
+};
+
+const onDelete = async () => {
+  try {
+    loading.value = true;
+
+    await FamilyGroupService.Delete(data.value.FamilyGroup.FamilyName);
+
+    onReset();
+    loading.value = false;
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const deleteFamilyGroupManager = async (
+  familyName: string,
+  username: string,
+) => {
+  let f: FamilyGroupManagerEntity = new FamilyGroupManagerEntity();
+  f.FamilyName = familyName;
+  f.UserName = username;
+
+  await FamilyGroupService.DeleteFamilyGroupManager(f);
+  onSearch();
+};
+
+const deleteFamilyGroupPermission = (
+  familyName: string,
+  folderName: string,
+  username: string,
+) => {
+  data.value.FamilyGroupPermissions = data.value.FamilyGroupPermissions.filter(
+    (item) =>
+      !(
+        item.FamilyName == familyName &&
+        item.FolderName == folderName &&
+        item.UserName == username
+      ),
+  );
+};
+
+const addFamilyGroupFolder = (event: MouseEvent) => {
+  if (!data.value.FamilyGroupFolders) data.value.FamilyGroupFolders = [];
+  let fld: FamilyGroupFolderDisplayData = new FamilyGroupFolderDisplayData();
+  fld.FolderId = 1;
+  if (
+    data.value.FamilyGroupFolders &&
+    data.value.FamilyGroupFolders.length > 0
+  ) {
+    let maxs: number[] = [];
+    data.value.FamilyGroupFolders.forEach((element) => {
+      maxs.push(element.FolderId);
+    });
+    fld.FolderId = max(maxs)! + 1; //fld.FolderId=data.value.FamilyGroupFolders.max(x=>x.);
+  }
+
+  data.value.FamilyGroupFolders.push(fld);
+  // If you don't want click extra trigger collapse, you can prevent this:
+  event.stopPropagation();
+};
+
+const shareFamilyGroupPermission = (folderName: string) => {
+  currentfolderName.value = folderName;
+  showModalUser.value = true;
+};
+
+const deleteFamilyGroupFolder = (key: number, folderName: string) => {
+  if (key > 0) {
+    dmsFileService.FindDmsFolderMapByFolderName(folderName).then((count) => {
+      if (count > 0) {
+        notification.info({
+          message: "系统提示：",
+          description: "【群组中心】请先删除共享目录下的内容再删除该目录.",
+          placement: "topRight",
+        });
+      }
+    });
+  } else {
+    data.value.FamilyGroupFolders = data.value.FamilyGroupFolders.filter(
+      (item) => item.FolderId !== key,
+    );
+  }
+};
+
+const okFamilyGroupRequest = (familyName: string, username: string) => {
+  let f: FamilyGroupManagerEntity = new FamilyGroupManagerEntity();
+  f.FamilyName = familyName;
+  f.UserName = username;
+  f.ValidIndc = "Y";
+  FamilyGroupService.UpdateFamilyGroupManager(f).then(() => {
+    notification.info({
+      message: "系统提示：",
+      description: "审核成功通过",
+      placement: "topRight",
+    });
+    onSearch();
+  });
+};
+
+const rejectFamilyGroupRequest = (familyName: string, username: string) => {
+  let f: FamilyGroupManagerEntity = new FamilyGroupManagerEntity();
+  f.FamilyName = familyName;
+  f.UserName = username;
+  FamilyGroupService.DeleteFamilyGroupManager(f).then(() => {
+    notification.info({
+      message: "系统提示：",
+      description: "拒绝成功",
+      placement: "topRight",
+    });
+    onSearch();
+  });
+};
+
+const handleSelect = async () => {
+  if (enquiry.value) {
+    if (enquiry.value.keys.length > 0) {
+      //查询弹出
+      if (showModalType.value == 0) {
+        familyName.value = enquiry.value.keys[0].FamilyName;
+
+        onSearch();
+      }
+
+      showModal.value = false;
+    } else {
+      notification.info({
+        message: "系统提示：",
+        description: "请选择一条记录",
+        placement: "topRight",
+      });
+    }
+  }
+};
+
+const handleSelectUser = async () => {
+  if (userEnquiry.value) {
+    if (userEnquiry.value.keys.length > 0) {
+      //查询弹出
+      let fgps: FamilyGroupPermissionEntity[] = [];
+      let fgp: FamilyGroupPermissionEntity;
+      userEnquiry.value.keys.forEach((element) => {
+        fgp = new FamilyGroupPermissionEntity();
+        fgp.UserName = element.UserName;
+        fgp.FamilyName = familyName.value;
+        fgp.FolderName = currentfolderName.value;
+        fgps.push(fgp);
+      });
+
+      await FamilyGroupService.InsertFamilyGroupPermission(fgps);
+      showModalUser.value = false;
+
+      onSearch();
+    } else {
+      notification.info({
+        message: "系统提示：",
+        description: "请选择一条记录",
+        placement: "topRight",
+      });
+    }
+  }
+};
+</script>
+<style lang="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>
diff --git a/WebVue/src/views/master/FamilyGroupShare.vue b/WebVue/src/views/master/FamilyGroupShare.vue
new file mode 100644
index 0000000..1f9fc8e
--- /dev/null
+++ b/WebVue/src/views/master/FamilyGroupShare.vue
@@ -0,0 +1,1274 @@
+<template>
+  <a-spin size="large" :spinning="loading" :tip="spinTip">
+    <search
+      @on-submit="onSubmit"
+      @on-print="onPrint"
+      @on-reset="onReset"
+      @use-pagination="onPagination"
+      :scrollx="200"
+      @handle-change-bind-value="handleChangeBindValue"
+      :is-modal="isModal"
+      :loading="loading"
+      :pagination="result"
+      :rowSelectionType="selectionType"
+      @on-select-change="onSelectChange"
+    >
+      <template #control>
+        <a-button
+          type="primary"
+          v-if="canCreate && !isModal"
+          :icon="h(FolderAddOutlined)"
+          @click.prevent="onCreate"
+          >新增文件夹</a-button
+        >
+      </template>
+
+      <template #headerCell="{ column }">
+        <template v-if="column.dataIndex === FamilyDmsFileViewEntity.URL">
+          <span
+            style="color: darkgoldenrod; font-size: large; cursor: pointer"
+            @click.prevent="onChangeFolder(rootPath)"
+          >
+            <LaptopOutlined
+              style="color: darkgoldenrod; font-size: larger"
+              title="返回顶层"
+            />返回顶层
+          </span>
+          <span
+            style="color: darkgoldenrod; font-size: large; cursor: pointer"
+            @click.prevent="onLastFolder()"
+          >
+            <RollbackOutlined
+              style="color: darkgoldenrod; font-size: larger; margin-left: 16px"
+              title="返回上层"
+            />返回上层
+          </span>
+        </template>
+      </template>
+
+      <template #bodyCell="{ column, record, index }">
+        <template v-if="column.dataIndex === FamilyDmsFileViewEntity.URL">
+          <template v-if="!fileTypePolicy.isImage(record.OrderKey)">
+            <template v-if="record.IsDirectoryIndc == 'Y'">
+              <a-card hoverable style="width: 300px">
+                <a-card-meta>
+                  <template #description>
+                    <span
+                      style="
+                        color: darkgoldenrod;
+                        margin-left: 4pxr;
+                        cursor: pointer;
+                        font-size: 26px;
+                      "
+                      @click.prevent="onChangeFolder(record.FileName)"
+                    >
+                      <FolderOutlined
+                        style="color: darkgoldenrod; font-size: 48px"
+                        title="打开文件夹"
+                      />{{ record.OrgFileName }}
+                    </span>
+                  </template>
+                </a-card-meta>
+                <template #actions>
+                  <template v-if="record.PermissionIndc == 'Y'">
+                    <span style="font-size: 24px">
+                      <CheckCircleTwoTone
+                        style="color: darkgoldenrod; font-size: larger"
+                      />有权限
+                    </span>
+                  </template>
+                  <template v-if="record.PermissionIndc == 'N'">
+                    <span style="font-size: 24px">
+                      <CloseCircleOutlined
+                        style="color: rgb(19, 185, 190); font-size: larger"
+                      />无权限
+                    </span>
+                  </template>
+                  <template
+                    v-if="
+                      record.FavoriteIndc == 'Y' && record.PermissionIndc == 'Y'
+                    "
+                  >
+                    <span
+                      style="font-size: 24px; cursor: pointer; color: salmon"
+                      @click.prevent="
+                        onDeleteFamilyFolderFavorite(record.FolderName)
+                      "
+                    >
+                      <heart-two-tone
+                        two-tone-color="salmon"
+                        style="font-size: 24px"
+                      />已分享
+                    </span>
+                  </template>
+                  <template
+                    v-if="
+                      record.FavoriteIndc == 'N' && record.PermissionIndc == 'Y'
+                    "
+                  >
+                    <span
+                      style="font-size: 24px; cursor: pointer"
+                      @click.prevent="
+                        onInsertFamilyFolderFavorite(record.FolderName)
+                      "
+                    >
+                      <LoginOutlined
+                        two-tone-color="#0010"
+                        style="font-size: 24px"
+                      />未分享
+                    </span>
+                  </template>
+                  <template v-if="record.PermissionIndc == 'N'">
+                    <span style="font-size: 24px">
+                      <LoginOutlined
+                        two-tone-color="green"
+                        style="font-size: 24px"
+                      />不能分享
+                    </span>
+                  </template>
+                </template>
+              </a-card>
+            </template>
+            <template v-else-if="fileTypePolicy.isVideo(record.OrderKey)">
+              <a-card style="width: 300px">
+                <template #cover>
+                  <img
+                    style="height: 220px"
+                    :src="record.Url.replace('.m3u8', '.png')"
+                    :title="record.OrgFileName"
+                  />
+                </template>
+                <a-card-meta>
+                  <template #description>
+                    <a-flex>
+                      <cust-icon-font
+                        size="26"
+                        type="icon-foldervideo"
+                        @click.prevent="
+                          onUrlVideoPlay(record.Url, record.OrgFileName)
+                        "
+                      />
+                      <span
+                        style="
+                          color: darkgoldenrod;
+                          margin-left: 4pxr;
+                          margin-top: 2px;
+                        "
+                      >
+                        {{ record.OrgFileName }}
+                      </span>
+                      <cust-icon-font
+                        size="26"
+                        type="icon-mp3-play"
+                        @click.prevent="onVideoPlay(record.FileId)"
+                      />
+                    </a-flex>
+                  </template>
+                </a-card-meta>
+              </a-card>
+            </template>
+            <template v-else-if="fileTypePolicy.isAudio(record.OrderKey)">
+              <a-card hoverable style="width: 300px">
+                <a-flex>
+                  <cust-icon-font
+                    size="60"
+                    type="icon-foldermp3"
+                    @click.prevent="onPlayAudio(toFamilyView(record))"
+                  />
+                  <span
+                    style="
+                      color: darkgoldenrod;
+                      margin-left: 4pxr;
+                      margin-top: 10px;
+                    "
+                  >
+                    {{ record.OrgFileName }}
+                  </span>
+                  <div
+                    v-if="record.IsPlay == 'Y'"
+                    style="margin-left: 16px; height: 60px; width: 60px"
+                    :class="record.IsPause == '' ? 'rotating-element' : ''"
+                  >
+                    <cust-icon-font
+                      size="60"
+                      type="icon-playmp3"
+                      v-if="record.IsPause == ''"
+                      @click.prevent="onPauseAudio(toFamilyView(record))"
+                    />
+                    <cust-icon-font
+                      size="54"
+                      type="icon-mp3-play"
+                      style="color: #ff7878"
+                      v-if="record.IsPlay == 'Y' && record.IsPause == 'Y'"
+                      @click.prevent="onContinueAudio(toFamilyView(record))"
+                    />
+                  </div>
+                </a-flex>
+              </a-card>
+            </template>
+            <template v-else>
+              <DownloadOutlined
+                style="
+                  color: rgb(19, 185, 190);
+                  font-size: larger;
+                  margin-right: 12px;
+                "
+                title="下载"
+                @click.prevent="
+                  onDownloadFile(record.FileId, record.OrgFileName)
+                "
+              />
+              <span>{{ record.OrgFileName }} </span>
+            </template>
+          </template>
+          <template v-else>
+            <a-card hoverable style="width: 300px">
+              <template #cover>
+                <img
+                  style="height: 260px; object-fit: cover"
+                  :src="record.Url"
+                  :title="record.OrgFileName"
+                  @click="onPreviewFile(record.CreatedBy, record.OrderKey)"
+                />
+              </template>
+              <a-card-meta>
+                <template #description>
+                  <span
+                    style="color: darkgoldenrod; margin-left: 4pxr"
+                    @click.prevent="
+                      onViewPictureFile(record.FileId, record.OrgFileName)
+                    "
+                  >
+                    <cust-icon-font size="26" type="icon-source-pic" />
+                    {{ record.OrgFileName }}
+                  </span>
+                </template>
+              </a-card-meta>
+            </a-card>
+          </template>
+        </template>
+      </template>
+
+      <template #footer>
+        <div v-if="!isModal" class="page-footer">
+          <a-row :gutter="24">
+            <a-col :lg="24" :sm="24">
+              <a-row v-if="!isEdit" :gutter="[16, 8]">
+                <a-space>
+                  <a-button
+                    type="primary"
+                    v-if="canAmend"
+                    :icon="h(FileImageOutlined)"
+                    :disabled="!(keys && keys.length > 0)"
+                    @click.prevent="onViewPic"
+                    >预览</a-button
+                  >
+                  <a-popconfirm
+                    :disabled="
+                      !(
+                        keys &&
+                        keys.length > 0 &&
+                        keys[0].PermissionIndc == 'Y'
+                      )
+                    "
+                    title="确定是否删除这条记录?"
+                    ok-text="是"
+                    cancel-text="否"
+                    @confirm="onDelete"
+                  >
+                    <a-button
+                      type="primary"
+                      danger
+                      :icon="h(DeleteOutlined)"
+                      :disabled="
+                        !(
+                          keys &&
+                          keys.length > 0 &&
+                          keys[0].PermissionIndc == 'Y'
+                        )
+                      "
+                      v-if="canDelete"
+                      >删除</a-button
+                    >
+                  </a-popconfirm>
+                </a-space>
+              </a-row>
+            </a-col>
+          </a-row>
+        </div>
+      </template>
+    </search>
+    <a-image
+      :width="1024"
+      :style="{ display: 'none' }"
+      :preview="{
+        visible,
+        onVisibleChange: setPicVisible,
+      }"
+      :src="imageSrc"
+    />
+    <dmsFolder @on-submit="onReload"></dmsFolder>
+    <videoPlay></videoPlay>
+  </a-spin>
+</template>
+
+<script setup lang="ts">
+import {
+  reactive,
+  inject,
+  onUnmounted,
+  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,
+  LoginOutlined,
+  LaptopOutlined,
+  CheckCircleTwoTone,
+  RollbackOutlined,
+  CheckSquareTwoTone,
+  NotificationOutlined,
+  PictureOutlined,
+  HeartTwoTone,
+  CloseCircleOutlined,
+  FolderAddOutlined,
+  DownloadOutlined,
+  FolderOutlined,
+  FileImageOutlined,
+  CrownOutlined,
+} from "@ant-design/icons-vue";
+import { DmsFileEntity } from "@/data/auto/dmsFileEntity";
+import { DmsFileResultData } from "@/data/auto/dmsFileResultData";
+import { FamilyGroupFolderEntity } from "@/data/auto/familyGroupFolderEntity";
+import { FamilyDmsFileViewEntity } from "@/data/auto/familyDmsFileViewEntity";
+import { SearchFilter } from "@/data/auto/searchFilter";
+import dmsFileService from "@/service/master/dmsFileService";
+import { DmsFileSearchCriteria } from "@/data/auto/dmsFileSearchCriteria";
+import FamilyGroupService from "@/service/master/familyGroupService";
+import publishPhotoService from "@/service/master/publishPhotoService";
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+import {
+  PermissionContext,
+  usePermissionContext,
+} from "@/hooks/PermissionContext";
+import { useRoute, useRouter } from "vue-router";
+
+import { useBindOption } from "@/hooks/useBindOption";
+import { SearchFilterOperatorPolicy } from "@/data/custom/searchFilterOperatorPolicy";
+import { SearchFilterTypePolicy } from "@/data/custom/searchFilterTypePolicy";
+import { notification } from "ant-design-vue";
+import { GridColumnInfo } from "@/data/auto/gridColumnInfo";
+import { useGridColumnInfo } from "@/hooks/gridColumnInfo";
+import dmsFolder from "./DmsFolderModal.vue";
+
+import { useLoginProfileStore } from "@/store/modules/loginProfile";
+import type { UploadProps } from "ant-design-vue";
+import { WebSitePolicy } from "@/policy/custom/webSitePolicy";
+import { forEach, orderBy } from "lodash-es";
+import { bsInfo } from "@/utils/browser";
+import axios from "axios";
+import { getuid } from "process";
+import VideoPlay from "./PlayVideo.vue";
+import {
+  enquiryMethodKey,
+  searchCriteriaManagerKey,
+  masterOperationToEnquiryMethodKey,
+  MasterOperationToEnquiryModelOption,
+  layoutProviderMethodKey,
+} from "@/injections";
+import { useOrderedChildren } from "@/hooks/use-ordered-children";
+import { SearchCriteriaContext } from "@/injections";
+import fileTypePolicy from "@/policy/custom/fileTypePolicy";
+import { Howl, Howler } from "howler";
+import { FamilyDmsFileViewDisplayData } from "@/data/auto/familyDmsFileViewDisplayData";
+
+//page from-----------------------------------------------------------------------------------------------------------------------------------
+//================inject================
+//报表名称
+const layoutProviderMethod = inject(layoutProviderMethodKey);
+
+//当前是弹出的Modal,还是Page
+const isModal = ref(inject("isModalFamilyDmsFile", false) as boolean);
+//初始化查询条件的值
+const initBindOptions = ref(
+  inject("initBindOptionsFamilyDmsFile", []) as BindOption[],
+);
+//记录单选还是多选
+const selectionType = ref(
+  inject("selectionTypeFamilyDmsFile", "radio") as string,
+);
+
+//================inject================
+
+const widthColumn = ref<string>("3%");
+if (bsInfo.size.sm) {
+  widthColumn.value = "8%";
+} else {
+  widthColumn.value = "3%";
+}
+const spinTip = ref<string>("加載中...");
+const loading = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const canView = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const modalTitle = ref<string>("新增文件夹");
+const rootPath = ref<string>("");
+const imageSrc = ref<string>("");
+const route = useRoute();
+const router = useRouter();
+
+const fileList = ref<UploadProps["fileList"]>([]);
+const uploadUrl = ref<string>(WebSitePolicy.WebApiRoot + "DmsFile/UploadFile");
+if (process.env.NODE_ENV === "development") {
+  uploadUrl.value = WebSitePolicy.WebApiRootDev + "/DmsFile/UploadFile";
+} else {
+  uploadUrl.value = WebSitePolicy.WebApiRoot + "/DmsFile/UploadFile";
+}
+const previousFilePath = ref<string>("");
+const currFilePath = ref<string>("");
+const headers = ref({
+  Authorization: useLoginProfileStore().getToken(),
+  "Content-Type": "multipart/form-data",
+  FilePath: currFilePath.value,
+});
+
+const columns = ref([
+  {
+    title: "",
+    dataIndex: FamilyDmsFileViewEntity.URL,
+    sorter: false,
+    width: "50%",
+    sequence: 1,
+    hidden: "N",
+  },
+]);
+
+const viewOption = {
+  Value: "default",
+  SelectOptions: [{ BindValue: "default", DisplayName: "默认" }],
+  Columns: [{ BindValue: "default", BindColumn: columns }],
+};
+
+const bindOptions = ref<BindOption[]>([]);
+const datas = ref<FamilyDmsFileViewDisplayData[]>([]);
+const pagingParams = ref<PagingParams>({ pageSize: 20, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+
+const data = ref<DmsFileResultData>(new DmsFileResultData());
+const currentFilter = ref<SearchFilter[]>([]);
+const isSearched = ref<boolean>(false);
+const currentSearchCriteria = ref<DmsFileSearchCriteria>(
+  new DmsFileSearchCriteria(),
+);
+
+const keys = ref<FamilyDmsFileViewDisplayData[]>([]);
+const dmsFolderModal = ref<boolean>(false);
+const dmsFolderTitle = ref<string>("新增文件夹");
+const dmsFolderIsRename = ref<boolean>(false);
+const dmsFolderIsMove = ref<boolean>(false);
+const entity = ref<DmsFileEntity>(new DmsFileEntity());
+const videoPlayModal = ref<boolean>(false);
+const videoSrc = ref<string>("");
+const videoType = ref<string>("");
+const videoPlayTitle = ref<string>("");
+const currentFamilyName = ref<string>("");
+
+const {
+  children: items,
+  addChild: addItem,
+  removeChild: removeItem,
+} = useOrderedChildren<SearchCriteriaContext>();
+
+//================provide================
+//初始化查询条件UI
+
+provide("dmsFolderModal", dmsFolderModal);
+provide("dmsFolderTitle", dmsFolderTitle);
+provide("dmsFolderIsRename", dmsFolderIsRename);
+provide("dmsFolderIsMove", dmsFolderIsMove);
+provide("dmsFolderIsFamilyGroup", true);
+provide("dmsFolderFamilyName", currentFamilyName);
+provide("DmsFileEntity", entity);
+
+provide("videoPlayModal", videoPlayModal);
+provide("videoPlayTitle", videoPlayTitle);
+provide("videoSrc", videoSrc);
+provide("videoType", videoType);
+provide(enquiryMethodKey, {
+  getLayoutSetting: () => {
+    return {
+      controlLeft: 16,
+      controlRight: 8,
+      space: true,
+      soltLeft: 24,
+      soltRight: 24,
+    };
+  },
+  getBindOptions: () => {
+    return unref(bindOptions);
+  },
+  getViewOption: () => {
+    return unref(viewOption);
+  },
+  getDatas: () => {
+    return datas;
+  },
+});
+
+provide(
+  searchCriteriaManagerKey,
+  reactive({
+    items,
+    addItem,
+    removeItem,
+  }),
+);
+//================provide================
+
+const sound = ref();
+
+// 表格 bodyCell 的 record 被透传为 Record<string, any>，转成具体展示类型
+const toFamilyView = (r: Record<string, any>): FamilyDmsFileViewDisplayData =>
+  r as FamilyDmsFileViewDisplayData;
+
+onUnmounted(() => {
+  sound.value?.stop();
+});
+
+const play = (src: string) => {
+  sound.value?.stop();
+  if (!src || src == undefined || src == "") {
+    return;
+  }
+
+  sound.value = new Howl({
+    src: src,
+    volume: 0.5,
+    autoplay: true,
+    loop: false,
+    html5: true,
+    preload: true,
+    onload: () => {
+      // console.log('loaded');
+    },
+    onplay: () => {
+      // console.log('play');
+    },
+    onpause: () => {
+      // console.log('pause');
+    },
+    onend: () => {
+      // console.log('end');
+      datas.value.forEach((element) => {
+        element.IsPlay = "";
+      });
+    },
+  });
+
+  sound.value.play();
+};
+
+const onPauseAudio = (record: FamilyDmsFileViewDisplayData) => {
+  record.IsPause = "Y";
+  sound.value.pause();
+};
+
+const onContinueAudio = (record: FamilyDmsFileViewDisplayData) => {
+  record.IsPause = "";
+  sound.value.play();
+};
+
+const onPlayAudio = (record: FamilyDmsFileViewDisplayData) => {
+  datas.value.forEach((element) => {
+    if (element.FileId == record.FileId && element.IsPlay == "Y") {
+      element.IsPlay = "";
+    } else if (
+      element.FileId == record.FileId &&
+      (element.IsPlay == "" ||
+        element.IsPlay == null ||
+        element.IsPlay == undefined)
+    ) {
+      element.IsPlay = "Y";
+    } else {
+      element.IsPlay = "";
+    }
+    record.IsPause = "";
+  });
+
+  if (record.IsPlay == "") {
+    sound.value?.stop();
+    return;
+  }
+
+  play(record.Url);
+};
+
+defineExpose({
+  keys,
+  initBindOptions,
+});
+
+onMounted(async () => {
+  let pContext: PermissionContext = usePermissionContext();
+  canView.value = pContext.canView(route.meta.permission as string);
+  canAmend.value = pContext.canAmend(route.meta.permission as string);
+  canDelete.value = pContext.canDelete(route.meta.permission as string);
+  canCreate.value = pContext.canCreate(route.meta.permission as string);
+
+  await initBindOption("");
+
+  onSearchByFilePath(rootPath.value);
+});
+
+const onViewPreview = async () => {
+  router.push({
+    name: "Previews",
+    params: { id: currentFamilyName.value, mode: "view" },
+  });
+};
+
+const onSelectChange = (selected: FamilyDmsFileViewDisplayData[]) => {
+  keys.value = selected;
+};
+
+const onPoublicFile = async (fid: number) => {
+  // publishPhotoService.InsertPublishPhotoDetailByFamilyGroup(fid).then(() => {
+  //     notification.info({
+  //         message: '系统提示：',
+  //         description: '图片已发布',
+  //         placement: "topRight",
+  //     });
+  // });
+};
+
+const onChangeFolder = async (fvalue: string) => {
+  onSearchByFilePath(fvalue);
+};
+
+const onLastFolder = async () => {
+  if (!datas.value || datas.value.length == 0) {
+    onSearchByFilePath(previousFilePath.value);
+  } else {
+    onPreviousFolder();
+  }
+};
+
+const onPreviousFolder = async () => {
+  let filePath: string = "";
+  if (datas.value && datas.value.length > 0) filePath = datas.value[0].FilePath;
+  dmsFileService.FindFolderNameParentByFolderName(filePath).then((res) => {
+    if (res && res.length > 0) onSearchByFilePath(res);
+  });
+};
+
+const onVideoPlay = async (fid: number) => {
+  //从服务器取出源视频
+  dmsFileService
+    .FindSourceVideoPath(fid)
+    .then((res) => {
+      videoType.value = "video/mp4";
+      videoSrc.value = res;
+      videoPlayModal.value = true;
+    })
+    .catch(() => {
+      videoPlayModal.value = false;
+    });
+};
+
+const DownloadFileCombine = (
+  fs: string[],
+  mergedData: Uint8Array,
+  index: number,
+  ttl: number,
+  total: number,
+  preview: boolean,
+  fname: string,
+) => {
+  loading.value = true;
+  fs[fs.length - 2] = index.toString();
+  spinTip.value = "加载中(" + index + "/" + total + ")...";
+  dmsFileService
+    .DownloadFileCombine(fs.toString().replace(/,/g, "-"))
+    .then((res) => {
+      mergedData.set(new Uint8Array(res), ttl);
+      if (index < total) {
+        DownloadFileCombine(
+          fs,
+          mergedData,
+          index + 1,
+          ttl + res.byteLength,
+          total,
+          preview,
+          fname,
+        );
+      } else if (index == total) {
+        loading.value = false;
+        spinTip.value = "加载中...";
+        const downloadUrl = window.URL.createObjectURL(new Blob([mergedData]));
+        imageSrc.value = downloadUrl;
+        if (!preview) {
+          const link = document.createElement("a");
+          link.href = downloadUrl;
+          link.setAttribute("download", fname);
+          document.body.appendChild(link);
+          link.click();
+        } else {
+          setPicVisible(true);
+        }
+      }
+    })
+    .catch(() => {
+      spinTip.value = "加载中...";
+      loading.value = false;
+    });
+};
+
+const onDownloadFile = async (fid: number, fname: string) => {
+  GetOrgPictureFile(fid, fname, false);
+};
+
+const onPreviewFile = async (username: string, orderKey: string) => {
+  loading.value = true;
+  getPreviewFile(username, orderKey);
+};
+
+const getPreviewFile = (username: string, fname: string) => {
+  let dms: DmsFileEntity = new DmsFileEntity();
+  dms.CreatedBy = username;
+  dms.OrderKey = fname;
+  dmsFileService
+    .DownloadFilePreview(dms)
+    .then((res) => {
+      const downloadUrl = window.URL.createObjectURL(new Blob([res]));
+      imageSrc.value = downloadUrl;
+      loading.value = false;
+      setPicVisible(true);
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+
+const GetOrgPictureFile = async (
+  fid: number,
+  fname: string,
+  preview: boolean,
+) => {
+  if (fileTypePolicy.isVideo(fname)) {
+    onVideoPlay(keys.value[0].FileId);
+    return;
+  }
+  if (preview && !fileTypePolicy.isImage(fname)) {
+    onPreviewFile(keys.value[0].CreatedBy, keys.value[0].OrderKey);
+    return;
+  }
+
+  loading.value = true;
+  dmsFileService
+    .FindByKey(fid)
+    .then((res) => {
+      let fs: string[] = res.OrderKey.split("-");
+      let index: string = fs[fs.length - 2];
+      let total: string = fs[fs.length - 1].split(".")[0];
+      var mergedData = new Uint8Array((res.FileSize + 1) * 1024);
+      let ttl: number = 0;
+      fs[fs.length - 2] = "1";
+      spinTip.value = "加载中(1/" + total + ")...";
+      DownloadFileCombine(
+        fs,
+        mergedData,
+        1,
+        ttl,
+        parseInt(total),
+        preview,
+        fname,
+      );
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+
+const onUrlVideoPlay = (url: string, title: string) => {
+  sound.value?.stop();
+  datas.value.forEach((element) => {
+    element.IsPlay = "";
+  });
+  videoType.value = "m3u8";
+  videoSrc.value = url;
+  videoPlayModal.value = true;
+  videoPlayTitle.value = title;
+};
+
+const onViewPictureFile = async (fid: number, fname: string) => {
+  GetOrgPictureFile(fid, fname, true);
+};
+
+const onDeleteFamilyFolderFavorite = async (folderName: string) => {
+  FamilyGroupService.DeleteFamilyFolderFavorite(folderName).then(() => {
+    notification.info({
+      message: "系统提示：",
+      description: "收藏分享成功移除",
+      placement: "topRight",
+    });
+    onReload();
+  });
+};
+
+const onInsertFamilyFolderFavorite = async (folderName: string) => {
+  FamilyGroupService.InsertFamilyFolderFavorite(folderName).then(() => {
+    notification.info({
+      message: "系统提示：",
+      description: "收藏分享成功加入",
+      placement: "topRight",
+    });
+    onReload();
+  });
+};
+
+const onSearchByFilePath = async (fvalue: string) => {
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FILE_PATH,
+    fvalue,
+    "",
+    [fvalue],
+    false,
+  );
+  previousFilePath.value = unref(currFilePath.value);
+  currFilePath.value = fvalue;
+
+  currentSearchCriteria.value.Filter = [];
+  let filter: SearchFilter;
+  filter = new SearchFilter();
+  filter.Column = FamilyDmsFileViewEntity.DB_FAMILY_NAME;
+  filter.Type = "SingleSelection";
+  filter.Operator = "single";
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+  )[0];
+  filter.Value = bindOption.Value;
+
+  currentSearchCriteria.value.Filter.push(filter);
+  filter = new SearchFilter();
+  filter.Column = FamilyDmsFileViewEntity.DB_FILE_PATH;
+  filter.Type = "SingleSelection";
+  filter.Operator = "single";
+  filter.Value = fvalue;
+  currentSearchCriteria.value.Filter.push(filter);
+
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+
+const onReset = () => {
+  keys.value = [];
+  result.value.Total = 0;
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+    currentFamilyName.value,
+    "",
+    [currentFamilyName.value],
+    false,
+  );
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FILE_PATH,
+    currentFamilyName.value,
+    "",
+    [currentFamilyName.value],
+    false,
+  );
+};
+
+const onViewPic = () => {
+  if (keys.value.length == 0) return;
+  if (keys.value[0].IsDirectoryIndc == "Y") {
+    onChangeFolder(keys.value[0].FileName);
+  } else if (
+    keys.value[0].OrgFileName.toLowerCase().indexOf("png") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("jpg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("jpeg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("gif") > 0
+  ) {
+    onPreviewFile(keys.value[0].CreatedBy, keys.value[0].OrderKey);
+  } else if (
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mp4") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mp3") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("rm") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mpeg") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("mov") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("wmv") > 0 ||
+    keys.value[0].OrgFileName.toLowerCase().indexOf("avi") > 0
+  ) {
+    onVideoPlay(keys.value[0].FileId);
+  } else {
+    notification.info({
+      message: "系统提示：",
+      description: "未知格式无法预览",
+      placement: "topRight",
+    });
+  }
+};
+
+const visible = ref<boolean>(false);
+const setPicVisible = (value: boolean): void => {
+  visible.value = value;
+};
+
+const onCreate = () => {
+  if (currFilePath.value == currentFamilyName.value) {
+    notification.info({
+      message: "系统提示：",
+      description: "群组一级目录,请在群组管理创建.",
+      placement: "topRight",
+    });
+    return;
+  }
+
+  dmsFolderTitle.value = "新增文件夹";
+  dmsFolderIsRename.value = false;
+  dmsFolderIsMove.value = false;
+  dmsFolderModal.value = true;
+
+  entity.value = new DmsFileEntity();
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == FamilyDmsFileViewEntity.DB_FILE_PATH,
+  )[0];
+
+  entity.value.FilePath = bindOption.SelectOptions.filter(
+    (x) => x.BindValue == bindOption.Value,
+  )[0].DisplayName;
+  entity.value.OrgFileName = bindOption.Value;
+
+  previousFilePath.value = unref(currFilePath.value);
+  currFilePath.value = bindOption.Value;
+};
+
+const onDelete = async () => {
+  let fgfs: FamilyGroupFolderEntity[] = [];
+  let fgf: FamilyGroupFolderEntity;
+  keys.value.forEach((element) => {
+    fgf = new FamilyGroupFolderEntity();
+    fgf.FamilyName = element.FamilyName;
+    fgf.FolderName = keys.value[0].FolderName;
+    fgf.TopFolderName = element.TopFolderName;
+    fgf.FilePath = element.FilePath;
+    fgfs.push(fgf);
+  });
+
+  await dmsFileService.DeleteFamilyGroupFolder(fgfs).then(() => {
+    notification.info({
+      message: "系统提示：",
+      description: "记录删除成功",
+      placement: "topRight",
+    });
+    onReload();
+  });
+};
+
+const setBindOptionValue = (
+  bindValue: string,
+  value: string,
+  value1: string,
+  values: string[],
+  disabled: boolean,
+) => {
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == bindValue,
+  )[0];
+  if (!bindOption) return;
+  bindOption.Value = value;
+  bindOption.Value1 = value1;
+  bindOption.Values = values;
+  bindOption.disabled = disabled;
+};
+
+const setBindSelectOption = (
+  bindValue: string,
+  SelectOptions: SelectOption[],
+) => {
+  let bindOption: BindOption = bindOptions.value.filter(
+    (x) => x.BindValue == bindValue,
+  )[0];
+  if (!bindOption) return;
+  bindOption.SelectOptions = SelectOptions;
+};
+
+//初始化查询条件
+const initBindOption = async (familyName: string) => {
+  let ubo = useBindOption();
+  bindOptions.value = [];
+  bindOptions.value.splice(0, bindOptions.value.length);
+  let bindOption: BindOption = ubo.getBindOption(
+    FamilyDmsFileViewEntity.DB_ORG_FILE_NAME,
+    "名称",
+    SearchFilterTypePolicy.TEXT,
+    SearchFilterOperatorPolicy.CONTAIN,
+  );
+  bindOptions.value.push(bindOption);
+  let fps: SelectOption[] = [];
+  fps.push({ BindValue: "", DisplayName: "" });
+
+  let rps: SelectOption[] = await dmsFileService.FindFamilyDmsFolders();
+  if (rps && rps.length > 0) {
+    if (familyName && familyName.length > 0) {
+      currentFamilyName.value = rootPath.value = familyName;
+    } else {
+      currentFamilyName.value = rootPath.value = rps[0].BindValue;
+    }
+    fps = await dmsFileService.FindFamilyDmsFoldersByFamilyName(
+      currentFamilyName.value,
+    );
+  }
+
+  bindOption = ubo.getBindSelectOption(
+    FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+    "当前群组",
+    SearchFilterTypePolicy.SINGLE_SELECTION,
+    SearchFilterOperatorPolicy.SINGLE,
+    rps,
+  );
+  bindOptions.value.push(bindOption);
+
+  bindOption = ubo.getBindSelectOption(
+    FamilyDmsFileViewEntity.DB_FILE_PATH,
+    "当前路径",
+    SearchFilterTypePolicy.SINGLE_SELECTION,
+    SearchFilterOperatorPolicy.SINGLE,
+    fps,
+  );
+  //bindOption.disabled = true;
+  //bindOption.lg = 24;
+  bindOptions.value.push(bindOption);
+
+  initBindOptions.value.forEach((element) => {
+    setBindOptionValue(
+      element.BindValue,
+      element.Value,
+      element.Value1,
+      element.Values,
+      element.disabled,
+    );
+  });
+
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+    currentFamilyName.value,
+    "",
+    [currentFamilyName.value],
+    false,
+  );
+};
+
+//table from-----------------------------------------------------------------------------------------------------------------------------------
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+const onSubmit = async (filters: SearchFilter[]) => {
+  loading.value = true;
+  let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+  currentFilter.value = filters;
+  isSearched.value = true;
+  c.Filter = filters;
+  c.limit = pagingParams.value.pageSize;
+  c.page = pagingParams.value.page ?? 1;
+  c.GridColumns = [];
+  currentSearchCriteria.value = c;
+
+  await findBySearchCriteria(c);
+};
+
+const handleChangeBindValue = async (bindValue: string, value: string) => {
+  if (value == FamilyDmsFileViewEntity.DB_FAMILY_NAME) {
+    let rps: SelectOption[] =
+      await dmsFileService.FindFamilyDmsFoldersByFamilyName(bindValue);
+
+    setBindSelectOption(FamilyDmsFileViewEntity.DB_FILE_PATH, rps);
+
+    if (rps && rps.length > 0) {
+      currentFamilyName.value = rootPath.value = rps[0].BindValue;
+
+      currentSearchCriteria.value.Filter = [];
+      let filter: SearchFilter;
+      filter = new SearchFilter();
+      filter.Column = FamilyDmsFileViewEntity.DB_FAMILY_NAME;
+      filter.Type = "SingleSelection";
+      filter.Operator = "single";
+      let bindOption: BindOption = bindOptions.value.filter(
+        (x) => x.BindValue == FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+      )[0];
+      filter.Value = bindOption.Value;
+
+      currentSearchCriteria.value.Filter.push(filter);
+      filter = new SearchFilter();
+      filter.Column = FamilyDmsFileViewEntity.DB_FILE_PATH;
+      filter.Type = "SingleSelection";
+      filter.Operator = "single";
+      filter.Value = bindOption.Value;
+      currentSearchCriteria.value.Filter.push(filter);
+
+      currFilePath.value = filter.Value;
+      setBindOptionValue(
+        FamilyDmsFileViewEntity.DB_FILE_PATH,
+        currentFamilyName.value,
+        "",
+        [currentFamilyName.value],
+        false,
+      );
+
+      await findBySearchCriteria(unref(currentSearchCriteria));
+    }
+  } else if (value == FamilyDmsFileViewEntity.DB_FILE_PATH) {
+    currentSearchCriteria.value.Filter = [];
+    let filter: SearchFilter;
+    filter = new SearchFilter();
+    filter.Column = FamilyDmsFileViewEntity.DB_FILE_PATH;
+    filter.Type = "SingleSelection";
+    filter.Operator = "single";
+    let bindOption: BindOption = bindOptions.value.filter(
+      (x) => x.BindValue == FamilyDmsFileViewEntity.DB_FILE_PATH,
+    )[0];
+
+    currFilePath.value = filter.Value = bindOption.Value;
+
+    currentSearchCriteria.value.Filter.push(filter);
+
+    await findBySearchCriteria(unref(currentSearchCriteria));
+  }
+};
+const onPrint = async () => {
+  loading.value = true;
+  let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+  if (currentFilter.value.length > 0) c.Filter = currentFilter.value;
+  else c.Filter = [];
+
+  c.limit = pagingParams.value.pageSize;
+  c.page = pagingParams.value.page ?? 1;
+  c.GridColumns = useGridColumnInfo().getGridColumnInfo(unref(columns));
+  c.ReportName = layoutProviderMethod?.getLayoutProvider().layoutTitle!;
+  try {
+    //let sss = await dmsFileService.PrintBySearchCriteria(c);
+  } catch (error) {
+    console.log(error);
+  }
+};
+
+const findBySearchCriteria = async (c: DmsFileSearchCriteria) => {
+  keys.value = [];
+  try {
+    if (c.limit == 0) c.limit = pagingParams.value.pageSize;
+    if (c.page == 0) c.page = pagingParams.value.page ?? 1;
+    data.value = await dmsFileService.FindFamilyBySearchCriteria(c);
+    result.value.Total = data.value.Total;
+    result.value.Page = data.value.Page;
+    result.value.Limit = data.value.Limit;
+    if (data.value.Families)
+      data.value.Families = orderBy(
+        data.value.Families,
+        (x) => x.IsDirectoryIndc,
+        "desc",
+      );
+
+    datas.value = data.value.Families;
+    loading.value = false;
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const onPagination = async (params: PagingParams) => {
+  try {
+    if (!isSearched.value) return;
+    let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+
+    if (currentFilter.value.length > 0) c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = params.pageSize;
+    c.page = params.page ?? 1;
+    if (params.sortField) c.orderby = params.sortField!;
+    if (params.sortOrder)
+      c.orderbytag = params.sortOrder?.toString().substring(0, 4)!;
+    c.GridColumns = [];
+    loading.value = true;
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+  } catch (error) {
+    loading.value = false;
+    console.log(error);
+  }
+};
+
+const onReSearch = async () => {
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+    currentFamilyName.value,
+    "",
+    [currentFamilyName.value],
+    false,
+  );
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+
+const onReload = async () => {
+  let orgFn: string = currentFamilyName.value;
+  let orgFp: string = currFilePath.value;
+
+  await initBindOption(currentFamilyName.value);
+
+  currentFamilyName.value = orgFn;
+  currFilePath.value = orgFp;
+
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FAMILY_NAME,
+    currentFamilyName.value,
+    "",
+    [currentFamilyName.value],
+    false,
+  );
+  setBindOptionValue(
+    FamilyDmsFileViewEntity.DB_FILE_PATH,
+    currFilePath.value,
+    "",
+    [currFilePath.value],
+    false,
+  );
+
+  await findBySearchCriteria(unref(currentSearchCriteria));
+};
+//table end-----------------------------------------------------------------------------------------------------------------------------------
+</script>
+<style scoped>
+.folder-list {
+  height: 80px;
+  width: 90vw;
+  border-bottom: 1px solid #ccc;
+}
+
+.folder-right {
+  position: relative;
+  right: 0;
+}
+
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.rotating-element {
+  animation: rotate 2s linear infinite;
+}
+</style>
diff --git a/WebVue/src/views/master/FamilyGroupUserModal.vue b/WebVue/src/views/master/FamilyGroupUserModal.vue
new file mode 100644
index 0000000..3455cef
--- /dev/null
+++ b/WebVue/src/views/master/FamilyGroupUserModal.vue
@@ -0,0 +1,248 @@
+<template>
+    <search @on-submit="onSubmit" @on-reset="onReset" @use-pagination="onPagination" :is-modal="isModal"
+        :loading="loading" :pagination="result" :rowSelectionType="selectionType" @on-select-change="onSelectChange">
+        <template #control>
+
+        </template>
+        <template #bodyCell="{ column, record, index }">
+
+        </template>
+        <template #footer>
+
+        </template>
+    </search>
+</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 { FamilyGroupResultData } from "@/data/auto/familyGroupResultData";
+import { FamilyGroupManagerUserViewEntity } from "@/data/auto/familyGroupManagerUserViewEntity";
+import { SearchFilter } from "@/data/auto/searchFilter"
+
+import familyGroupService from "@/service/master/familyGroupService";
+import { FamilyGroupManagerUserSearchCriteria } from "@/data/auto/familyGroupManagerUserSearchCriteria";
+
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
+import { useRoute, useRouter } from "vue-router";
+
+import { useBindOption } from "@/hooks/useBindOption";
+import { SearchFilterOperatorPolicy } from "@/data/custom/searchFilterOperatorPolicy"
+import { SearchFilterTypePolicy } from "@/data/custom/searchFilterTypePolicy"
+import { notification } from "ant-design-vue";
+import { GridColumnInfo } from "@/data/auto/gridColumnInfo"
+import { useGridColumnInfo } from "@/hooks/gridColumnInfo"
+import { title } from "process";
+import { useOrderedChildren } from "@/hooks/use-ordered-children";
+import { SearchCriteriaContext } from "@/injections";
+import { enquiryMethodKey, searchCriteriaManagerKey } from "@/injections";
+
+//page from-----------------------------------------------------------------------------------------------------------------------------------
+//================inject================
+
+//当前是弹出的Modal,还是Page
+const isModal = ref(inject("isModalUser", false) as boolean);
+//初始化查询条件的值
+const initBindOptions = ref(inject("initBindOptionsUser", []) as BindOption[]);
+//记录单选还是多选
+const selectionType = ref(inject("selectionTypeUser", 'radio') as string);
+
+const currentFamilyName = ref(inject("currentFamilyName", '') as string);
+const currentFolderName = ref(inject("currentFolderName", '') as string);
+//================inject================
+
+const loading = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const canView = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const route = useRoute();
+const router = useRouter();
+
+const columns = ref([
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: '30px',
+        align: 'center',
+        fixed: 'left',
+        sequence: 0,
+        hidden: 'N',
+        format: ''
+    },
+    {
+        title: "用户名称",
+        dataIndex: FamilyGroupManagerUserViewEntity.USER_NAME,
+        sorter: true,
+        width: '65px',
+        sequence: 1,
+        hidden: 'N'
+    },
+    {
+        title: "中文名称",
+        dataIndex: FamilyGroupManagerUserViewEntity.USER_LOCAL_NAME,
+        sorter: true,
+        width: '80px',
+        sequence: 2,
+        hidden: 'N'
+    },
+]);
+
+const viewOption = {
+    Value: 'default',
+    SelectOptions: [{ BindValue: 'default', DisplayName: "默认" }],
+    Columns: [{ BindValue: 'default', BindColumn: columns }]
+};
+
+
+
+const bindOptions = ref<BindOption[]>([]);
+const datas = ref<FamilyGroupManagerUserViewEntity[]>([]);
+const pagingParams = ref<PagingParams>({ pageSize: 20, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+
+const data = ref<FamilyGroupResultData>(new FamilyGroupResultData());
+const currentFilter = ref<SearchFilter[]>([]);
+const isSearched = ref<boolean>(false);
+const currentSearchCriteria = ref<FamilyGroupManagerUserSearchCriteria>(new FamilyGroupManagerUserSearchCriteria());
+
+const keys = ref<FamilyGroupManagerUserViewEntity[]>([]);
+const {
+    children: items,
+    addChild: addItem,
+    removeChild: removeItem,
+} = useOrderedChildren<SearchCriteriaContext>();
+//================provide================
+//初始化查询条件UI(search)
+provide(enquiryMethodKey, {
+    getLayoutSetting: () => { return { controlLeft: 16, controlRight: 8, space: true, soltLeft: 24, soltRight: 24 }; },
+    getBindOptions: () => { return unref(bindOptions); },
+    getViewOption: () => { return unref(viewOption); },
+    getDatas: () => { return datas; },
+});
+
+provide(
+    searchCriteriaManagerKey,
+    reactive({
+        items,
+        addItem,
+        removeItem,
+    })
+);
+
+//================provide================
+
+defineExpose({
+    keys,
+    initBindOptions,
+})
+
+onMounted(() => {
+    let pContext: PermissionContext = usePermissionContext();
+    canView.value = pContext.canView(route.meta.permission as string);
+    canAmend.value = pContext.canAmend(route.meta.permission as string);
+    canDelete.value = pContext.canDelete(route.meta.permission as string);
+    canCreate.value = pContext.canCreate(route.meta.permission as string);
+    initBindOption();
+    onSubmit(items.value[0].getFilter());
+})
+
+const onSelectChange = ((selected: FamilyGroupManagerUserViewEntity[]) => {
+    keys.value = selected;
+})
+
+const onReset = (() => {
+    keys.value = [];
+    result.value.Total = 0;
+})
+
+
+const setBindOptionValue = ((bindValue: string, value: string, value1: string, values: string[], disabled: boolean) => {
+    let bindOption: BindOption = bindOptions.value.filter(x => x.BindValue == bindValue)[0];
+    if (!bindOption) return;
+    bindOption.Value = value;
+    bindOption.Value1 = value1;
+    bindOption.Values = values;
+    bindOption.disabled = disabled;
+})
+
+
+
+//初始化查询条件
+const initBindOption = (async () => {
+    let ubo = useBindOption();
+    let bindOption: BindOption = ubo.getBindOption(FamilyGroupManagerUserViewEntity.DB_USER_NAME, '用户名称', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CONTAIN);
+    bindOptions.value.push(bindOption);
+
+    bindOption = ubo.getBindOption(FamilyGroupManagerUserViewEntity.DB_USER_LOCAL_NAME, '中文名称', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CONTAIN);
+    bindOption.lg = 10;
+    bindOptions.value.push(bindOption);
+
+    initBindOptions.value.forEach(element => {
+        setBindOptionValue(element.BindValue, element.Value, element.Value1, element.Values, element.disabled);
+    });
+})
+
+//table from-----------------------------------------------------------------------------------------------------------------------------------
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+const onSubmit = (async (filters: SearchFilter[]) => {
+
+    let c: FamilyGroupManagerUserSearchCriteria = new FamilyGroupManagerUserSearchCriteria();
+    currentFilter.value = filters;
+    isSearched.value = true;
+    c.Filter = filters;
+    c.limit = pagingParams.value.pageSize;
+    c.page = pagingParams.value.page ?? 1;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+})
+
+
+const findBySearchCriteria = (async (c: FamilyGroupManagerUserSearchCriteria) => {
+    try {
+        c.FolderName = currentFolderName.value;
+        c.FamilyName = currentFamilyName.value;
+        data.value = await familyGroupService.FindFamilyUserBySearchCriteria(c);
+        result.value.Total = data.value.Total;
+        result.value.Page = data.value.Page;
+        result.value.Limit = data.value.Limit;
+        datas.value = data.value.Users;
+    } catch (error) {
+        console.log(error);
+    }
+})
+
+const onPagination = (async (params: PagingParams) => {
+
+    if (!isSearched.value) return;
+    let c: FamilyGroupManagerUserSearchCriteria = new FamilyGroupManagerUserSearchCriteria();
+
+    if (currentFilter.value.length > 0)
+        c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = params.pageSize;
+    c.page = params.page ?? 1;
+    if (params.sortField)
+        c.orderby = params.sortField!;
+    if (params.sortOrder)
+        c.orderbytag = params.sortOrder?.toString().substring(0, 4)!;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+});
+
+const onReload = (async () => {
+    await findBySearchCriteria(unref(currentSearchCriteria));
+})
+//table end-----------------------------------------------------------------------------------------------------------------------------------
+</script>
diff --git a/WebVue/src/views/master/FamilyShareOperation.vue b/WebVue/src/views/master/FamilyShareOperation.vue
new file mode 100644
index 0000000..7c82a94
--- /dev/null
+++ b/WebVue/src/views/master/FamilyShareOperation.vue
@@ -0,0 +1,316 @@
+<template>
+    <search @on-submit="onSubmit" @on-print="onPrint" @on-reset="onReset" @use-pagination="onPagination" :scrollx="400"
+        :is-modal="isModal" :loading="loading" :pagination="result" :rowSelectionType="selectionType"
+        @on-select-change="onSelectChange">
+        <template #control>
+
+        </template>
+        <template #bodyCell="{ column, record, index }">
+
+        </template>
+        <template #footer>
+            <div v-if="!isModal" class="page-footer">
+                <a-row :gutter="24">
+                    <a-col :lg="24" :sm="24">
+                        <a-row v-if="!isEdit" :gutter="[16, 8]">
+                            <a-space>
+                                <a-popconfirm title="确定是否删除这些记录?" ok-text="是" cancel-text="否" @confirm="onDelete">
+                                    <a-button type="primary" danger :icon="h(DeleteOutlined)" v-if="canDelete"
+                                        :disabled="!(keys && keys.length > 0)">删除</a-button>
+                                </a-popconfirm>
+                            </a-space>
+                        </a-row>
+                    </a-col>
+                </a-row>
+            </div>
+        </template>
+    </search>
+</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 { FamilyGroupResultData } from "@/data/auto/familyGroupResultData";
+import { FamilyFolderFavoriteViewEntity } from "@/data/auto/familyFolderFavoriteViewEntity";
+import { FamilyFolderFavoriteEntity } from "@/data/auto/familyFolderFavoriteEntity";
+import { FamilyGroupFolderEntity } from "@/data/auto/familyGroupFolderEntity";
+import { SearchFilter } from "@/data/auto/searchFilter"
+import dmsFileService from "@/service/master/dmsFileService";
+import familyGroupService from "@/service/master/familyGroupService";
+import { FamilyGroupManagerUserSearchCriteria } from "@/data/auto/familyGroupManagerUserSearchCriteria";
+
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+import { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
+import { useRoute, useRouter } from "vue-router";
+
+import { useBindOption } from "@/hooks/useBindOption";
+import { SearchFilterOperatorPolicy } from "@/data/custom/searchFilterOperatorPolicy"
+import { SearchFilterTypePolicy } from "@/data/custom/searchFilterTypePolicy"
+import { notification } from "ant-design-vue";
+import { GridColumnInfo } from "@/data/auto/gridColumnInfo"
+import { useGridColumnInfo } from "@/hooks/gridColumnInfo"
+import { title } from "process";
+import { enquiryMethodKey, searchCriteriaManagerKey, masterOperationToEnquiryMethodKey, MasterOperationToEnquiryModelOption, layoutProviderMethodKey } from "@/injections";
+import { useOrderedChildren } from "@/hooks/use-ordered-children";
+import { SearchCriteriaContext } from "@/injections";
+//page from-----------------------------------------------------------------------------------------------------------------------------------
+//================inject================
+//报表名称
+const layoutProviderMethod = inject(layoutProviderMethodKey);
+
+//当前是弹出的Modal,还是Page
+const isModal = ref(inject("isModalShare", false) as boolean);
+//初始化查询条件的值
+const initBindOptions = ref(inject("initBindOptionsShare", []) as BindOption[]);
+//记录单选还是多选
+const selectionType = ref(inject("selectionTypeShare", 'checkbox') as string);
+
+//================inject================
+
+const loading = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const canView = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const route = useRoute();
+const router = useRouter();
+
+const columns = ref([
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: '3%',
+        align: 'center',
+        fixed: 'left',
+        sequence: 0,
+        hidden: 'N',
+        format: ''
+    },
+    {
+        title: "群组",
+        dataIndex: FamilyFolderFavoriteViewEntity.FAMILY_LOCAL_NAME,
+        sorter: false,
+        width: '10%',
+        sequence: 1,
+        hidden: 'N'
+    },
+    {
+        title: "顶级目录",
+        dataIndex: FamilyFolderFavoriteViewEntity.TOP_FOLDER_LOCAL_NAME,
+        sorter: false,
+        width: '10%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "目录",
+        dataIndex: FamilyFolderFavoriteViewEntity.FOLDER_LOCAL_NAME,
+        sorter: false,
+        width: '10%',
+        sequence: 3,
+        hidden: 'N'
+    },
+    {
+        title: "目录描述",
+        dataIndex: FamilyFolderFavoriteViewEntity.NOTICE,
+        sorter: false,
+        width: '30%',
+        sequence: 4,
+        hidden: 'N'
+    },
+]);
+
+const viewOption = {
+    Value: 'default',
+    SelectOptions: [{ BindValue: 'default', DisplayName: "默认" }],
+    Columns: [{ BindValue: 'default', BindColumn: columns }]
+};
+
+
+
+const bindOptions = ref<BindOption[]>([]);
+const datas = ref<FamilyFolderFavoriteViewEntity[]>([]);
+const pagingParams = ref<PagingParams>({ pageSize: 20, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+
+const data = ref<FamilyGroupResultData>(new FamilyGroupResultData());
+const currentFilter = ref<SearchFilter[]>([]);
+const isSearched = ref<boolean>(false);
+const currentSearchCriteria = ref<FamilyGroupManagerUserSearchCriteria>(new FamilyGroupManagerUserSearchCriteria());
+
+const keys = ref<FamilyFolderFavoriteViewEntity[]>([]);
+
+const {
+    children: items,
+    addChild: addItem,
+    removeChild: removeItem,
+} = useOrderedChildren<SearchCriteriaContext>();
+//================provide================
+//初始化查询条件UI(search)
+provide(enquiryMethodKey, {
+    getLayoutSetting: () => { return { controlLeft: 16, controlRight: 8, space: true, soltLeft: 24, soltRight: 24 }; },
+    getBindOptions: () => { return unref(bindOptions); },
+    getViewOption: () => { return unref(viewOption); },
+    getDatas: () => { return datas; },
+});
+
+provide(
+    searchCriteriaManagerKey,
+    reactive({
+        items,
+        addItem,
+        removeItem,
+    })
+);
+
+//================provide================
+
+defineExpose({
+    keys,
+    initBindOptions,
+})
+
+onMounted(() => {
+    let pContext: PermissionContext = usePermissionContext();
+    canView.value = pContext.canView(route.meta.permission as string);
+    canAmend.value = pContext.canAmend(route.meta.permission as string);
+    canDelete.value = pContext.canDelete(route.meta.permission as string);
+    canCreate.value = pContext.canCreate(route.meta.permission as string);
+    initBindOption();
+    onSubmit(items.value[0].getFilter());
+})
+
+const onSelectChange = ((selected: FamilyFolderFavoriteViewEntity[]) => {
+    keys.value = selected;
+})
+
+const onDelete = (async () => {
+    let fgfs: FamilyFolderFavoriteEntity[] = [];
+    let fgf: FamilyFolderFavoriteEntity;
+    keys.value.forEach(element => {
+        fgf = new FamilyFolderFavoriteEntity();
+        fgf.UserName = element.UserName;
+        fgf.FolderName = element.FolderName;
+        fgfs.push(fgf);
+    });
+
+    await familyGroupService.DeleteFamilyFolderFavorites(fgfs).then(() => {
+        notification.info({
+            message: '系统提示：',
+            description: '记录删除成功',
+            placement: "topRight",
+        });
+        onReload();
+    });
+
+})
+
+const onReset = (() => {
+    keys.value = [];
+    result.value.Total = 0;
+})
+
+
+const setBindOptionValue = ((bindValue: string, value: string, value1: string, values: string[], disabled: boolean) => {
+    let bindOption: BindOption = bindOptions.value.filter(x => x.BindValue == bindValue)[0];
+    if (!bindOption) return;
+    bindOption.Value = value;
+    bindOption.Value1 = value1;
+    bindOption.Values = values;
+    bindOption.disabled = disabled;
+})
+
+
+
+//初始化查询条件
+const initBindOption = (async () => {
+    let ubo = useBindOption();
+    let bindOption: BindOption = ubo.getBindOption(FamilyFolderFavoriteViewEntity.DB_FAMILY_LOCAL_NAME, '群组名称', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CN_CONTAIN);
+    bindOptions.value.push(bindOption);
+
+    bindOption = ubo.getBindOption(FamilyFolderFavoriteViewEntity.DB_FOLDER_LOCAL_NAME, '目录名称', SearchFilterTypePolicy.TEXT, SearchFilterOperatorPolicy.CN_CONTAIN);
+    bindOption.lg = 10;
+    bindOptions.value.push(bindOption);
+
+    initBindOptions.value.forEach(element => {
+        setBindOptionValue(element.BindValue, element.Value, element.Value1, element.Values, element.disabled);
+    });
+})
+
+//table from-----------------------------------------------------------------------------------------------------------------------------------
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+const onSubmit = (async (filters: SearchFilter[]) => {
+
+    let c: FamilyGroupManagerUserSearchCriteria = new FamilyGroupManagerUserSearchCriteria();
+    currentFilter.value = filters;
+    isSearched.value = true;
+    c.Filter = filters;
+    c.limit = pagingParams.value.pageSize;
+    c.page = pagingParams.value.page ?? 1;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+})
+
+const onPrint = (async () => {
+    let c: FamilyGroupManagerUserSearchCriteria = new FamilyGroupManagerUserSearchCriteria();
+    if (currentFilter.value.length > 0)
+        c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = pagingParams.value.pageSize;
+    c.page = pagingParams.value.page ?? 1;
+    c.GridColumns = useGridColumnInfo().getGridColumnInfo(unref(columns));
+    c.ReportName = layoutProviderMethod?.getLayoutProvider().layoutTitle!;
+    try {
+        let sss = await familyGroupService.FamilyFolderFavoriteBySearchCriteria(c);
+    } catch (error) {
+        console.log(error);
+    }
+
+})
+
+const findBySearchCriteria = (async (c: FamilyGroupManagerUserSearchCriteria) => {
+    try {
+        data.value = await familyGroupService.FamilyFolderFavoriteBySearchCriteria(c);
+        result.value.Total = data.value.Total;
+        result.value.Page = data.value.Page;
+        result.value.Limit = data.value.Limit;
+        datas.value = data.value.Favorites;
+    } catch (error) {
+        console.log(error);
+    }
+})
+
+const onPagination = (async (params: PagingParams) => {
+
+    if (!isSearched.value) return;
+    let c: FamilyGroupManagerUserSearchCriteria = new FamilyGroupManagerUserSearchCriteria();
+
+    if (currentFilter.value.length > 0)
+        c.Filter = currentFilter.value;
+    else c.Filter = [];
+
+    c.limit = params.pageSize;
+    c.page = params.page ?? 1;
+    if (params.sortField)
+        c.orderby = params.sortField!;
+    if (params.sortOrder)
+        c.orderbytag = params.sortOrder?.toString().substring(0, 4)!;
+    c.GridColumns = [];
+    currentSearchCriteria.value = c;
+    await findBySearchCriteria(c);
+});
+
+const onReload = (async () => {
+    await findBySearchCriteria(unref(currentSearchCriteria));
+})
+//table end-----------------------------------------------------------------------------------------------------------------------------------
+</script>
diff --git a/WebVue/src/views/master/VideoPlay.vue b/WebVue/src/views/master/PlayVideo.vue
similarity index 100%
rename from WebVue/src/views/master/VideoPlay.vue
rename to WebVue/src/views/master/PlayVideo.vue
diff --git a/WebVue/src/views/master/Preview.vue b/WebVue/src/views/master/Preview.vue
new file mode 100644
index 0000000..c010030
--- /dev/null
+++ b/WebVue/src/views/master/Preview.vue
@@ -0,0 +1,190 @@
+<template>
+    <div class="main-list" :style="{ height: (height - 150) + 'px' }">
+        <a-row style="margin-left:-8px;margin-top:-8px;">
+            <a-col :sm="24" :lg="24">
+                <section class="vertical" :style='imgStyle'>
+                    <photo-provider>
+                        <photo-consumer v-for="(src, index) in images" :key="src.DetailId" :src="src.FileName">
+                            <img :src="src.PublishName" class="view-box">
+                        </photo-consumer>
+                    </photo-provider>
+
+                </section>
+            </a-col>
+        </a-row>
+    </div>
+    <div class="main-page-footer">
+        <a-pagination v-model:current="result.Page" v-model:page-size="result.Limit" :total="result.Total"
+            @change="onPagination" :pageSizeOptions="pageSizeOptions"></a-pagination>
+    </div>
+</template>
+<script lang="ts" setup>
+import { watch, computed, inject, reactive, ref, VNode, h, unref, onMounted, onBeforeMount } from "vue";
+import { useRoute, useRouter } from 'vue-router'
+import { PublishPhotoDetailEntity } from "@/data/auto/publishPhotoDetailEntity";
+import publishPhotoService from "@/service/master/publishPhotoService";
+import { useWindowSize } from '@vueuse/core'
+import { bsInfo } from "@/utils/browser"
+import { DmsFileSearchCriteria } from "@/data/auto/dmsFileSearchCriteria";
+import { SearchFilter } from "@/data/auto/searchFilter";
+import { DmsFileUploadViewDisplayData } from "@/data/auto/dmsFileUploadViewDisplayData";
+import { FileTypePolicy } from "@/policy/custom/fileTypePolicy";
+import { DmsFileResultData } from "@/data/auto/dmsFileResultData";
+import dmsFileService from "@/service/master/dmsFileService";
+import { LeftCircleOutlined, RightCircleOutlined } from '@ant-design/icons-vue';
+import { SearchCriteriaResultData } from "@/data/auto/searchCriteriaResultData";
+
+const { width, height } = useWindowSize()
+
+const images = ref<PublishPhotoDetailEntity[]>([]);
+
+
+const route = useRoute();
+const router = useRouter();
+
+
+const publishName = ref<string>(route.params.id as string)
+const mode = ref<string>(route.params.mode as string)
+
+const toIndex = ref<number>(0)
+const beforeChange = (from: number, to: number) => {
+    if (to > 0) {
+        toIndex.value = to;
+    }
+}
+
+const imgStyle = computed(() => {
+    if (!bsInfo.size.sm) {
+        return ' object-fit: cover;width:100%; height:' + (height.value - 260) + 'px;'
+    }
+    else {
+        return ' object-fit: cover;width:' + width.value + 'px; height:' + height.value + 'px;'
+    }
+})
+
+const pagingParams = ref<PagingParams>({ pageSize: bsInfo.size.sm ? 30 : 100, page: 1 });
+const result = ref<SearchCriteriaResultData>(new SearchCriteriaResultData());
+const pageSizeOptions = ref<string[]>(['30', '60', '90', '100', '120']);
+
+result.value.Page = pagingParams.value.page ?? 1;
+result.value.Limit = pagingParams.value.pageSize;
+
+onMounted(async () => {
+    if (mode.value == "list") {
+        findData(1);
+    }
+    else if (publishName.value && publishName.value.length > 0) {
+        publishPhotoService.FindPublishPhotoDetailByPublishName(publishName.value).then(res => {
+            for (let i = 0; i <res.length; i++) {
+                res[i].PublishName = res[i].FileName;
+            }
+            images.value = res;
+        });
+    }
+    else {
+        publishPhotoService.FindPublishPhotoDetail().then(res => {
+            for (let i = 0; i <res.length; i++) {
+                res[i].PublishName = res[i].FileName;
+            }
+            images.value = res;
+        });
+    }
+})
+
+const findData = async (params: number) => {
+    try {
+        let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+        c.page = params;
+        c.limit = pagingParams.value.pageSize;
+        let filter: SearchFilter;
+        filter = new SearchFilter();
+        filter.Column = DmsFileUploadViewDisplayData.DB_FILE_PATH;
+        filter.Type = "SingleSelection";
+        filter.Operator = "single";
+        filter.Value = publishName.value;
+        c.Filter.push(filter);
+        filter = new SearchFilter();
+        filter.Column = DmsFileUploadViewDisplayData.DB_FILE_TYPE;
+        filter.Type = "SingleSelection";
+        filter.Operator = "single";
+        filter.Value = FileTypePolicy.PHOTO;
+        c.Filter.push(filter);
+        let dr: DmsFileResultData = await dmsFileService.FindBySearchCriteria(c);
+        result.value.Total = dr.Total;
+        result.value.Page = dr.Page;
+
+        if (dr && dr.Datas && dr.Datas.length > 0) {
+
+            images.value = [];
+            let detail: PublishPhotoDetailEntity;
+            for (let i = 0; i < dr.Datas.length; i++) {
+                detail = new PublishPhotoDetailEntity()
+                detail.FileName = dr.Datas[i].FormattedPic;
+                detail.Notice = dr.Datas[i].LandscapeIndc;
+                detail.PublishName = dr.Datas[i].Url;
+                images.value.push(detail);
+            }
+        }
+    } catch (error) {
+        console.log(error);
+    }
+}
+
+const onPagination = (async (params: number) => {
+    findData(params);
+});
+
+const showSizeChange = (async (current: number, size: number) => {
+    pagingParams.value.page = 1;
+    pagingParams.value.pageSize = size;
+    result.value.Page = 1;
+    result.value.Limit = size;
+});
+
+</script>
+
+
+<style lang="less" scoped>
+.vertical {
+    position: relative;
+    z-index: 10;
+}
+
+.main-list {
+    /* 设置高度 */
+    overflow-y: auto;
+    /* 显示纵向滚动条 */
+
+    background-color: bisque;
+    padding-left: 16px;
+    padding-right: 16px;
+    padding-top: 8px;
+    margin-right: 8px;
+    background-image: url('/images/main/p3.png');
+    background-size: cover;
+    width: 100%;
+}
+
+.view-box {
+    display: inline-block;
+    width: 100px;
+    height: 100px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+    cursor: pointer;
+    object-fit: cover;
+}
+
+.main-page-footer {
+    background-color: aliceblue;
+    z-index: 999;
+    padding-left: 8px;
+    padding-right: 18px;
+    padding-top: 8px;
+    width: 100%;
+    height: 50px;
+    position: fixed;
+    bottom: 0;
+    border-top: 1px solid silver;
+}
+</style>
diff --git a/WebVue/src/views/master/PreviewAudio.vue b/WebVue/src/views/master/PreviewAudio.vue
new file mode 100644
index 0000000..5639026
--- /dev/null
+++ b/WebVue/src/views/master/PreviewAudio.vue
@@ -0,0 +1,148 @@
+<template>
+    <div class="page" :style="{
+        height: bsInfo.height - 120 + 'px',
+    }">
+        <APlayer :audio="audio" ref="aplayer" />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, onMounted } from "vue";
+import APlayer from "@worstone/vue-aplayer";
+import publishAudioService from "@/service/master/publishAudioService";
+import { PublishAudioData } from "@/data/auto/publishAudioData";
+import { useRoute, useRouter } from 'vue-router';
+import { DmsFileSearchCriteria } from "@/data/auto/dmsFileSearchCriteria";
+import dmsFileService from "@/service/master/dmsFileService";
+import { DmsFileResultData } from "@/data/auto/dmsFileResultData";
+import { DmsFileUploadViewDisplayData } from "@/data/auto/dmsFileUploadViewDisplayData";
+import { SearchFilter } from "@/data/auto/searchFilter";
+import { FileTypePolicy } from "@/policy/custom/fileTypePolicy";
+import { bsInfo } from "@/utils/browser"
+
+const route = useRoute();
+const router = useRouter();
+
+const publishName = ref<string>(route.params.id as string)
+
+const mode = ref<string>(route.params.mode as string)
+
+const aplayer = ref(APlayer);
+// 设置 2 个或 2 个以上的歌曲信息
+const audio = ref([]);
+
+onMounted(async () => {
+    // 加载歌曲信息
+    loadAudios()
+});
+
+
+const loadAudios = async () => {
+
+    let data: PublishAudioData = new PublishAudioData();
+    let audios: any = [];
+    try {
+        //从网盘中心加载歌曲信息
+        if (mode.value == "list") {
+            let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+            c.limit = 100;
+            c.page = 1;
+            let filter: SearchFilter;
+            filter = new SearchFilter();
+            filter.Column = DmsFileUploadViewDisplayData.DB_FILE_PATH;
+            filter.Type = "SingleSelection";
+            filter.Operator = "single";
+            filter.Value = publishName.value;
+            c.Filter.push(filter);
+            filter = new SearchFilter();
+            filter.Column = DmsFileUploadViewDisplayData.DB_FILE_TYPE;
+            filter.Type = "SingleSelection";
+            filter.Operator = "single";
+            filter.Value = FileTypePolicy.AUDIO;
+            c.Filter.push(filter);
+
+            let dr: DmsFileResultData = await dmsFileService.FindBySearchCriteria(c);
+
+            if (dr && dr.Datas && dr.Datas.length > 0) {
+                dr.Datas.forEach((item: DmsFileUploadViewDisplayData) => {
+                    audios.push({
+                        name: item.OrgFileName.indexOf(".") > 0 ? item.OrgFileName.substring(0, item.OrgFileName.indexOf(".")) : item.OrgFileName,
+                        author: '有家相册',
+                        url: item.Url,
+                        type: "normal",
+                        // lrc: item.FormattedLrc,
+                        cover: '/public/images/logo.png',
+                    });
+                });
+            }
+        }
+        else if (!publishName.value || publishName.value.length == 0) {
+            data = await publishAudioService.FindPublishAudioDefault();
+        }
+        else {
+            data = await publishAudioService.FindByKey(publishName.value);
+        }
+
+        if (data && data.Details) {
+            data.Details.forEach((item: any) => {
+                audios.push({
+                    name: item.Title,
+                    author: item.Author,
+                    url: item.FormattedUrl,
+                    type: "normal",
+                    lrc: item.FormattedLrc,
+                    cover: item.FormattedPic,
+                });
+            });
+        }
+
+    } catch (error) {
+        console.log(error); // for debug
+    }
+
+    aplayer.value.addList(audios);
+    aplayer.value.showList();
+}
+</script>
+<style>
+.page {
+    overflow: auto;
+    background-color: bisque;
+    padding-left: 16px;
+    padding-right: 16px;
+    padding-top: 8px;
+    margin-right: 8px;
+    background-image: url('/images/main/p3.png');
+    background-size: cover;
+    width: 100%;
+}
+
+.aplayer {
+    margin-left: -5px !important;
+    margin-top: 0px !important;
+}
+
+.aplayer .aplayer-notice {
+    z-index: -999 !important;
+    ;
+    display: none !important;
+}
+
+.aplayer .aplayer-lrc p.aplayer-lrc-current {
+    font-size: 24px !important;
+    padding-top: 4px !important;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    -o-text-overflow: ellipsis;
+    line-height: 24px !important;
+}
+
+.aplayer-list {
+    max-height: 560px !important;
+}
+
+.aplayer-list ol {
+    max-height: 560px !important;
+}
+</style>
diff --git a/WebVue/src/views/master/PreviewVideo.vue b/WebVue/src/views/master/PreviewVideo.vue
new file mode 100644
index 0000000..b77c48c
--- /dev/null
+++ b/WebVue/src/views/master/PreviewVideo.vue
@@ -0,0 +1,177 @@
+<template>
+    <vue3VideoPlay v-if="options.type == 'm3u8'" :width="videoWidth" :title="title" :src="modal.videoSrc"
+        :poster="modal.poster" type="m3u8" @ended="handleEnded" :autoPlay="false" />
+    <vue3VideoPlay v-else :width="videoWidth" :title="title" :src="modal.videoSrc" :poster="modal.poster"
+        type="video/mp4" @ended="handleEnded" :autoPlay="false" />
+    <div class="list-container" :style="'height:' + listHeight + 'px;'">
+        <a-list bordered :data-source="modal.data.Details">
+            <template #renderItem="{ item, index }">
+                <a-list-item slot="renderItem" slot-scope="item, index" @click="handleChange(index)">
+                    <span
+                        :style="modal.index == index ? 'color: black;font-weight: bold;font-size: 24px;' : 'font-size: 20px;'">
+                        {{ index + 1
+                        }}.{{
+        item.Title }}</span>
+                </a-list-item>
+            </template>
+            <template #header>
+                <div>播放列表</div>
+            </template>
+        </a-list>
+    </div>
+
+</template>
+
+<script setup lang="ts">
+import {
+    watch,
+    computed,
+    inject,
+    reactive,
+    ref,
+    VNode,
+    h,
+    unref,
+    onMounted,
+    onBeforeMount,
+} from "vue";
+import dragModal from "@/components/basic/DragModal.vue";
+import { PublishVideoData } from "@/data/auto/publishVideoData";
+import { useRoute, useRouter } from "vue-router";
+import publishVideoService from "@/service/master/publishVideoService";
+import { bsInfo } from "@/utils/browser";
+import { PublishVideoDetailDisplayData } from "@/data/auto/publishVideoDetailDisplayData";
+import { DmsFileSearchCriteria } from "@/data/auto/dmsFileSearchCriteria";
+import { DmsFileUploadViewDisplayData } from "@/data/auto/dmsFileUploadViewDisplayData";
+import { SearchFilter } from "@/data/auto/searchFilter";
+import { FileTypePolicy } from "@/policy/custom/fileTypePolicy";
+import { DmsFileResultData } from "@/data/auto/dmsFileResultData";
+import dmsFileService from "@/service/master/dmsFileService";
+
+const route = useRoute();
+const router = useRouter();
+
+const publishName = ref<string>(route.params.id as string);
+const mode = ref<string>(route.params.mode as string)
+
+const videoWidth = computed(() => {
+    if (bsInfo.size.sm) return bsInfo.width;
+    else return bsInfo.width - 600;
+});
+
+
+const listHeight = computed(() => {
+    if (bsInfo.size.sm) return bsInfo.height - 550;
+    else return bsInfo.height - 560;
+});
+
+
+const modal = reactive({
+    loading: false,
+    showModal: false,
+    videoSrc: "",
+    poster: "",
+    index: 0,
+    data: new PublishVideoData(),
+});
+
+const title = "有家视频";
+
+onMounted(async () => {
+    // 加载歌曲信息
+    loadVideos();
+});
+
+const loadVideos = async () => {
+    try {
+        if (mode.value == "list") {
+            let c: DmsFileSearchCriteria = new DmsFileSearchCriteria();
+            c.limit = 100;
+            c.page = 1;
+            let filter: SearchFilter;
+            filter = new SearchFilter();
+            filter.Column = DmsFileUploadViewDisplayData.DB_FILE_PATH;
+            filter.Type = "SingleSelection";
+            filter.Operator = "single";
+            filter.Value = publishName.value;
+            c.Filter.push(filter);
+            filter = new SearchFilter();
+            filter.Column = DmsFileUploadViewDisplayData.DB_FILE_TYPE;
+            filter.Type = "SingleSelection";
+            filter.Operator = "single";
+            filter.Value = FileTypePolicy.VIDEO;
+            c.Filter.push(filter);
+
+            let dr: DmsFileResultData = await dmsFileService.FindBySearchCriteria(c);
+
+            if (dr && dr.Datas && dr.Datas.length > 0) {
+
+                modal.data.Details = [];
+                let detail: PublishVideoDetailDisplayData;
+                for (let i = 0; i < dr.Datas.length; i++) {
+                    detail = new PublishVideoDetailDisplayData()
+                    detail.Title = dr.Datas[i].OrgFileName;
+                    detail.FormattedUrl = dr.Datas[i].Url;
+                    detail.FormattedPic = dr.Datas[i].FormattedPic.replace('.m3u8', '.png');
+                    modal.data.Details.push(detail);
+                }
+            }
+
+        }
+        else if (!publishName.value || publishName.value.length == 0) {
+            modal.data = await publishVideoService.FindPublishVideoDefault();
+        } else {
+            modal.data = await publishVideoService.FindByKey(publishName.value);
+        }
+    } catch (error) {
+        console.log(error); // for debug
+    }
+
+    if (modal.data && modal.data.Details && modal.data.Details.length > 0) {
+        options.type = modal.data.Details[0].FormattedUrl.indexOf(".m3u8") > 0 ? "m3u8" : "video/mp4";
+        modal.videoSrc = modal.data.Details[0].FormattedUrl;
+        modal.poster = modal.data.Details[0].FormattedPic;
+        modal.index = 0;
+    }
+};
+
+const handleChange = (index: number) => {
+    modal.index = index;
+    options.type = modal.data.Details[index].FormattedUrl.indexOf(".m3u8") > 0 ? "m3u8" : "video/mp4";
+    modal.videoSrc = modal.data.Details[index].FormattedUrl;
+    modal.poster = modal.data.Details[index].FormattedPic;
+};
+
+const handleEnded = () => {
+    // 视频播放结束后，自动播放下一个视频
+    const index = modal.index + 1;
+    if (index < modal.data.Details.length) {
+        modal.index = index;
+        options.type = modal.data.Details[index].FormattedUrl.indexOf(".m3u8") > 0 ? "m3u8" : "video/mp4";
+        modal.videoSrc = modal.data.Details[index].FormattedUrl;
+        modal.poster = modal.data.Details[index].FormattedPic;
+    } else {
+        // 所有视频播放完毕，跳转到下一个页面
+        //router.push("/master/video-publish");
+    }
+};
+
+//const videoSrc = ref('https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8');
+// 视频播放器配置
+const options = reactive({
+    src: modal.videoSrc, //视频源
+    type: "m3u8", //视频类型
+});
+</script>
+
+<style>
+.layout-content-view {
+    padding-top: 0 !important;
+    padding-left: 0 !important;
+}
+
+.list-container {
+    overflow-y: scroll;
+    /* 添加滚动条 */
+}
+</style>
diff --git a/WebVue/src/views/master/PublishAudioOperation.vue b/WebVue/src/views/master/PublishAudioOperation.vue
new file mode 100644
index 0000000..99179e0
--- /dev/null
+++ b/WebVue/src/views/master/PublishAudioOperation.vue
@@ -0,0 +1,812 @@
+<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="publishName" flex="auto"
+                                    @search="onModalSearch" />
+                            </a-col>
+                        </a-row>
+                    </a-col>
+                    <a-col :lg="12" :sm="24">
+                        <a-space>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(FileSearchOutlined)"
+                                @click.prevent="onSearch">查询</a-button>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(ClearOutlined)"
+                                @click.prevent="onReset">重置</a-button>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(FileAddOutlined)"
+                                @click.prevent="onCreate">新增</a-button>
+                        </a-space>
+                    </a-col>
+                </a-row>
+            </div>
+            <div class="page-main" :style="{ height: resultH }">
+                <a-row :gutter="[16, 8]">
+                    <a-col :lg="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">
+
+                            </a-col>
+                            <a-col :lg="3" :sm="12" style="min-width: 300px;">
+                                <Checkbox v-model:value="data.PublishAudio.OpenIndc" true-value="Y" false-value="N"
+                                    :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;">
+                                <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>
+                                        </div>
+                                    </template>
+                                    <template #actions>
+                                        <span v-if="isEdit">
+                                            <UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
+                                                @click="upSon(datas.index)" />上移
+                                        </span>
+                                        <span v-if="isEdit">
+                                            <DownSquareTwoTone
+                                                :style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
+                                                @click="downSon(datas.index)" />下移
+                                        </span>
+                                        <span v-if="isEdit">
+                                            <DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
+                                                @click="deleteSon(datas.record.DetailId)" />删除
+                                        </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">
+                                    <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>
+            <div class="page-footer">
+                <div style="">
+                    <a-row :gutter="24">
+                        <a-col :lg="24" :sm="24">
+                            <div>
+                                <a-row v-if="isEdit" :gutter="[16, 8]">
+                                    <a-space>
+                                        <a-popconfirm v-if="data.PublishAudio.CreatedBy" title="确定是否取消修改?" ok-text="是"
+                                            cancel-text="否" @confirm="onCancel">
+                                            <a-button type="primary" ghost :icon="h(UndoOutlined)">取消</a-button>
+                                        </a-popconfirm>
+                                        <a-button v-if="!data.PublishAudio.CreatedBy" type="primary" ghost
+                                            :icon="h(UndoOutlined)" @click.prevent="onCancel">取消</a-button>
+                                        <a-button type="primary" ghost :icon="h(SaveOutlined)"
+                                            @click.prevent="onSave">保存</a-button>
+                                    </a-space>
+                                </a-row>
+                                <a-row v-else :gutter="[16, 8]">
+                                    <a-space>
+                                        <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
+                                            :disabled="!hasData" @click.prevent="onAmend">修改</a-button>
+                                        <a-popconfirm :disabled="!hasData" title="确定是否删除这条记录?" ok-text="是"
+                                            cancel-text="否" @confirm="onDelete">
+                                            <a-button type="primary" danger :icon="h(DeleteOutlined)"
+                                                :disabled="!hasData" v-if="canDelete">删除</a-button>
+                                        </a-popconfirm>
+                                        <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
+                                            :disabled="!hasData" @click.prevent="onViewAudioPreview">音乐厅</a-button>
+                                    </a-space>
+                                </a-row>
+                            </div>
+                        </a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+        <dragModal v-model:open="showModal" width="80%" 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"
+            :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"
+            :fullscreen="width < 640" @ok="handleSelectDmsFile">
+            <dmsFileEnquiryModal ref="dmsFileEnquiry" @on-row-dblclick="handleSelectDmsFile">
+            </dmsFileEnquiryModal>
+        </dragModal>
+    </a-spin>
+</template>
+<script lang="ts" setup>
+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 { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
+import dragModal from "@/components/basic/DragModal.vue"
+import Checkbox from '@/components/basic/check-box/index.vue';
+
+import { PublishAudioData } from "@/data/auto/publishAudioData";
+import audioPublishEnquiry from "./PublishAudioEnquiry.vue";
+import publishAudioService from "@/service/master/publishAudioService";
+
+import { SelectOption } from "@/data/auto/selectOption";
+import { useWindowSize } from '@vueuse/core'
+import { PublishAudioEntity } from "@/data/auto/publishAudioEntity";
+import { PublishAudioDetailEntity } from "@/data/auto/publishAudioDetailEntity";
+import { BindOption } from "@/data/custom/bindOption";
+import { nextTick } from "process";
+import IconsSelect from '@/components/basic/icons-select/index.vue';
+import { PublishAudioFamilyGroupEntity } from "@/data/auto/publishAudioFamilyGroupEntity";
+import { FamilyGroupEntity } from "@/data/auto/familyGroupEntity";
+import familyGroupEnquiry from './FamilyGroupEnquiry.vue';
+import { PublishAudioFamilyGroupDisplayData } from "@/data/auto/publishAudioFamilyGroupDisplayData";
+import dmsFileEnquiryModal from './DmsFileEnquiryModal.vue';
+import { DmsFileUploadViewDisplayData } from "@/data/auto/dmsFileUploadViewDisplayData";
+import { FileTypePolicy } from "@/policy/custom/fileTypePolicy";
+import { PublishAudioDetailDisplayData } from "@/data/auto/publishAudioDetailDisplayData";
+import { masterOperationToEnquiryMethodKey, MasterOperationToEnquiryModelOption, operationToEnquiryMethodKey, OperationToEnquiryModelOption } from "@/injections"
+import { useLoginProfileStore } from "@/store/modules/loginProfile";
+
+//================inject================
+const loading = ref<boolean>(false);
+//================inject================
+
+const { width, height } = useWindowSize()
+
+const cardStyle = computed(() => {
+    return width.value < 640 ? 'width: 300px' : 'width:' + (width.value - 400) + 'px'
+});
+
+const route = useRoute();
+const router = useRouter();
+
+const publishName = ref<string>(route.params.id as string)
+const mode = ref<string>(route.params.mode as string)
+
+const isEdit = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const showModal = ref<boolean>(false);
+const showModalFamilyGroup = ref<boolean>(false);
+const showModalDmsFile = ref<boolean>(false);
+const showModalPermission = ref<boolean>(false);
+const rowSelectionType = ref<string>('radio');
+const showModalType = ref<number>(0);
+
+const data = ref<PublishAudioData>(new PublishAudioData());
+const hasData = ref<boolean>(false);
+
+
+const resultH = ref('');
+const oldPublishName = ref<string>(publishName.value);
+const initBindOptions = ref<BindOption[]>([]);
+
+interface AudioPublishEnquiry {
+    keys: PublishAudioEntity[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+
+const enquiry = ref<AudioPublishEnquiry | null>(null)
+
+interface FamilyGroupEnquiry {
+    keys: FamilyGroupEntity[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+const groupEnquiry = ref<FamilyGroupEnquiry | null>(null)
+
+interface DmsFileEnquiry {
+    keys: DmsFileUploadViewDisplayData[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+const dmsFileEnquiry = ref<DmsFileEnquiry | null>(null)
+
+const activeKey = ref(['1', '2']);
+
+const columnDtls = ref([
+    {
+        title: "",
+        dataIndex: PublishAudioDetailEntity.PIC,
+        width: '45%',
+        sequence: 1,
+        hidden: 'N'
+    },
+]);
+//================provide================
+//弹出(Function Modal)
+provide("isModalAudioPublish", showModal);
+//记录单选还是多选(Modal)
+provide("selectionTypeAudioPublish", rowSelectionType);
+//初始化查询条件的值(Modal)
+provide("initBindOptionsAudioPublish", initBindOptions);
+
+provide("isModalFamilyGroup", showModalFamilyGroup);
+provide("selectionTypeFamilyGroup", 'checkbox');
+
+provide("isModalDmsFile", showModalDmsFile);
+provide("selectionTypeDmsFile", 'radio');
+//================provide================
+
+onBeforeMount(async () => {
+
+})
+
+onMounted(() => {
+    let pContext: PermissionContext = usePermissionContext();
+    canAmend.value = pContext.canAmend(route.meta.permission as string);
+    canDelete.value = pContext.canDelete(route.meta.permission as string);
+    canCreate.value = pContext.canCreate(route.meta.permission as string);
+    computResultTableHeight();
+
+    if (publishName.value && publishName.value.trim().length > 0) {
+        onSearch();
+    }
+    if (mode.value && mode.value == 'create') {
+        onCreate();
+        isEdit.value = true;
+    }
+    else if (mode.value && mode.value == 'amend') {
+        isEdit.value = true;
+    }
+})
+
+const computResultTableHeight = () => {
+    if (width.value > 640) {
+        resultH.value = 'calc(100vh -  220px )';
+    }
+    else {
+        resultH.value = 'calc(100vh -  250px )';
+    }
+}
+
+const onModalSearch = (() => {
+    showModal.value = true;
+    rowSelectionType.value = 'radio';
+    showModalType.value = 0;
+})
+
+const currentModal = ref<string>('');
+
+const modelOption = ref<MasterOperationToEnquiryModelOption>(new MasterOperationToEnquiryModelOption());
+modelOption.value.initBindOptionsDmsFile = [];
+
+const getOperationToEnquiryModelOption = () => {
+    return modelOption.value
+}
+provide(
+    masterOperationToEnquiryMethodKey,
+    {
+        getOperationToEnquiryModelOption,
+    }
+);
+
+const onModalSearchPic = (() => {
+    currentModal.value = FileTypePolicy.PHOTO;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const onModalSearchUrl = (() => {
+    currentModal.value = FileTypePolicy.AUDIO;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const PackInitBindOptions = (value: string) => {
+    modelOption.value.initBindOptionsDmsFile = [];
+    let bo: BindOption = new BindOption();
+    bo.BindValue = DmsFileUploadViewDisplayData.DB_FILE_TAG;
+    bo.Value = value;
+    bo.disabled = true;
+    modelOption.value.initBindOptionsDmsFile?.push(bo);
+};
+
+const onModalSearchLrc = (() => {
+    currentModal.value = FileTypePolicy.LYRIC;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const onSearch = (async () => {
+
+    if (!publishName.value || publishName.value.trim().length == 0) {
+        notification.info({
+            message: '系统提示：',
+            description: '请输入发布编号',
+            placement: "topRight",
+        });
+        hasData.value = false;
+        return;
+    }
+
+    await publishAudioService.FindByKey(publishName.value.trim()).then((res) => {
+        data.value = res;
+    });
+
+    if (data.value.PublishAudio == null) {
+        notification.info({
+            message: '系统提示：',
+            description: '记录不存在',
+            placement: "topRight",
+        });
+        data.value = new PublishAudioData();
+        hasData.value = false;
+        return;
+    }
+
+    let userLoginProfile = useLoginProfileStore();
+
+    if (data.value.PublishAudio.OwnerName != userLoginProfile.getUsername()) {
+        canAmend.value = false;
+        canDelete.value = false;
+    }
+
+    hasData.value = true;
+})
+
+const onReset = (() => {
+    data.value = new PublishAudioData();
+    data.value.Details = [];
+    publishName.value = '';
+    hasData.value = false;
+})
+
+
+
+const onViewAudioPreview = (async () => {
+    router.push({ name: "AudioPreviews", params: { id: data.value.PublishAudio.PublishName, mode: 'view' } });
+})
+
+const onCreate = (() => {
+    onReset();
+    isEdit.value = true;
+})
+
+const onAmend = (() => {
+    isEdit.value = true;
+    oldPublishName.value = unref(data.value.PublishAudio.PublishName);
+})
+
+const onSave = (async () => {
+
+    try {
+        loading.value = true;
+
+        if (!data.value.Details) data.value.Details = [];
+        if (!data.value.FamilyGroups) data.value.FamilyGroups = [];
+
+        if (data.value.PublishAudio?.CreatedBy)
+            data.value = await publishAudioService.Update(data.value);
+        else {
+            data.value = await publishAudioService.Insert(data.value);
+        }
+
+        publishName.value = data.value.PublishAudio.PublishName;
+
+        loading.value = false;
+        hasData.value = true;
+        isEdit.value = false;
+
+    } catch (error) {
+        loading.value = false;
+        console.log(error);
+    }
+
+})
+
+const onCancel = (() => {
+    onReset();
+    if (oldPublishName.value && oldPublishName.value.length > 0) {
+        publishName.value = oldPublishName.value;
+        onSearch();
+    }
+    isEdit.value = false;
+})
+
+const onDelete = (async () => {
+    try {
+        loading.value = true;
+
+        await publishAudioService.Delete(data.value.PublishAudio.PublishName);
+
+        onReset();
+        loading.value = false;
+
+    } catch (error) {
+        loading.value = false;
+        console.log(error);
+    }
+})
+
+const handleCance = (async () => {
+
+})
+
+
+const upSon = (index: number) => {
+    if (index > 0) {
+        const item = data.value.Details.splice(index, 1)[0];
+        data.value.Details.splice(index - 1, 0, item);
+    }
+};
+
+const downSon = (index: number) => {
+    if (index < data.value.Details.length) {
+        const item = data.value.Details.splice(index, 1)[0];
+        data.value.Details.splice(index + 1, 0, item);
+    }
+};
+
+const deleteSon = (key: number) => {
+    data.value.Details = data.value.Details.filter(item => item.DetailId !== key);
+};
+
+const handleSelect = (async () => {
+    if (enquiry.value) {
+        if (enquiry.value.keys.length > 0) {
+            //查询弹出
+            if (showModalType.value == 0) {
+                publishName.value = enquiry.value.keys[0].PublishName;
+
+                onSearch();
+            }
+            showModal.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const selected = ref<PublishAudioDetailDisplayData[]>([])
+
+const handleSelectDmsFile = (async () => {
+    if (dmsFileEnquiry.value) {
+        if (dmsFileEnquiry.value.keys.length > 0) {
+            //查询弹出
+            data.value.Details.forEach((item: PublishAudioDetailDisplayData) => {
+                if (item.DetailId == selected.value[0].DetailId) {
+                    if (currentModal.value == FileTypePolicy.AUDIO) {
+                        item.Url = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                    else if (currentModal.value == FileTypePolicy.PHOTO) {
+                        item.Pic = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                    else if (currentModal.value == FileTypePolicy.LYRIC) {
+                        item.Lrc = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                }
+            });
+
+            showModalDmsFile.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const customRow = (record: any) => {
+    return {
+        onDblclick: (event: any) => {
+            if (selected.value.includes(record)) {
+                selected.value = selected.value.filter(item => item !== record);
+            }
+            else {
+                selected.value.push(record);
+            }
+        },
+        onclick: (event: any) => {
+            if (unref(rowSelectionType) == 'radio') {
+                selected.value = [record];
+            }
+            else {
+                if (selected.value.includes(record)) {
+                    selected.value = selected.value.filter(item => item !== record);
+                }
+                else {
+                    selected.value.push(record);
+                }
+            }
+        }
+    }
+}
+
+const handleSelectFamilyGroup = (async () => {
+    if (groupEnquiry.value) {
+        if (groupEnquiry.value.keys.length > 0) {
+            //查询弹出
+            if (!data.value.FamilyGroups) data.value.FamilyGroups = [];
+            groupEnquiry.value.keys.forEach((element: FamilyGroupEntity) => {
+                if (data.value.FamilyGroups.filter(item => item.FamilyName == element.FamilyName).length == 0) {
+                    let ent: PublishAudioFamilyGroupDisplayData = new PublishAudioFamilyGroupDisplayData();
+                    ent.FamilyName = element.FamilyName;
+                    ent.FamilyLocalName = element.FamilyLocalName;
+                    ent.Notice = element.Notice;
+                    data.value.FamilyGroups.push(ent);
+                }
+            });
+            showModalFamilyGroup.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const addFamilyGroup = (event: MouseEvent) => {
+    showModalFamilyGroup.value = true;
+    // If you don't want click extra trigger collapse, you can prevent this:
+    event.stopPropagation();
+};
+
+const deleteFamilyGroup = (key: string) => {
+    data.value.FamilyGroups = data.value.FamilyGroups.filter(item => item.FamilyName !== key);
+};
+
+
+const onViewActorOperation = ((familyName: string) => {
+    router.push({ name: "FamilyGroupOperation", params: { id: familyName, mode: 'view' } });
+})
+
+
+
+const columnFamilyGroups = ref([
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: '10%',
+        align: 'center',
+        fixed: 'left',
+        sequence: 0,
+        hidden: 'N',
+        format: ''
+    },
+    {
+        title: "群组代碼",
+        dataIndex: FamilyGroupEntity.FAMILY_NAME,
+        width: '30%',
+        sequence: 1,
+        hidden: 'N'
+    },
+    {
+        title: "群组名称",
+        dataIndex: FamilyGroupEntity.FAMILY_LOCAL_NAME,
+        width: '30%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "群组描述",
+        dataIndex: FamilyGroupEntity.NOTICE,
+        width: '30%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "",
+        dataIndex: 'operation',
+        width: '5%',
+        sequence: 2,
+        hidden: 'N'
+    }
+]);
+
+
+</script>
+<style lang="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>
\ No newline at end of file
diff --git a/WebVue/src/views/master/PublishVideoOperation.vue b/WebVue/src/views/master/PublishVideoOperation.vue
new file mode 100644
index 0000000..30b8a66
--- /dev/null
+++ b/WebVue/src/views/master/PublishVideoOperation.vue
@@ -0,0 +1,812 @@
+<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="publishName" flex="auto"
+                                    @search="onModalSearch" />
+                            </a-col>
+                        </a-row>
+                    </a-col>
+                    <a-col :lg="12" :sm="24">
+                        <a-space>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(FileSearchOutlined)"
+                                @click.prevent="onSearch">查询</a-button>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(ClearOutlined)"
+                                @click.prevent="onReset">重置</a-button>
+                            <a-button type="primary" :disabled="isEdit" :icon="h(FileAddOutlined)"
+                                @click.prevent="onCreate">新增</a-button>
+                        </a-space>
+                    </a-col>
+                </a-row>
+            </div>
+            <div class="page-main" :style="{ height: resultH }">
+                <a-row :gutter="[16, 8]">
+                    <a-col :lg="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">
+
+                            </a-col>
+                            <a-col :lg="3" :sm="12" style="min-width: 300px;">
+                                <Checkbox v-model:value="data.PublishVideo.OpenIndc" true-value="Y" false-value="N"
+                                    :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;">
+                                <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>
+                                            <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>
+                                        </div>
+                                    </template>
+                                    <template #actions>
+                                        <span v-if="isEdit">
+                                            <UpSquareTwoTone :style="{ fontSize: '24px', color: '#08c' }"
+                                                @click="upSon(datas.index)" />上移
+                                        </span>
+                                        <span v-if="isEdit">
+                                            <DownSquareTwoTone
+                                                :style="{ fontSize: '24px', color: '#08c', marginLeft: '20px', marginRight: '20px' }"
+                                                @click="downSon(datas.index)" />下移
+                                        </span>
+                                        <span v-if="isEdit">
+                                            <DeleteOutlined :style="{ fontSize: '24px', color: 'red' }"
+                                                @click="deleteSon(datas.record.DetailId)" />删除
+                                        </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">
+                                    <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>
+            <div class="page-footer">
+                <div style="">
+                    <a-row :gutter="24">
+                        <a-col :lg="24" :sm="24">
+                            <div>
+                                <a-row v-if="isEdit" :gutter="[16, 8]">
+                                    <a-space>
+                                        <a-popconfirm v-if="data.PublishVideo.CreatedBy" title="确定是否取消修改?" ok-text="是"
+                                            cancel-text="否" @confirm="onCancel">
+                                            <a-button type="primary" ghost :icon="h(UndoOutlined)">取消</a-button>
+                                        </a-popconfirm>
+                                        <a-button v-if="!data.PublishVideo.CreatedBy" type="primary" ghost
+                                            :icon="h(UndoOutlined)" @click.prevent="onCancel">取消</a-button>
+                                        <a-button type="primary" ghost :icon="h(SaveOutlined)"
+                                            @click.prevent="onSave">保存</a-button>
+                                    </a-space>
+                                </a-row>
+                                <a-row v-else :gutter="[16, 8]">
+                                    <a-space>
+                                        <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
+                                            :disabled="!hasData" @click.prevent="onAmend">修改</a-button>
+                                        <a-popconfirm :disabled="!hasData" title="确定是否删除这条记录?" ok-text="是"
+                                            cancel-text="否" @confirm="onDelete">
+                                            <a-button type="primary" danger :icon="h(DeleteOutlined)"
+                                                :disabled="!hasData" v-if="canDelete">删除</a-button>
+                                        </a-popconfirm>
+                                        <a-button type="primary" v-if="canAmend" :icon="h(EditOutlined)"
+                                            :disabled="!hasData" @click.prevent="onViewVideoPreview">影视厅</a-button>
+                                    </a-space>
+                                </a-row>
+                            </div>
+                        </a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+        <dragModal v-model:open="showModal" width="80%" 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"
+            :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"
+            :fullscreen="width < 640" @ok="handleSelectDmsFile">
+            <dmsFileEnquiryModal ref="dmsFileEnquiry" @on-row-dblclick="handleSelectDmsFile">
+            </dmsFileEnquiryModal>
+        </dragModal>
+    </a-spin>
+</template>
+<script lang="ts" setup>
+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 { PermissionContext, usePermissionContext } from "@/hooks/PermissionContext"
+import dragModal from "@/components/basic/DragModal.vue"
+import Checkbox from '@/components/basic/check-box/index.vue';
+
+import { PublishVideoData } from "@/data/auto/publishVideoData";
+import videoPublishEnquiry from "./PublishVideoEnquiry.vue";
+import publishVideoService from "@/service/master/publishVideoService";
+
+import { SelectOption } from "@/data/auto/selectOption";
+import { useWindowSize } from '@vueuse/core'
+import { PublishVideoEntity } from "@/data/auto/publishVideoEntity";
+import { PublishVideoDetailEntity } from "@/data/auto/publishVideoDetailEntity";
+import { BindOption } from "@/data/custom/bindOption";
+import { nextTick } from "process";
+import IconsSelect from '@/components/basic/icons-select/index.vue';
+import { PublishVideoFamilyGroupEntity } from "@/data/auto/publishVideoFamilyGroupEntity";
+import { FamilyGroupEntity } from "@/data/auto/familyGroupEntity";
+import familyGroupEnquiry from './FamilyGroupEnquiry.vue';
+import { PublishVideoFamilyGroupDisplayData } from "@/data/auto/publishVideoFamilyGroupDisplayData";
+import dmsFileEnquiryModal from './DmsFileEnquiryModal.vue';
+import { DmsFileUploadViewDisplayData } from "@/data/auto/dmsFileUploadViewDisplayData";
+import { FileTypePolicy } from "@/policy/custom/fileTypePolicy";
+import { PublishVideoDetailDisplayData } from "@/data/auto/publishVideoDetailDisplayData";
+import { masterOperationToEnquiryMethodKey, MasterOperationToEnquiryModelOption, operationToEnquiryMethodKey, OperationToEnquiryModelOption } from "@/injections"
+import { useLoginProfileStore } from "@/store/modules/loginProfile";
+//================inject================
+const loading = ref<boolean>(false);
+//================inject================
+
+const { width, height } = useWindowSize()
+
+const cardStyle = computed(() => {
+    return width.value < 640 ? 'width: 300px' : 'width:' + (width.value - 400) + 'px'
+});
+
+const route = useRoute();
+const router = useRouter();
+
+const publishName = ref<string>(route.params.id as string)
+const mode = ref<string>(route.params.mode as string)
+
+const isEdit = ref<boolean>(false);
+const canAmend = ref<boolean>(false);
+const canDelete = ref<boolean>(false);
+const canCreate = ref<boolean>(false);
+const showModal = ref<boolean>(false);
+const showModalFamilyGroup = ref<boolean>(false);
+const showModalDmsFile = ref<boolean>(false);
+const showModalPermission = ref<boolean>(false);
+const rowSelectionType = ref<string>('radio');
+const showModalType = ref<number>(0);
+
+const data = ref<PublishVideoData>(new PublishVideoData());
+const hasData = ref<boolean>(false);
+
+
+const resultH = ref('');
+const oldPublishName = ref<string>(publishName.value);
+const initBindOptions = ref<BindOption[]>([]);
+
+interface VideoPublishEnquiry {
+    keys: PublishVideoEntity[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+
+const enquiry = ref<VideoPublishEnquiry | null>(null)
+
+interface FamilyGroupEnquiry {
+    keys: FamilyGroupEntity[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+const groupEnquiry = ref<FamilyGroupEnquiry | null>(null)
+
+interface DmsFileEnquiry {
+    keys: DmsFileUploadViewDisplayData[],
+    setBindOptionValue(bindValue: string, value: string, value1: string, values: string[]): void,
+}
+
+
+const dmsFileEnquiry = ref<DmsFileEnquiry | null>(null)
+
+const activeKey = ref(['1', '2']);
+
+const columnDtls = ref([
+    {
+        title: "",
+        dataIndex: PublishVideoDetailEntity.PIC,
+        width: '45%',
+        sequence: 1,
+        hidden: 'N'
+    },
+]);
+//================provide================
+//弹出(Function Modal)
+provide("isModalVideoPublish", showModal);
+//记录单选还是多选(Modal)
+provide("selectionTypeVideoPublish", rowSelectionType);
+//初始化查询条件的值(Modal)
+provide("initBindOptionsVideoPublish", initBindOptions);
+
+provide("isModalFamilyGroup", showModalFamilyGroup);
+provide("selectionTypeFamilyGroup", 'checkbox');
+
+provide("isModalDmsFile", showModalDmsFile);
+provide("selectionTypeDmsFile", 'radio');
+//================provide================
+
+onBeforeMount(async () => {
+
+})
+
+onMounted(() => {
+    let pContext: PermissionContext = usePermissionContext();
+    canAmend.value = pContext.canAmend(route.meta.permission as string);
+    canDelete.value = pContext.canDelete(route.meta.permission as string);
+    canCreate.value = pContext.canCreate(route.meta.permission as string);
+    computResultTableHeight();
+
+    if (publishName.value && publishName.value.trim().length > 0) {
+        onSearch();
+    }
+    if (mode.value && mode.value == 'create') {
+        onCreate();
+        isEdit.value = true;
+    }
+    else if (mode.value && mode.value == 'amend') {
+        isEdit.value = true;
+    }
+})
+
+const computResultTableHeight = () => {
+    if (width.value > 640) {
+        resultH.value = 'calc(100vh -  220px )';
+    }
+    else {
+        resultH.value = 'calc(100vh -  250px )';
+    }
+}
+
+const onModalSearch = (() => {
+    showModal.value = true;
+    rowSelectionType.value = 'radio';
+    showModalType.value = 0;
+})
+
+const currentModal = ref<string>('');
+
+const modelOption = ref<MasterOperationToEnquiryModelOption>(new MasterOperationToEnquiryModelOption());
+modelOption.value.initBindOptionsDmsFile = [];
+
+const getOperationToEnquiryModelOption = () => {
+    return modelOption.value
+}
+provide(
+    masterOperationToEnquiryMethodKey,
+    {
+        getOperationToEnquiryModelOption,
+    }
+);
+
+const onModalSearchPic = (() => {
+    currentModal.value = FileTypePolicy.PHOTO;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const onModalSearchUrl = (() => {
+    currentModal.value = FileTypePolicy.VIDEO;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const PackInitBindOptions = (value: string) => {
+    modelOption.value.initBindOptionsDmsFile = [];
+    let bo: BindOption = new BindOption();
+    bo.BindValue = DmsFileUploadViewDisplayData.DB_FILE_TAG;
+    bo.Value = value;
+    bo.disabled = true;
+    modelOption.value.initBindOptionsDmsFile?.push(bo);
+};
+
+const onModalSearchLrc = (() => {
+    currentModal.value = FileTypePolicy.LYRIC;
+    PackInitBindOptions(currentModal.value);
+    showModalDmsFile.value = true;
+})
+
+const onSearch = (async () => {
+
+    if (!publishName.value || publishName.value.trim().length == 0) {
+        notification.info({
+            message: '系统提示：',
+            description: '请输入发布编号',
+            placement: "topRight",
+        });
+        hasData.value = false;
+        return;
+    }
+
+    await publishVideoService.FindByKey(publishName.value.trim()).then((res) => {
+        data.value = res;
+    });
+
+    if (data.value.PublishVideo == null) {
+        notification.info({
+            message: '系统提示：',
+            description: '记录不存在',
+            placement: "topRight",
+        });
+        data.value = new PublishVideoData();
+        hasData.value = false;
+        return;
+    }
+
+    
+    let userLoginProfile = useLoginProfileStore();
+
+    if (data.value.PublishVideo.OwnerName != userLoginProfile.getUsername()) {
+        canAmend.value = false;
+        canDelete.value = false;
+    }
+
+    hasData.value = true;
+})
+
+const onReset = (() => {
+    data.value = new PublishVideoData();
+    data.value.Details = [];
+    publishName.value = '';
+    hasData.value = false;
+})
+
+
+
+const onViewVideoPreview = (async () => {
+    router.push({ name: "VideoPreviews", params: { id: data.value.PublishVideo.PublishName, mode: 'view' } });
+})
+
+const onCreate = (() => {
+    onReset();
+    isEdit.value = true;
+})
+
+const onAmend = (() => {
+    isEdit.value = true;
+    oldPublishName.value = unref(data.value.PublishVideo.PublishName);
+})
+
+const onSave = (async () => {
+
+    try {
+        loading.value = true;
+
+        if (!data.value.Details) data.value.Details = [];
+        if (!data.value.FamilyGroups) data.value.FamilyGroups = [];
+
+        if (data.value.PublishVideo?.CreatedBy)
+            data.value = await publishVideoService.Update(data.value);
+        else {
+            data.value = await publishVideoService.Insert(data.value);
+        }
+
+        publishName.value = data.value.PublishVideo.PublishName;
+
+        loading.value = false;
+        hasData.value = true;
+        isEdit.value = false;
+
+    } catch (error) {
+        loading.value = false;
+        console.log(error);
+    }
+
+})
+
+const onCancel = (() => {
+    onReset();
+    if (oldPublishName.value && oldPublishName.value.length > 0) {
+        publishName.value = oldPublishName.value;
+        onSearch();
+    }
+    isEdit.value = false;
+})
+
+const onDelete = (async () => {
+    try {
+        loading.value = true;
+
+        await publishVideoService.Delete(data.value.PublishVideo.PublishName);
+
+        onReset();
+        loading.value = false;
+
+    } catch (error) {
+        loading.value = false;
+        console.log(error);
+    }
+})
+
+const handleCance = (async () => {
+
+})
+
+
+const upSon = (index: number) => {
+    if (index > 0) {
+        const item = data.value.Details.splice(index, 1)[0];
+        data.value.Details.splice(index - 1, 0, item);
+    }
+};
+
+const downSon = (index: number) => {
+    if (index < data.value.Details.length) {
+        const item = data.value.Details.splice(index, 1)[0];
+        data.value.Details.splice(index + 1, 0, item);
+    }
+};
+
+const deleteSon = (key: number) => {
+    data.value.Details = data.value.Details.filter(item => item.DetailId !== key);
+};
+
+const handleSelect = (async () => {
+    if (enquiry.value) {
+        if (enquiry.value.keys.length > 0) {
+            //查询弹出
+            if (showModalType.value == 0) {
+                publishName.value = enquiry.value.keys[0].PublishName;
+
+                onSearch();
+            }
+            showModal.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const selected = ref<PublishVideoDetailDisplayData[]>([])
+
+const handleSelectDmsFile = (async () => {
+    if (dmsFileEnquiry.value) {
+        if (dmsFileEnquiry.value.keys.length > 0) {
+            //查询弹出
+            data.value.Details.forEach((item: PublishVideoDetailDisplayData) => {
+                if (item.DetailId == selected.value[0].DetailId) {
+                    if (currentModal.value == FileTypePolicy.VIDEO) {
+                        item.Url = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                    else if (currentModal.value == FileTypePolicy.PHOTO) {
+                        item.Pic = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                    else if (currentModal.value == FileTypePolicy.LYRIC) {
+                        item.Lrc = dmsFileEnquiry.value!.keys[0].OrderKey;
+                    }
+                }
+            });
+
+            showModalDmsFile.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const customRow = (record: any) => {
+    return {
+        onDblclick: (event: any) => {
+            if (selected.value.includes(record)) {
+                selected.value = selected.value.filter(item => item !== record);
+            }
+            else {
+                selected.value.push(record);
+            }
+        },
+        onclick: (event: any) => {
+            if (unref(rowSelectionType) == 'radio') {
+                selected.value = [record];
+            }
+            else {
+                if (selected.value.includes(record)) {
+                    selected.value = selected.value.filter(item => item !== record);
+                }
+                else {
+                    selected.value.push(record);
+                }
+            }
+        }
+    }
+}
+
+const handleSelectFamilyGroup = (async () => {
+    if (groupEnquiry.value) {
+        if (groupEnquiry.value.keys.length > 0) {
+            //查询弹出
+            if (!data.value.FamilyGroups) data.value.FamilyGroups = [];
+            groupEnquiry.value.keys.forEach((element: FamilyGroupEntity) => {
+                if (data.value.FamilyGroups.filter(item => item.FamilyName == element.FamilyName).length == 0) {
+                    let ent: PublishVideoFamilyGroupDisplayData = new PublishVideoFamilyGroupDisplayData();
+                    ent.FamilyName = element.FamilyName;
+                    ent.FamilyLocalName = element.FamilyLocalName;
+                    ent.Notice = element.Notice;
+                    data.value.FamilyGroups.push(ent);
+                }
+            });
+            showModalFamilyGroup.value = false;
+        }
+        else {
+            notification.info({
+                message: '系统提示：',
+                description: '请选择一条记录',
+                placement: "topRight",
+            });
+        }
+    }
+})
+
+const addFamilyGroup = (event: MouseEvent) => {
+    showModalFamilyGroup.value = true;
+    // If you don't want click extra trigger collapse, you can prevent this:
+    event.stopPropagation();
+};
+
+const deleteFamilyGroup = (key: string) => {
+    data.value.FamilyGroups = data.value.FamilyGroups.filter(item => item.FamilyName !== key);
+};
+
+
+const onViewActorOperation = ((familyName: string) => {
+    router.push({ name: "FamilyGroupOperation", params: { id: familyName, mode: 'view' } });
+})
+
+
+
+const columnFamilyGroups = ref([
+    {
+        title: '序号',
+        dataIndex: 'index',
+        width: '10%',
+        align: 'center',
+        fixed: 'left',
+        sequence: 0,
+        hidden: 'N',
+        format: ''
+    },
+    {
+        title: "群组代碼",
+        dataIndex: FamilyGroupEntity.FAMILY_NAME,
+        width: '30%',
+        sequence: 1,
+        hidden: 'N'
+    },
+    {
+        title: "群组名称",
+        dataIndex: FamilyGroupEntity.FAMILY_LOCAL_NAME,
+        width: '30%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "群组描述",
+        dataIndex: FamilyGroupEntity.NOTICE,
+        width: '30%',
+        sequence: 2,
+        hidden: 'N'
+    },
+    {
+        title: "",
+        dataIndex: 'operation',
+        width: '5%',
+        sequence: 2,
+        hidden: 'N'
+    }
+]);
+
+
+</script>
+<style lang="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>
\ No newline at end of file