更新歌手页面，接口

src/api/application-song.js

@@ -47,7 +47,7 @@ export function tbShopSongEdit(data) {
  */
 export function tbShopSongDel(ids) {
   return request({
-    url: 'api/tbProduct/',
+    url: '/api/tbShopSong',
     method: 'delete',
     data: ids
   })

src/views/application/choose_song.vue

@@ -1,10 +1,16 @@
 <template>
   <div class="app-container">
-    <div class="head-container">
+    <div class="head-container flex">
       <el-button type="primary" icon="el-icon-plus" @click="$refs.addSong.show()">
         添加歌曲
       </el-button>
     </div>
+    <div class="flex">
+      <div class="flex">
+        <span>歌手页地址:</span>
+        <a class="cursor-pointer" target="_blank" :href="singgerUrl">{{singgerUrl}}</a>
+      </div>
+    </div>
     <div class="head-container" id="table_drag">
       <el-table :data="tableData.list" v-loading="tableData.loading" row-key="id">
         <el-table-column label="排序" sortable prop="sort"></el-table-column>
@@ -63,6 +69,7 @@
     },
     data() {
       return {
+        singgerUrl:'',
         tableData: {
           page: 0,
           size: 10,
@@ -76,6 +83,9 @@
       this.getTableData()
     },
     methods: {
+      jumpUrl(url){
+        window.open(url)
+      },
       addSongSuccess() {
         this.getTableData()
       },
@@ -132,8 +142,25 @@
           this.tableData.loading = false
           this.tableData.list = res.content
           this.tableData.total = res.totalElements
+          const baseUrl=location.hostname==='localhost'? 'https://admintestweb.sxczgkj.cn': location.origin
+           this.singgerUrl =  baseUrl+'/song-H5/index.html?t='+res.songUrl
         } catch (error) {}
       }
     }
   }
 </script>
+<style>
+.flex{
+  display: flex;
+  align-content: center;
+}
+.cursor-pointer{
+  cursor: pointer;
+  color: #1890ff!important;
+  transition: all 0.3s;
+  font-size: 16px;
+}
+.cursor-pointer:hover{
+  opacity: .7;
+}
+</style>

src/views/application/componentsCompoents/add-song.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog :title="title" width="500px" :visible.sync="dialogVisible">
+  <el-dialog :title="title" width="500px" :visible.sync="dialogVisible" @close="diaClose">
     <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
       <el-form-item label="歌曲图片">
         <uploadImg ref="uploadImg" :limit="1" @success="uploadSuccess" @remove="uploadRemove" />
@@ -33,13 +33,21 @@
   import {
     tbShopSongAdd,tbShopSongEdit
   } from '@/api/application-song'
+  const form={
+        img: '',
+          name: '',
+          singer: '',
+          originSinger: '',
+          price: 0,
+          sort: 0
+  }
   export default {
     components: {
       uploadImg
     },
     data() {
       return {
-        title: '新增歌曲',
+        title: '',
         dialogVisible: false,
         rules: {
           name: [{
@@ -63,20 +71,19 @@
             trigger: 'blur'
           }]
         },
-        form: {
-          img: '',
-          name: '',
-          singer: '',
-          originSinger: '',
-          price: 0,
-          sort: 0
-        }
+        form:form
       }
     },
     mounted() {
-      console.log(this.form);
     },
     methods: {
+      restForm(){
+        this.form=form
+        this.$refs.uploadImg.clearFiles()
+      },
+      diaClose(){
+        this.restForm()
+      },
       uploadSuccess(res) {
         this.form.img = res[0]
         console.log(this.form.img);
@@ -115,15 +122,20 @@
           }
         })
       },
-      async show(obj = {}, wine = false) {
+      async show(obj = {}) {
         console.log(obj);
+        // this.form=this.$options.data().form
         this.dialogVisible = true
+        this.title='添加歌曲'
+
         if (obj && obj.id) {
+          this.title='编辑歌曲'
           this.form = {
             ...obj
           }
         }
-        if (obj && obj.img) {
+        if (obj && obj.hasOwnProperty('img')&&obj.img) {
+          console.log(obj.img)
           this.form.img = obj.img
           requestAnimationFrame(()=>{
             this.$refs.uploadImg.fileList = [{
@@ -135,12 +147,8 @@
 
       },
       close() {
+        this.restForm()
         this.dialogVisible = false
-      },
-      reset() {
-        this.form = {
-          ...this.resetForm
-        }
       }
     }
   }