mfx/loveKeyAdmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

恋爱键盘后台初始化

Browse Source
This commit is contained in:
没复习
2026-02-10 15:20:30 +08:00
commit b3335b4b6e
1766 changed files with 263928 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

270
src/views/keyboard/aicompanion/AiCompanionForm.vue Normal file
View File

@@ -0,0 +1,270 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible" width="700px">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<!-- 基础信息 -->
<el-divider content-position="left">基础信息</el-divider>
<el-form-item label="角色名称" prop="name">
<el-input v-model="formData.name" placeholder="如：Katie Leona" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="性别" prop="gender">
<el-select v-model="formData.gender" placeholder="请选择性别">
<el-option label="男" value="male" />
<el-option label="女" value="female" />
<el-option label="其他" value="other" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="年龄段" prop="ageRange">
<el-input v-model="formData.ageRange" placeholder="如：20s、25-30" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="头像" prop="avatarUrl">
<UploadImg v-model="formData.avatarUrl" directory="ai_companion_avatar" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="封面图" prop="coverImageUrl">
<UploadImg v-model="formData.coverImageUrl" directory="ai_companion_cover" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="一句话简介" prop="shortDesc">
<el-input v-model="formData.shortDesc" placeholder="用于卡片或列表展示" />
</el-form-item>
<el-form-item label="详细介绍" prop="introText">
<el-input v-model="formData.introText" type="textarea" :rows="3" placeholder="用于角色详情页" />
</el-form-item>
<!-- 人设配置 -->
<el-divider content-position="left">人设配置</el-divider>
<el-form-item label="性格标签" prop="personalityTags">
<div class="w-full">
<div class="flex flex-wrap">
<el-tag
v-for="(tag, index) in formData.personalityTags"
:key="index"
class="mr-5px mb-5px"
closable
@close="removeTag(index)"
>
{{ tag }}
</el-tag>
<span v-if="!formData.personalityTags?.length" class="text-gray-400">暂无标签</span>
</div>
<div class="mt-8px flex items-center gap-8px">
<el-input v-model="newTag" placeholder="输入标签后回车" class="!w-200px" @keyup.enter="addTag" />
<el-button type="primary" plain @click="addTag">添加</el-button>
</div>
</div>
</el-form-item>
<el-form-item label="说话风格" prop="speakingStyle">
<el-input v-model="formData.speakingStyle" placeholder="如：撒娇型、理性型、活泼型" />
</el-form-item>
<el-form-item label="系统 Prompt" prop="systemPrompt">
<el-input
v-model="formData.systemPrompt"
type="textarea"
:rows="5"
placeholder="定义角色核心人设，仅供 AI 模型使用"
/>
</el-form-item>
<!-- 语音与开场白 -->
<el-divider content-position="left">语音与开场白</el-divider>
<el-form-item label="开场白" prop="prologue">
<el-input v-model="formData.prologue" type="textarea" :rows="2" placeholder="角色的开场白文案" />
</el-form-item>
<el-form-item label="开场白音频" prop="prologueAudio">
<el-input v-model="formData.prologueAudio" placeholder="开场白音频 URL" />
</el-form-item>
<el-form-item label="音色 ID" prop="voiceId">
<el-input v-model="formData.voiceId" placeholder="TTS 音色 ID" />
</el-form-item>
<!-- 运营配置 -->
<el-divider content-position="left">运营配置</el-divider>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="状态" prop="status">
<el-radio-group v-model="formData.status">
<el-radio :value="1">上线</el-radio>
<el-radio :value="0">下线</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="可见性" prop="visibility">
<el-select v-model="formData.visibility" placeholder="请选择可见性">
<el-option label="公开" :value="1" />
<el-option label="内测" :value="2" />
<el-option label="隐藏" :value="3" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="排序权重" prop="sortOrder">
<el-input-number v-model="formData.sortOrder" :min="0" controls-position="right" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="热度评分" prop="popularityScore">
<el-input-number v-model="formData.popularityScore" :min="0" :precision="1" controls-position="right" />
</el-form-item>
</el-col>
</el-row>
</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 setup lang="ts">
import { AiCompanionApi, AiCompanion } from '@/api/keyboard/aicompanion'
import { UploadImg } from '@/components/UploadFile'
defineOptions({ name: 'AiCompanionForm' })
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,
name: undefined,
avatarUrl: undefined,
coverImageUrl: undefined,
gender: undefined,
ageRange: undefined,
shortDesc: undefined,
introText: undefined,
personalityTags: [] as string[],
speakingStyle: undefined,
systemPrompt: undefined,
status: 1,
visibility: 1,
sortOrder: 0,
popularityScore: 0,
prologue: undefined,
prologueAudio: undefined,
voiceId: undefined
})
const formRules = reactive({
name: [{ required: true, message: '角色名称不能为空', trigger: 'blur' }],
systemPrompt: [{ required: true, message: '系统 Prompt 不能为空', trigger: 'blur' }],
status: [{ required: true, message: '请选择状态', trigger: 'change' }],
visibility: [{ required: true, message: '请选择可见性', trigger: 'change' }]
})
const formRef = ref()
/** 性格标签 */
const newTag = ref('')
const normalizePersonalityTags = (raw: unknown): string[] => {
if (!raw) return []
if (Array.isArray(raw)) return raw.map(String)
if (typeof raw === 'string') {
try {
const parsed = JSON.parse(raw)
if (Array.isArray(parsed)) return parsed.map(String)
} catch {
return raw.split(/[,，]/).map((s) => s.trim()).filter(Boolean)
}
}
return []
}
const addTag = () => {
const text = newTag.value.trim()
if (!text) return
if (!formData.value.personalityTags.includes(text)) {
formData.value.personalityTags = [...formData.value.personalityTags, text]
}
newTag.value = ''
}
const removeTag = (index: number) => {
formData.value.personalityTags = formData.value.personalityTags.filter((_, i) => i !== index)
}
/** 打开弹窗 */
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 {
const data = await AiCompanionApi.getAiCompanion(id)
formData.value = {
...data,
personalityTags: normalizePersonalityTags(data.personalityTags)
}
} 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 unknown as AiCompanion
if (formType.value === 'create') {
await AiCompanionApi.createAiCompanion(data)
message.success(t('common.createSuccess'))
} else {
await AiCompanionApi.updateAiCompanion(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
name: undefined,
avatarUrl: undefined,
coverImageUrl: undefined,
gender: undefined,
ageRange: undefined,
shortDesc: undefined,
introText: undefined,
personalityTags: [] as string[],
speakingStyle: undefined,
systemPrompt: undefined,
status: 1,
visibility: 1,
sortOrder: 0,
popularityScore: 0,
prologue: undefined,
prologueAudio: undefined,
voiceId: undefined
}
formRef.value?.resetFields()
}
</script>

