smart-flow/yudao-ui-admin-vben
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 自动回复迁移

Browse Source
This commit is contained in:
hw
2025-11-04 16:53:08 +08:00
parent 7a5f4b01e2
commit 84795d10cd
28 changed files with 2060 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web-antd/package.json
View File

@@ -43,6 +43,7 @@
"@vben/styles": "workspace:*",
"@vben/types": "workspace:*",
"@vben/utils": "workspace:*",
"@videojs-player/vue": "catalog:",
"@vueuse/core": "catalog:",
"@vueuse/integrations": "catalog:",
"ant-design-vue": "catalog:",
@@ -59,6 +60,7 @@
"pinia": "catalog:",
"steady-xml": "catalog:",
"tinymce": "catalog:",
"video.js": "catalog:",
"vue": "catalog:",
"vue-dompurify-html": "catalog:",
"vue-router": "catalog:",

BIN
apps/web-antd/src/assets/imgs/wechat.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

11
apps/web-antd/src/store/index.ts
View File

@@ -1 +1,12 @@
import type { App } from 'vue';
import { createPinia } from 'pinia';
export * from './auth';
const store = createPinia();
export const setupStore = (app: App<Element>) => {
app.use(store);
};
export { store };

202
apps/web-antd/src/store/tagsView.ts Normal file
View File

@@ -0,0 +1,202 @@
import type { RouteLocationNormalizedLoaded } from 'vue-router';
import { useUserStore } from '@vben/stores';
import { defineStore } from 'pinia';
import { router } from '#/router';
import { findIndex } from '#/utils';
import { getRawRoute } from '#/utils/routerHelper';
import { store } from './index';
const userStore = useUserStore();
export interface TagsViewState {
visitedViews: RouteLocationNormalizedLoaded[];
cachedViews: Set<string>;
selectedTag?: RouteLocationNormalizedLoaded;
}
export const useTagsViewStore = defineStore('tagsView', {
state: (): TagsViewState => ({
visitedViews: [],
cachedViews: new Set(),
selectedTag: undefined,
}),
getters: {
getVisitedViews(): RouteLocationNormalizedLoaded[] {
return this.visitedViews;
},
getCachedViews(): string[] {
return [...this.cachedViews];
},
getSelectedTag(): RouteLocationNormalizedLoaded | undefined {
return this.selectedTag;
},
},
actions: {
// 新增缓存和tag
addView(view: RouteLocationNormalizedLoaded): void {
this.addVisitedView(view);
this.addCachedView();
},
// 新增tag
addVisitedView(view: RouteLocationNormalizedLoaded) {
if (this.visitedViews.some((v) => v.fullPath === view.fullPath)) return;
if (view.meta?.noTagsView) return;
const visitedView = Object.assign({}, view, {
title: view.meta?.title || 'no-name',
});
if (visitedView.meta) {
const titleSuffixList: string[] = [];
this.visitedViews.forEach((v) => {
if (
v.path === visitedView.path &&
v.meta?.title === visitedView.meta?.title
) {
titleSuffixList.push((v.meta?.titleSuffix as string) || '1');
}
});
if (titleSuffixList.length > 0) {
let titleSuffix = 1;
while (titleSuffixList.includes(`${titleSuffix}`)) {
titleSuffix += 1;
}
visitedView.meta.titleSuffix =
titleSuffix === 1 ? undefined : `${titleSuffix}`;
}
}
this.visitedViews.push(visitedView);
},
// 新增缓存
addCachedView() {
const cacheMap: Set<string> = new Set();
for (const v of this.visitedViews) {
const item = getRawRoute(v);
const needCache = !item.meta?.noCache;
if (!needCache) {
continue;
}
const name = item.name as string;
cacheMap.add(name);
}
if (
[...this.cachedViews].sort().toString() ===
[...cacheMap].sort().toString()
)
return;
this.cachedViews = cacheMap;
},
// 删除某个
delView(view: RouteLocationNormalizedLoaded) {
this.delVisitedView(view);
this.delCachedView();
},
// 删除tag
delVisitedView(view: RouteLocationNormalizedLoaded) {
for (const [i, v] of this.visitedViews.entries()) {
if (v.fullPath === view.fullPath) {
this.visitedViews.splice(i, 1);
break;
}
}
},
// 删除缓存
delCachedView() {
const route = router.currentRoute.value;
const index = findIndex<string>(
this.getCachedViews,
(v) => v === route.name,
);
for (const v of this.visitedViews) {
if (v.name === route.name) {
return;
}
}
if (index > -1) {
this.cachedViews.delete(
this.getCachedViews[index] as unknown as string,
);
}
},
// 删除所有缓存和tag
delAllViews() {
this.delAllVisitedViews();
this.delCachedView();
},
// 删除所有tag
delAllVisitedViews() {
// const userStore = useUserStoreWithOut();
// const affixTags = this.visitedViews.filter((tag) => tag.meta.affix)
this.visitedViews = userStore.userInfo
? this.visitedViews.filter((tag) => tag?.meta?.affix)
: [];
},
// 删除其他
delOthersViews(view: RouteLocationNormalizedLoaded) {
this.delOthersVisitedViews(view);
this.addCachedView();
},
// 删除其他tag
delOthersVisitedViews(view: RouteLocationNormalizedLoaded) {
this.visitedViews = this.visitedViews.filter((v) => {
return v?.meta?.affix || v.fullPath === view.fullPath;
});
},
// 删除左侧
delLeftViews(view: RouteLocationNormalizedLoaded) {
const index = findIndex<RouteLocationNormalizedLoaded>(
this.visitedViews,
(v) => v.fullPath === view.fullPath,
);
if (index > -1) {
this.visitedViews = this.visitedViews.filter((v, i) => {
return v?.meta?.affix || v.fullPath === view.fullPath || i > index;
});
this.addCachedView();
}
},
// 删除右侧
delRightViews(view: RouteLocationNormalizedLoaded) {
const index = findIndex<RouteLocationNormalizedLoaded>(
this.visitedViews,
(v) => v.fullPath === view.fullPath,
);
if (index > -1) {
this.visitedViews = this.visitedViews.filter((v, i) => {
return v?.meta?.affix || v.fullPath === view.fullPath || i < index;
});
this.addCachedView();
}
},
updateVisitedView(view: RouteLocationNormalizedLoaded) {
for (let v of this.visitedViews) {
if (v.fullPath === view.fullPath) {
v = Object.assign(v, view);
break;
}
}
},
// 设置当前选中的 tag
setSelectedTag(tag: RouteLocationNormalizedLoaded) {
this.selectedTag = tag;
},
setTitle(title: string, path?: string) {
for (const v of this.visitedViews) {
if (v.path === (path ?? this.selectedTag?.path)) {
v.meta.title = title;
break;
}
}
},
},
persist: false,
});
export const useTagsViewStoreWithOut = () => {
return useTagsViewStore(store);
};

27
apps/web-antd/src/utils/index.ts
View File

@@ -1,2 +1,29 @@
import type { Recordable } from '@vben/types';
export * from './rangePickerProps';
export * from './routerHelper';
/**
* 查找数组对象的某个下标
* @param {Array} ary 查找的数组
* @param {Function} fn 判断的方法
*/
type Fn<T = any> = (item: T, index: number, array: Array<T>) => boolean;
export const findIndex = <T = Recordable<any>>(
ary: Array<T>,
fn: Fn<T>,
): number => {
if (ary.findIndex) {
return ary.findIndex((item, index, array) => fn(item, index, array));
}
let index = -1;
ary.some((item: T, i: number, ary: Array<T>) => {
const ret: boolean = fn(item, i, ary);
if (ret) {
index = i;
return true;
}
return false;
});
return index;
};

22
apps/web-antd/src/utils/routerHelper.ts
View File

@@ -1,3 +1,8 @@
import type {
RouteLocationNormalized,
RouteRecordNormalized,
} from 'vue-router';
import { defineAsyncComponent } from 'vue';
const modules = import.meta.glob('../views/**/*.{vue,tsx}');
@@ -14,3 +19,20 @@ export function registerComponent(componentPath: string) {
}
}
}
export const getRawRoute = (
route: RouteLocationNormalized,
): RouteLocationNormalized => {
if (!route) return route;
const { matched, ...opt } = route;
return {
...opt,
matched: (matched
? matched.map((item) => ({
meta: item.meta,
name: item.name,
path: item.path,
}))
: undefined) as RouteRecordNormalized[],
};
};

88
apps/web-antd/src/views/mp/autoReply/data.ts Normal file
View File

@@ -0,0 +1,88 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { VxeGridPropTypes } from '#/adapter/vxe-table';
import { markRaw } from 'vue';
import { DICT_TYPE } from '@vben/constants';
import WxAccountSelect from '#/views/mp/modules/wx-account-select/main.vue';
import { MsgType } from './modules/types';
/** 获取表格列配置 */
export function useGridColumns(msgType: MsgType): VxeGridPropTypes.Columns {
const columns: VxeGridPropTypes.Columns = [];
// 请求消息类型列（仅消息回复显示）
if (msgType === MsgType.Message) {
columns.push({
field: 'requestMessageType',
title: '请求消息类型',
minWidth: 120,
});
}
// 关键词列（仅关键词回复显示）
if (msgType === MsgType.Keyword) {
columns.push({
field: 'requestKeyword',
title: '关键词',
minWidth: 150,
});
}
// 匹配类型列（仅关键词回复显示）
if (msgType === MsgType.Keyword) {
columns.push({
field: 'requestMatch',
title: '匹配类型',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.MP_AUTO_REPLY_REQUEST_MATCH },
},
});
}
// 回复消息类型列
columns.push(
{
field: 'responseMessageType',
title: '回复消息类型',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.MP_MESSAGE_TYPE },
},
},
{
field: 'responseContent',
title: '回复内容',
minWidth: 200,
slots: { default: 'replyContent' },
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
title: '操作',
width: 140,
fixed: 'right',
slots: { default: 'actions' },
},
);
return columns;
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'accountId',
label: '公众号',
component: markRaw(WxAccountSelect),
},
];
}

