Skip to content

Y
yaoai-video
Commit 5c22d17c authored by 黄同智's avatar 黄同智
Browse files
Options

选择库弹窗，完善表单新增

parent fa216bce
Show whitespace changes
Inline Side-by-side
Showing with 290 additions and 41 deletions
doc/h5/src/static/styles/common.scss
View file @ 5c22d17c
......@@ -688,3 +688,19 @@ $numbers: (
display: none;
}
}
.el-dialog {
position: relative;
border-radius: 14px;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 80px;
background: linear-gradient(to bottom, #5476ff13, #ffffff00);
border-radius: 8px;
}
}
\ No newline at end of file
doc/h5/src/views/project/components/EditModal.vue
View file @ 5c22d17c
<template>
<el-dialog v-model="visible" width="700">
<el-dialog v-model="visible" width="700" align-center>
<template #header="{ close, titleId, titleClass }">
<div class="flex-align-center gap-8 mb-20">
<div class="cirir flex-center w-40 h-40 rounded-8">
<el-icon>
<User />
</el-icon>
<div class="cirir flex-center w-48 h-48 rounded-8">
<IconType :modalType="modalType" />
</div>
<span class="fs-16">{{ title }}</span>
<span class="fs-18">{{ title }}</span>
</div>
</template>
<template #footer>
<div class="flex-align-center gap-8">
<div class="flex-align-center justify-end gap-8">
<el-button @click="close">取消</el-button>
<el-button type="primary" @click="close">小星星</el-button>
<el-button type="primary" @click="close">
<svg t="1779335788481" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="9953" width="20" height="20">
<path
d="M408.8832 353.9968c40.7552-87.1424 61.0304-130.7648 92.7744-136.192a61.44 61.44 0 0 1 20.6848 0c31.744 5.4272 52.0192 49.0496 92.7744 136.192 7.8848 16.9984 11.8784 25.6 18.0224 32.3584a61.44 61.44 0 0 0 4.5056 4.5056c6.8608 6.144 15.36 10.1376 32.3584 18.0224 87.1424 40.7552 130.7648 61.0304 136.192 92.7744a61.44 61.44 0 0 1 0 20.6848c-5.4272 31.744-49.0496 52.0192-136.192 92.7744-16.9984 7.8848-25.6 11.8784-32.3584 18.0224a61.44 61.44 0 0 0-4.5056 4.5056c-6.144 6.8608-10.1376 15.36-18.0224 32.3584-40.7552 87.1424-61.0304 130.7648-92.7744 136.192a61.44 61.44 0 0 1-20.6848 0c-31.744-5.4272-52.0192-49.0496-92.7744-136.192-7.8848-16.9984-11.8784-25.6-18.0224-32.3584a61.44 61.44 0 0 0-4.5056-4.5056c-6.8608-6.144-15.36-10.1376-32.3584-18.0224-87.1424-40.7552-130.7648-61.0304-136.192-92.7744a61.44 61.44 0 0 1 0-20.6848c5.4272-31.744 49.0496-52.0192 136.192-92.7744 16.9984-7.8848 25.6-11.8784 32.3584-18.0224a61.44 61.44 0 0 0 4.5056-4.5056c6.144-6.8608 10.1376-15.36 18.0224-32.3584z"
p-id="9954" fill="#ffffff"></path>
</svg>876</el-button>
</div>
</template>
......@@ -22,34 +26,96 @@
<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top">
<div class="flex gap-20">
<el-form-item class="flex-1" label="名称" prop="name">
<el-input v-model="ruleForm.name" />
<el-input v-model="ruleForm.name" placeholder="名称" />
</el-form-item>
<el-form-item class="flex-1" label="性别" prop="name">
<el-select v-model="ruleForm.region" placeholder="Activity zone">
<el-form-item v-if="modalType === 1" class="flex-1" label="性别" prop="name">
<el-select v-model="ruleForm.region" placeholder="请选择性别">
<el-option label="男" :value="1" />
<el-option label="女" :value="2" />
<el-option label="其他（动物）" :value="3" />
</el-select>
</el-form-item>
</div>
<div class="flex gap-20">
<div v-if="modalType === 1" class="flex gap-20">
<el-form-item class="flex-1" label="年龄" prop="name">
<el-select v-model="ruleForm.region" placeholder="Activity zone">
<el-select v-model="ruleForm.region" placeholder="请选择年龄">
<el-option v-for="(item, index) in options1" :key="index" :label="item.name" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item class="flex-1" label="音色选择" prop="name">
<el-input v-model="ruleForm.name" />
<el-form-item class="flex-1" label="音色选择">
<el-dropdown placement="bottom-start" class="w-b100" trigger="click" :hide-on-click="false">
<el-button class="w-b100">
<svg t="1779672551042" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="2500" width="16" height="16">
<path
d="M597.333333 128a42.666667 42.666667 0 0 1 42.666667 42.666667v682.666666a42.666667 42.666667 0 1 1-85.333333 0V170.666667a42.666667 42.666667 0 0 1 42.666666-42.666667zM256 213.333333a42.666667 42.666667 0 0 1 42.666667 42.666667v512a42.666667 42.666667 0 1 1-85.333334 0V256a42.666667 42.666667 0 0 1 42.666667-42.666667zM768 256a42.666667 42.666667 0 0 1 42.666667 42.666667v426.666666a42.666667 42.666667 0 1 1-85.333334 0V298.666667a42.666667 42.666667 0 0 1 42.666667-42.666667zM426.666667 341.333333a42.666667 42.666667 0 0 1 42.666666 42.666667v256a42.666667 42.666667 0 1 1-85.333333 0V384a42.666667 42.666667 0 0 1 42.666667-42.666667zM85.333333 426.666667a42.666667 42.666667 0 0 1 42.666667 42.666666v85.333334a42.666667 42.666667 0 1 1-85.333333 0v-85.333334a42.666667 42.666667 0 0 1 42.666666-42.666666zM938.666667 426.666667a42.666667 42.666667 0 0 1 42.666666 42.666666v85.333334a42.666667 42.666667 0 1 1-85.333333 0v-85.333334a42.666667 42.666667 0 0 1 42.666667-42.666666z"
fill="#222222" p-id="2501"></path>
</svg>
<span class="ml-8">音色</span>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<el-upload class="" :show-file-list="false">
<div class="flex-center flex-col line-h24 fs-12">上传音频</div>
</el-upload>
</el-dropdown-item>
<el-dropdown-item>
<el-popover placement="bottom" :width="500" trigger="click">
<template #reference>
<span class="m-2">选择音色</span>
</template>
<div class="flex flex-wrap gap-8">
<div class="flex-align-center gap-4 rounded-8 py-8 pl-10 pr-4 cursor-pointer itemw"
v-for="(item, index) in 8" :key="index">
<video ref="videoRef" src="@/static/imgs/mp4.mp4" style="display: none;"></video>
<button class="ctrl-btn w-30 h-30 flex-center rounded-100 cursor-pointer" @click="togglePlay"
:title="isPlaying ? '暂停' : '播放'">
<svg v-if="isPlaying" t="1779505259978" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="4322" width="20" height="20">
<path
d="M288 768V213.333333a53.333333 53.333333 0 0 1 106.666667 0v554.666667a53.333333 53.333333 0 1 1-106.666667 0zM629.333333 768V213.333333a53.333333 53.333333 0 1 1 106.666667 0v554.666667a53.333333 53.333333 0 1 1-106.666667 0z"
fill="#3f3f51" p-id="4323"></path>
</svg>
<svg v-else t="1779505357927" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="14047" width="20" height="20">
<path
d="M512-292.39808158C69.5810551-292.39808158-292.39808158 69.5810551-292.39808158 512s361.97913673 804.39808158 804.39808158 804.39808158 804.39808158-361.97913673 804.39808158-804.39808158S954.4189449-292.39808158 512-292.39808158z m0 1541.76298917C106.44930106 1249.36490759-225.36490759 917.55069894-225.36490759 512S106.44930106-225.36490759 512-225.36490759s737.36490759 331.81420868 737.36490759 737.36490759-331.81420868 737.36490759-737.36490759 737.36490759z"
p-id="14048" fill="#3f3f51"></path>
<path
d="M763.37440051 401.39526378l-268.13269438-177.63791024c-90.49478419-60.32985613-167.58293419-20.10995202-167.58293265 90.49478423v402.19904074c0 110.60473622 73.73649031 150.82464031 167.58293265 90.49478421l268.13269438-177.63790864c90.49478419-67.03317396 90.49478419-167.58293419 0-227.9127903z"
p-id="14049" fill="#3f3f51"></path>
</svg>
</button>
<div class="flex flex-col text-888 ml-6 fs-12">
<span>幽默大爷</span>
<span>男 老年</span>
</div>
</div>
</div>
</el-popover>
</el-dropdown-item>
<el-dropdown-item divided>清空音色</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</el-form-item>
</div>
<el-form-item class="flex-1" label="形象生成方式" prop="name">
<el-form-item class="flex-1" :label="`${modalType === 1 ? '角色' : modalType === 2 ? '场景' : '道具'}生成方式`"
prop="name">
<div class="bg-f5 h-44 flex gap-8 w-b100 rounded-8 p-4 cursor-pointer">
<div class="flex-1 flex-center" :class="xxType === 1 ? 'active' : ''" @click="xxType = 1">AI生成</div>
<div class="flex-1 flex-center" :class="xxType === 2 ? 'active' : ''" @click="xxType = 2">从角色库选择</div>
<div class="flex-1 flex-center" :class="xxType === 2 ? 'active' : ''" @click="xxType = 2">从{{ modalType ===
1 ?
'角色' : modalType === 2 ? '场景' : '道具' }}库选择</div>
<div class="flex-1 flex-center" :class="xxType === 3 ? 'active' : ''" @click="xxType = 3">本地上传</div>
</div>
<el-upload v-if="xxType === 3" class="avatar-uploader mt-20" action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
:show-file-list="false">
<div v-if="xxType === 2" class="warehouse flex-center mt-20 cursor-pointer" @click="openRoleModal">
<el-button :icon="Plus" round>从{{ modalType === 1 ? '角色' : modalType === 2 ? '场景' : '道具' }}库选择</el-button>
</div>
<!-- 本地上传 -->
<el-upload v-if="xxType === 3" class="avatar-uploader mt-20"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" :show-file-list="false">
<img v-if="ruleForm.imageUrl" :src="ruleForm.imageUrl" class="avatar" />
<div v-else class="flex-center flex-col line-h24 fs-12">
<el-icon size="20">
......@@ -60,15 +126,23 @@
<span>最大文件限制在 20MB 内</span>
</div>
</el-upload>
<div></div>
</el-form-item>
<el-form-item v-if="xxType === 1" label="提示词" prop="name">
<el-input type="textarea" rows="4" v-model="ruleForm.name" placeholder="提示词" />
</el-form-item>
<el-form-item :label="modalType === 1 ? '角色描述' : modalType === 2 ? '场景描述' : '道具描述'">
<el-input type="textarea" rows="4" v-model="ruleForm.name" placeholder="请输入描述" />
</el-form-item>
</el-form>
</section>
</el-dialog>
<RoleModal ref="roleModalRef" :title="depotTitle" />
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue';
import { User, Plus } from '@element-plus/icons-vue'
import { Plus } from '@element-plus/icons-vue'
import RoleModal from './RoleModal.vue';
import IconType from './IconType.vue';
const props = defineProps({
title: {
......@@ -76,7 +150,8 @@ const props = defineProps({
default: '新增',
},
})
const xxType = ref(1)
const xxType = ref(1) // 形象生成方式
const modalType = ref(1) // 1:角色 2:场景 3:道具
const ruleFormRef = ref<any>()
const ruleForm = reactive<any>({
name: '',
......@@ -90,12 +165,23 @@ const rules = reactive<any>({
})
const visible = ref(true)
const open = () => {
const open = (n: number) => {
modalType.value = n
visible.value = true
}
const close = () => {
visible.value = false
}
// 从资产库 中选择
const roleModalRef = ref<any>()
const depotTitle = ref('')
const openRoleModal = () => {
depotTitle.value = modalType.value === 1 ? '角色库' : modalType.value === 2 ? '场景库' : '道具库'
roleModalRef.value.open(modalType.value)
}
defineExpose({
open,
})
......@@ -107,22 +193,25 @@ const options1 = [
{ name: '中年', value: 4 },
{ name: '老年', value: 5 },
]
// 音频播放
const isPlaying = ref(false)
const videoRef: any = ref(null)
const togglePlay = () => {
const video = videoRef.value
if (video.paused) {
video.play()
isPlaying.value = true;
} else {
video.pause()
isPlaying.value = false;
}
}
</script>
<style lang="scss">
.el-dialog {
position: relative;
border-radius: 14px;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100px;
background: linear-gradient(to bottom, #141b361c, #ffffff00);
border-radius: 8px;
}
.el-popover.el-popper {
border-radius: 16px;
}
</style>
<style lang="scss" scoped>
......@@ -153,4 +242,32 @@ const options1 = [
}
}
}
.warehouse {
border: 1px dashed #ddd;
width: 100%;
height: 240px;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: all 0.3s;
&:hover {
border-color: #c5c5c5;
}
}
.ctrl-btn {
background: #ececee;
border: none;
}
.itemw {
flex: 0 0 calc(33.3333% - 6px);
&:hover {
background-color: #f6f6fd;
}
}
</style>
\ No newline at end of file
doc/h5/src/views/project/components/IconType.vue 0 → 100644
View file @ 5c22d17c
<template>
<div>
<svg v-if="modalType === 1" t="1779678288103" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="12193" width="24" height="24">
<path
d="M512 597.333333a298.666667 298.666667 0 1 1 298.666667-298.666666 298.666667 298.666667 0 0 1-298.666667 298.666666z m0-512a213.333333 213.333333 0 1 0 213.333333 213.333334A213.333333 213.333333 0 0 0 512 85.333333z"
fill="#3f3f51" p-id="12194"></path>
<path
d="M855.04 1024H168.96a125.013333 125.013333 0 0 1-106.666667-59.946667 128 128 0 0 1-5.973333-126.08 514.773333 514.773333 0 0 1 231.893333-231.893333 84.053333 84.053333 0 0 1 97.706667 16.64L512 752l126.08-129.28a84.053333 84.053333 0 0 1 97.706667-16.64 514.773333 514.773333 0 0 1 231.893333 231.893333 128 128 0 0 1-5.973333 126.08 125.013333 125.013333 0 0 1-106.666667 59.946667zM324.693333 682.666667a436.693333 436.693333 0 0 0-192 193.706666 43.733333 43.733333 0 0 0 2.133334 42.666667 39.893333 39.893333 0 0 0 34.133333 19.626667h686.08a39.893333 39.893333 0 0 0 34.133333-19.626667 43.733333 43.733333 0 0 0 2.133334-42.666667 429.44 429.44 0 0 0-192-193.066666l-127.36 129.493333a83.413333 83.413333 0 0 1-119.893334 0z m343.893334-29.866667z"
fill="#3f3f51" p-id="12195"></path>
</svg>
<svg v-if="modalType === 2" t="1779678634023" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="13327" width="24" height="24">
<path d="M98.88 219.824a107.824 106.064 90 1 0 212.128 0 107.824 106.064 90 1 0-212.128 0Z" p-id="13328"
fill="#3f3f51"></path>
<path
d="M238.8 525.2c78.704 0 154.816 193.904 261.92 193.904 107.12 0 140.832-326.592 262.352-326.592 121.536 0 214.8 260.384 247.296 372.896 32.512 112.512-4.672 148.32-168.928 148.32-164.272 0-685.904-7.024-751.296-7.024-65.408 0-104.8-49.28-60.192-144.24 44.592-94.976 130.144-237.28 208.848-237.28z"
p-id="13329" fill="#3f3f51"></path>
</svg>
<svg v-if="modalType === 3" t="1779678737829" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="16155" width="24" height="24">
<path
d="M483.84 579.67a39.936 39.936 0 0 1 56.49 0l352 352a39.936 39.936 0 0 1-56.49 56.49l-352-352a39.936 39.936 0 0 1 0-56.49z m44.459-429.825a75.35 75.35 0 0 1 121.173 61.867l-4.95 187.904L799.66 506.197a75.35 75.35 0 0 1-21.334 134.315l-65.109 19.37a40.107 40.107 0 0 1-22.699-76.629l55.723-16.64-157.013-107.861a57.856 57.856 0 0 1-24.918-49.067l4.864-190.378-151.04 115.968a57.685 57.685 0 0 1-54.357 8.533l-179.627-63.573 63.659 179.541a57.856 57.856 0 0 1-8.704 54.443l-115.968 151.04 190.464-4.864a57.856 57.856 0 0 1 49.152 25.002L470.528 842.24l16.64-55.637a40.107 40.107 0 1 1 76.63 22.698l-19.286 64.939a75.35 75.35 0 0 1-134.315 21.333l-106.666-154.88-187.904 4.95a75.35 75.35 0 0 1-61.782-121.174l114.347-149.333-62.635-177.237-2.986-11.179a75.35 75.35 0 0 1 99.157-84.992l177.323 62.72 149.333-114.517zM894.89 289.11c0-1.45 2.218-1.45 2.218 0C903.083 320 928 344.832 958.891 350.891c1.536 0 1.536 2.218 0 2.218a78.933 78.933 0 0 0-61.782 61.782c0 1.45-2.218 1.45-2.218 0a78.933 78.933 0 0 0-61.782-61.782c-1.45 0-1.45-2.218 0-2.218a78.933 78.933 0 0 0 61.782-61.782zM798.037 1.963c0-2.56 3.926-2.56 3.926 0A138.24 138.24 0 0 0 910.08 109.995c2.56 0 2.56 3.925 0 3.925a138.24 138.24 0 0 0-108.117 108.117c0 2.56-3.926 2.56-3.926 0A138.24 138.24 0 0 0 690.005 113.92c-2.645 0-2.645-3.84 0-3.925A138.24 138.24 0 0 0 798.037 1.963z"
p-id="16156" fill="#3f3f51"></path>
</svg>
</div>
</template>
<script setup lang="ts">
const props = defineProps({
modalType: {
type: Number,
default: 1,
},
})
</script>
\ No newline at end of file
doc/h5/src/views/project/components/RoleModal.vue
View file @ 5c22d17c
<template>
<el-dialog v-model="visible" width="700">
<template #header="{ close, titleId, titleClass }">
<div class="flex-align-center gap-8 mb-10">
<div class="cirir flex-center w-48 h-48 rounded-8">
<IconType :modalType="modalType" />
</div>
<span class="fs-18">{{ title }}选择</span>
</div>
</template>
<div>
<div v-if="title === '角色库'" class="bg-f5 h-36 flex gap-8 rounded-8 p-2 cursor-pointer" style="width: 260px;">
<div class="flex-1 flex-center" :class="typeVal === 1 ? 'active' : ''" @click="typeVal = 1">虚拟人像库</div>
<div class="flex-1 flex-center" :class="typeVal === 2 ? 'active' : ''" @click="typeVal = 2">真人人像库</div>
</div>
<div v-else class="bg-f5 h-36 flex gap-8 w-b100 rounded-8 p-4 cursor-pointer" style="width: 260px;">
<div class="flex-1 flex-center" :class="typeVal === 1 ? 'active' : ''" @click="typeVal = 1">个人资产</div>
<div class="flex-1 flex-center" :class="typeVal === 2 ? 'active' : ''" @click="typeVal = 2">团队资产</div>
</div>
<div class="min-h-400">
<div class="h-400 flex-center flex-col">
<svg t="1779342435411" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="25486" width="64" height="64">
<path
d="M625.777778 0l341.333333 307.2v648.931556c0 37.432889-33.792 67.868444-75.320889 67.868444H132.209778C90.680889 1024 56.888889 993.564444 56.888889 956.131556V67.868444C56.888889 30.435556 90.680889 0 132.209778 0H625.777778zM476.728889 747.52h-11.491556a52.337778 52.337778 0 0 0-51.768889 52.906667c0 29.240889 23.153778 52.906667 51.768889 52.906666h11.548445a52.337778 52.337778 0 0 0 51.768889-52.906666 52.337778 52.337778 0 0 0-51.768889-52.906667zM459.377778 341.333333c-30.151111 0-57.287111 4.892444-80.497778 14.620445a147.342222 147.342222 0 0 0-55.694222 39.879111c-45.795556 53.134222-38.684444 122.026667-37.717334 129.706667a47.616 47.616 0 0 0 53.020445 41.927111 48.241778 48.241778 0 0 0 41.073778-54.215111c0-0.284444-2.844444-32.881778 14.791111-53.361778 12.401778-14.392889 34.304-21.617778 65.024-21.617778 34.702222 0 57.059556 8.817778 66.503111 26.225778a44.600889 44.600889 0 0 1-3.982222 47.616l-93.184 125.383111a49.152 49.152 0 0 0 9.102222 67.868444 46.535111 46.535111 0 0 0 66.446222-9.272889l93.184-125.383111a143.246222 143.246222 0 0 0 11.377778-153.144889C590.051556 382.805333 548.807111 341.333333 459.377778 341.333333z"
fill="#e6e6e6" p-id="25487"></path>
<path
d="M941.852444 276.48L628.280889 0v217.941333c0 32.711111 29.354667 58.481778 62.236444 58.481778l251.335111 0.056889z"
fill="#e6e6e6" fill-opacity=".5" p-id="25488"></path>
</svg>
<div class="text-888 mt-10">暂无数据</div>
</div>
</div>
</div>
<!-- <template #footer>
<div class="flex-align-center justify-end gap-8">
<el-button @click="close">取消</el-button>
<el-button type="primary" @click="close"></el-button>
</div>
</template> -->
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import IconType from './IconType.vue';
const props = defineProps({
title: {
type: String,
default: '新增',
},
})
const visible = ref(false)
const typeVal = ref(1)
const modalType = ref(1) // 1:角色 2:场景 3:道具
const open = (val: number) => {
modalType.value = val
visible.value = true
}
const close = () => {
visible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
.cirir {
border: 1px solid #ccc;
}
.active {
background: #fff;
border-radius: 8px;
}
</style>
\ No newline at end of file
doc/h5/src/views/project/components/StepTwo.vue
View file @ 5c22d17c
......@@ -46,7 +46,7 @@
</div>
</div>
<div>
<el-button text :icon="Plus" class="hover" @click="open">新增角色</el-button>
<el-button text :icon="Plus" class="hover" @click="open(1)">新增角色</el-button>
<el-button text :icon="DocumentCopy" class="hover">批量生成</el-button>
</div>
</div>
......@@ -131,7 +131,7 @@
</div>
</div>
<div>
<el-button text :icon="Plus" class="hover">新增场景</el-button>
<el-button text :icon="Plus" class="hover" @click="open(2)">新增场景</el-button>
<el-button text :icon="DocumentCopy" class="hover">批量生成</el-button>
</div>
</div>
......@@ -216,7 +216,7 @@
</div>
</div>
<div>
<el-button text :icon="Plus" class="hover">新增道具</el-button>
<el-button text :icon="Plus" class="hover" @click="open(3)">新增道具</el-button>
<el-button text :icon="DocumentCopy" class="hover">批量生成</el-button>
</div>
</div>
......@@ -302,8 +302,9 @@ const changeTab = ref((index: number) => {
const title = ref('新增角色')
const editModalRef = ref()
const open = () => {
editModalRef.value?.open()
const open = (index: number) => {
title.value = ['新增角色', '新增场景', '新增道具'][index - 1]
editModalRef.value?.open(index)
}
</script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment