From 5ffadd3f8a72fc69a817bcbe1af23786852d9da5 Mon Sep 17 00:00:00 2001
From: TermiNexus <wyt18222152539wyt@163.com>
Date: Mon, 5 Oct 2026 17:02:20 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E8=AE=A2=E9=98=85=E5=BC=8F=E8=BD=AF?=
 =?UTF-8?q?=E4=BB=B6=E6=8F=90=E4=BE=9B):=20=E6=96=B0=E5=A2=9E=E3=80=8C?=
 =?UTF-8?q?=E6=88=91=E7=9A=84=E8=AE=A2=E9=98=85=E3=80=8D=E9=A1=B5=E5=B9=B6?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E5=8A=A0=E8=BD=BD=E4=BA=A7=E5=93=81=E5=AE=9A?=
 =?UTF-8?q?=E5=88=B6=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

新增 MySubscriptions 页（列出当前用户已订阅产品、提供者与订阅部门）；对已声明 RemoteEntry 的产品经 RegisterProductRemoteApp 登记为远端应用，点「打开定制页」走 /remote-app/:code 由 RemoteAppHost 原生渲染；新增 GET /API/Subscription/MySubscriptions 客户端与类型；路由新增 subscription/my。
---
 src/api/subscription.ts                    |  20 +++
 src/apps/remoteRoutes.ts                   |  27 ++++
 src/router/index.ts                        |   6 +
 src/views/subscription/MySubscriptions.vue | 177 +++++++++++++++++++++
 4 files changed, 230 insertions(+)
 create mode 100644 src/views/subscription/MySubscriptions.vue

diff --git a/src/api/subscription.ts b/src/api/subscription.ts
index e8a9be5..085b193 100644
--- a/src/api/subscription.ts
+++ b/src/api/subscription.ts
@@ -103,6 +103,20 @@ export interface SubscriptionMemberSaveResult {
   total: number
 }
 
+/** 我的订阅条目（被订阅者视角；含提供者定制的远端页面入口） */
+export interface MySubscriptionItem {
+  SubscriptionGroupUUID: string
+  GroupName: string
+  GroupDesc: string
+  GroupStatus: number
+  Providers: SubscriptionCompanyItem[]
+  /** 提供者声明的定制页远端入口（空=提供者尚未提供定制页） */
+  RemoteEntry: string
+  RemoteModule: string
+  /** 我在该产品下订阅的部门名（展示用） */
+  MyDeptNames: string[]
+}
+
 /** 订阅式软件提供 API 客户端 */
 export const subscriptionApi = {
   /** 订阅组（产品）列表（含提供者/消费者公司） */
@@ -166,4 +180,10 @@ export const subscriptionApi = {
   /** 删除一条订阅成员 */
   deleteMember: (SubscriptionGroupUUID: string, SubscriptionMemberUUID: string): Promise<void> =>
     post<void>('/API/Subscription/Member/Delete', { SubscriptionGroupUUID, SubscriptionMemberUUID }),
+
+  // ==================== 我的订阅（被订阅者视角） ====================
+
+  /** 当前登录用户已订阅的产品（含提供者定制页远端入口） */
+  mySubscriptions: (): Promise<{ list: MySubscriptionItem[]; total: number }> =>
+    get<{ list: MySubscriptionItem[]; total: number }>('/API/Subscription/MySubscriptions'),
 }
diff --git a/src/apps/remoteRoutes.ts b/src/apps/remoteRoutes.ts
index eccec37..3eb6575 100644
--- a/src/apps/remoteRoutes.ts
+++ b/src/apps/remoteRoutes.ts
@@ -40,3 +40,30 @@ export function InstallRemoteAppRoutes(router: Router): void {
     meta: { title: '远端应用', requiresAuth: true },
   })
 }
+
+/**
+ * 为「产品定制页」登记远端应用模块，返回可直接用于 `/remote-app/:code` 的 AppCode
+ *
+ * 订阅式软件提供场景：提供者子服务器把定制页入口（RemoteEntry）声明到主服务器，
+ * 消费者在「我的订阅」里登记后点开，即由 RemoteAppHost 运行时加载并原生渲染。
+ */
+export function RegisterProductRemoteApp(
+  GroupUUID: string,
+  Title: string,
+  RemoteEntry: string,
+  RemoteModule = 'default',
+): string {
+  const Code = `sub-${GroupUUID}`
+  registerRemoteApp({
+    AppCode: Code,
+    Title: Title || '定制页',
+    Icon: 'Star',
+    FrontendRoute: `/remote-app/${Code}`,
+    FrontendType: 'remote',
+    LegacySrc: '',
+    RemoteEntry,
+    RemoteModule: RemoteModule || 'default',
+    ServiceName: 'gvsd-service-server',
+  })
+  return Code
+}
diff --git a/src/router/index.ts b/src/router/index.ts
index 2ef73f1..2828eae 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -469,6 +469,12 @@ export const staticRoutes: RouteRecordRaw[] = [
         component: () => import('@/views/subscription/Relation.vue'),
         meta: { title: '订阅关系', icon: 'Share', requiresAuth: true, menuGuarded: true },
       },