272
apps/web-antd/src/views/mp/autoReply/index.vue
View File

@@ -1,29 +1,259 @@
<script lang="ts" setup>
import { DocAlert, Page } from '@vben/common-ui';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { computed, nextTick, onMounted, ref } from 'vue';
import {
confirm,
ContentWrap,
DocAlert,
Page,
useVbenModal,
} from '@vben/common-ui';
import { IconifyIcon } from '@vben/icons';
import { message, Row, Tabs } from 'ant-design-vue';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import * as MpAutoReplyApi from '#/api/mp/autoReply';
import { $t } from '#/locales';
import { useGridColumns, useGridFormSchema } from './data';
import Form from './modules/form.vue';
import ReplyContentCell from './modules/ReplyTable.vue';
import { MsgType } from './modules/types';
defineOptions({ name: 'MpAutoReply' });
const msgType = ref<string>(String(MsgType.Keyword)); // 消息类型
async function onTabChange(_tabName: string) {
msgType.value = _tabName;
// 等待 msgType 更新完成
await nextTick();
const columns = useGridColumns(Number(msgType.value) as MsgType);
if (columns) {
// 使用 setGridOptions 更新列配置
gridApi.setGridOptions({ columns });
// 等待列配置更新完成
await nextTick();
}
await gridApi.query();
// 查询完成后更新数据长度
updateTableDataLength();
}
/** 新增按钮操作 */
async function handleCreate() {
const formValues = await gridApi.formApi.getValues();
formModalApi
.setData({
isCreating: true,
msgType: Number(msgType.value) as MsgType,
accountId: formValues.accountId,
})
.open();
}
/** 修改按钮操作 */
async function handleEdit(row: any) {
const data = (await MpAutoReplyApi.getAutoReply(row.id)) as any;
formModalApi
.setData({
isCreating: false,
msgType: Number(msgType.value) as MsgType,
row: data,
})
.open();
}
/** 删除按钮操作 */
async function handleDelete(row: any) {
await confirm('是否确认删除此数据?');
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', ['自动回复']),
duration: 0,
});
try {
await MpAutoReplyApi.deleteAutoReply(row.id);
message.success('删除成功');
await gridApi.query();
// 查询完成后更新数据长度
updateTableDataLength();
} finally {
hideLoading();
}
}
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
destroyOnClose: true,
});
const [Grid, gridApi] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
// 表单值变化时自动提交，这样 accountId 会被正确传递到查询函数
submitOnChange: true,
},
gridOptions: {
columns: useGridColumns(Number(msgType.value) as MsgType),
height: 'calc(100vh - 300px)',
// height: '600px',
keepSource: true,
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
return await MpAutoReplyApi.getAutoReplyPage({
pageNo: page.currentPage,
pageSize: page.pageSize,
type: Number(msgType.value) as MsgType,
...formValues,
});
},
},
// 禁用自动加载，等表单初始化完成后再加载
autoLoad: false,
},
rowConfig: {
keyField: 'id',
isHover: true,
},
toolbarConfig: {
refresh: true,
search: true,
},
} as VxeTableGridOptions<any>,
});
// 表格数据长度，用于判断是否显示新增按钮
const tableDataLength = ref(0);
// 更新表格数据长度（避免在模板中直接调用 getTableData 导致响应式循环）
function updateTableDataLength() {
try {
if (!gridApi.grid) {
return;
}
const tableData = gridApi.grid.getTableData();
tableDataLength.value = tableData?.tableData?.length || 0;
} catch {
tableDataLength.value = 0;
}
}
// 计算是否显示新增按钮：关注时回复类型只有在没有数据时才显示
const showCreateButton = computed(() => {
if (Number(msgType.value) !== MsgType.Follow) {
return true;
}
return tableDataLength.value <= 0;
});
// 页面挂载后，等待表单初始化完成再加载数据
onMounted(async () => {
// 等待 WxAccountSelect 组件加载并设置默认值
await nextTick();
if (gridApi.formApi) {
const formValues = await gridApi.formApi.getValues();
// 如果 accountId 有值，说明已经准备好了
if (formValues.accountId) {
// 设置为最新提交的值
gridApi.formApi.setLatestSubmissionValues(formValues);
// 触发首次查询
await gridApi.query();
updateTableDataLength();
}
}
});
</script>
<template>
<Page>
<Page auto-content-height>
<DocAlert title="自动回复" url="https://doc.iocoder.cn/mp/auto-reply/" />
<Button
danger
type="link"
target="_blank"
href="https://github.com/yudaocode/yudao-ui-admin-vue3"
>
该功能支持 Vue3 + element-plus 版本！
</Button>
<br />
<Button
type="link"
target="_blank"
href="https://github.com/yudaocode/yudao-ui-admin-vue3/blob/master/src/views/mp/autoReply/index"
>
可参考
https://github.com/yudaocode/yudao-ui-admin-vue3/blob/master/src/views/mp/autoReply/index
代码，pull request 贡献给我们！
</Button>
<!-- tab 切换 -->
<ContentWrap>
<Tabs
v-model:active-key="msgType"
@change="(activeKey) => onTabChange(activeKey as string)"
>
<!-- tab 项 -->
<Tabs.TabPane :key="String(MsgType.Follow)">
<template #tab>
<Row align="middle">
<IconifyIcon icon="ep:star" class="mr-2px" /> 关注时回复
</Row>
</template>
</Tabs.TabPane>
<Tabs.TabPane :key="String(MsgType.Message)">
<template #tab>
<Row align="middle">
<IconifyIcon icon="ep:chat-line-round" class="mr-2px" /> 消息回复
</Row>
</template>
</Tabs.TabPane>
<Tabs.TabPane :key="String(MsgType.Keyword)">
<template #tab>
<Row align="middle">
<IconifyIcon icon="fa:newspaper-o" class="mr-2px" /> 关键词回复
</Row>
</template>
</Tabs.TabPane>
</Tabs>
<!-- 列表 -->
<FormModal
@success="
() => {
gridApi.query().then(() => {
updateTableDataLength();
});
}
"
/>
<Grid table-title="自动回复列表">
<template #toolbar-tools>
<TableAction
v-if="showCreateButton"
:actions="[
{
label: $t('ui.actionTitle.create', ['自动回复']),
type: 'primary',
icon: ACTION_ICON.ADD,
auth: ['mp:auto-reply:create'],
onClick: handleCreate,
},
]"
/>
</template>
<template #replyContent="{ row }">
<ReplyContentCell :row="row" />
</template>
<template #actions="{ row }">
<TableAction
:actions="[
{
label: $t('common.edit'),
type: 'link',
icon: ACTION_ICON.EDIT,
auth: ['mp:auto-reply:update'],
onClick: handleEdit.bind(null, row),
},
{
label: $t('common.delete'),
type: 'link',
danger: true,
icon: ACTION_ICON.DELETE,
auth: ['mp:auto-reply:delete'],
popConfirm: {
title: '是否确认删除此数据?',
confirm: handleDelete.bind(null, row),
},
},
]"
/>
</template>
</Grid>
</ContentWrap>
</Page>
</template>

139
apps/web-antd/src/views/mp/autoReply/modules/ReplyForm.vue Normal file
View File

@@ -0,0 +1,139 @@
<script lang="ts" setup>
import type { Rule } from 'ant-design-vue/es/form';
import type { Reply } from '#/views/mp/modules/wx-reply';
import { computed, ref } from 'vue';
import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks';
import { Form, FormItem, Input, Select, SelectOption } from 'ant-design-vue';
import WxReplySelect from '#/views/mp/modules/wx-reply';
import { MsgType } from './types';
defineOptions({ name: 'ReplyForm' });
const props = defineProps<{
modelValue: any;
msgType: MsgType;
reply: Reply;
}>();
const emit = defineEmits<{
(e: 'update:reply', v: Reply): void;
(e: 'update:modelValue', v: any): void;
}>();
const reply = computed<Reply>({
get: () => props.reply,
set: (val) => emit('update:reply', val),
});
const replyForm = computed<any>({
get: () => props.modelValue,
set: (val) => emit('update:modelValue', val),
});
const formRef = ref(); // 表单 ref
const RequestMessageTypes = [
'text',
'image',
'voice',
'video',
'shortvideo',
'location',
'link',
]; // 允许选择的请求消息类型
// 表单校验规则
const rules = {
requestKeyword: [
{ required: true, message: '请求的关键字不能为空', trigger: 'blur' },
] as Rule[],
requestMatch: [
{ required: true, message: '请求的关键字的匹配不能为空', trigger: 'blur' },
] as Rule[],
} as Record<string, Rule[]>;
defineExpose({
resetFields: () => formRef.value?.resetFields(),
validate: async () => {
await formRef.value?.validate();
},
});
</script>
<template>
<div>
<Form
ref="formRef"
:model="replyForm"
:rules="rules"
:label-col="{ span: 6 }"
:wrapper-col="{ span: 18 }"
>
<FormItem
label="消息类型"
name="requestMessageType"
v-if="msgType === MsgType.Message"
>
<Select
v-model:value="replyForm.requestMessageType"
placeholder="请选择"
>
<SelectOption
v-for="dict in getDictOptions(DICT_TYPE.MP_MESSAGE_TYPE).filter(
(d) => RequestMessageTypes.includes(d.value as string),
)"
:key="dict.value"
:value="dict.value"
>
{{ dict.label }}
</SelectOption>
</Select>
</FormItem>
<FormItem
label="匹配类型"
name="requestMatch"
v-if="msgType === MsgType.Keyword"
>
<Select
v-model:value="replyForm.requestMatch"
placeholder="请选择匹配类型"
allow-clear
>
<SelectOption
v-for="dict in getDictOptions(
DICT_TYPE.MP_AUTO_REPLY_REQUEST_MATCH,
'number',
)"
:key="String(dict.value)"
:value="dict.value"
>
{{ dict.label }}
</SelectOption>
</Select>
</FormItem>
<FormItem
label="关键词"
name="requestKeyword"
v-if="msgType === MsgType.Keyword"
>
<Input
v-model:value="replyForm.requestKeyword"
placeholder="请输入内容"
allow-clear
/>
</FormItem>
<FormItem label="回复消息">
<WxReplySelect v-model="reply" />
</FormItem>
</Form>
</div>
</template>
<style scoped></style>

