no message

src/components/GanttChart/index.vue

@@ -23,7 +23,7 @@
         <span class="solid"></span>
       </div>
       <draggable class="label_box" v-model="item.list" group="componentGroup" :item-key="index.toString()"
-        :move="onMove" :end="onEnd">
+        @move="onMove" @end="onEnd">
         <template #item="{ element, index }">
           <div @mousedown.stop style="width: 100%">
             <el-popover placement="bottom" trigger="click" width="300px" popper-class="popper"
@@ -192,6 +192,7 @@ watch(() => props.date, (val) => {
 
 // 拖拽内容
 function onMove(params) {
+  console.log(1);
   if (params.to.childElementCount < 1) {
     return true
   } else {
@@ -201,6 +202,7 @@ function onMove(params) {
 
 // 拖拽结束
 function onEnd(params) {
+  console.log(2);
   if (params.from.className === 'contentList' &&
     params.to.className === 'label_box' ||
     params.from.className === 'label_box' &&

src/views/content/ohplay/index.vue

@@ -31,7 +31,7 @@
       <el-table-column label="歌曲名称" prop="name" align="center"></el-table-column>
       <el-table-column label="歌曲封面" prop="thumbUrl" align="center" width="100px">
         <template #default="scope">
-          <el-image :src="scope.row.thumbUrl" />
+          <el-image v-if="scope.row.thumbUrl" :src="scope.row.thumbUrl" />
         </template>
       </el-table-column>
       <el-table-column label="歌手名称" prop="singerName" align="center"></el-table-column>

src/views/content/scene/detail.vue

@@ -12,19 +12,20 @@
         <div class="date" v-for="(item, index) in data.dateList">
           <el-time-picker ref="picker" v-model="data.dateList[index]" is-range format="HH:mm:ss" value-format="HH:mm:ss"
             start-placeholder="开始时间" end-placeholder="结束时间" @change="handleChangeDate($event, index)" />
-          <el-link v-show="data.dateList.length > 1" icon="CircleClose" :underline="false" @click="handleDeleteDate(index)" />
+          <el-link v-show="data.dateList.length > 1" icon="CircleClose" :underline="false"
+            @click="handleDeleteDate(index)" />
           <el-link v-show="data.dateList.length - 1 === index" icon="CirclePlus" :underline="false"
             @click="handlePushDate" />
         </div>
       </el-form-item>
-      <el-form-item label="关联设备：" style="width: 900px">
+      <el-form-item label="关联设备：" style="width: 900px" prop="tpresetContentInfoReq">
         <el-table :data="data.form.tpresetContentInfoReq">
           <el-table-column label="所属企业" align="center">
             <template #default="scope">
               <el-form-item :prop="`tpresetContentInfoReq.${scope.$index}.tenantId`"
                 :rules="{ required: true, trigger: 'change' }">
                 <el-select v-model="scope.row.tenantId" placeholder="请选择企业" style="width: 200px" filterable remote
-                  :remote-method="businessRemote" remote-show-suffix @change="handleChange">
+                  :remote-method="businessRemote" remote-show-suffix @change="handleChangeTenant">
                   <el-option v-for="item in businessData.options" :key="item.id" :value="item.id" :label="item.name" />
                 </el-select>
               </el-form-item>
@@ -54,7 +55,7 @@
           </el-table-column>
           <el-table-column label="操作" align="center">
             <template #default="scope">
-              <el-button type="danger" link>删除</el-button>
+              <el-button type="danger" link @click="getDelete(scope.$index)">删除</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -103,7 +104,8 @@ const data = reactive({
   },
   rules: {
     takeId: [{ required: true, message: '请选择预设音频', trigger: 'change' }],
-    listDate: [{ type: 'array', required: true, message: '请选择播放时间', trigger: 'change' }]
+    listDate: [{ type: 'array', required: true, message: '请选择播放时间', trigger: 'change' }],
+    tpresetContentInfoReq: [{ type: 'array', required: true, message: '请新增关联设备', trigger: 'change'}]
   },
   dialogForm: {
     pageNum: 1,
@@ -116,6 +118,15 @@ const data = reactive({
 
 const total = ref(0)
 
+const getAudioList = () => {
+  if (proxy.$route.query.audioList) {
+    let e = JSON.parse(proxy.$route.query.audioList)
+    data.form.takeId = e.id
+    data.form.takeName = e.name
+  }
+}
+getAudioList()
+
 // 列表
 function getList() {
   loading.value = true
@@ -135,6 +146,7 @@ function getDialog() {
   dialogVisible.value = true
   getList()
 }
+
 // 选择预设音频
 function handleChecked(item) {
   data.form.takeId = item.takeId
@@ -186,16 +198,22 @@ const handleChangeDate = (e, index) => {
   }
 }
 
-// 添加门店
+// 添加关联
 const getAdd = () => {
   data.form.tpresetContentInfoReq.push({})
 }
 
-const handleChange = (e) => {
+// 所属企业
+const handleChangeTenant = (e) => {
   storeData.form.tenantId = e
   getStore()
 }
 
+// 删除关联设备
+const getDelete = (index) => {
+  data.form.tpresetContentInfoReq.splice(index, 1)
+}
+
 // 提交
 const getSubmit = () => {
   proxy.$refs.form.validate(valid => {

src/views/content/scene/index.vue

@@ -111,16 +111,16 @@ function onMove(params) {
 }
 // 拖拽结束
 function onEnd(params) {
-  if (params.from.className === 'contentList' &&
-    params.to.className === 'label_box' ||
-    params.from.className === 'label_box' &&
-    params.from.__draggable_component__.itemKey !== params.to.__draggable_component__.itemKey) {
-    let query = {
-      value: params.item._underlying_vm_.value,
-      label: params.item._underlying_vm_.label
+  proxy.$modal.confirm(`是否要添加?`).then(() => {
+    if (params.from.className === 'contentList' &&
+      params.to.className === 'label_box' ||
+      params.from.className === 'label_box' &&
+      params.from.__draggable_component__.itemKey !== params.to.__draggable_component__.itemKey) {
+      getRouter({ audioList: JSON.stringify(params.item.__draggable_context.element) })
     }
-    getRouter(query)
-  }
+  }).catch(() => {
+    params.to.firstChild.remove()
+  })
 }
 
 // 弹窗

src/views/content/setting/detail.vue

@@ -2,8 +2,8 @@
   <div class='app-container'>
     <el-form class="form" label-width="100px" ref="form" :model="data.form" :rules="data.rules">
       <el-form-item class="chooseAudio" label="选择音频：" prop="audioList">
-        <div class="audioList" v-for="item in data.form.audioList" :key="item.id">
-          <el-tag v-show="item.type === 0 || item.type === 1" size="large" closable @close="handleClose(item)">
+        <div class="audioList" v-for="(item, index) in data.form.audioList" :key="item.id">
+          <el-tag v-show="item.type === 0 || item.type === 1" size="large" closable @close="handleClose(index)">
             {{ item.audioName }}
           </el-tag>
           <div v-show="item.type === 2" class="audio">
@@ -27,14 +27,14 @@
             @click="handlePushDate" />
         </div>
       </el-form-item>
-      <el-form-item label="所属门店：" style="width: 900px">
+      <el-form-item label="关联设备：" style="width: 900px" prop="tpresetContentInfoReq">
         <el-table :data="data.form.tpresetContentInfoReq">
           <el-table-column label="所属企业" align="center">
             <template #default="scope">
               <el-form-item :prop="`tpresetContentInfoReq.${scope.$index}.tenantId`"
                 :rules="{ required: true, trigger: 'change' }">
                 <el-select v-model="scope.row.tenantId" placeholder="请选择企业" style="width: 200px" filterable remote
-                  :remote-method="businessRemote" remote-show-suffix @change="handleChange">
+                  :remote-method="businessRemote" remote-show-suffix @change="handleChangeTenant">
                   <el-option v-for="item in businessData.options" :key="item.id" :value="item.id" :label="item.name" />
                 </el-select>
               </el-form-item>
@@ -62,6 +62,11 @@
               </el-form-item>
             </template>
           </el-table-column>
+          <el-table-column label="操作" align="center">
+            <template #default="scope">
+              <el-button type="danger" link @click="getDelete(scope.$index)">删除</el-button>
+            </template>
+          </el-table-column>
         </el-table>
       </el-form-item>
       <el-form-item style="width: 800px">
@@ -175,10 +180,45 @@ const data = reactive({
     }],
     listDate: [{
       required: true, message: '请选择播放时间', trigger: 'change'
+    }],
+    tpresetContentInfoReq: [{
+      required: true, message: '请新增关联', trigger: 'change'
     }]
   },
 })
 
+// 传参
+const getAudioList = () => {
+  if (proxy.$route.query.audioList) {
+    let e = JSON.parse(proxy.$route.query.audioList)
+    data.form.audioList.push({
+      audioId: e.id,
+      audioName: e.name,
+      audioType: e.audioType,
+      categoryId: e.sceneId,
+      type: e.type
+    })
+  }
+}
+getAudioList()
+
+// 详情
+const getDetail = () => {
+  let e = proxy.$route.query
+  if (e.id) {
+    detail({ id: e.id, storeId: e.storeId }).then(res => {
+      if (res.code === 0) {
+        data.form = res.data
+        data.dateList = []
+        res.data.listDate.map(i => {
+          data.dateList.push([i.startTime, i.endTime])
+        })
+      }
+    })
+  }
+}
+getDetail()
+
 // 弹窗
 const dialogVisible = ref(false)
 // 打开弹窗
@@ -192,9 +232,9 @@ function getDialog() {
         proxy.$refs.table.clearSelection()
         if (val && data.form.audioList.length > 0) {
           data.form.audioList.map(i => {
-            let row = val.find(j => j.id === i.id)
+            let row = val.find(j => j.id === i.audioId)
             if (row) {
-              proxy.$refs.table.toggleRowSelection(row)
+              proxy.$refs.table.toggleRowSelection(row, true)
             }
           })
         }
@@ -203,22 +243,74 @@ function getDialog() {
   })
 }
 
-// 详情
-const getDetail = () => {
-  let e = proxy.$route.query
-  if (e.id) {
-    detail({ id: e.id, storeId: e.storeId }).then(res => {
-      if (res.code === 0) {
-        data.form = res.data
-        data.dateList = []
-        res.data.listDate.map(i => {
-          data.dateList.push([i.startTime, i.endTime])
-        })
-      }
-    })
+// 搜索
+const getSearch = () => {
+  audioData.form.pageNum = 1
+  getAudio()
+}
+
+// 重置
+const getRefresh = () => {
+  audioData.form = {
+    pageNum: 1,
+    pageSize: 10,
+    type: 0
   }
+  getAudio()
+}
+
+// 返回id
+const rowKey = (e) => {
+  return e.id
+}
+
+// 多选
+const handleSelectionChange = (e) => {
+  data.selectionList = []
+  e.map(i => {
+    if (data.selectionList.findIndex(j => j.id === i.id) === -1) {
+      data.selectionList.push({
+        audioId: i.id,
+        audioName: i.name,
+        audioType: i.audioType,
+        categoryId: i.sceneId,
+        type: i.type
+      })
+    }
+  })
+}
+
+// 单选
+const handleChooseAudio = (e) => {
+  data.form.audioList = []
+  data.form.audioList.push({
+    audioId: e.id,
+    audioName: e.name,
+    audioType: i.audioType,
+    categoryId: i.sceneId,
+    type: i.type
+  })
+  proxy.$modal.msgSuccess('选择成功！')
+  dialogVisible.value = false
+}
+
+// 确定
+const getPush = () => {
+  data.form.audioList = []
+  data.form.audioList = JSON.parse(JSON.stringify(data.selectionList))
+  proxy.$modal.msgSuccess('选择成功！')
+  dialogVisible.value = false
+}
+
+// 删除音频
+const handleClose = (index) => {
+  data.form.audioList.splice(index, 1)
+}
+
+// 删除所属门店
+const getDelete = (index) => {
+  data.form.tpresetContentInfoReq.splice(index, 1)
 }
-getDetail()
 
 // 增加时间
 function handlePushDate() {
@@ -268,7 +360,8 @@ const getAdd = () => {
   data.form.tpresetContentInfoReq.push({})
 }
 
-const handleChange = (e) => {
+// 所属企业
+const handleChangeTenant = (e) => {
   storeData.form.tenantId = e
   getStore()
 }
@@ -278,6 +371,7 @@ const getClose = () => {
   proxy.$tab.closeOpenPage('/content/setting')
 }
 
+// 提交
 const getSubmit = () => {
   proxy.$refs.form.validate(valid => {
     if (valid) {
@@ -293,70 +387,6 @@ const getSubmit = () => {
   })
 }
 
-// 搜索
-const getSearch = () => {
-  audioData.form.pageNum = 1
-  getAudio()
-}
-
-// 重置
-const getRefresh = () => {
-  audioData.form = {
-    pageNum: 1,
-    pageSize: 10,
-    type: 0
-  }
-  getAudio()
-}
-
-// 返回id
-const rowKey = (e) => {
-  return e.id
-}
-
-// 多选
-const handleSelectionChange = (e) => {
-  data.selectionList = []
-  e.map(i => {
-    if (data.selectionList.findIndex(j => j.id === i.id) === -1) {
-      data.selectionList.push({
-        audioId: i.id,
-        audioName: i.name,
-        audioType: i.audioType,
-        categoryId: i.sceneId,
-        type: i.type
-      })
-    }
-  })
-}
-
-// 单选
-const handleChooseAudio = (e) => {
-  data.form.audioList = []
-  data.form.audioList.push({
-    audioId: e.id,
-    audioName: e.name,
-    audioType: i.audioType,
-    categoryId: i.sceneId,
-    type: i.type
-  })
-  proxy.$modal.msgSuccess('选择成功！')
-  dialogVisible.value = false
-}
-
-// 删除
-const handleClose = (e) => {
-  console.log(e);
-}
-
-// 确定
-const getPush = () => {
-  data.form.audioList = []
-  data.form.audioList = JSON.parse(JSON.stringify(data.selectionList))
-  proxy.$modal.msgSuccess('选择成功！')
-  dialogVisible.value = false
-}
-
 // 字典
 const statusFormatter = (row) => {
   return proxy.selectDictLabel(sys_change_status.value, row.status)

src/views/content/setting/index.vue

@@ -19,9 +19,9 @@
             v-loading="audioData.loading">
             <el-empty v-if="audioData.tableData.length === 0" description="暂无数据" />
             <el-scrollbar v-else :height="220">
-              <draggable class="contentList" :style="[activeName !== 2 ? 'flex-direction: column' : 'flex-wrap: wrap;']" v-model="audioData.tableData"
-                item-key="id" chosen-class="chosenClass" data-id="content"
-                :group="{ name: 'componentGroup', pull: 'clone', put: false }" :sort="false" :move="onMove"
+              <draggable class="contentList" :style="[activeName !== 2 ? 'flex-direction: column' : 'flex-wrap: wrap;']"
+                v-model="audioData.tableData" item-key="id" chosen-class="chosenClass" data-id="content"
+                :group="{ name: 'componentGroup', pull: 'clone', put: false }" :sort="false" @move="onMove"
                 @end="onEnd">
                 <template #item="{ element, index }">
                   <div class="item">
@@ -131,16 +131,16 @@ function onMove(params) {
 
 // 拖拽结束
 function onEnd(params) {
-  if (params.from.className === 'contentList' &&
-    params.to.className === 'label_box' ||
-    params.from.className === 'label_box' &&
-    params.from.__draggable_component__.itemKey !== params.to.__draggable_component__.itemKey) {
-    let query = {
-      value: params.item._underlying_vm_.value,
-      label: params.item._underlying_vm_.label
+  proxy.$modal.confirm(`是否要添加?`).then(() => {
+    if (params.from.className === 'contentList' &&
+      params.to.className === 'label_box' ||
+      params.from.className === 'label_box' &&
+      params.from.__draggable_component__.itemKey !== params.to.__draggable_component__.itemKey) {
+      getRouter({ audioList: JSON.stringify(params.item.__draggable_context.element)})
     }
-    getRouter(query)
-  }
+  }).catch(() => {
+    params.to.firstChild.remove()
+  })
 }
 
 // 新增
@@ -231,6 +231,8 @@ draggable,
 
 .chosenClass {
   background: none !important;
+  color: #3979F9 !important;
+  line-height: 60px;
 }
 
 .el-scrollbar {