|
@@ -3,54 +3,70 @@
|
|
|
<view :style="{height: height}"></view>
|
|
|
<view class="safe-area-inset-bottom"></view>
|
|
|
<view class="chat-down-box u-flex-col u-col-center">
|
|
|
- <view class="chat-down-btn u-flex u-row-between">
|
|
|
- <image @click="openchangyong" v-if="showtype == 2" class="img2" src="@/static/images/jianpan.png"
|
|
|
+ <view class="chat-down-btn u-flex u-row-between" v-if="isjianpan">
|
|
|
+ <image @click="openchangyong" v-if="showtype == 2" class="img2" src="../static/images/jianpan.png"
|
|
|
mode=""></image>
|
|
|
<text @click="openchangyong" v-else class="changyong">常</text>
|
|
|
- <input class="input" :cursor-spacing="15" v-model="text" type="text" confirm-type="send"
|
|
|
+ <input class="input" :cursor-spacing="15" v-model="text" type="text" confirm-type="send" @confirm="send"
|
|
|
placeholder="请输入消息内容…">
|
|
|
- <image @click="openemoji" class="img1" src="@/static/images/biaoqing.png" mode=""></image>
|
|
|
- <image @click="openmore" v-if="showtype == 1" class="img2" src="@/static/images/jianpan.png" mode="">
|
|
|
+ <image @click="openemoji" class="img1" src="../static/images/biaoqing.png" mode=""></image>
|
|
|
+ <image @click="openmore" v-if="showtype == 1" class="img2" src="../static/images/jianpan.png" mode="">
|
|
|
</image>
|
|
|
- <image @click="openmore" v-else class="img2" src="@/static/images/wenjian.png" mode=""></image>
|
|
|
+ <image @click="openmore" v-else class="img2" src="../static/images/wenjian.png" mode=""></image>
|
|
|
</view>
|
|
|
- <view v-if="showtype == 1" class="more-box u-flex u-row-between">
|
|
|
- <view class="more-item u-flex-col u-col-center">
|
|
|
+ <view class="chat-down-btn luyin u-flex u-row-between" v-else>
|
|
|
+ <image @click="isjianpan = true" class="img2" src="../static/images/jianpan.png" mode=""></image>
|
|
|
+ <button class="record-btn" :class="longPress == '1' ? 'record-btn-1' : 'record-btn-2'"
|
|
|
+ @longpress="longpressBtn()" @touchend="touchendBtn()">
|
|
|
+ <!-- <image src="@/static/images/luyin.png" mode="" style="changyong" /> -->
|
|
|
+ <text>{{longPress == '1' ? '按住说话' : '说话中...'}}</text>
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ <view class="prompt-layer prompt-layer-1" v-if="longPress == '2'">
|
|
|
+ <view class="prompt-loader">
|
|
|
+ <view class="em" v-for="(item,index) in 15" :key="index"></view>
|
|
|
+ </view>
|
|
|
+ <text class="span">松手结束录音</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <view v-if="showtype == 1" class="more-box u-flex acenter">
|
|
|
+ <!-- <view class="more-item u-flex-col u-col-center">
|
|
|
<view class="item-img u-flex u-row-center">
|
|
|
- <image src="@/static/images/more1.png" mode=""></image>
|
|
|
+ <image src="../static/images/more1.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="item-text">
|
|
|
发简历
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <view class="more-item u-flex-col u-col-center">
|
|
|
+ </view> -->
|
|
|
+ <view class="more-item u-flex-col u-col-center" @click="toalbum">
|
|
|
<view class="item-img u-flex u-row-center">
|
|
|
- <image src="@/static/images/more2.png" mode=""></image>
|
|
|
+ <image src="../static/images/more2.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="item-text">
|
|
|
相册
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="more-item u-flex-col u-col-center">
|
|
|
+ <view class="more-item u-flex-col u-col-center" @click="tocapture">
|
|
|
<view class="item-img u-flex u-row-center">
|
|
|
- <image src="@/static/images/more3.png" mode=""></image>
|
|
|
+ <image src="../static/images/more3.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="item-text">
|
|
|
拍摄
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="more-item u-flex-col u-col-center">
|
|
|
+ <view class="more-item u-flex-col u-col-center" @click="isjianpan = false;showtype = 0">
|
|
|
<view class="item-img u-flex u-row-center">
|
|
|
- <image src="@/static/images/more4.png" mode=""></image>
|
|
|
+ <image src="../static/images/more4.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="item-text">
|
|
|
- 语言
|
|
|
+ 语音
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="showtype == 2" class="changyong-box u-flex-col">
|
|
|
<scroll-view scroll-y="true" class="changyong-scroll u-flex-1">
|
|
|
- <view class="changyong-text" v-for="(item,index) in list" :key="b">{{item.content}}</view>
|
|
|
+ <view class="changyong-text" v-for="(a,b) in list" :key="b" @click="select(a)">{{a.content}}</view>
|
|
|
</scroll-view>
|
|
|
<view class="changyong-btn u-flex u-row-between">
|
|
|
<text class="text1" @click="toadd">新增</text>
|
|
@@ -69,29 +85,248 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import emoji from "@/common/emoji.js"
|
|
|
import {
|
|
|
- phraseList
|
|
|
- } from "@/units/inquire.js"
|
|
|
+ conn
|
|
|
+ } from '@/utils/WebIM';
|
|
|
+ import WebIM from '@/newSDK/Easemob-chat.js'
|
|
|
+ // import emoji from "@/common/emoji.js"
|
|
|
+
|
|
|
+ const recorderManager = uni.getRecorderManager()
|
|
|
+ var init // 录制时长计时器
|
|
|
+
|
|
|
export default {
|
|
|
+ props: {
|
|
|
+ to: {
|
|
|
+ typeof: String,
|
|
|
+ default: ''
|
|
|
+ },
|
|
|
+ list: {
|
|
|
+ typeof: Array,
|
|
|
+ default: []
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
- list: [],
|
|
|
height: '100rpx',
|
|
|
showtype: 0, //默认0,1显示更多,2显示常用,3显示表情
|
|
|
emoji: emoji,
|
|
|
- text: ''
|
|
|
+ text: '',
|
|
|
+ isjianpan: true,
|
|
|
+ longPress: '1',
|
|
|
+
|
|
|
+ time: 0, //录音时长
|
|
|
+ duration: 60000, //录音最大值ms 60000/1分钟
|
|
|
+ tempFilePath: '', //音频路径
|
|
|
+ playStatus: 0, //录音播放状态 0:未播放 1:正在播放
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- this.phraseList()
|
|
|
+
|
|
|
},
|
|
|
+
|
|
|
methods: {
|
|
|
- phraseList() {
|
|
|
- phraseList().then(res => {
|
|
|
- console.log(res);
|
|
|
- this.list = res.data
|
|
|
+ longpressBtn() {
|
|
|
+ this.longPress = '2';
|
|
|
+ // this.countdown(60); // 倒计时
|
|
|
+ // clearInterval(init) // 清除定时器
|
|
|
+ recorderManager.onStop((res) => {
|
|
|
+ console.log('onstop', res);
|
|
|
+ this.tempFilePath = res.tempFilePath;
|
|
|
+ this.recordingTimer(this.time);
|
|
|
})
|
|
|
+ const options = {
|
|
|
+ duration: this.duration, // 指定录音的时长,单位 ms
|
|
|
+ sampleRate: 16000, // 采样率
|
|
|
+ numberOfChannels: 1, // 录音通道数
|
|
|
+ encodeBitRate: 96000, // 编码码率
|
|
|
+ format: 'mp3', // 音频格式,有效值 aac/mp3
|
|
|
+ frameSize: 10, // 指定帧大小,单位 KB
|
|
|
+ }
|
|
|
+ this.recordingTimer();
|
|
|
+ recorderManager.start(options);
|
|
|
+ // 监听音频开始事件
|
|
|
+ recorderManager.onStart((res) => {})
|
|
|
+ recorderManager.onError((res) => {})
|
|
|
+ },
|
|
|
+ // 长按松开录音事件
|
|
|
+ touchendBtn() {
|
|
|
+ let _this = this
|
|
|
+ this.longPress = '1';
|
|
|
+ recorderManager.onStop((res) => {
|
|
|
+ this.tempFilePath = res.tempFilePath
|
|
|
+ uni.uploadFile({
|
|
|
+ url: _this.$url + '/api/common/upload',
|
|
|
+ filePath: _this.tempFilePath,
|
|
|
+ name: 'file',
|
|
|
+ success: (res) => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if (JSON.parse(res.data).code == 1) {
|
|
|
+ _this.sendluyin(JSON.parse(res.data).data.fullurl);
|
|
|
+ } else {
|
|
|
+ _this.$u.toast(JSON.parse(res.data).msg)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: (e) => {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.recordingTimer(this.time)
|
|
|
+ recorderManager.stop()
|
|
|
+ },
|
|
|
+ recordingTimer(time) {
|
|
|
+ var that = this;
|
|
|
+ if (time == undefined) {
|
|
|
+ // 将计时器赋值给init
|
|
|
+ init = setInterval(function() {
|
|
|
+ that.time++
|
|
|
+ }, 1000);
|
|
|
+ } else {
|
|
|
+ clearInterval(init)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ sendluyin(url) {
|
|
|
+ var option = {
|
|
|
+ type: "audio",
|
|
|
+ chatType: "singleChat",
|
|
|
+ filename: url,
|
|
|
+ // 消息接收方:单聊为对端用户 ID,群聊和聊天室分别为群组 ID 和聊天室 ID。
|
|
|
+ to: this.to,
|
|
|
+ body: {
|
|
|
+ //文件 URL。
|
|
|
+ url: url,
|
|
|
+ //文件类型。
|
|
|
+ type: "audio",
|
|
|
+ //文件名。
|
|
|
+ filename: url,
|
|
|
+ // 音频文件时长,单位为秒。
|
|
|
+ length: this.time,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ let msg = new WebIM.message.create(option);
|
|
|
+ // 调用 `send` 方法发送该语音消息。
|
|
|
+ conn.send(msg).then((res) => {
|
|
|
+ // 语音消息成功发送。
|
|
|
+ console.log("Success");
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$emit('success', true)
|
|
|
+ }, 800)
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ // 语音消息发送失败。
|
|
|
+ console.log("Fail", e);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ send() {
|
|
|
+ let _this = this
|
|
|
+ if (this.text == '' || this.text == null) {
|
|
|
+ this.$u.toast('发送消息不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ let id = conn.getUniqueId(); // 生成本地消息id
|
|
|
+ let msg = new WebIM.message('txt', id); // 创建文本消息
|
|
|
+ msg.set({
|
|
|
+ msg: this.text, // 消息内容
|
|
|
+ to: this.to, // 接收消息对象(用户id)
|
|
|
+ chatType: 'singleChat', // 设置为单聊
|
|
|
+ success: function(id, serverMsgId) {
|
|
|
+ console.log('成功发送消息');
|
|
|
+ setTimeout(() => {
|
|
|
+ _this.$emit('success', true)
|
|
|
+ }, 800);
|
|
|
+ },
|
|
|
+ fail: function(e) {
|
|
|
+ console.log("发送消息失败");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ conn.send(msg.body);
|
|
|
+ this.text = ''
|
|
|
+ },
|
|
|
+ toalbum() {
|
|
|
+ let _this = this
|
|
|
+ uni.chooseImage({
|
|
|
+ count: 1,
|
|
|
+ sizeType: ["original", "compressed"],
|
|
|
+ sourceType: ["album"],
|
|
|
+ success(img) {
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: "请稍后"
|
|
|
+ })
|
|
|
+ uni.uploadFile({
|
|
|
+ url: _this.$url + '/api/common/upload',
|
|
|
+ filePath: img.tempFilePaths[0],
|
|
|
+ name: 'file',
|
|
|
+ success: (res) => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if (JSON.parse(res.data).code == 1) {
|
|
|
+ _this.sendPrivateImg(JSON.parse(res.data).data.fullurl);
|
|
|
+ } else {
|
|
|
+ _this.$u.toast(JSON.parse(res.data).msg)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: (e) => {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ tocapture() {
|
|
|
+ let _this = this
|
|
|
+ uni.chooseImage({
|
|
|
+ count: 1,
|
|
|
+ sizeType: ["original", "compressed"],
|
|
|
+ sourceType: ["camera"],
|
|
|
+ success(img) {
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: "请稍后"
|
|
|
+ })
|
|
|
+ uni.uploadFile({
|
|
|
+ url: _this.$url + '/api/common/upload',
|
|
|
+ filePath: img.tempFilePaths[0],
|
|
|
+ name: 'file',
|
|
|
+ success: (res) => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if (JSON.parse(res.data).code == 1) {
|
|
|
+ _this.sendPrivateImg(JSON.parse(res.data).data.fullurl);
|
|
|
+ } else {
|
|
|
+ _this.$u.toast(JSON.parse(res.data).msg)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: (e) => {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ sendPrivateImg(res) {
|
|
|
+ let option = {
|
|
|
+ chatType: "singleChat",
|
|
|
+ // 消息类型。
|
|
|
+ type: "img",
|
|
|
+ // 图片文件的 URL 地址。
|
|
|
+ url: res,
|
|
|
+ // 消息接收方:单聊为对方用户 ID,群聊和聊天室分别为群组 ID 和聊天室 ID。
|
|
|
+ to: this.to,
|
|
|
+ };
|
|
|
+ // 创建一条图片消息。
|
|
|
+ let msg = new WebIM.message.create(option);
|
|
|
+ // 调用 `send` 方法发送该图片消息。
|
|
|
+ conn.send(msg).then((res) => {
|
|
|
+ console.log('发送图片成功');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$emit('success', true)
|
|
|
+ }, 800)
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ select(item) {
|
|
|
+ console.log(item);
|
|
|
+ this.text = item.content
|
|
|
},
|
|
|
tolist() {
|
|
|
uni.navigateTo({
|
|
@@ -100,12 +335,7 @@
|
|
|
},
|
|
|
toadd() {
|
|
|
uni.navigateTo({
|
|
|
- url: "/pagesC/changyong-add",
|
|
|
- events: {
|
|
|
- getconcent: res => {
|
|
|
- this.phraseList()
|
|
|
- }
|
|
|
- }
|
|
|
+ url: "/pagesC/changyong-add"
|
|
|
})
|
|
|
},
|
|
|
changeemoji(item) {
|
|
@@ -122,6 +352,7 @@
|
|
|
openchangyong() {
|
|
|
this.showtype = this.showtype == 2 ? 0 : 2
|
|
|
this.height = this.showtype == 2 ? '600rpx' : '100rpx'
|
|
|
+ this.isjianpan = true
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -138,7 +369,6 @@
|
|
|
width: 750rpx;
|
|
|
background-color: #fff;
|
|
|
|
|
|
-
|
|
|
.emoji-scroll {
|
|
|
height: 300rpx;
|
|
|
|
|
@@ -205,9 +435,10 @@
|
|
|
height: 200rpx;
|
|
|
padding: 0 60rpx;
|
|
|
width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
|
|
|
.more-item {
|
|
|
+ margin: 0 58rpx 0 0;
|
|
|
+
|
|
|
.item-text {
|
|
|
font-size: 22rpx;
|
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
@@ -222,6 +453,18 @@
|
|
|
border-radius: 20rpx;
|
|
|
margin-bottom: 24rpx;
|
|
|
|
|
|
+ .hide {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ min-width: 100%;
|
|
|
+ min-height: 100%;
|
|
|
+ filter: alpha(opacity=0);
|
|
|
+ opacity: 0;
|
|
|
+ cursor: inherit;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
image {
|
|
|
width: 52rpx;
|
|
|
height: 52rpx;
|
|
@@ -269,5 +512,185 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .record-box {
|
|
|
+ width: 100%;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .luyin button::after {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .luyin button {
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 38px;
|
|
|
+ width: 100%;
|
|
|
+ height: 38px;
|
|
|
+ border-radius: 8px;
|
|
|
+ text-align: center;
|
|
|
+ background: #f3f3f3;
|
|
|
+ }
|
|
|
+
|
|
|
+ .luyin button image {
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ margin-right: 4px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ .record-btn-2 {
|
|
|
+ background: rgba(255, 211, 0, 0.2);
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 提示小弹窗 */
|
|
|
+ .prompt-layer {
|
|
|
+ border-radius: 8px;
|
|
|
+ background: #fff;
|
|
|
+ padding: 8px 16px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-layer::after {
|
|
|
+ content: '';
|
|
|
+ display: block;
|
|
|
+ border: 6px solid rgba(0, 0, 0, 0);
|
|
|
+ border-top-color: rgba(255, 211, 0, 1);
|
|
|
+ position: absolute;
|
|
|
+ bottom: -10px;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-layer-1 {
|
|
|
+ font-size: 12px;
|
|
|
+ width: 128px;
|
|
|
+ text-align: center;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ top: -80px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-layer-1 .p {
|
|
|
+ color: #000000;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-layer-1 .span {
|
|
|
+ color: rgba(0, 0, 0, .6);
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em {}
|
|
|
+
|
|
|
+ /* 语音音阶------------- */
|
|
|
+ .prompt-loader {
|
|
|
+ width: 96px;
|
|
|
+ height: 20px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em {
|
|
|
+ display: block;
|
|
|
+ background: #333333;
|
|
|
+ width: 1px;
|
|
|
+ height: 10%;
|
|
|
+ margin-right: 2.5px;
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:last-child {
|
|
|
+ margin-right: 0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(1) {
|
|
|
+ animation: load 2.5s 1.4s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(2) {
|
|
|
+ animation: load 2.5s 1.2s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(3) {
|
|
|
+ animation: load 2.5s 1s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(4) {
|
|
|
+ animation: load 2.5s 0.8s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(5) {
|
|
|
+ animation: load 2.5s 0.6s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(6) {
|
|
|
+ animation: load 2.5s 0.4s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(7) {
|
|
|
+ animation: load 2.5s 0.2s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(8) {
|
|
|
+ animation: load 2.5s 0s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(9) {
|
|
|
+ animation: load 2.5s 0.2s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(10) {
|
|
|
+ animation: load 2.5s 0.4s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(11) {
|
|
|
+ animation: load 2.5s 0.6s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(12) {
|
|
|
+ animation: load 2.5s 0.8s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(13) {
|
|
|
+ animation: load 2.5s 1s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(14) {
|
|
|
+ animation: load 2.5s 1.2s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-loader .em:nth-child(15) {
|
|
|
+ animation: load 2.5s 1.4s infinite linear;
|
|
|
+ }
|
|
|
+
|
|
|
+ @keyframes load {
|
|
|
+ 0% {
|
|
|
+ height: 10%;
|
|
|
+ }
|
|
|
+
|
|
|
+ 50% {
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ height: 10%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 语音音阶-------------------- */
|
|
|
+ .prompt-layer-2 {
|
|
|
+ top: -40px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-layer-2 .text {
|
|
|
+ color: rgba(0, 0, 0, 1);
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|