55
apps/web-antd/src/views/mp/autoReply/modules/ReplyTable.vue Normal file
View File

@@ -0,0 +1,55 @@
<script lang="ts" setup>
import WxMusic from '#/views/mp/modules/wx-music';
import WxNews from '#/views/mp/modules/wx-news';
import WxVideoPlayer from '#/views/mp/modules/wx-video-play';
import WxVoicePlayer from '#/views/mp/modules/wx-voice-play';
defineOptions({ name: 'ReplyContentCell' });
const props = defineProps<{
row: any;
}>();
</script>
<template>
<div>
<div v-if="props.row.responseMessageType === 'text'">
{{ props.row.responseContent }}
</div>
<div v-else-if="props.row.responseMessageType === 'voice'">
<WxVoicePlayer
v-if="props.row.responseMediaUrl"
:url="props.row.responseMediaUrl"
/>
</div>
<div v-else-if="props.row.responseMessageType === 'image'">
<a target="_blank" :href="props.row.responseMediaUrl">
<img :src="props.row.responseMediaUrl" style="width: 100px" />
</a>
</div>
<div
v-else-if="
props.row.responseMessageType === 'video' ||
props.row.responseMessageType === 'shortvideo'
"
>
<WxVideoPlayer
v-if="props.row.responseMediaUrl"
:url="props.row.responseMediaUrl"
style="margin-top: 10px"
/>
</div>
<div v-else-if="props.row.responseMessageType === 'news'">
<WxNews :articles="props.row.responseArticles" />
</div>
<div v-else-if="props.row.responseMessageType === 'music'">
<WxMusic
:title="props.row.responseTitle"
:description="props.row.responseDescription"
:thumb-media-url="props.row.responseThumbMediaUrl"
:music-url="props.row.responseMusicUrl"
:hq-music-url="props.row.responseHqMusicUrl"
/>
</div>
</div>
</template>

142
apps/web-antd/src/views/mp/autoReply/modules/form.vue Normal file
View File

@@ -0,0 +1,142 @@
<script lang="ts" setup>
import type { Reply } from '#/views/mp/modules/wx-reply';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import * as MpAutoReplyApi from '#/api/mp/autoReply';
import { $t } from '#/locales';
import { ReplyType } from '#/views/mp/modules/wx-reply/components/types';
import ReplyForm from './ReplyForm.vue';
import { MsgType } from './types';
const emit = defineEmits(['success']);
const formRef = ref<InstanceType<typeof ReplyForm> | null>(null);
const formData = ref<{ isCreating: boolean; msgType: MsgType; row?: any }>();
const replyForm = ref<any>({});
const reply = ref<Reply>({
type: ReplyType.Text,
accountId: -1,
});
const getTitle = computed(() => {
return formData.value?.isCreating
? $t('ui.actionTitle.create', ['自动回复'])
: $t('ui.actionTitle.edit', ['自动回复']);
});
const [Modal, modalApi] = useVbenModal({
async onConfirm() {
await formRef.value?.validate();
// 处理回复消息
const submitForm: any = { ...replyForm.value };
submitForm.responseMessageType = reply.value.type;
submitForm.responseContent = reply.value.content;
submitForm.responseMediaId = reply.value.mediaId;
submitForm.responseMediaUrl = reply.value.url;
submitForm.responseTitle = reply.value.title;
submitForm.responseDescription = reply.value.description;
submitForm.responseThumbMediaId = reply.value.thumbMediaId;
submitForm.responseThumbMediaUrl = reply.value.thumbMediaUrl;
submitForm.responseArticles = reply.value.articles;
submitForm.responseMusicUrl = reply.value.musicUrl;
submitForm.responseHqMusicUrl = reply.value.hqMusicUrl;
modalApi.lock();
try {
if (replyForm.value.id === undefined) {
await MpAutoReplyApi.createAutoReply(submitForm);
message.success('新增成功');
} else {
await MpAutoReplyApi.updateAutoReply(submitForm);
message.success('修改成功');
}
await modalApi.close();
emit('success');
} finally {
modalApi.unlock();
}
},
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
formData.value = undefined;
replyForm.value = {};
reply.value = {
type: ReplyType.Text,
accountId: -1,
};
return;
}
// 加载数据
const data = modalApi.getData<{
accountId?: number;
isCreating: boolean;
msgType: MsgType;
row?: any;
}>();
if (!data) {
return;
}
formData.value = data;
if (data.isCreating) {
// 新建：初始化表单
replyForm.value = {
id: undefined,
accountId: data.accountId || -1,
type: data.msgType,
requestKeyword: undefined,
requestMatch: data.msgType === MsgType.Keyword ? 1 : undefined,
requestMessageType: undefined,
};
reply.value = {
type: ReplyType.Text,
accountId: data.accountId || -1,
};
} else if (data.row) {
// 编辑：加载数据
const rowData = data.row;
replyForm.value = { ...rowData };
delete replyForm.value.responseMessageType;
delete replyForm.value.responseContent;
delete replyForm.value.responseMediaId;
delete replyForm.value.responseMediaUrl;
delete replyForm.value.responseDescription;
delete replyForm.value.responseArticles;
reply.value = {
type: rowData.responseMessageType,
accountId: data.accountId || -1,
content: rowData.responseContent,
mediaId: rowData.responseMediaId,
url: rowData.responseMediaUrl,
title: rowData.responseTitle,
description: rowData.responseDescription,
thumbMediaId: rowData.responseThumbMediaId,
thumbMediaUrl: rowData.responseThumbMediaUrl,
articles: rowData.responseArticles,
musicUrl: rowData.responseMusicUrl,
hqMusicUrl: rowData.responseHqMusicUrl,
};
}
},
});
</script>
<template>
<Modal :title="getTitle" class="w-4/5">
<ReplyForm
v-if="formData"
v-model="replyForm"
v-model:reply="reply"
:msg-type="formData.msgType"
ref="formRef"
/>
</Modal>
</template>

7
apps/web-antd/src/views/mp/autoReply/modules/types.ts Normal file
View File

@@ -0,0 +1,7 @@
// 消息类型（Follow: 关注时回复；Message: 消息回复；Keyword: 关键词回复）
// 作为 tab.name，enum 的数字不能随意修改，与 api 参数相关
export enum MsgType {
Follow = 1,
Keyword = 3,
Message = 2,
}

123
apps/web-antd/src/views/mp/modules/wx-account-select/main.vue
View File

@@ -1,23 +1,26 @@
<script lang="ts" setup>
import type { MpAccountApi } from '#/api/mp/account';
import { onMounted, reactive, ref, unref } from 'vue';
import { computed, onMounted, reactive, ref, unref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { useTabs } from '@vben/hooks';
import { message, Select } from 'ant-design-vue';
import { message, Select, SelectOption } from 'ant-design-vue';
import { getSimpleAccountList } from '#/api/mp/account';
import { useTagsViewStore } from '#/store/tagsView';
defineOptions({ name: 'WxAccountSelect' });
const emit = defineEmits<{
(e: 'change', id: number, name: string): void;
const props = defineProps<{
modelValue?: number;
}>();
// 消息弹窗
const { closeCurrentTab } = useTabs(); // 视图操作
const emit = defineEmits<{
(e: 'change', id: number, name: string): void;
(e: 'update:modelValue', id: number): void;
}>();
const { delView } = useTagsViewStore(); // 视图操作
const { push, currentRoute } = useRouter();
const account: MpAccountApi.AccountSimple = reactive({
@@ -27,37 +30,78 @@ const account: MpAccountApi.AccountSimple = reactive({
const accountList = ref<MpAccountApi.AccountSimple[]>([]);
// 计算当前选中的 ID，优先使用 modelValue（表单绑定），否则使用内部 account.id
const currentId = computed({
get: () => {
// 如果外部传入了 modelValue，优先使用外部的值
if (props.modelValue !== undefined && props.modelValue !== null) {
return props.modelValue;
}
return account.id;
},
set: (value: number) => {
// 更新内部状态
account.id = value;
// 同步到外部（表单系统）
emit('update:modelValue', value);
// 触发 change 事件（保持向后兼容）
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === value,
);
if (found) {
account.name = found.name;
emit('change', value, found.name);
}
},
});
// 监听外部 modelValue 变化，同步到内部状态
watch(
() => props.modelValue,
(newValue) => {
if (
newValue !== undefined &&
newValue !== null &&
newValue !== account.id
) {
account.id = newValue;
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === newValue,
);
if (found) {
account.name = found.name;
}
}
},
);
/** 查询公众号列表 */
async function handleQuery() {
accountList.value = await getSimpleAccountList();
if (accountList.value.length === 0) {
message.error('未配置公众号，请在【公众号管理 -> 账号管理】菜单，进行配置');
await closeCurrentTab(unref(currentRoute));
delView(unref(currentRoute));
await push({ name: 'MpAccount' });
return;
}
// 默认选中第一个
const firstAccount = accountList.value[0];
if (firstAccount) {
account.id = firstAccount.id;
if (account.id) {
account.name = firstAccount.name;
emit('change', account.id, account.name);
}
}
}
/** 公众号变化 */
function onChanged(value: any) {
if (value === undefined || Array.isArray(value)) return;
const id = typeof value === 'number' ? value : Number(value);
account.id = id;
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === id,
);
if (account.id && found) {
account.name = found.name;
emit('change', account.id, account.name);
// 如果外部没有传入值（modelValue 为空），默认选中第一个
if (props.modelValue === undefined || props.modelValue === null) {
const firstAccount = accountList.value[0];
if (firstAccount) {
currentId.value = firstAccount.id;
account.name = firstAccount.name;
emit('change', firstAccount.id, firstAccount.name);
}
} else {
// 如果外部有值，同步到内部状态
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === props.modelValue,
);
if (found) {
account.id = props.modelValue;
account.name = found.name;
}
}
}
@@ -69,23 +113,12 @@ onMounted(() => {
<template>
<Select
v-model:value="account.id"
v-model:value="currentId"
placeholder="请选择公众号"
class="!w-240px"
@change="onChanged"
style="width: 240px"
>
<Select.Option
v-for="item in accountList"
:key="item.id"
:label="item.name"
:value="item.id"
>
<SelectOption v-for="item in accountList" :key="item.id" :value="item.id">
{{ item.name }}
</Select.Option>
</SelectOption>
</Select>
</template>
<style lang="scss" scoped>
:deep(.ant-select-selector) {
width: 240px !important;
}
</style>

73
apps/web-antd/src/views/mp/modules/wx-reply/components/TabVideo.vue
View File

@@ -1,5 +1,6 @@
<script lang="ts" setup>
import type { UploadFile } from 'ant-design-vue';
import type { UploadRequestOption } from 'ant-design-vue/lib/vc-upload/interface';
import type { Reply } from './types';
@@ -54,9 +55,65 @@ function beforeVideoUpload(file: UploadFile) {
return useBeforeUpload(UploadType.Video, 10)(file as any);
}
/** 自定义上传请求 */
async function customRequest(info: UploadRequestOption) {
const formData = new FormData();
formData.append('file', info.file as File);
formData.append('accountId', String(uploadData.accountId));
formData.append('type', uploadData.type);
if (uploadData.title) {
formData.append('title', uploadData.title);
}
if (uploadData.introduction) {
formData.append('introduction', uploadData.introduction);
}
try {
const xhr = new XMLHttpRequest();
// 监听上传进度
xhr.upload.addEventListener('progress', (e) => {
if (e.lengthComputable) {
const percent = Math.round((e.loaded / e.total) * 100);
info.onProgress?.({ percent });
}
});
// 监听上传完成
xhr.addEventListener('load', () => {
if (xhr.status >= 200 && xhr.status < 300) {
try {
const res = JSON.parse(xhr.responseText);
onUploadSuccess(res);
info.onSuccess?.(res);
} catch {
info.onError?.(new Error('解析响应失败'));
message.error('上传失败：解析响应失败');
}
} else {
info.onError?.(new Error(`上传失败：HTTP ${xhr.status}`));
message.error('上传失败，请重试');
}
});
// 监听上传错误
xhr.addEventListener('error', () => {
info.onError?.(new Error('上传请求失败'));
message.error('上传失败，请重试');
});
// 发送请求
xhr.open('POST', UPLOAD_URL);
xhr.setRequestHeader('Authorization', HEADERS.Authorization);
xhr.send(formData);
} catch (error: any) {
info.onError?.(error);
message.error('上传失败，请重试');
}
}
/** 上传成功 */
function onUploadSuccess(info: any) {
const res = info.response || info;
function onUploadSuccess(res: any) {
if (res.code !== 0) {
message.error(`上传出错：${res.msg}`);
return false;
@@ -66,7 +123,6 @@ function onUploadSuccess(info: any) {
fileList.value = [];
uploadData.title = '';
uploadData.introduction = '';
selectMaterial(res.data);
}
@@ -127,18 +183,9 @@ function selectMaterial(item: any) {
<!-- 文件上传 -->
<Col :span="12">
<Upload
:action="UPLOAD_URL"
:headers="HEADERS"
:file-list="fileList"
:data="uploadData"
:before-upload="beforeVideoUpload"
@change="
(info) => {
if (info.file.status === 'done') {
onUploadSuccess(info.file.response || info.file);
}
}
"
:custom-request="customRequest"
>
<Button type="primary">
新建视频 <IconifyIcon icon="ep:upload" />

19
apps/web-antd/src/views/mp/modules/wx-video-play/main.vue
View File

@@ -13,11 +13,12 @@
<script lang="ts" setup>
import { ref } from 'vue';
import { IconifyIcon } from '@vben/icons';
import { VideoPlayer } from '@videojs-player/vue';
import { Modal } from 'ant-design-vue';
// import { VideoPlayer } from '@videojs-player/vue';
// import 'video.js/dist/video-js.css';
import 'video.js/dist/video-js.css';
defineOptions({ name: 'WxVideoPlayer' });
@@ -42,19 +43,23 @@ const playVideo = () => {
<template>
<div @click="playVideo()">
<!-- 提示 -->
<div>
<Icon icon="ep:video-play" :size="32" class="mr-5px" />
<div class="flex cursor-pointer flex-col items-center">
<IconifyIcon icon="ep:video-play" class="size-5" />
<p class="text-sm">点击播放视频</p>
</div>
<!-- 弹窗播放 -->
<Modal v-model:open="dialogVideo" title="视频播放" width="800px">
<Modal
v-model:open="dialogVideo"
title="视频播放"
width="900px"
:footer="null"
>
<VideoPlayer
v-if="dialogVideo"
class="video-player vjs-big-play-centered"
:src="props.url"
poster=""
crossorigin="anonymous"
controls
playsinline
:volume="0.6"

2
apps/web-ele/.env.development
View File

@@ -5,8 +5,10 @@ VITE_BASE=/
# 请求路径
VITE_BASE_URL=http://47.103.66.220:48080
# VITE_BASE_URL=http://192.168.1.49:48080
# 接口地址
VITE_GLOB_API_URL=http://47.103.66.220:48080/admin-api
# VITE_GLOB_API_URL=http://192.168.1.49:48080/admin-api
# 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持S3服务
VITE_UPLOAD_TYPE=server
# 是否打开 devtools，true 为打开，false 为关闭

2
apps/web-ele/package.json
View File

@@ -43,6 +43,7 @@
"@vben/styles": "workspace:*",
"@vben/types": "workspace:*",
"@vben/utils": "workspace:*",
"@videojs-player/vue": "catalog:",
"@vueuse/core": "catalog:",
"@vueuse/integrations": "catalog:",
"benz-amr-recorder": "^1.1.5",
@@ -52,6 +53,7 @@
"highlight.js": "catalog:",
"pinia": "catalog:",
"tinymce": "catalog:",
"video.js": "catalog:",
"vue": "catalog:",
"vue-dompurify-html": "catalog:",
"vue-router": "catalog:",

BIN
apps/web-ele/src/assets/imgs/wechat.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

90
apps/web-ele/src/views/mp/autoReply/data.ts Normal file
View File

@@ -0,0 +1,90 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { markRaw } from 'vue';
import { DICT_TYPE } from '@vben/constants';
import WxAccountSelect from '#/views/mp/modules/wx-account-select/main.vue';
import { MsgType } from './modules/types';
/** 获取表格列配置 */
export function useGridColumns(
msgType: MsgType,
): VxeTableGridOptions['columns'] {
const columns: VxeTableGridOptions['columns'] = [];
// 请求消息类型列（仅消息回复显示）
if (msgType === MsgType.Message) {
columns.push({
field: 'requestMessageType',
title: '请求消息类型',
minWidth: 120,
});
}
// 关键词列（仅关键词回复显示）
if (msgType === MsgType.Keyword) {
columns.push({
field: 'requestKeyword',
title: '关键词',
minWidth: 150,
});
}
// 匹配类型列（仅关键词回复显示）
if (msgType === MsgType.Keyword) {
columns.push({
field: 'requestMatch',
title: '匹配类型',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.MP_AUTO_REPLY_REQUEST_MATCH },
},
});
}
// 回复消息类型列
columns.push(
{
field: 'responseMessageType',
title: '回复消息类型',
minWidth: 120,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.MP_MESSAGE_TYPE },
},
},
{
field: 'responseContent',
title: '回复内容',
minWidth: 200,
slots: { default: 'replyContent' },
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
title: '操作',
width: 140,
fixed: 'right',
slots: { default: 'actions' },
},
);
return columns;
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'accountId',
label: '公众号',
component: markRaw(WxAccountSelect),
},
];
}

253
apps/web-ele/src/views/mp/autoReply/index.vue Normal file
View File

@@ -0,0 +1,253 @@
<script lang="ts" setup>
import type { TabPaneName } from 'element-plus';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { computed, nextTick, onMounted, ref } from 'vue';
import { ContentWrap, DocAlert, Page, useVbenModal } from '@vben/common-ui';
import {
ElLoading,
ElMessage,
ElMessageBox,
ElRow,
ElTabPane,
ElTabs,
} from 'element-plus';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import * as MpAutoReplyApi from '#/api/mp/autoReply';
import { $t } from '#/locales';
import { useGridColumns, useGridFormSchema } from './data';
import Form from './modules/form.vue';
import ReplyContentCell from './modules/ReplyTable.vue';
import { MsgType } from './modules/types';
defineOptions({ name: 'MpAutoReply' });
const msgType = ref<MsgType>(MsgType.Keyword); // 消息类型
async function onTabChange(_tabName: TabPaneName) {
// 等待 msgType 更新完成
await nextTick();
const columns = useGridColumns(msgType.value);
if (columns) {
// 使用 setGridOptions 更新列配置
gridApi.setGridOptions({ columns });
// 等待列配置更新完成
await nextTick();
}
await gridApi.query();
// 查询完成后更新数据长度
updateTableDataLength();
}
/** 新增按钮操作 */
async function handleCreate() {
const formValues = await gridApi.formApi.getValues();
formModalApi
.setData({
isCreating: true,
msgType: msgType.value,
accountId: formValues.accountId,
})
.open();
}
/** 修改按钮操作 */
async function handleEdit(row: any) {
const data = (await MpAutoReplyApi.getAutoReply(row.id)) as any;
formModalApi
.setData({ isCreating: false, msgType: msgType.value, row: data })
.open();
}
/** 删除按钮操作 */
async function handleDelete(row: any) {
await ElMessageBox.confirm('是否确认删除此数据?');
const loadingInstance = ElLoading.service({
text: $t('ui.actionMessage.deleting', ['自动回复']),
});
try {
await MpAutoReplyApi.deleteAutoReply(row.id);
ElMessage.success('删除成功');
await gridApi.query();
// 查询完成后更新数据长度
updateTableDataLength();
} finally {
loadingInstance.close();
}
}
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
destroyOnClose: true,
});
const [Grid, gridApi] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
// 表单值变化时自动提交，这样 accountId 会被正确传递到查询函数
submitOnChange: true,
},
gridOptions: {
columns: useGridColumns(msgType.value),
height: 'calc(100vh - 300px)',
// height: '600px',
keepSource: true,
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
return await MpAutoReplyApi.getAutoReplyPage({
pageNo: page.currentPage,
pageSize: page.pageSize,
type: msgType.value,
...formValues,
});
},
},
// 禁用自动加载，等表单初始化完成后再加载
autoLoad: false,
},
rowConfig: {
keyField: 'id',
isHover: true,
},
toolbarConfig: {
refresh: true,
search: true,
},
} as VxeTableGridOptions<any>,
});
// 表格数据长度，用于判断是否显示新增按钮
const tableDataLength = ref(0);
// 更新表格数据长度（避免在模板中直接调用 getTableData 导致响应式循环）
function updateTableDataLength() {
try {
if (!gridApi.grid) {
return;
}
const tableData = gridApi.grid.getTableData();
tableDataLength.value = tableData?.tableData?.length || 0;
} catch {
tableDataLength.value = 0;
}
}
// 计算是否显示新增按钮：关注时回复类型只有在没有数据时才显示
const showCreateButton = computed(() => {
if (msgType.value !== MsgType.Follow) {
return true;
}
return tableDataLength.value <= 0;
});
// 页面挂载后，等待表单初始化完成再加载数据
onMounted(async () => {
// 等待 WxAccountSelect 组件加载并设置默认值
await nextTick();
if (gridApi.formApi) {
const formValues = await gridApi.formApi.getValues();
// 如果 accountId 有值，说明已经准备好了
if (formValues.accountId) {
// 设置为最新提交的值
gridApi.formApi.setLatestSubmissionValues(formValues);
// 触发首次查询
await gridApi.query();
updateTableDataLength();
}
}
});
</script>
<template>
<Page auto-content-height>
<DocAlert title="自动回复" url="https://doc.iocoder.cn/mp/auto-reply/" />
<!-- tab 切换 -->
<ContentWrap>
<ElTabs v-model="msgType" @tab-change="onTabChange">
<!-- tab 项 -->
<ElTabPane :name="MsgType.Follow">
<template #label>
<ElRow align="middle">
<Icon icon="ep:star" class="mr-2px" /> 关注时回复
</ElRow>
</template>
</ElTabPane>
<ElTabPane :name="MsgType.Message">
<template #label>
<ElRow align="middle">
<Icon icon="ep:chat-line-round" class="mr-2px" /> 消息回复
</ElRow>
</template>
</ElTabPane>
<ElTabPane :name="MsgType.Keyword">
<template #label>
<ElRow align="middle">
<Icon icon="fa:newspaper-o" class="mr-2px" /> 关键词回复
</ElRow>
</template>
</ElTabPane>
</ElTabs>
<!-- 列表 -->
<FormModal
@success="
() => {
gridApi.query().then(() => {
updateTableDataLength();
});
}
"
/>
<Grid table-title="自动回复列表">
<template #toolbar-tools>
<TableAction
v-if="showCreateButton"
:actions="[
{
label: $t('ui.actionTitle.create', ['自动回复']),
type: 'primary',
icon: ACTION_ICON.ADD,
auth: ['mp:auto-reply:create'],
onClick: handleCreate,
},
]"
/>
</template>
<template #replyContent="{ row }">
<ReplyContentCell :row="row" />
</template>
<template #actions="{ row }">
<TableAction
:actions="[
{
label: $t('common.edit'),
type: 'primary',
link: true,
icon: ACTION_ICON.EDIT,
auth: ['mp:auto-reply:update'],
onClick: handleEdit.bind(null, row),
},
{
label: $t('common.delete'),
type: 'danger',
link: true,
icon: ACTION_ICON.DELETE,
auth: ['mp:auto-reply:delete'],
popConfirm: {
title: '是否确认删除此数据?',
confirm: handleDelete.bind(null, row),
},
},
]"
/>
</template>
</Grid>
</ContentWrap>
</Page>
</template>

