c5_labsci/fapp/ciyon_ap/components/ciy-aivoice/ciy-aivoice.vue

104 lines
3.0 KiB
Vue

<template>
<view class="_voice" @touchstart="start" @touchend="stop" v-if="benable">
<ciy-ani class="_txt" ref="ani">{{txt}}</ciy-ani>
<ciy-svgimg :src="svg" class="_img" :style="{filter:'hue-rotate('+deg+'deg)'}"></ciy-svgimg>
</view>
</template>
<script>
export default {
emits: ['change'],
props: {
maskpng: {
type: String,
default: ''
},
},
data() {
return {
benable: true,
bst: false,
txt: '',
deg: 0, //150 红
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" version="1"><path fill="#1989d8" d="M1006 520c0 269-218 486-486 486-56 0-110-10-161-28-13 10-28 18-46 18-41 0-74-33-74-74 0-41 33-74 74-74 33 0 61 23 72 54 44 15 90 23 136 23 225 0 407-182 407-407 0-79-23-154-61-215-3-5-3-10-3-15 0-20 5-28 20-38 13-8 23-5 38-5 54 79 84 174 84 276z m-266-159v317c0 20-15 36-36 36-20 0-36-15-36-36V361c0-20 15-36 36-36 18 0 36 15 36 36z m-133 343h-8l-20 8c-8 0-18-13-20-20l-38-102h-146l-56 102c-3 8-13 20-20 20l-26-8c-10 0-18-8-18-18v-8L394 333c3-8 10-10 15-10h46c8 0 13 5 15 10L614 681c5 10 0 20-8 23zM435 404l-61 115h123L435 404z m269-238c-26 0-49-15-61-36-38-13-79-18-120-18-225 0-407 182-407 407 0 46 8 92 23 133 5 18 13 38 15 49 8 18-15 36-36 36-33 0-44-26-44-26-26-59-41-125-41-195 0-269 218-486 486-486 44 0 84 5 123 18 13-18 36-31 59-31 41 0 74 33 74 74 0 41-33 74-72 74z"/></svg>'
};
},
watch: {},
computed: {},
mounted() {
var app = getApp();
if (app.globalData.plugin_wechatsi_manager) {
app.globalData.plugin_wechatsi_manager.onStop = res => {
this.$emit('change', {
txt: res.result,
data: res
});
this.getrefsSync('ani', this).Doani('op0|op1,200');
this.txt = res.result;
if (this._t)
clearTimeout(this._t);
this._t = setTimeout(() => {
this.getrefsSync('ani', this).Doani('op1|op0,sa1.5,300|hide');
}, 5000);
}
app.globalData.plugin_wechatsi_manager.onStart = res => {
console.log("成功开始录音识别", res)
}
app.globalData.plugin_wechatsi_manager.onError = res => {
clearInterval(this._an);
this.deg = 150; //红
console.error("error msg", res.msg)
}
this._an = setInterval(() => {
this.deg += 10;
}, 100);
} else {
this.benable = false;
}
},
unmounted() {
clearInterval(this._an);
},
methods: {
test() {
this.getrefsSync('ani', this).Doani('op0|op1,200');
this.txt = 'res.result';
if (this._t)
clearTimeout(this._t);
this._t = setTimeout(() => {
this.getrefsSync('ani', this).Doani('op1|op0,sa1.5,300|hide');
}, 5000);
},
start() {
this.bst = true;
var app = getApp();
app.globalData.plugin_wechatsi_manager.start({
duration: 60000
});
},
stop() {
this.bst = false;
var app = getApp();
app.globalData.plugin_wechatsi_manager.stop();
}
}
}
</script>
<style scoped>
._voice ._img {
width: 3em;
height: 3em;
display: block;
}
._voice ._txt {
position: fixed;
bottom: 7em;
left: 0;
right: 0;
opacity: 0;
text-align: center;
}
</style>