han
/
AI-Application-Scenarios
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

初始化

Browse Source
main
han 5 months ago
parent adf161aaac
commit 8631471dd7
9 changed files with 254 additions and 178 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 6
      src/assets/styles/v-layout.scss
  2. 54
      src/views/components/VoicePlayer/index.vue
  3. BIN
      src/views/components/VoicePlayer/wanjiang.mp3
  4. 64
      src/views/pages/AI-Document-Correction/dialog.vue
  5. 56
      src/views/pages/AI-Document-Writing/dialog.vue
  6. 22
      src/views/pages/AI-Image-Generate/dialog.vue
  7. 30
      src/views/pages/AI-Marketing-Writing/dialog.vue
  8. 36
      src/views/pages/AI-Video-Generate/dialog.vue
  9. 164
      src/views/pages/AI-Voice-Generate/dialog.vue

6
src/assets/styles/v-layout.scss
Unescape View File

@ -109,6 +109,7 @@ $--base-super-radius: 24px;
/* 页面 表格 */
.v-ecode-form {
height: calc(100vh - 130px);
.el-form-item {
position: relative
}
@ -363,7 +364,7 @@ $--base-super-radius: 24px;
.el-input-number--small .el-input__inner {
padding: 0;
border-color: $--border-color-light !important;
}
}.el-slider__button-wrapper{margin-left: 10px}
.el-input-number__decrease, .el-input-number__increase {
display: none
@ -549,7 +550,7 @@ body {
position: relative;
z-index: 1;
width: 350px;
height: 100%;
height:100%;
transition: all .4s;
&.types {
@ -1248,7 +1249,6 @@ body {
}
.ai-mark-file-list {
max-height: calc(100vh - 510px);
margin-top: $--base-small-space;
.ai-mark-file-list-item {

54
src/views/components/VoicePlayer/index.vue
Unescape View File

@ -0,0 +1,54 @@
<template>
<div class="v-video">
<div class="v-video-title">{{ text }}</div>
<audio ref="audioPlayer" src="./wanjiang.mp3" controls></audio>
</div>
</template>
<script>
export default {
props: {
text: {
type: String,
},
src: {
type: String,
required: true
}
},
data() {
return {
audioSrc: this.src,
};
},
mounted() {
const audio = this.$refs.audioPlayer;
audio.addEventListener('loadedmetadata', () => {
this.duration = this.formatTime(audio.duration);
});
}
}
</script>
<style scoped lang="scss">
.v-video {
display: inline-block;
padding: 10px 0;
.v-video-title {
font-size: 14px;
padding: 0 20px;
margin-bottom: 5px;
}
background-color: #F2F5FA;
border-radius: 8px;
audio {
height: 24px
}
audio::-webkit-media-controls-panel {
background-color: #F2F5FA;
}
}
</style>

BIN
src/views/components/VoicePlayer/wanjiang.mp3
View File

Binary file not shown.

64
src/views/pages/AI-Document-Correction/dialog.vue
Unescape View File

@ -2,7 +2,7 @@
<div class="ai-pages">
<main class="ai-pages-main row">
<!-- 对话左侧 -->
<div class="ai-edit-left col m-r-large">
<div class="ai-edit-left col m-r-large v-overflow-y">
<div class="ai-show-btn show" @click="showPage=!showPage"><i class="el-icon-arrow-right"></i></div>
<Toolbar
style="border-bottom: 1px solid #ccc"
@ -22,8 +22,8 @@
<div class="ai-edit-right m-r-large" :class="showPage?'show':'hide'">
<!-- 对话 表单 -->
<div class="ai-edit-right-form">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="v-ecode-form">
<div class="v-ecode-form v-overflow-y">
<el-form ref="form" :model="form" label-width="80px" size="small">
<el-form-item label="" class="v-item-block" label-width="0">
<el-select v-model="form.model" placeholder="请选择" class="v-select" style="width: 100%"
popper-class="v-select-popper">
@ -57,10 +57,10 @@
<el-input v-model="form.title" class="v-input"></el-input>
</el-form-item>
<el-form-item label="主题词" class="v-item-block">
<el-input v-model="form.keyword" type="textarea" :rows="2" class="v-textarea" resize="none"></el-input>
<el-input v-model="form.keyword" type="textarea" :rows="2" class="v-textarea" resize="none"></el-input>
</el-form-item>
<el-form-item :label="activeName=='first'?'补充说明':'我是'" class="v-item-block">
<el-input v-model="form.describe" type="textarea" :rows="2" class="v-textarea" resize="none"></el-input>
<el-input v-model="form.describe" type="textarea" :rows="2" class="v-textarea" resize="none"></el-input>
</el-form-item>
<el-form-item label="内容篇幅" class="v-item-inline">
<el-radio-group v-model="form.space" class="v-radio-group">
@ -83,37 +83,35 @@
</el-upload>
</div>
</el-form-item>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;"><i
class="iconfont icon-generate ai-icon-small"></i> 生成正文
</el-button>
</div>
</el-form>
<div class="ai-ecode-content">
<div class="ai-ecode-msg">
<div class="ai-ecode-msg-title"><img src="@/assets/ai-images/aie.png" class="ai-ecode-msg-title-img"/>
<span class="ai-ecode-msg-title-txt">已深度思考,耗时26.49秒</span>
</el-form>
<div class="ai-ecode-content">
<div class="ai-ecode-msg">
<div class="ai-ecode-msg-title"><img src="@/assets/ai-images/aie.png" class="ai-ecode-msg-title-img"/>
<span class="ai-ecode-msg-title-txt">已深度思考,耗时26.49秒</span>
</div>
</div>
</div>
<div class="ai-ecode-think">
<div class="ai-ecode-content-wrapper"><p>
好的，我需要帮用户完成一份关于2024年维森市数字政府建设的工作报告。首先，用户提供的范文是空的，所以需要完全依靠现有的信息和用户的要求来构建内容。</p>
<p>
首先，确定公文类型是工作报告，结构需要总分总，层次分明，使用一级标题和子标题，每个子标题下至少200字。同时要注意将“管理”改为“服务”，体现“放管服”改革要求。核心句要加粗，并且每个段落开头就是核心句，使用规范公文用语。</p>
<p>
接下来，分析用户提供的关键词：维森市、数字政府建设、工作报告。需要围绕这些关键词展开，涵盖政务服务、数据共享、安全保障、公众参与等方面。用户身份是领导办公室的厅主任，主送单位和发文单位需要合理创建，可能主送单位是市政府全体会议，发文单位是维森市人民政府办公室。</p>
<p>
然后，考虑结构。总分总结构，分为四个部分：工作成效、存在问题、下一步计划、结语。每个部分下再分二级标题，比如工作成效包括服务效能提升、数据融合共享、安全体系建设；存在问题包括服务覆盖不均、数据壁垒残留、群众参与不足；下一步计划包括深化服务改革、强化数据赋能、创新互动机制。每个二级标题下需要详细描述，确保逻辑连贯，语言简洁。</p>
<p>
在写作过程中，注意替换“管理”为“服务”，例如“推进服务流程再造”等。核心句加粗，并且每个段落首句即观点。另外，格式要求使用h1、h2、h3标签包裹标题，其他内容用p标签，换行用\n，不出现Markdown。日期部分需要实时，但用户提到如果无法获取用XX代替，所以日期写为2024年X月X日。</p>
<p>
还需要检查字数，确保在500字左右，上下浮动10%。每个子标题下大约200字，总共有四个大点，每个大点下三个小点，可能需要调整内容长度以满足字数要求。同时，确保小标题对仗工整，体现递进关系，如“服务效能显著提升，数字惠民成效凸显”“数据壁垒尚未消除，共享机制有待完善”等。</p>
<p>
最后，检查是否符合党政风，使用规范的公文体语言，避免口语化表达，确保格式正确，没有使用任何不允许的符号或格式。确认主送单位和发文单位合理，日期处理正确，没有遗漏用户的要求。</p>
<div class="ai-ecode-think">
<div class="ai-ecode-content-wrapper"><p>
好的，我需要帮用户完成一份关于2024年维森市数字政府建设的工作报告。首先，用户提供的范文是空的，所以需要完全依靠现有的信息和用户的要求来构建内容。</p>
<p>
首先，确定公文类型是工作报告，结构需要总分总，层次分明，使用一级标题和子标题，每个子标题下至少200字。同时要注意将“管理”改为“服务”，体现“放管服”改革要求。核心句要加粗，并且每个段落开头就是核心句，使用规范公文用语。</p>
<p>
接下来，分析用户提供的关键词：维森市、数字政府建设、工作报告。需要围绕这些关键词展开，涵盖政务服务、数据共享、安全保障、公众参与等方面。用户身份是领导办公室的厅主任，主送单位和发文单位需要合理创建，可能主送单位是市政府全体会议，发文单位是维森市人民政府办公室。</p>
<p>
然后，考虑结构。总分总结构，分为四个部分：工作成效、存在问题、下一步计划、结语。每个部分下再分二级标题，比如工作成效包括服务效能提升、数据融合共享、安全体系建设；存在问题包括服务覆盖不均、数据壁垒残留、群众参与不足；下一步计划包括深化服务改革、强化数据赋能、创新互动机制。每个二级标题下需要详细描述，确保逻辑连贯，语言简洁。</p>
<p>
在写作过程中，注意替换“管理”为“服务”，例如“推进服务流程再造”等。核心句加粗，并且每个段落首句即观点。另外，格式要求使用h1、h2、h3标签包裹标题，其他内容用p标签，换行用\n，不出现Markdown。日期部分需要实时，但用户提到如果无法获取用XX代替，所以日期写为2024年X月X日。</p>
<p>
还需要检查字数，确保在500字左右，上下浮动10%。每个子标题下大约200字，总共有四个大点，每个大点下三个小点，可能需要调整内容长度以满足字数要求。同时，确保小标题对仗工整，体现递进关系，如“服务效能显著提升，数字惠民成效凸显”“数据壁垒尚未消除，共享机制有待完善”等。</p>
<p>
最后，检查是否符合党政风，使用规范的公文体语言，避免口语化表达，确保格式正确，没有使用任何不允许的符号或格式。确认主送单位和发文单位合理，日期处理正确，没有遗漏用户的要求。</p>
</div>
</div>
</div>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</div>
</div>
</main>
@ -129,7 +127,7 @@ export default {
components: {Editor, Toolbar, FileUpload},
data() {
return {
showPage:true,
showPage: true,
aiSelect: "",
modelOptions: [{label: "openAI"}],
activeName: 'first',

56
src/views/pages/AI-Document-Writing/dialog.vue
Unescape View File

@ -2,7 +2,7 @@
<div class="ai-pages">
<main class="ai-pages-main row">
<!-- 对话左侧 -->
<div class="ai-edit-left col m-r-large">
<div class="ai-edit-left col m-r-large v-overflow-y">
<div class="ai-show-btn show" @click="showPage=!showPage"><i class="el-icon-arrow-right"></i></div>
<Toolbar
style="border-bottom: 1px solid #ccc"
@ -22,41 +22,45 @@
<div class="ai-edit-right row types" :class="showPage?'show':'hide'">
<!-- 对话 表单 -->
<div class="ai-edit-right-form m-r-large">
<div class="ai-error-title row flex-align-center">
<div class="col">已选择<span class="tip">全部错误</span>类型</div>
<div class="btn">
<el-button size="mini" type="primary" round>全部接受</el-button>
<el-button plain size="mini" round>重新检查</el-button>
<div class="v-ecode-form v-overflow-y">
<div class="ai-error-title row flex-align-center">
<div class="col">已选择<span class="tip">全部错误</span>类型</div>
<div class="btn">
<el-button size="mini" type="primary" round>全部接受</el-button>
<el-button plain size="mini" round>重新检查</el-button>
</div>
</div>
</div>
<div class="ai-error-list m-t-small v-overflow-y">
<div class="ai-error-list-item serious" :class="[errorActive==index?'active':'','type'+item.type]"
v-for="(item,index) in errorList" @click="getErrorActive(index)">
<div class="line"></div>
<div class="title row">
<div class="title-left col">{{ item.name }}</div>
<div class="title-right">
<el-button type="text">接受</el-button>
<el-button type="text">忽略</el-button>
<div class="ai-error-list m-t-small">
<div class="ai-error-list-item serious" :class="[errorActive==index?'active':'','type'+item.type]"
v-for="(item,index) in errorList" @click="getErrorActive(index)">
<div class="line"></div>
<div class="title row">
<div class="title-left col">{{ item.name }}</div>
<div class="title-right">
<el-button type="text">接受</el-button>
<el-button type="text">忽略</el-button>
</div>
</div>
</div>
<div class="content row">
<div class="ai_error_content col">
<span class="ai_error_content ai_error_original_content m-r-mimi">{{ item.original }}</span>
<i class="iconfont icon-arrow ai-icon-mini"></i>
<span class="ai_error_content ai_error_proposal_content">{{ item.proposal }}</span>
<div class="content row">
<div class="ai_error_content col">
<span class="ai_error_content ai_error_original_content m-r-mimi">{{ item.original }}</span>
<i class="iconfont icon-arrow ai-icon-mini"></i>
<span class="ai_error_content ai_error_proposal_content">{{ item.proposal }}</span>
</div>
<div class="error">严重错误</div>
</div>
<div class="error">严重错误</div>
</div>
</div>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%"><i class="iconfont icon-down ai-icon-small"></i>下载</el-button>
<el-button type="primary" size="small" style="width: 100%"><i class="iconfont icon-down ai-icon-small"></i>下载
</el-button>
</div>
</div>
<!-- 对话 种类 -->
<div class="ai-error-types">
<div class="ai-error-types-item" :class="errorTypesActive==index?'active':''" v-for="(item,index) in errorTypes"
<div class="ai-error-types-item" :class="errorTypesActive==index?'active':''"
v-for="(item,index) in errorTypes"
:key="index" @click="getErrorType(index)">
<div class="number" :class="'type'+index">{{ item.value }}</div>
<div class="title">{{ item.name }}</div>
@ -76,7 +80,7 @@ export default {
components: {Editor, Toolbar, FileUpload},
data() {
return {
showPage:true,
showPage: true,
editor: null,
html: '',
toolbarConfig: {},

22
src/views/pages/AI-Image-Generate/dialog.vue
Unescape View File

@ -9,7 +9,11 @@
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">图像生成</div>
<div class="tag"><el-tag size="mini">图片3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-image-model ai-icon-small"></i>图像3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>1.1</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>4</el-tag>
</div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
@ -24,7 +28,11 @@
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">图像生成</div>
<div class="tag"><el-tag size="mini">图片3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-image-model ai-icon-small"></i>图像3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>1.1</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>4</el-tag>
</div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
@ -41,9 +49,8 @@
<div class="ai-edit-right row" :class="showPage?'show':'hide'">
<!-- 对话 表单 -->
<div class="ai-edit-right-form m-r-large">
<div class="v-ecode-form">
<div class="v-ecode-form v-overflow-y">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="v-ecode-form">
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>图像生成
</div>
@ -91,12 +98,11 @@
:max="4">
</el-slider>
</el-form-item>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</el-form>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</div>
</div>
</main>

30
src/views/pages/AI-Marketing-Writing/dialog.vue
Unescape View File

@ -2,7 +2,7 @@
<div class="ai-pages">
<main class="ai-pages-main row">
<!-- 对话左侧 -->
<div class="ai-edit-left col m-r-large">
<div class="ai-edit-left col m-r-large v-overflow-y">
<div class="ai-show-btn show" @click="showPage=!showPage"><i class="el-icon-arrow-right"></i></div>
<Toolbar
style="border-bottom: 1px solid #ccc"
@ -21,11 +21,11 @@
<!-- 对话右侧 -->
<div class="ai-edit-right m-r-large" :class="showPage?'show':'hide'">
<div class="ai-edit-right-form">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>自由创作
</div>
<div class="v-ecode-form m-t-small">
<div class="v-ecode-form v-overflow-y">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>自由创作
</div>
<el-form-item label="" class="v-item-block" label-width="0">
<el-input
type="textarea"
@ -70,7 +70,7 @@
</div>
</el-col>
</el-row>
<div class="ai-mark-file-list v-overflow-y">
<div class="ai-mark-file-list">
<div class="ai-mark-file-list-item row flex-align-center">
<div class="col title"><i class="iconfont icon-add-URL"></i>五一出游攻略.docx</div>
<i class="iconfont icon-delete"></i>
@ -121,13 +121,13 @@
</div>
</div>
</div>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;"><i
class="iconfont icon-generate ai-icon-small"></i> 开始生成
</el-button>
</div>
</el-form>
</el-form>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;"><i
class="iconfont icon-generate ai-icon-small"></i> 开始生成
</el-button>
</div>
</div>
</div>
</main>
@ -143,7 +143,7 @@ export default {
components: {Editor, Toolbar, FileUpload},
data() {
return {
showPage:true,
showPage: true,
textarea: '',
form: {type: undefined, title: undefined, keyword: undefined, describe: undefined, space: 0},
editor: null,

36
src/views/pages/AI-Video-Generate/dialog.vue
Unescape View File

@ -9,22 +9,30 @@
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">视频生成</div>
<div class="tag"><el-tag size="mini">视频3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-video-model ai-icon-small"></i>图像3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>1.1</el-tag>
<el-tag size="mini"><i class="iconfont icon-time ai-icon-small"></i>4s</el-tag>
</div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
</div>
<div class="item-video">
<video width="320" height="240" controls autoplay>
<source src="movie.mp4" type="video/mp4">
</video>
</div>
<div class="item-video">
<video width="320" height="240" controls autoplay>
<source src="movie.mp4" type="video/mp4">
</video>
</div>
</div>
<div class="ai-dialog-list-item">
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">视频生成</div>
<div class="tag"><el-tag size="mini">视频3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-video-model ai-icon-small"></i>图像3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-proportion ai-icon-small"></i>1.1</el-tag>
<el-tag size="mini"><i class="iconfont icon-time ai-icon-small"></i>4s</el-tag>
</div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
@ -41,9 +49,8 @@
<div class="ai-edit-right row" :class="showPage?'show':'hide'">
<!-- 对话 表单 -->
<div class="ai-edit-right-form m-r-large">
<div class="v-ecode-form">
<div class="v-ecode-form v-overflow-y">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="v-ecode-form">
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>视频生成
</div>
@ -86,12 +93,11 @@
</el-radio-button>
</el-radio-group>
</el-form-item>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</el-form>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</div>
</div>
</main>
@ -103,7 +109,7 @@ export default {
name: 'edit',
data() {
return {
showPage:true,
showPage: true,
activeImages: "1",
modelOptions: [{
value: '1',
@ -130,7 +136,7 @@ export default {
describe: undefined,
model: '1',
ratio: '1',
times:'1',
times: '1',
}
}
},

164
src/views/pages/AI-Voice-Generate/dialog.vue
Unescape View File

@ -2,37 +2,41 @@
<div class="ai-pages">
<main class="ai-pages-main row">
<!-- 对话左侧 -->
<div class="ai-edit-left col m-r-large">
<div class="ai-edit-left col m-r-large v-overflow-y">
<div class="ai-show-btn show" @click="showPage=!showPage"><i class="el-icon-arrow-right"></i></div>
<div class="ai-dialog-list">
<div class="ai-dialog-list-item">
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">视频生成</div>
<div class="tag"><el-tag size="mini">视频3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
<div class="name">语音生成</div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-speech-model ai-icon-small"></i>语音3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-triple-speed ai-icon-small"></i>2.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-play ai-icon-small"></i>8.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-timbre ai-icon-small"></i>2.5</el-tag>
</div>
</div>
<div class="item-video">
<video width="320" height="240" controls autoplay>
<source src="movie.mp4" type="video/mp4">
</video>
<VoicePlayer src="./wanjiang.mp3" text=" 国风写意，泼墨，大面积水彩晕染，极简构图"></VoicePlayer>
</div>
</div>
<div class="ai-dialog-list-item">
<div class="item-title row flex-align-center">
<div class="icon"><i class="iconfont icon-think"></i></div>
<div class="name">视频生成</div>
<div class="tag"><el-tag size="mini">视频3.0</el-tag><el-tag size="mini">1:1</el-tag></div>
<div class="name">语音生成</div>
<div class="tag">
<el-tag size="mini"><i class="iconfont icon-speech-model ai-icon-small"></i>语音3.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-triple-speed ai-icon-small"></i>2.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-play ai-icon-small"></i>8.0</el-tag>
<el-tag size="mini"><i class="iconfont icon-timbre ai-icon-small"></i>2.5</el-tag>
</div>
</div>
<div class="item-describe">
国风写意，泼墨，大面积水彩晕染，极简构图，一只小船，沧海，青绿色主色，冷色调为主，大光圈，山林，远景，渐变风。细节描绘，国风意
</div>
<div class="item-video">
<video width="320" height="240" controls autoplay>
<source src="movie.mp4" type="video/mp4">
</video>
<VoicePlayer src="./wanjiang.mp3"
text="一只小船，沧海，青绿色主色，冷色调为主大光圈，山林，远景，渐变风。细节描绘，国风意一只小船，沧海，青绿色主色，冷色调为主大光圈，山林，远景，渐变风。细节描绘，国风意"></VoicePlayer>
</div>
</div>
</div>
@ -41,73 +45,74 @@
<div class="ai-edit-right row" :class="showPage?'show':'hide'">
<!-- 对话 表单 -->
<div class="ai-edit-right-form m-r-large">
<div class="v-ecode-form">
<div class="v-ecode-form v-overflow-y">
<el-form ref="form" :model="form" label-width="80px" size="small">
<div class="v-ecode-form">
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>语音生成
</div>
<el-form-item label="创意描述" class="v-item-block">
<el-input
type="textarea"
class="v-textarea"
placeholder="描述想要生成的语音内容..."
v-model="form.describe"
:rows="8"
maxlength="500"
show-word-limit
resize="none"
>
</el-input>
</el-form-item>
<el-form-item label="语音" class="v-item-block">
<el-select v-model="form.model" placeholder="请选择" class="v-select" style="width: 100%"
popper-class="v-select-popper">
<el-option
v-for="item in modelOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="倍速" class="v-item-block">
<el-slider
v-model="form.speed"
show-input
class="v-slide"
:step="0.1"
:min="0.25"
:max="4">
</el-slider>
</el-form-item>
<el-form-item label="音量" class="v-item-block">
<el-slider
v-model="form.volume"
show-input
class="v-slide"
:step="0.1"
:min="-10"
:max="10">
</el-slider>
</el-form-item>
<el-form-item label="音色" class="v-item-block">
<el-select v-model="form.timbre" placeholder="请选择" class="v-select" style="width: 100%"
popper-class="v-select-popper">
<el-option
v-for="item in timbreOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
<div class="ai-mark-title row flex-align-center">
<img src="@/assets/ai-images/icon_create.svg" class="ai-icon-mini m-r-mini"/>语音生成
</div>
<el-form-item label="创意描述" class="v-item-block">
<el-input
type="textarea"
class="v-textarea"
placeholder="描述想要生成的语音内容..."
v-model="form.describe"
:rows="8"
maxlength="500"
show-word-limit
resize="none"
>
</el-input>
</el-form-item>
<el-form-item label="语音" class="v-item-block">
<el-select v-model="form.model" placeholder="请选择" class="v-select" style="width: 100%"
popper-class="v-select-popper">
<el-option
v-for="item in modelOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="倍速" class="v-item-block">
<el-slider
v-model="form.speed"
show-input
class="v-slide"
:step="0.1"
:min="0.25"
:max="4">
</el-slider>
</el-form-item>
<el-form-item label="音量" class="v-item-block">
<el-slider
v-model="form.volume"
show-input
class="v-slide"
:step="0.1"
:min="-10"
:max="10">
</el-slider>
</el-form-item>
<el-form-item label="音色" class="v-item-block">
<el-select v-model="form.timbre" placeholder="请选择" class="v-select" style="width: 100%"
popper-class="v-select-popper">
<el-option
v-for="item in timbreOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div class="ai-ecode-bot">
<el-button type="primary" size="small" style="width: 100%;">立即生成</el-button>
</div>
</div>
</div>
</main>
@ -115,11 +120,14 @@
</template>
<script>
import VoicePlayer from "@/views/components/VoicePlayer/index.vue"
export default {
name: 'edit',
components: {VoicePlayer},
data() {
return {
showPage:true,
showPage: true,
activeImages: "1",
modelOptions: [{
value: '1',

Write Preview
Loading…
Cancel
Save