128
apps/web-ele/src/views/mp/autoReply/modules/ReplyForm.vue Normal file
View File

@@ -0,0 +1,128 @@
<script lang="ts" setup>
import type { FormInstance } from 'element-plus';
import type { Reply } from '#/views/mp/modules/wx-reply';
import { computed, ref } from 'vue';
import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks';
import { ElForm, ElFormItem, ElInput, ElOption, ElSelect } from 'element-plus';
import WxReplySelect from '#/views/mp/modules/wx-reply';
import { MsgType } from './types';
defineOptions({ name: 'ReplyForm' });
const props = defineProps<{
modelValue: any;
msgType: MsgType;
reply: Reply;
}>();
const emit = defineEmits<{
(e: 'update:reply', v: Reply): void;
(e: 'update:modelValue', v: any): void;
}>();
const reply = computed<Reply>({
get: () => props.reply,
set: (val) => emit('update:reply', val),
});
const replyForm = computed<any>({
get: () => props.modelValue,
set: (val) => emit('update:modelValue', val),
});
const formRef = ref<FormInstance | null>(null); // 表单 ref
const RequestMessageTypes = [
'text',
'image',
'voice',
'video',
'shortvideo',
'location',
'link',
]; // 允许选择的请求消息类型
// 表单校验
const rules = {
requestKeyword: [
{ required: true, message: '请求的关键字不能为空', trigger: 'blur' },
],
requestMatch: [
{ required: true, message: '请求的关键字的匹配不能为空', trigger: 'blur' },
],
};
defineExpose({
resetFields: () => formRef.value?.resetFields(),
validate: async () => formRef.value?.validate(),
});
</script>
<template>
<div>
<ElForm ref="formRef" :model="replyForm" :rules="rules" label-width="80px">
<ElFormItem
label="消息类型"
prop="requestMessageType"
v-if="msgType === MsgType.Message"
>
<ElSelect v-model="replyForm.requestMessageType" placeholder="请选择">
<template
v-for="dict in getDictOptions(DICT_TYPE.MP_MESSAGE_TYPE)"
:key="dict.value"
>
<ElOption
v-if="RequestMessageTypes.includes(dict.value as string)"
:label="dict.label"
:value="dict.value"
/>
</template>
</ElSelect>
</ElFormItem>
<ElFormItem
label="匹配类型"
prop="requestMatch"
v-if="msgType === MsgType.Keyword"
>
<ElSelect
v-model="replyForm.requestMatch"
placeholder="请选择匹配类型"
clearable
>
<ElOption
v-for="dict in getDictOptions(
DICT_TYPE.MP_AUTO_REPLY_REQUEST_MATCH,
'number',
)"
:key="String(dict.value)"
:label="dict.label"
:value="dict.value"
/>
</ElSelect>
</ElFormItem>
<ElFormItem
label="关键词"
prop="requestKeyword"
v-if="msgType === MsgType.Keyword"
>
<ElInput
v-model="replyForm.requestKeyword"
placeholder="请输入内容"
clearable
/>
</ElFormItem>
<ElFormItem label="回复消息">
<WxReplySelect v-model="reply" />
</ElFormItem>
</ElForm>
</div>
</template>
<style scoped></style>

55
apps/web-ele/src/views/mp/autoReply/modules/ReplyTable.vue Normal file
View File

@@ -0,0 +1,55 @@
<script lang="ts" setup>
import WxMusic from '#/views/mp/modules/wx-music';
import WxNews from '#/views/mp/modules/wx-news';
import WxVideoPlayer from '#/views/mp/modules/wx-video-play';
import WxVoicePlayer from '#/views/mp/modules/wx-voice-play';
defineOptions({ name: 'ReplyContentCell' });
const props = defineProps<{
row: any;
}>();
</script>
<template>
<div>
<div v-if="props.row.responseMessageType === 'text'">
{{ props.row.responseContent }}
</div>
<div v-else-if="props.row.responseMessageType === 'voice'">
<WxVoicePlayer
v-if="props.row.responseMediaUrl"
:url="props.row.responseMediaUrl"
/>
</div>
<div v-else-if="props.row.responseMessageType === 'image'">
<a target="_blank" :href="props.row.responseMediaUrl">
<img :src="props.row.responseMediaUrl" style="width: 100px" />
</a>
</div>
<div
v-else-if="
props.row.responseMessageType === 'video' ||
props.row.responseMessageType === 'shortvideo'
"
>
<WxVideoPlayer
v-if="props.row.responseMediaUrl"
:url="props.row.responseMediaUrl"
style="margin-top: 10px"
/>
</div>
<div v-else-if="props.row.responseMessageType === 'news'">
<WxNews :articles="props.row.responseArticles" />
</div>
<div v-else-if="props.row.responseMessageType === 'music'">
<WxMusic
:title="props.row.responseTitle"
:description="props.row.responseDescription"
:thumb-media-url="props.row.responseThumbMediaUrl"
:music-url="props.row.responseMusicUrl"
:hq-music-url="props.row.responseHqMusicUrl"
/>
</div>
</div>
</template>

