<template>
  <div>
    <el-form>
      <el-form-item label-width="100px">

        <el-input placeholder="请输入内容" v-model="name" class="input-with-select">
          <el-select v-model="platform" slot="prepend" placeholder="请选择">
            <el-option label="网易云音乐" value="1"></el-option>
            <el-option label="QQ音乐" value="2" disabled></el-option>
            <el-option label="酷狗音乐" value="3" disabled></el-option>
          </el-select>
          <el-button slot="append" icon="el-icon-search" @click="getList"></el-button>
        </el-input>
      </el-form-item>
    </el-form>
    <div>
      <div v-for="item in musicList">

      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'component2',
  data () {
    return {
      platform: '1',
      name: '孤勇者',
      musicList: [],
    }
  },
  methods: {
    // 获取音乐列表
    getList () {
      let search = this.name
      this.$tool.request({
        url: `/wy/api/search/get/web?csrf_token=hlpretag=&hlposttag=&s=${search}&type=1&offset=0&total=true`,
        method: 'get',
      }).then(res => {
        console.log(res)
        if (res.code === 200) {
          this.musicList = res.result
        }
      })
    }
  },
  created () {
  }
}
</script>
<style scoped>
.el-select .el-input {
  width: 130px;
}
</style>
