|
@@ -65,8 +65,6 @@
|
|
|
<el-table-column label="序号" align="center" type="index"/>
|
|
|
<el-table-column label="景点名称" align="center" prop="voiceName"/>
|
|
|
<el-table-column label="二维码" align="center" prop="qrCodeUrl">
|
|
|
- <!-- <div ref="qrcode" class="qrcode" style="margin-left: 163px" @mouseover="hover = true" @mouseleave="hover = false"></div>-->
|
|
|
- <!-- <div ref="qrcode" style="margin-left: 163px"></div>-->
|
|
|
<template slot-scope="scope">
|
|
|
<el-popover placement="right" trigger="hover">
|
|
|
<img :src="getFullUrl(scope.row.qrCodeUrl)" style="width:200px;height:200px;"/>
|
|
@@ -74,7 +72,12 @@
|
|
|
</el-popover>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="备注" align="center" prop="remark"/>
|
|
|
+ <el-table-column label="作者" align="center" prop="author"/>
|
|
|
+ <el-table-column align="center" label="发布时间" prop="releaseTime" width="180">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ parseTime(scope.row.releaseTime, '{y}-{m}-{d}') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
@@ -110,8 +113,8 @@
|
|
|
@pagination="getList"
|
|
|
/>
|
|
|
|
|
|
- <!-- 添加或修改语音播报对话框 -->
|
|
|
- <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
|
|
+ <!-- 添加或修改景点播报对话框 -->
|
|
|
+ <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
|
<el-form-item label="景点名称" prop="voiceName">
|
|
|
<el-input v-model="form.voiceName" placeholder="请输入景点名称"/>
|
|
@@ -119,8 +122,21 @@
|
|
|
<el-form-item label="语音文件" prop="voiceUrl">
|
|
|
<file-upload v-model="form.voiceUrl"/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="备注" prop="remark">
|
|
|
- <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
|
|
|
+ <el-form-item label="内容" prop="content">
|
|
|
+ <editor style="height: 300px" label="富文本控件" v-model="form.content"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="作者" prop="author">
|
|
|
+ <el-input v-model="form.author" placeholder="请输入作者"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="排序" prop="sort">
|
|
|
+ <el-input-number :min="1" v-model="form.sort" placeholder="请输入排序"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="发布时间" prop="releaseTime">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.releaseTime"
|
|
|
+ type="date"
|
|
|
+ placeholder="请选择发布时间">
|
|
|
+ </el-date-picker>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
@@ -132,8 +148,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {getVoice, listVoice, addVoice, delVoice, updateVoice, createQrCode} from "@/api/system/voice";
|
|
|
-import QRCode from "qrcodejs2";
|
|
|
+import {addVoice, createQrCode, delVoice, getVoice, listVoice, updateVoice} from "@/api/system/voice";
|
|
|
|
|
|
export default {
|
|
|
name: "Voice",
|
|
@@ -151,7 +166,7 @@ export default {
|
|
|
showSearch: true,
|
|
|
// 总条数
|
|
|
total: 0,
|
|
|
- // 语音播报表格数据
|
|
|
+ // 景点播报表格数据
|
|
|
voiceList: [],
|
|
|
// 弹出层标题
|
|
|
title: "",
|
|
@@ -173,45 +188,29 @@ export default {
|
|
|
voiceUrl: [
|
|
|
{required: true, message: "语音文件不能为空", trigger: "blur"}
|
|
|
],
|
|
|
+ content: [
|
|
|
+ {required: true, message: "内容不能为空", trigger: "blur"}
|
|
|
+ ],
|
|
|
+ author: [
|
|
|
+ {required: true, message: "作者不能为空", trigger: "blur"}
|
|
|
+ ],
|
|
|
+ releaseTime: [
|
|
|
+ {required: true, message: "发布时间不能为空", trigger: "change"}
|
|
|
+ ],
|
|
|
},
|
|
|
- // showImg: false,// 是否显示企业签名二维码的弹框,默认false
|
|
|
- // qrcode: '',// 二维码数据
|
|
|
localIp: '',
|
|
|
localPort: '',
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
this.getList();
|
|
|
- // this.$nextTick(() => {
|
|
|
- // this.handleQrCode();
|
|
|
- // });
|
|
|
},
|
|
|
mounted() {
|
|
|
this.localIp = this.getLocalIp();
|
|
|
- console.log("localIp", this.localIp)
|
|
|
this.localPort = this.getPort()
|
|
|
- console.log("localPort", this.localPort)
|
|
|
},
|
|
|
methods: {
|
|
|
- // 生成二维码
|
|
|
- // handleQrCode(row) {
|
|
|
- // // 清除上一次的二维码
|
|
|
- // if (this.$refs.qrcode) {
|
|
|
- // this.$refs.qrcode.innerHTML = ''; // 清除二维码方法
|
|
|
- // }
|
|
|
- // // 生成二维码(这里有个坑,一定要在 new关键字前面用 等于号,赋给一个变量,否则vue运行会报错)
|
|
|
- // this.qrcode = new QRCode(this.$refs.qrcode, {
|
|
|
- // width: 50, // 二维码宽度 (不支持100%)
|
|
|
- // height: 50, // 二维码高度(不支持100%)
|
|
|
- // text: row.voiceUrl, // 后端返回的二维码地址
|
|
|
- // render: 'canvas', // 设置渲染方式(有两种方式 table和canvas,默认是canvas)
|
|
|
- // });
|
|
|
- // const canvas = document.querySelector('canvas');
|
|
|
- // const imageUrl = canvas.toDataURL('image/png');
|
|
|
- // console.log("imageUrl",imageUrl)
|
|
|
- // },
|
|
|
getLocalIp() {
|
|
|
- console.log("window.location", window.location)
|
|
|
const {hostname} = window.location;
|
|
|
return hostname === 'localhost' || hostname === '127.0.0.1'
|
|
|
? 'http://localhost'
|
|
@@ -239,7 +238,7 @@ export default {
|
|
|
});
|
|
|
this.getList()
|
|
|
},
|
|
|
- /** 查询语音播报列表 */
|
|
|
+ /** 查询景点播报列表 */
|
|
|
getList() {
|
|
|
this.loading = true;
|
|
|
listVoice(this.queryParams).then(response => {
|
|
@@ -287,7 +286,7 @@ export default {
|
|
|
handleAdd() {
|
|
|
this.reset();
|
|
|
this.open = true;
|
|
|
- this.title = "添加语音播报";
|
|
|
+ this.title = "添加景点播报";
|
|
|
},
|
|
|
/** 修改按钮操作 */
|
|
|
handleUpdate(row) {
|
|
@@ -296,7 +295,7 @@ export default {
|
|
|
getVoice(id).then(response => {
|
|
|
this.form = response.data;
|
|
|
this.open = true;
|
|
|
- this.title = "修改语音播报";
|
|
|
+ this.title = "修改景点播报";
|
|
|
});
|
|
|
},
|
|
|
/** 提交按钮 */
|
|
@@ -331,7 +330,7 @@ export default {
|
|
|
},
|
|
|
/** 导出按钮操作 */
|
|
|
handleExport() {
|
|
|
- this.download('system/voice/export', {
|
|
|
+ this.download('app/voice/export', {
|
|
|
...this.queryParams
|
|
|
}, `user_${new Date().getTime()}.xlsx`)
|
|
|
},
|