142
apps/web-ele/src/views/mp/autoReply/modules/form.vue Normal file
View File

@@ -0,0 +1,142 @@
<script lang="ts" setup>
import type { Reply } from '#/views/mp/modules/wx-reply';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { ElMessage } from 'element-plus';
import * as MpAutoReplyApi from '#/api/mp/autoReply';
import { $t } from '#/locales';
import { ReplyType } from '#/views/mp/modules/wx-reply/components/types';
import ReplyForm from './ReplyForm.vue';
import { MsgType } from './types';
const emit = defineEmits(['success']);
const formRef = ref<InstanceType<typeof ReplyForm> | null>(null);
const formData = ref<{ isCreating: boolean; msgType: MsgType; row?: any }>();
const replyForm = ref<any>({});
const reply = ref<Reply>({
type: ReplyType.Text,
accountId: -1,
});
const getTitle = computed(() => {
return formData.value?.isCreating
? $t('ui.actionTitle.create', ['自动回复'])
: $t('ui.actionTitle.edit', ['自动回复']);
});
const [Modal, modalApi] = useVbenModal({
async onConfirm() {
await formRef.value?.validate();
// 处理回复消息
const submitForm: any = { ...replyForm.value };
submitForm.responseMessageType = reply.value.type;
submitForm.responseContent = reply.value.content;
submitForm.responseMediaId = reply.value.mediaId;
submitForm.responseMediaUrl = reply.value.url;
submitForm.responseTitle = reply.value.title;
submitForm.responseDescription = reply.value.description;
submitForm.responseThumbMediaId = reply.value.thumbMediaId;
submitForm.responseThumbMediaUrl = reply.value.thumbMediaUrl;
submitForm.responseArticles = reply.value.articles;
submitForm.responseMusicUrl = reply.value.musicUrl;
submitForm.responseHqMusicUrl = reply.value.hqMusicUrl;
modalApi.lock();
try {
if (replyForm.value.id === undefined) {
await MpAutoReplyApi.createAutoReply(submitForm);
ElMessage.success('新增成功');
} else {
await MpAutoReplyApi.updateAutoReply(submitForm);
ElMessage.success('修改成功');
}
await modalApi.close();
emit('success');
} finally {
modalApi.unlock();
}
},
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
formData.value = undefined;
replyForm.value = {};
reply.value = {
type: ReplyType.Text,
accountId: -1,
};
return;
}
// 加载数据
const data = modalApi.getData<{
accountId?: number;
isCreating: boolean;
msgType: MsgType;
row?: any;
}>();
if (!data) {
return;
}
formData.value = data;
if (data.isCreating) {
// 新建：初始化表单
replyForm.value = {
id: undefined,
accountId: data.accountId || -1,
type: data.msgType,
requestKeyword: undefined,
requestMatch: data.msgType === MsgType.Keyword ? 1 : undefined,
requestMessageType: undefined,
};
reply.value = {
type: ReplyType.Text,
accountId: data.accountId || -1,
};
} else if (data.row) {
// 编辑：加载数据
const rowData = data.row;
replyForm.value = { ...rowData };
delete replyForm.value.responseMessageType;
delete replyForm.value.responseContent;
delete replyForm.value.responseMediaId;
delete replyForm.value.responseMediaUrl;
delete replyForm.value.responseDescription;
delete replyForm.value.responseArticles;
reply.value = {
type: rowData.responseMessageType,
accountId: data.accountId || -1,
content: rowData.responseContent,
mediaId: rowData.responseMediaId,
url: rowData.responseMediaUrl,
title: rowData.responseTitle,
description: rowData.responseDescription,
thumbMediaId: rowData.responseThumbMediaId,
thumbMediaUrl: rowData.responseThumbMediaUrl,
articles: rowData.responseArticles,
musicUrl: rowData.responseMusicUrl,
hqMusicUrl: rowData.responseHqMusicUrl,
};
}
},
});
</script>
<template>
<Modal :title="getTitle" class="w-4/5">
<ReplyForm
v-if="formData"
v-model="replyForm"
v-model:reply="reply"
:msg-type="formData.msgType"
ref="formRef"
/>
</Modal>
</template>

7
apps/web-ele/src/views/mp/autoReply/modules/types.ts Normal file
View File

@@ -0,0 +1,7 @@
// 消息类型（Follow: 关注时回复；Message: 消息回复；Keyword: 关键词回复）
// 作为 tab.name，enum 的数字不能随意修改，与 api 参数相关
export enum MsgType {
Follow = 1,
Keyword = 3,
Message = 2,
}

