/****************************************************************************

所属系统: 组件库
所属模块: 录音组件操场
创建时间: 2020年5月13日 14:30:21
维护人: 陈宇奇
*┌────────────────────────────────────────────────────────────┐
*│  此技术信息为本公司机密信息，未经本公司书面同意禁止向第三方披露．│
*│  版权所有：杰人软件(深圳)有限公司                             │
*└────────────────────────────────────────────────────────────┘
***************************************************************************/
<template>
  <div class="j-pt-30 j-pl-30">
    <h4 class="j-pb-10">正常录音</h4>
    <jr-record  v-model="url1"   
                businessCode="DPC"
                action="//192.168.99.29:8200/"
                ref="record"
                @upload-complate="handleComplate"></jr-record>
    <div class="j-pt-15 j-pb-30"><jr-button @click="handleSave">保存</jr-button></div>

    
    <h4 class="j-pb-10">数据回显</h4>
    <jr-record  v-model="url2"  
                businessCode="DPC"
                action="//192.168.99.29:8200/"
               ></jr-record>
    <div class="j-pt-15 j-pb-30"><jr-button @click="handleInstall">插入音频</jr-button></div>

    <h4 class="j-pb-10">只读状态</h4>
    <jr-record  v-model="url3"  
                businessCode="DPC"
                action="//192.168.99.29:8200/"
                readonly
               ></jr-record>
  </div>
  </table>
</template>
<script>
export default {
  name: "recordView",
  label: "录音操场",
  data() {
    return {
      url1: '',
      url2: '',
      url3: 'http://jerrisoft-test-oss.oss-cn-shenzhen.aliyuncs.com/dpc/382909695b08d5bc1b2e6636de78e8e9/ab09d1536e1be.mp3'
    };
  },
  methods: {
    handleComplate(data) {
      // 文件上传完成 去做自己的事情吧
      console.log(data)
    },
    async handleSave() {
      // 保存之前走一下校验
      await this.$refs.record.validate()
      this.$msg('已保存')
    },
    handleInstall() {
      this.url2 = "http://jerrisoft-test-oss.oss-cn-shenzhen.aliyuncs.com/dpc/382909695b08d5bc1b2e6636de78e8e9/ab09d1536e1be.mp3";
    },
  }
};
</script>
<style scoped lang='scss'>
</style>