+      {
+        path: 'subscription/my',
+        name: 'SubscriptionMy',
+        component: () => import('@/views/subscription/MySubscriptions.vue'),
+        meta: { title: '我的订阅', icon: 'Star', requiresAuth: true, menuGuarded: true },
+      },
       // === OA 办公自动化流程（审批/请假/出差/会议/公告/汇报） ===
       {
         path: 'oa/approval',
diff --git a/src/views/subscription/MySubscriptions.vue b/src/views/subscription/MySubscriptions.vue
new file mode 100644
index 0000000..98f1ac5
--- /dev/null
+++ b/src/views/subscription/MySubscriptions.vue
@@ -0,0 +1,177 @@
+<script setup lang="ts">
+/**
+ * 我的订阅（被订阅者视角）
+ *
+ * 列出当前登录用户作为订阅成员（部门-员工键）已订阅的产品；
+ * 提供者若已声明定制页远端入口（RemoteEntry），点「打开定制页」即由宿主
+ * 远端微前端运行时加载并**原生渲染**（非 iframe）。
+ */
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { setPageTitle } from '@/utils/serverScope'
+import { subscriptionApi, type MySubscriptionItem } from '@/api/subscription'
+import { RegisterProductRemoteApp } from '@/apps/remoteRoutes'
+
+setPageTitle('我的订阅')
+
+const router = useRouter()
+const loading = ref(false)
+const rows = ref<MySubscriptionItem[]>([])
+
+async function load(): Promise<void> {
+  loading.value = true
+  try {
+    const r = await subscriptionApi.mySubscriptions()
+    rows.value = r.list || []
+    // 已有定制页入口的产品先登记为远端应用（点开时可即时渲染）
+    for (const it of rows.value) {
+      if (it.RemoteEntry) {
+        RegisterProductRemoteApp(it.SubscriptionGroupUUID, it.GroupName, it.RemoteEntry, it.RemoteModule)
+      }
+    }
+  } catch {
+    /* 拦截器已提示 */
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 打开产品定制页（登记远端应用 → 跳远端宿主路由原生渲染） */
+function openCustomPage(row: MySubscriptionItem): void {
+  if (!row.RemoteEntry) {
+    ElMessage.info('该产品暂未提供定制页')
+    return
+  }
+  const code = RegisterProductRemoteApp(
+    row.SubscriptionGroupUUID, row.GroupName, row.RemoteEntry, row.RemoteModule,
+  )
+  router.push({ path: `/remote-app/${code}` })
+}
+
+onMounted(load)
+</script>
+
+<template>
+  <div class="my-sub-page">
+    <el-card shadow="never">
+      <template #header>
+        <div class="page-head">
+          <el-icon><Star /></el-icon>
+          <span class="page-title">我的订阅</span>
+          <span class="page-sub">你是以下产品的订阅成员；提供者若已提供定制页，可直接打开</span>
+          <div class="spacer" />
+          <el-button @click="load"><el-icon><Refresh /></el-icon>刷新</el-button>
+        </div>
+      </template>
+
+      <div v-loading="loading" class="sub-list">
+        <el-empty
+          v-if="!loading && !rows.length"
+          description="你还没有订阅任何产品"
+          :image-size="90"
+        />
+        <div v-for="r in rows" :key="r.SubscriptionGroupUUID" class="sub-card">
+          <div class="sub-head">
+            <span class="sub-name">{{ r.GroupName }}</span>
+            <el-tag :type="r.GroupStatus ? 'success' : 'info'" size="small" effect="plain">
+              {{ r.GroupStatus ? '启用' : '停用' }}
+            </el-tag>
+            <div class="spacer" />
+            <el-button type="primary" :disabled="!r.RemoteEntry" @click="openCustomPage(r)">
+              <el-icon><Link /></el-icon>{{ r.RemoteEntry ? '打开定制页' : '暂无定制页' }}
+            </el-button>
+          </div>
+          <div v-if="r.GroupDesc" class="sub-desc">{{ r.GroupDesc }}</div>
+          <div class="sub-meta">
+            <span class="meta-label">提供者：</span>
+            <el-tag
+              v-for="c in r.Providers"
+              :key="c.CompanyUUID"
+              size="small"
+              effect="plain"
+            >{{ c.CompanyName }}</el-tag>
+            <span v-if="!r.Providers.length" class="empty-tip">未指定</span>
+          </div>
+          <div class="sub-meta">
+            <span class="meta-label">我的订阅部门：</span>
+            <el-tag
+              v-for="d in r.MyDeptNames"
+              :key="d"
+              size="small"
+              type="info"
+              effect="plain"
+            >{{ d }}</el-tag>
+            <span v-if="!r.MyDeptNames.length" class="empty-tip">—</span>
+          </div>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.my-sub-page {
+  padding: 16px;
+  box-sizing: border-box;
+}
+.page-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+  .page-title {
+    font-weight: 600;
+    font-size: 15px;
+    flex-shrink: 0;
+  }
+  .page-sub {
+    font-size: 12px;
+    color: var(--el-text-color-secondary);
+    min-width: 0;
+  }
+}
+.spacer {
+  flex: 1;
+}
+.sub-list {
+  min-height: 120px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.sub-card {
+  border: 1px solid var(--el-border-color-lighter);
+  border-radius: 8px;
+  padding: 12px 14px;
+}
+.sub-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.sub-name {
+  font-size: 14px;
+  font-weight: 600;
+}
+.sub-desc {
+  margin-top: 6px;
+  font-size: 13px;
+  color: var(--el-text-color-secondary);
+}
+.sub-meta {
+  margin-top: 8px;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 6px;
+  font-size: 12px;
+}
+.meta-label {
+  color: var(--el-text-color-regular);
+}
+.empty-tip {
+  font-size: 12px;
+  color: var(--el-text-color-placeholder);
+}
+</style>