84
apps/web-ele/src/views/mp/modules/wx-account-select/main.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { MpAccountApi } from '#/api/mp/account';
import { onMounted, reactive, ref, unref } from 'vue';
import { computed, onMounted, reactive, ref, unref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { ElMessage } from 'element-plus';
@@ -11,8 +11,13 @@ import { useTagsViewStore } from '#/store/tagsView';
defineOptions({ name: 'WxAccountSelect' });
const props = defineProps<{
modelValue?: number;
}>();
const emit = defineEmits<{
(e: 'change', id: number, name: string): void;
(e: 'update:modelValue', id: number): void;
}>();
const message = ElMessage; // 消息弹窗
@@ -26,6 +31,51 @@ const account: MpAccountApi.AccountSimple = reactive({
const accountList = ref<MpAccountApi.AccountSimple[]>([]);
// 计算当前选中的 ID，优先使用 modelValue（表单绑定），否则使用内部 account.id
const currentId = computed({
get: () => {
// 如果外部传入了 modelValue，优先使用外部的值
if (props.modelValue !== undefined && props.modelValue !== null) {
return props.modelValue;
}
return account.id;
},
set: (value: number) => {
// 更新内部状态
account.id = value;
// 同步到外部（表单系统）
emit('update:modelValue', value);
// 触发 change 事件（保持向后兼容）
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === value,
);
if (found) {
account.name = found.name;
emit('change', value, found.name);
}
},
});
// 监听外部 modelValue 变化，同步到内部状态
watch(
() => props.modelValue,
(newValue) => {
if (
newValue !== undefined &&
newValue !== null &&
newValue !== account.id
) {
account.id = newValue;
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === newValue,
);
if (found) {
account.name = found.name;
}
}
},
);
/** 查询公众号列表 */
async function handleQuery() {
accountList.value = await getSimpleAccountList();
@@ -35,25 +85,31 @@ async function handleQuery() {
await push({ name: 'MpAccount' });
return;
}
// 默认选中第一个
const firstAccount = accountList.value[0];
if (firstAccount) {
account.id = firstAccount.id;
if (account.id) {
// 如果外部没有传入值（modelValue 为空），默认选中第一个
if (props.modelValue === undefined || props.modelValue === null) {
const firstAccount = accountList.value[0];
if (firstAccount) {
currentId.value = firstAccount.id;
account.name = firstAccount.name;
emit('change', account.id, account.name);
emit('change', firstAccount.id, firstAccount.name);
}
} else {
// 如果外部有值，同步到内部状态
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === props.modelValue,
);
if (found) {
account.id = props.modelValue;
account.name = found.name;
}
}
}
/** 公众号变化 */
function onChanged(id?: number) {
const found = accountList.value.find(
(v: MpAccountApi.AccountSimple) => v.id === id,
);
if (account.id && found) {
account.name = found.name;
emit('change', account.id, account.name);
if (id) {
currentId.value = id;
}
}
@@ -65,7 +121,7 @@ onMounted(() => {
<template>
<el-select
v-model="account.id"
v-model="currentId"
placeholder="请选择公众号"
class="!w-240px"
@change="onChanged"

5
apps/web-ele/src/views/mp/modules/wx-video-play/main.vue
View File

@@ -13,9 +13,9 @@
<script lang="ts" setup>
import { ref } from 'vue';
// import { VideoPlayer } from '@videojs-player/vue';
import { VideoPlayer } from '@videojs-player/vue';
// import 'video.js/dist/video-js.css';
import 'video.js/dist/video-js.css';
defineOptions({ name: 'WxVideoPlayer' });
@@ -52,7 +52,6 @@ const playVideo = () => {
class="video-player vjs-big-play-centered"
:src="props.url"
poster=""
crossorigin="anonymous"
controls
playsinline
:volume="0.6"

211
pnpm-lock.yaml generated
View File

@@ -159,6 +159,9 @@ catalogs:
'@vee-validate/zod':
specifier: ^4.15.1
version: 4.15.1
'@videojs-player/vue':
specifier: ^1.0.0
version: 1.0.0
'@vite-pwa/vitepress':
specifier: ^1.0.0
version: 1.0.1
@@ -543,6 +546,9 @@ catalogs:
vee-validate:
specifier: ^4.15.1
version: 4.15.1
video.js:
specifier: ^7.21.6
version: 7.21.7
vite:
specifier: ^7.1.2
version: 7.1.11
@@ -797,6 +803,9 @@ importers:
'@vben/utils':
specifier: workspace:*
version: link:../../packages/utils
'@videojs-player/vue':
specifier: 'catalog:'
version: 1.0.0(@types/video.js@7.3.58)(video.js@7.21.7)(vue@3.5.22(typescript@5.9.3))
'@vueuse/core':
specifier: 'catalog:'
version: 13.9.0(vue@3.5.22(typescript@5.9.3))
@@ -845,6 +854,9 @@ importers:
tinymce:
specifier: 'catalog:'
version: 7.9.1
video.js:
specifier: 'catalog:'
version: 7.21.7
vue:
specifier: ^3.5.17
version: 3.5.22(typescript@5.9.3)
@@ -914,6 +926,9 @@ importers:
'@vben/utils':
specifier: workspace:*
version: link:../../packages/utils
'@videojs-player/vue':
specifier: 'catalog:'
version: 1.0.0(@types/video.js@7.3.58)(video.js@7.21.7)(vue@3.5.22(typescript@5.9.3))
'@vueuse/core':
specifier: 'catalog:'
version: 13.9.0(vue@3.5.22(typescript@5.9.3))
@@ -941,6 +956,9 @@ importers:
tinymce:
specifier: 'catalog:'
version: 7.9.1
video.js:
specifier: 'catalog:'
version: 7.21.7
vue:
specifier: ^3.5.17
version: 3.5.22(typescript@5.9.3)
@@ -4953,6 +4971,9 @@ packages:
'@types/unist@3.0.3':
resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
'@types/video.js@7.3.58':
resolution: {integrity: sha512-1CQjuSrgbv1/dhmcfQ83eVyYbvGyqhTvb2Opxr0QCV+iJ4J6/J+XWQ3Om59WiwCd1MN3rDUHasx5XRrpUtewYQ==}
'@types/web-bluetooth@0.0.16':
resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==}
@@ -5164,6 +5185,26 @@ packages:
engines: {node: '>=18'}
hasBin: true
'@videojs-player/vue@1.0.0':
resolution: {integrity: sha512-WonTezRfKu3fYdQLt/ta+nuKH6gMZUv8l40Jke/j4Lae7IqeO/+lLAmBnh3ni88bwR+vkFXIlZ2Ci7VKInIYJg==}
peerDependencies:
'@types/video.js': 7.x
video.js: 7.x
vue: ^3.5.17
'@videojs/http-streaming@2.16.3':
resolution: {integrity: sha512-91CJv5PnFBzNBvyEjt+9cPzTK/xoVixARj2g7ZAvItA+5bx8VKdk5RxCz/PP2kdzz9W+NiDUMPkdmTsosmy69Q==}
engines: {node: '>=8', npm: '>=5'}
peerDependencies:
video.js: ^6 || ^7
'@videojs/vhs-utils@3.0.5':
resolution: {integrity: sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==}
engines: {node: '>=8', npm: '>=5'}
'@videojs/xhr@2.6.0':
resolution: {integrity: sha512-7J361GiN1tXpm+gd0xz2QWr3xNWBE+rytvo8J3KuggFaLg+U37gZQ2BuPLcnkfGffy2e+ozY70RHC8jt7zjA6Q==}
'@vite-pwa/vitepress@1.0.1':
resolution: {integrity: sha512-INBxiNLZpef349KSmQ6zHWB4uqIgZgvJnwzH3bedW/7d/Ej0lK5HP95fiBdIc2wHUtmR3Znnegmt3zLESVWrpA==}
peerDependencies:
@@ -5449,6 +5490,10 @@ packages:
peerDependencies:
vue: ^3.5.17
'@xmldom/xmldom@0.8.11':
resolution: {integrity: sha512-cQzWCtO6C8TQiYl1ruKNn2U6Ao4o4WBBcbL61yJl84x+j5sOWWFU9X7DpND8XZG3daDppSsigMdfAIl2upQBRw==}
engines: {node: '>=10.0.0'}
'@xyflow/svelte@1.4.0':
resolution: {integrity: sha512-LXokbj1nEP8FROE/y9/xU11G4dM2+mGBiMmPU714Mmk+bGnyot+nZmyR8Y7OFBUahY1mnMNfeclLPJKGy3r7tA==}
peerDependencies:
@@ -5488,6 +5533,9 @@ packages:
engines: {node: '>=0.4.0'}
hasBin: true
aes-decrypter@3.1.3:
resolution: {integrity: sha512-VkG9g4BbhMBy+N5/XodDeV6F02chEk9IpgRTq/0bS80y4dzy79VH2Gtms02VXomf3HmyRe3yyJYkJ990ns+d6A==}
agent-base@7.1.4:
resolution: {integrity: sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==}
engines: {node: '>= 14'}
@@ -6741,6 +6789,9 @@ packages:
dom-serializer@2.0.0:
resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
dom-walk@0.1.2:
resolution: {integrity: sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==}
dom-zindex@1.0.6:
resolution: {integrity: sha512-FKWIhiU96bi3xpP9ewRMgANsoVmMUBnMnmpCT6dPMZOunVYJQmJhSRruoI0XSPoHeIif3kyEuiHbFrOJwEJaEA==}
@@ -7563,6 +7614,9 @@ packages:
resolution: {integrity: sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==}
engines: {node: '>=6'}
global@4.4.0:
resolution: {integrity: sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==}
globals@14.0.0:
resolution: {integrity: sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==}
engines: {node: '>=18'}
@@ -7795,6 +7849,9 @@ packages:
resolution: {integrity: sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==}
engines: {node: '>=12'}
individual@2.0.0:
resolution: {integrity: sha512-pWt8hBCqJsUWI/HtcfWod7+N9SgAqyPEaF7JQjwzjn5vGrpg6aQ5qeAFQ7dx//UH4J1O+7xqew+gCeeFt6xN/g==}
inflight@1.0.6:
resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
@@ -7912,6 +7969,9 @@ packages:
resolution: {integrity: sha512-5XHYaSyiqADb4RnZ1Bdad6cPp8Toise4TzEjcOYDHZkTCbKgiUl7WTUCpNWHuxmDt91wnsZBc9xinNzopv3JMQ==}
engines: {node: '>=18'}
is-function@1.0.2:
resolution: {integrity: sha512-lw7DUp0aWXYg+CBCN+JKkcE0Q2RayZnSvnZBlwgxHBQhqt5pZNVy4Ri7H9GmmXkdu7LUthszM+Tor1u/2iBcpQ==}
is-generator-function@1.1.2:
resolution: {integrity: sha512-upqt1SkGkODW9tsGNG5mtXTXtECizwtS2kA161M+gJPc1xdb/Ax629af6YrTwcOeQHbewrPNlE5Dx7kzvXTizA==}
engines: {node: '>= 0.4'}
@@ -8216,6 +8276,9 @@ packages:
resolution: {integrity: sha512-woHRUZ/iF23GBP1dkDQMh1QBad9dmr8/PAwNA54VrSOVYgI12MAcE14TqnDdQOdzyEonGzMepYnqBMYdsoAr8Q==}
hasBin: true
keycode@2.2.1:
resolution: {integrity: sha512-Rdgz9Hl9Iv4QKi8b0OlCRQEzp4AgVxyCtz5S/+VIHezDmrDhkp2N2TqBWOLz0/gbeREXOOiI9/4b8BY9uw2vFg==}
keyv@4.5.4:
resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
@@ -8503,6 +8566,9 @@ packages:
resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==}
hasBin: true
m3u8-parser@4.8.0:
resolution: {integrity: sha512-UqA2a/Pw3liR6Df3gwxrqghCP17OpPlQj6RBPLYygf/ZSQ4MoSgvdvhvt35qV+3NaaA0FSZx93Ix+2brT1U7cA==}
magic-string@0.25.9:
resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
@@ -8650,6 +8716,9 @@ packages:
min-dash@4.2.3:
resolution: {integrity: sha512-VLMYQI5+FcD9Ad24VcB08uA83B07OhueAlZ88jBK6PyupTvEJwllTMUqMy0wPGYs7pZUEtEEMWdHB63m3LtEcg==}
min-document@2.19.0:
resolution: {integrity: sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==}
min-dom@4.2.1:
resolution: {integrity: sha512-TMoL8SEEIhUWYgkj7XMSgxmwSyGI+4fP2KFFGnN3FbHfbGHVdsLYSz8LoIsgPhz4dWRmLvxWWSMgzZMJW5sZuA==}
@@ -8742,6 +8811,10 @@ packages:
moddle@6.2.3:
resolution: {integrity: sha512-bLVN+ZHL3aKnhxc19XtjUfvdJsS3EsiEJC7bT6YPD11qYmTzvsxrGgyYz1Ouof7TZuGw0lDJ1OLmEnxcpQWk3Q==}
mpd-parser@0.22.1:
resolution: {integrity: sha512-fwBebvpyPUU8bOzvhX0VQZgSohncbgYwUyJJoTSNpmy7ccD2ryiCvM7oRkn/xQH5cv73/xU7rJSNCLjdGFor0Q==}
hasBin: true
mri@1.2.0:
resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
engines: {node: '>=4'}
@@ -8760,6 +8833,11 @@ packages:
resolution: {integrity: sha512-ypMKuglUrZUD99Tk2bUQ+xNQj43lPEfAeX2o9cTteAmShXy2VHDJpuwu1o0xqoKCt9jLVAvwyFKdLTPXKAfJyA==}
engines: {node: '>=10'}
mux.js@6.0.1:
resolution: {integrity: sha512-22CHb59rH8pWGcPGW5Og7JngJ9s+z4XuSlYvnxhLuc58cA1WqGDQPzuG8I+sPm1/p0CdgpzVTaKW408k5DNn8w==}
engines: {node: '>=8', npm: '>=5'}
hasBin: true
mz@2.7.0:
resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
@@ -9194,6 +9272,10 @@ packages:
resolution: {integrity: sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==}
engines: {node: '>= 6'}
pkcs7@1.0.4:
resolution: {integrity: sha512-afRERtHn54AlwaF2/+LFszyAANTCggGilmcmILUzEjvs3XgFZT+xE6+QWQcAGmu4xajy+Xtj7acLOPdx5/eXWQ==}
hasBin: true
pkg-types@1.3.1:
resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
@@ -10066,6 +10148,9 @@ packages:
run-parallel@1.2.0:
resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
rust-result@1.0.0:
resolution: {integrity: sha512-6cJzSBU+J/RJCF063onnQf0cDUOHs9uZI1oroSGnHOph+CQTIJ5Pp2hK5kEQq1+7yE/EEWfulSNXAQ2jikPthA==}
rw@1.3.3:
resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==}
@@ -10083,6 +10168,9 @@ packages:
safe-buffer@5.2.1:
resolution: {integrity: sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==}
safe-json-parse@4.0.0:
resolution: {integrity: sha512-RjZPPHugjK0TOzFrLZ8inw44s9bKox99/0AZW9o/BEQVrJfhI+fIHMErnPyRa89/yRXUUr93q+tiN6zhoVV4wQ==}
safe-push-apply@1.0.0:
resolution: {integrity: sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==}
engines: {node: '>= 0.4'}
@@ -11064,6 +11152,9 @@ packages:
uri-js@4.4.1:
resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
url-toolkit@2.2.5:
resolution: {integrity: sha512-mtN6xk+Nac+oyJ/PrI7tzfmomRVNFIWKUbG8jdYFt52hxbiReFAXIjYskvu64/dvuW71IcB7lV8l0HvZMac6Jg==}
util-deprecate@1.0.2:
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
@@ -11083,6 +11174,15 @@ packages:
vfile@6.0.3:
resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==}
video.js@7.21.7:
resolution: {integrity: sha512-T2s3WFAht7Zjr2OSJamND9x9Dn2O+Z5WuHGdh8jI5SYh5mkMdVTQ7vSRmA5PYpjXJ2ycch6jpMjkJEIEU2xxqw==}
videojs-font@3.2.0:
resolution: {integrity: sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA==}
videojs-vtt.js@0.15.5:
resolution: {integrity: sha512-yZbBxvA7QMYn15Lr/ZfhhLPrNpI/RmCSCqgIff57GC2gIrV5YfyzLfLyZMj0NnZSAz8syB4N0nHXpZg9MyrMOQ==}
vite-hot-client@2.1.0:
resolution: {integrity: sha512-7SpgZmU7R+dDnSmvXE1mfDtnHLHQSisdySVR7lO8ceAXvM0otZeuQQ6C8LrS5d/aYyP/QZ0hI0L+dIPrm4YlFQ==}
peerDependencies:
@@ -14898,6 +14998,8 @@ snapshots:
'@types/unist@3.0.3': {}
'@types/video.js@7.3.58': {}
'@types/web-bluetooth@0.0.16': {}
'@types/web-bluetooth@0.0.20': {}
@@ -15123,6 +15225,35 @@ snapshots:
- rollup
- supports-color
'@videojs-player/vue@1.0.0(@types/video.js@7.3.58)(video.js@7.21.7)(vue@3.5.22(typescript@5.9.3))':
dependencies:
'@types/video.js': 7.3.58
video.js: 7.21.7
vue: 3.5.22(typescript@5.9.3)
'@videojs/http-streaming@2.16.3(video.js@7.21.7)':
dependencies:
'@babel/runtime': 7.28.4
'@videojs/vhs-utils': 3.0.5
aes-decrypter: 3.1.3
global: 4.4.0
m3u8-parser: 4.8.0
mpd-parser: 0.22.1
mux.js: 6.0.1
video.js: 7.21.7
'@videojs/vhs-utils@3.0.5':
dependencies:
'@babel/runtime': 7.28.4
global: 4.4.0
url-toolkit: 2.2.5
'@videojs/xhr@2.6.0':
dependencies:
'@babel/runtime': 7.28.4
global: 4.4.0
is-function: 1.0.2
'@vite-pwa/vitepress@1.0.1(vite-plugin-pwa@1.1.0(vite@5.4.21(@types/node@24.9.1)(less@4.4.2)(sass@1.93.2)(terser@5.44.0))(workbox-build@7.3.0)(workbox-window@7.3.0))':
dependencies:
vite-plugin-pwa: 1.1.0(vite@5.4.21(@types/node@24.9.1)(less@4.4.2)(sass@1.93.2)(terser@5.44.0))(workbox-build@7.3.0)(workbox-window@7.3.0)
@@ -15489,6 +15620,8 @@ snapshots:
vue: 3.5.22(typescript@5.9.3)
xe-utils: 3.7.9
'@xmldom/xmldom@0.8.11': {}
'@xyflow/svelte@1.4.0(svelte@5.41.1)':
dependencies:
'@svelte-put/shortcut': 4.1.0(svelte@5.41.1)
@@ -15530,6 +15663,13 @@ snapshots:
acorn@8.15.0: {}
aes-decrypter@3.1.3:
dependencies:
'@babel/runtime': 7.28.4
'@videojs/vhs-utils': 3.0.5
global: 4.4.0
pkcs7: 1.0.4
agent-base@7.1.4: {}
ajv-draft-04@1.0.0(ajv@8.13.0):
@@ -16928,6 +17068,8 @@ snapshots:
domhandler: 5.0.3
entities: 4.5.0
dom-walk@0.1.2: {}
dom-zindex@1.0.6: {}
domelementtype@2.3.0: {}
@@ -17934,6 +18076,11 @@ snapshots:
kind-of: 6.0.3
which: 1.3.1
global@4.4.0:
dependencies:
min-document: 2.19.0
process: 0.11.10
globals@14.0.0: {}
globals@15.15.0: {}
@@ -18179,6 +18326,8 @@ snapshots:
indent-string@5.0.0: {}
individual@2.0.0: {}
inflight@1.0.6:
dependencies:
once: 1.4.0
@@ -18292,6 +18441,8 @@ snapshots:
dependencies:
get-east-asian-width: 1.4.0
is-function@1.0.2: {}
is-generator-function@1.1.2:
dependencies:
call-bound: 1.0.4
@@ -18557,6 +18708,8 @@ snapshots:
dependencies:
commander: 8.3.0
keycode@2.2.1: {}
keyv@4.5.4:
dependencies:
json-buffer: 3.0.1
@@ -18822,6 +18975,12 @@ snapshots:
lz-string@1.5.0: {}
m3u8-parser@4.8.0:
dependencies:
'@babel/runtime': 7.28.4
'@videojs/vhs-utils': 3.0.5
global: 4.4.0
magic-string@0.25.9:
dependencies:
sourcemap-codec: 1.4.8
@@ -18976,6 +19135,10 @@ snapshots:
min-dash@4.2.3: {}
min-document@2.19.0:
dependencies:
dom-walk: 0.1.2
min-dom@4.2.1:
dependencies:
component-event: 0.2.1
@@ -19077,6 +19240,13 @@ snapshots:
dependencies:
min-dash: 4.2.3
mpd-parser@0.22.1:
dependencies:
'@babel/runtime': 7.28.4
'@videojs/vhs-utils': 3.0.5
'@xmldom/xmldom': 0.8.11
global: 4.4.0
mri@1.2.0: {}
mrmime@2.0.1: {}
@@ -19093,6 +19263,11 @@ snapshots:
arrify: 2.0.1
minimatch: 3.1.2
mux.js@6.0.1:
dependencies:
'@babel/runtime': 7.28.4
global: 4.4.0
mz@2.7.0:
dependencies:
any-promise: 1.3.0
@@ -19592,6 +19767,10 @@ snapshots:
pirates@4.0.7: {}
pkcs7@1.0.4:
dependencies:
'@babel/runtime': 7.28.4
pkg-types@1.3.1:
dependencies:
confbox: 0.1.8
@@ -20453,6 +20632,10 @@ snapshots:
dependencies:
queue-microtask: 1.2.3
rust-result@1.0.0:
dependencies:
individual: 2.0.0
rw@1.3.3: {}
sade@1.8.1:
@@ -20471,6 +20654,10 @@ snapshots:
safe-buffer@5.2.1: {}
safe-json-parse@4.0.0:
dependencies:
rust-result: 1.0.0
safe-push-apply@1.0.0:
dependencies:
es-errors: 1.3.0
@@ -21581,6 +21768,8 @@ snapshots:
dependencies:
punycode: 2.3.1
url-toolkit@2.2.5: {}
util-deprecate@1.0.2: {}
vdirs@0.1.8(vue@3.5.22(typescript@5.9.3)):
@@ -21604,6 +21793,28 @@ snapshots:
'@types/unist': 3.0.3
vfile-message: 4.0.3
video.js@7.21.7:
dependencies:
'@babel/runtime': 7.28.4
'@videojs/http-streaming': 2.16.3(video.js@7.21.7)
'@videojs/vhs-utils': 3.0.5
'@videojs/xhr': 2.6.0
aes-decrypter: 3.1.3
global: 4.4.0
keycode: 2.2.1
m3u8-parser: 4.8.0
mpd-parser: 0.22.1
mux.js: 6.0.1
safe-json-parse: 4.0.0
videojs-font: 3.2.0
videojs-vtt.js: 0.15.5
videojs-font@3.2.0: {}
videojs-vtt.js@0.15.5:
dependencies:
global: 4.4.0
vite-hot-client@2.1.0(vite@7.1.11(@types/node@24.9.1)(jiti@2.6.1)(less@4.4.2)(sass@1.93.2)(terser@5.44.0)(yaml@2.8.1)):
dependencies:
vite: 7.1.11(@types/node@24.9.1)(jiti@2.6.1)(less@4.4.2)(sass@1.93.2)(terser@5.44.0)(yaml@2.8.1)

2
pnpm-workspace.yaml
View File

@@ -76,6 +76,7 @@ catalog:
'@vueuse/core': ^13.4.0
'@vueuse/integrations': ^13.4.0
'@vueuse/motion': ^3.0.3
'@videojs-player/vue': ^1.0.0
ant-design-vue: ^4.2.6
archiver: ^7.0.1
autoprefixer: ^10.4.21
@@ -220,6 +221,7 @@ catalog:
vuedraggable: ^4.1.0
vxe-pc-ui: ^4.9.29
vxe-table: ^4.16.11
video.js: ^7.21.6
watermark-js-plus: ^1.6.2
zod: ^3.25.67
zod-defaults: ^0.1.3