From bfd407d75b7fb5de305f776be3d5638b1f13d6e0 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Tue, 19 May 2026 17:18:48 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(im):=20=E7=BB=A7=E7=BB=AD?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A2=91=E9=81=93=E7=9A=84=E5=90=84=E7=A7=8D?=
 =?UTF-8?q?=E4=BB=A3=E7=A0=81=EF=BC=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/user/index.ts                  |   4 +-
 .../im/home/composables/useMessagePuller.ts   |  14 +-
 src/views/im/home/store/websocketStore.ts     |   2 +-
 .../channel/material/ChannelMaterialForm.vue  | 138 ++++++++++++++++++
 src/views/im/utils/channel.ts                 |  18 +++
 src/views/im/utils/message.ts                 |   1 -
 6 files changed, 160 insertions(+), 17 deletions(-)
 create mode 100644 src/views/im/manager/channel/material/ChannelMaterialForm.vue
 create mode 100644 src/views/im/utils/channel.ts

diff --git a/src/api/system/user/index.ts b/src/api/system/user/index.ts
index 3c243afec..39fde53b0 100644
--- a/src/api/system/user/index.ts
+++ b/src/api/system/user/index.ts
@@ -51,8 +51,8 @@ export const getAllUser = () => {
  * @param id
  * @returns
  */
-export const getDeptUser = (id: number): Promise<UserVO[]> => {
-  return request.get({ url: '/system/user/simple-list?id=' + id })
+export const getDeptUser = (deptId: number): Promise<UserVO[]> => {
+  return request.get({ url: '/system/user/simple-list?deptId=' + deptId })
 }
 
 // 查询用户详情
diff --git a/src/views/im/home/composables/useMessagePuller.ts b/src/views/im/home/composables/useMessagePuller.ts
index 859429a0b..e5096334d 100644
--- a/src/views/im/home/composables/useMessagePuller.ts
+++ b/src/views/im/home/composables/useMessagePuller.ts
@@ -29,21 +29,9 @@ import {
   MESSAGE_PRIVATE_READ_ENABLED
 } from '../../utils/config'
 import { useUserStore } from '@/store/modules/user'
-import { useChannelStore } from '../store/channelStore'
+import { buildChannelConversationStub } from '../../utils/channel'
 import type { Message } from '../types'
 
-/** 构建频道会话描述；优先从 channelStore 取真实 name / avatar，缺失时退化为占位 */
-// TODO @AI：这个可以抽到 channel.ts 搞个工具类么？类似 user.ts 获取名字这种。
-export const buildChannelConversationStub = (channelId: number) => {
-  const channel = useChannelStore().getChannel(channelId)
-  return {
-    type: ImConversationType.CHANNEL,
-    targetId: channelId,
-    name: channel?.name || `频道 ${channelId}`,
-    avatar: channel?.avatar || ''
-  }
-}
-
 /**
  * 消息增量拉取：登录后分页拉取离线期间的新消息
  *
diff --git a/src/views/im/home/store/websocketStore.ts b/src/views/im/home/store/websocketStore.ts
index 0da3c9e84..b60cc159d 100644
--- a/src/views/im/home/store/websocketStore.ts
+++ b/src/views/im/home/store/websocketStore.ts
@@ -30,7 +30,7 @@ import {
 import { readPrivateMessages as apiReadPrivateMessages } from '@/api/im/message/private'
 import { readGroupMessages as apiReadGroupMessages } from '@/api/im/message/group'
 import type { ImChannelMessageRespVO } from '@/api/im/message/channel'
-import { buildChannelConversationStub } from '../composables/useMessagePuller'
+import { buildChannelConversationStub } from '../../utils/channel'
 import type {
   WebSocketFrame,
   ImPrivateMessageDTO,
diff --git a/src/views/im/manager/channel/material/ChannelMaterialForm.vue b/src/views/im/manager/channel/material/ChannelMaterialForm.vue
new file mode 100644
index 000000000..650cc7dc0
--- /dev/null
+++ b/src/views/im/manager/channel/material/ChannelMaterialForm.vue
@@ -0,0 +1,138 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="720">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="所属频道" prop="channelId">
+        <!-- TODO @AI：使用 channelselect 组件 -->
+        <el-select v-model="formData.channelId" placeholder="请选择频道" class="!w-full">
+          <el-option v-for="c in props.channelList" :key="c.id" :label="c.name" :value="c.id" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="标题" prop="title">
+        <el-input v-model="formData.title" placeholder="图文标题" maxlength="128" show-word-limit />
+      </el-form-item>
+      <el-form-item label="封面图" prop="coverUrl">
+        <el-input v-model="formData.coverUrl" placeholder="封面图 URL" />
+      </el-form-item>
+      <el-form-item label="摘要" prop="summary">
+        <el-input
+          v-model="formData.summary"
+          placeholder="一句话摘要"
+          type="textarea"
+          :rows="2"
+          maxlength="255"
+          show-word-limit
+        />
+      </el-form-item>
+      <!-- TODO @AI：需要增加 type； -->
+      <el-form-item label="跳转链接" prop="url">
+        <el-input
+          v-model="formData.url"
+          placeholder="为空走站内详情页渲染 content；非空则跳此链接"
+        />
+      </el-form-item>
+      <el-form-item label="正文" prop="content">
+        <el-input
+          v-model="formData.content"
+          placeholder="富文本 HTML"
+          type="textarea"
+          :rows="8"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+
+<script lang="ts" setup>
+// TODO @AI：补充一些注释，对齐 system user form；
+import * as MaterialApi from '@/api/im/manager/channel/material'
+import type { ImManagerChannelVO } from '@/api/im/manager/channel'
+
+defineOptions({ name: 'ImChannelMaterialForm' })
+
+const props = defineProps<{ channelList: ImManagerChannelVO[] }>()
+
+const { t } = useI18n()
+const message = useMessage()
+
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const formLoading = ref(false)
+const formType = ref('')
+const formData = ref({
+  id: undefined as number | undefined,
+  channelId: undefined as number | undefined,
+  // TODO @AI：不是这种 type；是 1 为外链；2 为图文；
+  type: 125, // MATERIAL
+  title: '',
+  coverUrl: '',
+  summary: '',
+  content: '',
+  url: ''
+})
+const formRules = reactive({
+  channelId: [{ required: true, message: '所属频道不能为空', trigger: 'change' }],
+  title: [{ required: true, message: '标题不能为空', trigger: 'blur' }]
+})
+const formRef = ref()
+
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  if (id) {
+    formLoading.value = true
+    try {
+      formData.value = await MaterialApi.getManagerChannelMaterial(id)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ open })
+
+const emit = defineEmits(['success'])
+
+const submitForm = async () => {
+  await formRef.value.validate()
+  formLoading.value = true
+  try {
+    const data = formData.value as MaterialApi.ImManagerChannelMaterialVO
+    if (formType.value === 'create') {
+      await MaterialApi.createManagerChannelMaterial(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await MaterialApi.updateManagerChannelMaterial(data)
+      message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+const resetForm = () => {
+  formData.value = {
+    id: undefined,
+    channelId: undefined,
+    type: 125,
+    title: '',
+    coverUrl: '',
+    summary: '',
+    content: '',
+    url: ''
+  }
+  formRef.value?.resetFields()
+}
+</script>
diff --git a/src/views/im/utils/channel.ts b/src/views/im/utils/channel.ts
new file mode 100644
index 000000000..5276fb257
--- /dev/null
+++ b/src/views/im/utils/channel.ts
@@ -0,0 +1,18 @@
+import { useChannelStore } from '../home/store/channelStore'
+import { ImConversationType } from './constants'
+
+/**
+ * 构建频道会话描述（type / targetId / name / avatar）
+ *
+ * 优先用 channelStore 拉到的真实名称 / 头像；本地缓存还没拉到时退化为「频道 N」占位文案。
+ * 抽到 utils/channel.ts 后，useMessagePuller / websocketStore 共用同一份占位逻辑，避免多处复制；类似 utils/user.ts 取昵称的工具集。
+ */
+export const buildChannelConversationStub = (channelId: number) => {
+  const channel = useChannelStore().getChannel(channelId)
+  return {
+    type: ImConversationType.CHANNEL,
+    targetId: channelId,
+    name: channel?.name || `频道 ${channelId}`,
+    avatar: channel?.avatar || ''
+  }
+}
diff --git a/src/views/im/utils/message.ts b/src/views/im/utils/message.ts
index f4b0208c9..dc0a33681 100644
--- a/src/views/im/utils/message.ts
+++ b/src/views/im/utils/message.ts
@@ -307,7 +307,6 @@ export interface FaceMessage extends Quotable {
 
 /** 合并转发的单条内嵌消息快照（对齐后端 MergeMessage.Item） */
 export interface MergeMessageItem {
-  // TODO @AI：是不是把 messageId 改成 id，和原本的更统一一点？
   /** 原消息编号；仅做溯源标识 */
   messageId: number
   /** 发送人编号 */