github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2026-01-26 20:48:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 新增录音转文字

Browse Source
This commit is contained in:
kuaifan 2025-03-05 01:52:37 +08:00
parent 7b1d352c95
commit 567c75830a
3 changed files with 74 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
resources/assets/js/pages/manage/components/ChatInput/index.vue
View File

@ -206,14 +206,16 @@
class="chat-input-convert-transfer"
:style="recordTransferStyle">
<div class="convert-box">
<div class="convert-content">
<Input
type="textarea"
class="convert-result"
v-model="recordConvertResult"
:rows="1"
:autosize="{minRows: 1, maxRows: 5}"
:placeholder="recordConvertStatus === 0 ? '...' : ''"/>
<div class="convert-body">
<div class="convert-content">
<Input
type="textarea"
class="convert-result"
v-model="recordConvertResult"
:rows="1"
:autosize="{minRows: 1, maxRows: 5}"
:placeholder="recordConvertStatus === 0 ? '...' : ''"/>
</div>
</div>
<ul class="convert-footer">
<li @click="recordConvertIng=false">

18
resources/assets/sass/dark.scss vendored
View File

@ -577,6 +577,24 @@ body.dark-mode-reverse {
}
}
.chat-input-convert-transfer {
background-color: rgba(255, 255, 255, 0.9);
.convert-box {
.convert-footer {
color: #000000;
> li {
> i {
&.send,
&.error {
color: #0a7600;
background: #000000;
}
}
}
}
}
}
.chat-emoji-wrapper {
.chat-emoji-box {
ul {

81
resources/assets/sass/pages/components/chat-input.scss vendored
View File

@ -744,54 +744,64 @@
align-items: center;
justify-content: flex-end;
flex-direction: column;
background-color: rgba(255, 255, 255, 0.8);
background-color: rgba(50, 50, 50, 0.9);
.convert-box {
width: 100%;
height: 100%;
max-width: 500px;
height: 50%;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
.convert-content {
position: relative;
background-color: $primary-color;
color: #000000;
width: 88%;
padding: 18px;
border-radius: 14px;
transform: translateY(-50%);
&:before {
content: "";
position: absolute;
bottom: -15px;
right: 12%;
transform: translateX(-50%);
border-width: 8px;
border-style: solid;
border-color: $primary-color transparent transparent transparent;
}
.convert-result {
.ivu-input {
font-size: 18px;
border: 0;
box-shadow: none;
background: transparent;
color: #000000;
border-radius: 0;
outline: none;
resize: none;
&::placeholder {
color: rgba(0, 0, 0, 0.7);
.convert-body {
flex: 1;
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
.convert-content {
position: relative;
background-color: $primary-color;
color: #000000;
width: 88%;
padding: 18px;
border-radius: 14px;
transform: translateY(24px);
&:before {
content: "";
position: absolute;
bottom: -15px;
right: 12%;
transform: translateX(-50%);
border-width: 8px;
border-style: solid;
border-color: $primary-color transparent transparent transparent;
}
.convert-result {
.ivu-input {
font-size: 18px;
border: 0;
box-shadow: none;
background: transparent;
color: #000000;
border-radius: 0;
outline: none;
resize: none;
&::placeholder {
color: rgba(0, 0, 0, 0.7);
}
}
}
}
}
.convert-footer {
flex: 1;
width: 88%;
display: flex;
align-items: flex-end;
justify-content: space-around;
margin-bottom: 64px;
color: #ffffff;
> li {
flex-grow: 0;
flex-shrink: 0;
@ -802,6 +812,7 @@
flex-direction: column;
justify-content: center;
align-items: center;
margin-bottom: 64px;
> i {
font-size: 18px;
&.voice {
@ -816,8 +827,8 @@
display: flex;
justify-content: center;
align-items: center;
color: #0a7600;
background: #000000;
color: #3fc433;
background: #ffffff;
font-weight: 600;
.common-loading {
width: 26px;