Commit 7fa0b727 by huangqy

假如音频模块

parent 8711ef40
......@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>金锭生产防伪管理系统</title>
<title>贵金属生产管理系统</title>
</head>
<body>
<noscript>
......
......@@ -2,6 +2,8 @@
<div class="body" :style="'height:' + height + 'px'">
<div class="inner_border">
<el-card :style="'height:' + (height - 60) + 'px; overflow-y: auto; position:relative;'">
<audio controls="controls" hidden src="../../assets/error.mp3" ref="audio"></audio>
<audio controls="controls" hidden src="../../assets/success.mp3" ref="audio1"></audio>
<el-form :inline="true" :model="searchData" size="medium" label-position="left">
<el-row type="flex" justify="space-between" align="middle">
<el-col>
......@@ -86,7 +88,7 @@
</el-card>
<el-dialog :append-to-body="true" title="生产自检" :visible.sync="dialogVisible" @close="dialogClose()" width="1000px" :close-on-click-modal="false">
<el-dialog :append-to-body="true" title="生产自检" :visible.sync="dialogVisible" @close="dialogClose()" width="1200px" :close-on-click-modal="false">
<el-card>
<div slot="header" class="clearfix">
<span style="font-size: 20px;flex: 1">已自检数: <span style="color: green;font-size: 20px;">{{ formData.checkedNum }} </span></span>
......@@ -104,7 +106,7 @@
<div style="max-height: 130px;overflow:auto">
<ul>
<li v-for="item in logList" style="margin-top: 8px;" :key="item.time + item.log">
<div style="display: flex;justify-content: center;align-items: center">
<div style="display: flex;justify-content: center;align-items: center" :class="item.status === 1 ? 'greenFont': 'redFont' ">
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.log }}</div>
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.time }}</div>
</div>
......@@ -115,8 +117,8 @@
</el-card>
<span slot="footer" class="dialog-footer">
<a-button @click="dialogVisible = false" ghost type="danger">取 消</a-button>
<a-button type="primary" ghost @click="bindBatch()" style="margin-left: 10px;" :loading="loading">自 检</a-button>
<a-button @click="dialogVisible = false" ghost type="danger" size="large">取 消</a-button>
<a-button type="primary" ghost @click="bindBatch()" style="margin-left: 20px;" :loading="loading" size="large">自 检</a-button>
</span>
</el-dialog>
</div>
......@@ -226,9 +228,11 @@ export default {
},
websocketOnopen(e) {
this.logList.unshift({time: this.parseTime(new Date()), log: 'WebSocket连接建立' })
this.logList.unshift({time: this.parseTime(new Date()), log: 'WebSocket连接建立', status: 1 })
},
websocketOnerror: function (e) {
this.logList.unshift({time: this.parseTime(new Date()), log: '写入服务连接失败', status: 2 })
this.$refs.audio.play()
console.log("WebSocket连接发生错误");
},
websocketOnclose: function (e) {
......@@ -252,7 +256,6 @@ export default {
// obj = obj.substring(index+3, obj.length)
// var sendObj = { Uid: this.uid, Data: obj }
var sendObj = { Uid: this.uid, Data: backMessObj.Code }
console.log(JSON.stringify({Cmd: 3, Data: sendObj}))
this.websock.send(JSON.stringify({Cmd: 3, Data: sendObj}))
}
else if (backMessObj.Cmd === 254) {
......@@ -261,14 +264,17 @@ export default {
this.websock.send(JSON.stringify({Cmd: 1, Data: ''}))
}, 1000)
} else {
this.logList.unshift({time: this.parseTimes(new Date()), log: backMessObj.Data.Message })
this.$refs.audio.play()
this.logList.unshift({time: this.parseTimes(new Date()), log: backMessObj.Data.Message, status: 2 })
setTimeout(() => alert(backMessObj.Data.Message), 500)
}
}
},
async tagCheck(productCode) {
const { data: res } = await this.$axios.post('/api/tag/check', { tagUid: this.uid, productCode: productCode })
if (res.code != 99200) return this.$message.error(res.message)
this.logList.unshift({time: this.parseTimes(new Date()), log: '自检成功' })
this.logList.unshift({time: this.parseTimes(new Date()), log: '自检成功', status: 1 })
this.$refs.audio1.play()
this.findNumber()
},
async findNumber() {
......@@ -312,4 +318,10 @@ export default {
align-items: center;
text-align: center;
}
.greenFont {
color: green;
}
.redFont {
color: red;
}
</style>
......@@ -4,6 +4,8 @@
<div class="inner_border">
<!-- 主体区域 - 卡片视图 -->
<el-card :style="'height:' + (height - 60) + 'px;overflow-y: auto;position:relative;'">
<audio controls="controls" hidden src="../../assets/error.mp3" ref="audio"></audio>
<audio controls="controls" hidden src="../../assets/success.mp3" ref="audio1"></audio>
<!-- 查询功能区域 -->
<el-form :inline="true" :model="searchData" size="medium" label-position="left" >
<el-row type="flex" justify="space-between" align="middle">
......@@ -100,7 +102,7 @@
:title="title"
:visible.sync="dialogVisible"
@close="dialogClose()"
width="800px"
width="1000px"
:close-on-click-modal="false"
>
<!-- 表单区域 -->
......@@ -159,13 +161,13 @@
</el-dialog>
<el-dialog :append-to-body="true" title="数据绑定" :visible.sync="bindVisible" @close="bindDialogClose()" width="1000px" :close-on-click-modal="false">
<el-dialog :append-to-body="true" title="数据绑定" :visible.sync="bindVisible" @close="bindDialogClose()" width="1200px" :close-on-click-modal="false">
<el-card>
<div slot="header" class="clearfix">
<span style="font-size: 20px;flex: 1">生产总数: <span style="color: green;font-size: 20px;">{{ bindForm.total }} </span></span>
<span style="font-size: 20px;flex: 1">已绑定数量: <span style="color: red;font-size: 20px;">{{ bindForm.doneNum }} </span></span>
</div>
<el-descriptions direction="vertical" border :column="5">
<el-descriptions direction="vertical" border :column="5" size="medium">
<el-descriptions-item label="批次号" :labelStyle="{'text-align': 'center'}" :contentStyle="{'text-align': 'center'}">{{ bindForm.batchNo }}</el-descriptions-item>
<el-descriptions-item label="产品名称" :labelStyle="{'text-align': 'center'}" :contentStyle="{'text-align': 'center'}">{{ bindForm.productName }}</el-descriptions-item>
<el-descriptions-item label="规格" :labelStyle="{'text-align': 'center'}" :contentStyle="{'text-align': 'center'}">{{ bindForm.spec }}</el-descriptions-item>
......@@ -177,10 +179,10 @@
<div style="max-height: 130px;overflow:auto">
<ul>
<li v-for="item in logList" style="margin-top: 8px;" :key="item.time + item.log">
<div style="display: flex;justify-content: center;align-items: center">
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.log }}</div>
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.time }}</div>
</div>
<div style="display: flex;justify-content: center;align-items: center" :class="item.status === 1 ? 'greenFont': 'redFont' ">
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.log }}</div>
<div style="flex: 1;line-height: 16px; font-size: 16px;text-align: center">{{ item.time }}</div>
</div>
</li>
</ul>
</div>
......@@ -188,8 +190,8 @@
</el-card>
<span slot="footer" class="dialog-footer">
<a-button @click="bindVisible = false" ghost type="danger">取 消</a-button>
<a-button type="primary" ghost @click="bindBatch()" style="margin-left: 10px;" :loading="loading">绑 定</a-button>
<a-button @click="bindVisible = false" ghost type="danger" size="large">取 消</a-button>
<a-button type="primary" ghost @click="bindBatch()" style="margin-left: 20px;" :loading="loading" size="large">绑 定</a-button>
</span>
</el-dialog>
</el-card>
......@@ -199,24 +201,24 @@
<script>
import initData from '../../mixins/initData'
import Speech from 'speak-tts'
const speech = new Speech() // will throw an exception if not browser supported
if(speech.hasBrowserSupport()) { // returns a boolean
console.log("speech synthesis supported")
}
speech.init({
'volume': 1,
'lang': 'zh-CN',
'rate': 1,
'pitch': 1,
'voice':'Google 普通话(中国大陆)',
'splitSentences': true,
'listeners': {
'onvoiceschanged': (voices) => {
console.log("Event voiceschanged", voices)
}
}
})
// import Speech from 'speak-tts'
// const speech = new Speech() // will throw an exception if not browser supported
// if(speech.hasBrowserSupport()) { // returns a boolean
// console.log("speech synthesis supported")
// }
// speech.init({
// 'volume': 1,
// 'lang': 'zh-CN',
// 'rate': 1,
// 'pitch': 1,
// 'voice':'Google 普通话(中国大陆)',
// 'splitSentences': true,
// 'listeners': {
// 'onvoiceschanged': (voices) => {
// console.log("Event voiceschanged", voices)
// }
// }
// })
export default {
mixins: [initData],
data () {
......@@ -245,23 +247,22 @@ export default {
methods: {
speak(text) {
console.log(text)
speech.speak({
text: text,
queue: true, // current speech will be interrupted,
listeners: {
onstart: () => {
console.log("Start utterance")
},
onend: () => {
console.log("End utterance")
},
onresume: () => {
console.log("Resume utterance")
},
onboundary: (event) => {
console.log(event.name + ' boundary reached after ' + event.elapsedTime + ' milliseconds.')
}
onstart: () => {
console.log("Start utterance")
},
onend: () => {
console.log("End utterance")
},
onresume: () => {
console.log("Resume utterance")
},
onboundary: (event) => {
console.log(event.name + ' boundary reached after ' + event.elapsedTime + ' milliseconds.')
}
}
}).then(() => {
console.log("Success !")
......@@ -382,9 +383,11 @@ export default {
this.bindVisible = true
},
websocketOnopen(e) {
this.logList.unshift({time: this.parseTime(new Date()), log: 'WebSocket连接建立' })
this.logList.unshift({time: this.parseTime(new Date()), log: '写入服务连接建立', status: 1 })
},
websocketOnerror: function (e) {
this.logList.unshift({time: this.parseTime(new Date()), log: '写入服务连接失败', status: 2 })
this.$refs.audio.play()
console.log("WebSocket连接发生错误");
},
websocketOnclose: function (e) {
......@@ -398,13 +401,14 @@ export default {
this.updateContent(backMessObj.Data.Access, backMessObj.Data.Data)
} else if (backMessObj.Cmd === 1){
if (this.oldUid !== this.newUid) {
this.logList.unshift({time: this.parseTime(new Date()), log: '读取到UID:' + backMessObj.Data })
// this.logList.unshift({time: this.parseTime(new Date()), log: '读取到UID:' + backMessObj.Data })
}
this.updateUid(backMessObj.Data)
}
else if (backMessObj.Cmd === 4){
this.speak('D')
this.logList.unshift({time: this.parseTime(new Date()), log: '标签成功写入生产数据' })
//this.speak('D')
this.$refs.audio1.play()
this.logList.unshift({time: this.parseTime(new Date()), log: '写入成功', status: 1 })
this.bindForm.doneNum ++
this.oldUid = this.newUid
setTimeout(() => {
......@@ -417,8 +421,10 @@ export default {
this.websock.send(JSON.stringify({Cmd: 1, Data: ''}))
}, 1000)
} else {
this.logList.unshift({time: this.parseTime(new Date()), log: backMessObj.Data.Message })
this.speak(backMessObj.Data.Message + ',请重新绑定')
this.logList.unshift({time: this.parseTime(new Date()), log: backMessObj.Data.Message, status: 2 })
this.$refs.audio.play()
setTimeout(() => alert(backMessObj.Data.Message), 500)
// this.speak(backMessObj.Data.Message + ',请重新绑定')
}
}
},
......@@ -441,8 +447,8 @@ export default {
this.websock.send(JSON.stringify({Cmd: 4, Data: {Access: password, Data: res.data.content, Code: res.data.productCode } }))
},
bindBatch() {
this.loading = true
this.websock.send(JSON.stringify({Cmd: 1, Data: ''}))
this.loading = true
this.websock.send(JSON.stringify({Cmd: 1, Data: ''}))
}
}
}
......@@ -454,4 +460,10 @@ export default {
align-items: center;
text-align: center;
}
.greenFont {
color: green;
}
.redFont {
color: red;
}
</style>
......@@ -4,7 +4,7 @@
<el-header class="ltk-header">
<div class="logo">
<img src="../assets/logo.png" alt="logo" />
<span>金锭生产防伪管理系统</span>
<span>贵金属生产管理系统</span>
</div>
<div class="time_box" @click="cut">
<bo-time></bo-time>
......
<template>
<template>
......@@ -4,7 +4,7 @@
<el-header class="ltk-header">
<div class="logo" @click="goHome()">
<img src="../assets/logo.png" alt="logo" />
<span>金锭生产防伪管理系统</span>
<span>贵金属生产管理系统</span>
</div>
<div class="time_box" @click="cut">
<bo-time></bo-time>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论