|  | @@ -2,7 +2,8 @@
 | 
	
		
			
				|  |  |      <div v-if="wordList.length>0">
 | 
	
		
			
				|  |  |          <ul>
 | 
	
		
			
				|  |  |              <li v-for="(itemW,indexW) in wordList" :key="indexW" :class="['li-'+colorObj.type]">
 | 
	
		
			
				|  |  | -                <svg-icon icon-class="voice" className="icon-voice"></svg-icon>
 | 
	
		
			
				|  |  | +                <svg-icon v-if="itemW.hasVoice&&!voiceSrc||itemW.hasVoice&&activeIndex!==indexW" icon-class="voice" className="icon-voice" @click="handlePlayVoice(itemW,indexW)"></svg-icon>
 | 
	
		
			
				|  |  | +                <img v-if="itemW.hasVoice&&voiceSrc&&activeIndex===indexW" :src="voiceSrc" class="icon-voice" />
 | 
	
		
			
				|  |  |                  <div class="word-info">
 | 
	
		
			
				|  |  |                      <div class="word-info-top">
 | 
	
		
			
				|  |  |                          <b class="word" @click="showWord(itemW)" :style="{color:colorObj.newWordColor}">{{itemW.word}}</b>
 | 
	
	
		
			
				|  | @@ -51,14 +52,19 @@ export default {
 | 
	
		
			
				|  |  |    data() {
 | 
	
		
			
				|  |  |      //这里存放数据
 | 
	
		
			
				|  |  |      return {
 | 
	
		
			
				|  |  | -        wordList: []
 | 
	
		
			
				|  |  | +        wordList: [],
 | 
	
		
			
				|  |  | +        audio: new Audio(),
 | 
	
		
			
				|  |  | +        voiceSrc: "",
 | 
	
		
			
				|  |  | +        voicePauseSrc: '',
 | 
	
		
			
				|  |  | +        voicePlaySrc: require("../../../../assets/voice-play-gray.png"),
 | 
	
		
			
				|  |  | +        activeIndex: null
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    //计算属性 类似于data概念
 | 
	
		
			
				|  |  |    computed: {},
 | 
	
		
			
				|  |  |    //监控data中数据变化
 | 
	
		
			
				|  |  |    watch: {
 | 
	
		
			
				|  |  | -     list:{
 | 
	
		
			
				|  |  | +    list:{
 | 
	
		
			
				|  |  |        handler(val, oldVal) {
 | 
	
		
			
				|  |  |          const _this = this;
 | 
	
		
			
				|  |  |          if (val) {
 | 
	
	
		
			
				|  | @@ -71,6 +77,34 @@ export default {
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    //方法集合
 | 
	
		
			
				|  |  |    methods: {
 | 
	
		
			
				|  |  | +    async handlePlayVoice(item,index) {
 | 
	
		
			
				|  |  | +      let _this = this;
 | 
	
		
			
				|  |  | +      let url = ''
 | 
	
		
			
				|  |  | +      if(item.originalObj.word_explain.ph_mp3_id){
 | 
	
		
			
				|  |  | +        await getLogin('/FileServer/GetFileInfo', {file_id:item.originalObj.word_explain.ph_mp3_id})
 | 
	
		
			
				|  |  | +        .then((res) => {
 | 
	
		
			
				|  |  | +            if(res.status===1){
 | 
	
		
			
				|  |  | +                url = res.file_url
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +      }else if(item.originalObj.word_explain.ph_file_url){
 | 
	
		
			
				|  |  | +        url = item.originalObj.word_explain.ph_file_url
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +      if (!url) {
 | 
	
		
			
				|  |  | +        return;
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +    //   if (!this.audio.paused) {
 | 
	
		
			
				|  |  | +    //     this.audio.pause();
 | 
	
		
			
				|  |  | +    //   } else 
 | 
	
		
			
				|  |  | +      {
 | 
	
		
			
				|  |  | +        _this.audio.pause();
 | 
	
		
			
				|  |  | +        _this.audio.load();
 | 
	
		
			
				|  |  | +        _this.audio.src = url;
 | 
	
		
			
				|  |  | +        _this.audio.loop = false;
 | 
	
		
			
				|  |  | +        _this.audio.play();
 | 
	
		
			
				|  |  | +        _this.activeIndex = index
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  |      // 删除
 | 
	
		
			
				|  |  |      handleDelete(item,index){
 | 
	
		
			
				|  |  |          this.$confirm('确定删除吗?', '提示', {
 | 
	
	
		
			
				|  | @@ -103,7 +137,19 @@ export default {
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    //生命周期 - 挂载完成(可以访问DOM元素)
 | 
	
		
			
				|  |  |    mounted() {
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | +    let _this = this;
 | 
	
		
			
				|  |  | +    _this.voiceSrc = _this.voicePauseSrc;
 | 
	
		
			
				|  |  | +    _this.audio.addEventListener("play", function () {
 | 
	
		
			
				|  |  | +    //   console.log("播放");
 | 
	
		
			
				|  |  | +      _this.voiceSrc = _this.voicePlaySrc;
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    _this.audio.addEventListener("pause", function () {
 | 
	
		
			
				|  |  | +      _this.voiceSrc = _this.voicePauseSrc;
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    _this.audio.addEventListener("ended", function () {
 | 
	
		
			
				|  |  | +    //   console.log("停止");
 | 
	
		
			
				|  |  | +      _this.voiceSrc = _this.voicePauseSrc;
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    //生命周期-创建之前
 | 
	
		
			
				|  |  |    beforeCreated() { },
 |