274
src/views/keyboard/aicompanion/index.vue Normal file
View File

@@ -0,0 +1,274 @@
<template>
<!-- 搜索 -->
<ContentWrap>
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="68px"
>
<el-form-item label="角色名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入角色名称"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="性别" prop="gender">
<el-select v-model="queryParams.gender" placeholder="全部" clearable class="!w-240px">
<el-option label="男" value="male" />
<el-option label="女" value="female" />
<el-option label="其他" value="other" />
</el-select>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="全部" clearable class="!w-240px">
<el-option label="上线" :value="1" />
<el-option label="下线" :value="0" />
</el-select>
</el-form-item>
<el-form-item label="可见性" prop="visibility">
<el-select v-model="queryParams.visibility" placeholder="全部" clearable class="!w-240px">
<el-option label="公开" :value="1" />
<el-option label="内测" :value="2" />
<el-option label="隐藏" :value="3" />
</el-select>
</el-form-item>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker
v-model="queryParams.createTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-240px"
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
<el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['keyboard:ai-companion:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
<el-button
type="success"
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['keyboard:ai-companion:export']"
>
<Icon icon="ep:download" class="mr-5px" /> 导出
</el-button>
<el-button
type="danger"
plain
:disabled="isEmpty(checkedIds)"
@click="handleDeleteBatch"
v-hasPermi="['keyboard:ai-companion:delete']"
>
<Icon icon="ep:delete" class="mr-5px" /> 批量删除
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table
row-key="id"
v-loading="loading"
:data="list"
:stripe="true"
:show-overflow-tooltip="true"
@selection-change="handleRowCheckboxChange"
>
<el-table-column type="selection" width="55" />
<el-table-column label="ID" align="center" prop="id" width="70" />
<el-table-column label="头像" align="center" prop="avatarUrl" width="80">
<template #default="scope">
<el-image
v-if="scope.row.avatarUrl"
:src="scope.row.avatarUrl"
:preview-src-list="[scope.row.avatarUrl]"
preview-teleported
fit="cover"
class="w-40px h-40px rounded-full"
/>
</template>
</el-table-column>
<el-table-column label="角色名称" align="center" prop="name" min-width="120" />
<el-table-column label="性别" align="center" prop="gender" width="70">
<template #default="scope">
<el-tag v-if="scope.row.gender === 'male'" type="primary">男</el-tag>
<el-tag v-else-if="scope.row.gender === 'female'" type="danger">女</el-tag>
<el-tag v-else type="info">其他</el-tag>
</template>
</el-table-column>
<el-table-column label="年龄段" align="center" prop="ageRange" width="80" />
<el-table-column label="简介" align="center" prop="shortDesc" min-width="160" />
<el-table-column label="说话风格" align="center" prop="speakingStyle" width="100" />
<el-table-column label="状态" align="center" prop="status" width="80">
<template #default="scope">
<el-tag v-if="scope.row.status === 1" type="success">上线</el-tag>
<el-tag v-else type="info">下线</el-tag>
</template>
</el-table-column>
<el-table-column label="可见性" align="center" prop="visibility" width="80">
<template #default="scope">
<el-tag v-if="scope.row.visibility === 1">公开</el-tag>
<el-tag v-else-if="scope.row.visibility === 2" type="warning">内测</el-tag>
<el-tag v-else-if="scope.row.visibility === 3" type="info">隐藏</el-tag>
</template>
</el-table-column>
<el-table-column label="排序" align="center" prop="sortOrder" width="70" />
<el-table-column label="热度" align="center" prop="popularityScore" width="70" />
<el-table-column
label="创建时间"
align="center"
prop="createdAt"
:formatter="dateFormatter"
width="180"
/>
<el-table-column label="操作" align="center" fixed="right" width="130">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['keyboard:ai-companion:update']"
>
编辑
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['keyboard:ai-companion:delete']"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</ContentWrap>
<!-- 表单弹窗：添加/修改 -->
<AiCompanionForm ref="formRef" @success="getList" />
</template>
<script setup lang="ts">
import { isEmpty } from '@/utils/is'
import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
import { AiCompanionApi, AiCompanion } from '@/api/keyboard/aicompanion'
import AiCompanionForm from './AiCompanionForm.vue'
defineOptions({ name: 'KeyboardAiCompanion' })
const message = useMessage()
const { t } = useI18n()
const loading = ref(true)
const list = ref<AiCompanion[]>([])
const total = ref(0)
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
name: undefined,
gender: undefined,
status: undefined,
visibility: undefined,
createTime: []
})
const queryFormRef = ref()
const exportLoading = ref(false)
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await AiCompanionApi.getAiCompanionPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
}
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
await message.delConfirm()
await AiCompanionApi.deleteAiCompanion(id)
message.success(t('common.delSuccess'))
await getList()
} catch {}
}
/** 批量删除 */
const checkedIds = ref<number[]>([])
const handleRowCheckboxChange = (records: AiCompanion[]) => {
checkedIds.value = records.map((item) => item.id!)
}
const handleDeleteBatch = async () => {
try {
await message.delConfirm()
await AiCompanionApi.deleteAiCompanionList(checkedIds.value)
checkedIds.value = []
message.success(t('common.delSuccess'))
await getList()
} catch {}
}
/** 导出按钮操作 */
const handleExport = async () => {
try {
await message.exportConfirm()
exportLoading.value = true
const data = await AiCompanionApi.exportAiCompanion(queryParams)
download.excel(data, 'AI陪聊角色.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 初始化 **/
onMounted(() => {
getList()
})
</script>