管理后台-演出管理：演出安排

htmldev/manage/src/views/business/sms/plan/details.vue

@@ -35,9 +35,9 @@
                 placeholder="请选择演唱艺人">
                 <el-option
                   v-for="item in singerData"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value">
+                  :key="item.id"
+                  :label="item.user_name"
+                  :value="item.id">
                 </el-option>
               </el-select>
             </el-col>
@@ -153,7 +153,7 @@ export default {
       })
     },
     handleSubmit () {
-      // todo 修改
+      // 不做修改，业务上是直接删除，然后重新添加
       const url = this.exData.id ? '' : '/v1/bar/show/plan/add'
 
       this.$refs.form.validate(async valid => {
@@ -176,22 +176,7 @@ export default {
       })
     }
   },
-  mounted () {
-    if (this.exData.id) {
-      this.$set(this.form, 'id', this.exData.id)
-      for (const key in this.exData) {
-        if (this.form.hasOwnProperty(key)) {
-          let value = this.exData[key]
-          if ((Array.isArray(value) && value.length > 0) || value) {
-            if (key === 'bar_status') {
-              value = value.toString()
-            }
-            this.$set(this.form, key, value)
-          }
-        }
-      }
-    }
-  },
+  mounted () {},
   watch: {
     dialog (val) {
       if (!val) this.$emit('input', val)

htmldev/manage/src/views/business/sms/plan/index.vue

@@ -41,12 +41,11 @@
       <el-table-column label="本节点歌歌单">
         <template slot-scope="scope">
           <span style="margin-right: 20px;">{{ scope.row.song_num }}</span>
-          <el-button type="text" @click="editPlayList(scope.row)">设置歌单</el-button>
         </template>
       </el-table-column>
       <el-table-column label="操作">
         <template slot-scope="scope">
-          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
+          <el-button type="text" @click="editPlayList(scope.row)">设置歌单</el-button>
           <el-button type="text" @click="del(scope.row)">删除</el-button>
         </template>
       </el-table-column>
@@ -69,6 +68,7 @@
             @success="init"></detail>
     <playList v-if="playListDialog.show"
               v-model="playListDialog.show"
+              :musicData="musicData"
               :exData="playListDialog.exData"
               @success="init"></playList>
   </div>
@@ -131,17 +131,13 @@ export default {
       this.detailsDialog.exData = {}
       this.detailsDialog.show = true
     },
-    edit (row) {
-      this.detailsDialog.exData = row
-      this.detailsDialog.show = true
-    },
     del (row) {
       this.$confirm('确定要删除吗', '确认', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(async () => {
-        const data = await this.$fetch('/api/auth/department/del', { id: row.id })
+        const data = await this.$fetch('/v1/bar/show/plan/delete', { id: row.id }, 'get')
         if (data.code === 200) {
           this.$message.success('删除成功')
           this.init()
@@ -150,6 +146,8 @@ export default {
     },
     // 设置歌单弹窗
     editPlayList (row) {
+      this.fetchMusicList(row.user_id)
+      this.fetchSongDetail(row.plan_id)
       this.playListDialog.exData = row
       this.playListDialog.show = true
     },
@@ -161,27 +159,33 @@ export default {
         page_size: 10000
       }, 'get')
       if (this.tableData && (data.data || data.list) && code === 200) {
-        this.singerData = (data.data || data.list).map(item => ({
-          ...item,
-          value: item.id,
-          label: item.user_name
-        }))
+        this.singerData = data.data || data.list
+      }
+    },
+    // 获取歌手当天演出歌曲列表
+    async fetchSongDetail (planId) {
+      const api = '/v1/bar/show/plan/song/detail'
+      const { code, data } = await this.$fetch(api, {
+        plan_id: planId
+      }, 'get')
+      if (code === 200) {
+        this.playListDialog.exData = {
+          ...this.playListDialog.exData,
+          plan_id: planId,
+          songs: data
+        }
       }
     },
     // 获取歌手曲库
-    async fetchMusicList () {
+    async fetchMusicList (id) {
       const api = '/v1/user/song/list'
       const { code, data } = await this.$fetch(api, {
         page: 1,
         page_size: 10000,
-        id: ''
+        id: id
       }, 'get')
       if (this.tableData && (data.data || data.list) && code === 200) {
-        this.musicData = (data.data || data.list).map(item => ({
-          ...item,
-          value: item.id,
-          label: item.user_name
-        }))
+        this.musicData = data.data || data.list
       }
     }
   },

htmldev/manage/src/views/business/sms/plan/playList.vue

@@ -10,31 +10,32 @@
                :rules="formRules"
                label-width="80px">
         <el-form-item>
-          <h4>设置 王羲之 2021-05-19 第一节的点歌歌单</h4>
+          <h4>设置 {{ plan_author_name }} {{ plan_start_time.replace(/\s\w.*/, '') }} 第一节的点歌歌单</h4>
         </el-form-item>
-        <el-form-item v-for="(domain, index) in form.domains"
-                      :label="(index + 1)"
-                      :key="domain.key"
-                      :prop="'domains.' + index + '.value'">
+        <el-form-item v-for="(song, index) in form.songs"
+                      :label="(index + 1).toString()"
+                      :key="index"
+                      :prop="'songs.' + index + '.value'">
           <el-select class="af-el-select"
-                     v-model="domain.singer"
+                     v-model="song.song_id"
                      filterable
                      placeholder="请选择歌曲">
             <el-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value">
+              v-for="item in musicData"
+              :key="item.id"
+              :label="item.song_name"
+              :value="item.song_id">
             </el-option>
           </el-select>
           <el-button type="warning"
-                     @click.prevent="removeDomain(domain)">删除
+                     :disabled="form.songs.length <= 1"
+                     @click.prevent="removeSong(song)">删除
           </el-button>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer text-center">
         <el-button @click="dialog = false">取 消</el-button>
-        <el-button @click="addDomain">新增歌曲</el-button>
+        <el-button @click="addSong">新增歌曲</el-button>
         <el-button type="primary" @click="handleSubmit">确 定</el-button>
       </div>
     </el-dialog>
@@ -54,65 +55,51 @@ export default {
       default: function () {
         return {}
       }
+    },
+    musicData: {
+      type: Array,
+      default: function () {
+        return []
+      }
     }
   },
   data () {
     return {
       dialog: !!this.value,
       form: {
-        bar_name: '', // 门店名称
-        bar_address: '', // 门店地址
-        bar_status: '1', // 门店状态(0无效1有效)
-        bar_img_url: [], // 门店图片
-        bar_song_start_time: '', // 点歌开始时间
-        bar_song_end_time: '', // 点歌结束时间
-        bar_place_reserve_start_time: '', // 座位预定开始时间
-        bar_place_reserve_end_time: '', // 座位预定结束时间
-        note: '', // 备注
-        domains: [
+        plan_id: '',
+        songs: [
           {
-            singer: '',
-            value1: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)]
-          },
-          {
-            singer: '',
-            value1: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)]
+            'song_id': '',
+            'song_name': '',
+            'song_price': '',
+            'song_auth_name': ''
           }
         ]
       },
-      options: [{
-        value: '选项1',
-        label: '黄金糕'
-      }, {
-        value: '选项2',
-        label: '双皮奶'
-      }, {
-        value: '选项3',
-        label: '蚵仔煎'
-      }, {
-        value: '选项4',
-        label: '龙须面'
-      }, {
-        value: '选项5',
-        label: '北京烤鸭'
-      }]
+      plan_author_name: '', // 歌手名
+      plan_start_time: '' // 演唱日期
+      // todo 第几节演唱
     }
   },
   methods: {
-    removeDomain (item) {
-      var index = this.form.domains.indexOf(item)
+    removeSong (item) {
+      var index = this.form.songs.indexOf(item)
       if (index !== -1) {
-        this.form.domains.splice(index, 1)
+        this.form.songs.splice(index, 1)
       }
     },
-    addDomain () {
-      this.form.domains.push({
-        value: '',
-        key: Date.now()
+    addSong () {
+      this.form.songs.push({
+        'song_id': '',
+        'song_name': '',
+        'song_price': '',
+        'song_auth_name': ''
       })
     },
     handleSubmit () {
-      const url = this.exData.id ? '/v1/bar/modify' : '/v1/bar/show/plan/song/add'
+      // TODO 修改
+      const url = this.exData.id ? '' : '/v1/bar/show/plan/song/add'
       this.$refs.form.validate(async valid => {
         if (valid) {
           const data = await this.$fetch(url, {
@@ -129,14 +116,13 @@ export default {
   },
   mounted () {
     if (this.exData.id) {
-      this.$set(this.form, 'id', this.exData.id)
+      this.plan_author_name = this.exData.plan_author_name
+      this.plan_start_time = this.exData.plan_start_time
+
       for (const key in this.exData) {
         if (this.form.hasOwnProperty(key)) {
           let value = this.exData[key]
           if ((Array.isArray(value) && value.length > 0) || value) {
-            if (key === 'bar_status') {
-              value = value.toString()
-            }
             this.$set(this.form, key, value)
           }
         }