使用vue开发实现XixunPlayer的功能.

XixunPlayer 实现删除文件

/**
* @Author: 858834013@qq.com
* @Name: deleteFile
* @Date: 2022-04-26
* @Desc: XixunPlayer 删除文件
*/
<template>
  <div class="deleteFile">
    <el-button @click="deleteFile" type="text" size="small">删除</el-button>
  </div>
</template>

<script>
import { getdata } from '@/api/led/led'
import qs from 'qs'
import axios from 'axios'

export default {
  name: 'deleteFile',
  components: {},
  props: {
    item: {
      type: Object,
      default () {
        return {}
      }
    },
    id: {
      type: String | Object,
      default () {
        return ''
      }
    }
  },
  data () {
    return {
      dialogVisible: false
    }
  },
  watch: {
    dialogVisible () {
      if (this.dialogVisible) {
        this.getlist()
      }
    }
  },
  methods: {
    DeleteFilePath () {
      var that = this
      var data = qs.stringify({
        name: this.item.name,
        cardcode: this.id
      })
      axios({
        method: 'POST',
        url: url,
        data: data,
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded'
        }
      }).then(function (res) {
        if (res.data == '删除节目成功') {
          that.$message({
            message: res.data,
            type: 'success'
          })
          that.dialogVisible = false
          that.$emit('getdata', 0)
        } else {
          that.$message.error(res.data)
        }
      })
    },
    deleteFile () {
      var that = this
      getdata(that.id,
        {
          type: 'deleteFile',
          fileName: this.item.name,
          deleteAll: true
        }
      ).then(function (res) {
        if (res) {
          that.DeleteFilePath()
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.editinfo {
  display: inline-block;
}
</style>