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"
@@ -31,8 +31,9 @@
               <div class="title">
                 <h2>{{ props.type === 'scene' ? element.takeName : element.name }}</h2>
                 <div style="display:flex; justify-content: space-between;">
-                  <span v-if="props.type === 'scene'">
-                    {{ element.listDate.startTime }} - {{ element.listDate.endTime }}</span>
+                  <div v-if="props.type === 'scene'">
+                    <span v-if="element.listDate">{{ element.listDate.startTime }} - {{ element.listDate.endTime }}</span>
+                  </div>
                   <div v-else>
                     <div v-if="element.listDate">{{ element.listDate.startTime.split(' ')[0] }}</div>
                     <div v-if="element.listDate">
@@ -40,7 +41,7 @@
                     </div>
                   </div>
                   <div style="display:flex; align-items: center">
-                    <el-icon style="margin-right: 10px" @click="getDetail(element)">
+                    <el-icon style="margin-right: 10px" @click="getDetail({...element, disabled: true})">
                       <Edit />
                     </el-icon>
                     <el-icon @click="getDelete(element)">
@@ -134,8 +135,8 @@ function getTime() {
       if (i === 23) {
         end = start + 3600000
       }
-    }else{
-      if(i === 23) {
+    } else {
+      if (i === 23) {
         end = start + 3600
       }
     }
@@ -198,24 +199,21 @@ watch(() => props.date, (val) => {
 
 // 拖拽内容
 function onMove(params) {
-  if (params.to.childElementCount < 1) {
-    return true
-  } else {
+  if (params.from.className === params.to.className) {
     return false
+  } else {
+    return true
   }
 }
 
 // 拖拽结束
 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
-    }
-    getDetail(query)
+  if (params.from.className !== params.to.className) {
+    proxy.$modal.confirm(`是否要添加?`).then(() => {
+      getDetail({ audioList: JSON.stringify(params.item.__draggable_context.element), disabled: true })
+    }).catch(() => {
+      params.to.firstChild.remove()
+    })
   }
 }
 
@@ -292,6 +290,7 @@ const storeName = (val) => {
   margin-left: 50px;
   overflow-y: auto;
   padding: 20px 20px 20px 50px;
+  user-select: none;
 
   .item {
     width: 100%;

src/views/content/scene/detail.vue

@@ -24,9 +24,10 @@
             <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="handleChangeTenant">
-                  <el-option v-for="item in businessData.options" :key="item.id" :value="item.id.toString()" :label="item.name" />
+                <el-select v-model="scope.row.tenantId" placeholder="请搜索并选择企业" style="width: 200px" filterable remote
+                  :remote-method="businessRemote" remote-show-suffix @change="handleChangeTenant($event, scope.$index)">
+                  <el-option v-for="item in businessData.options" :key="item.id" :value="item.id.toString()"
+                    :label="item.name" />
                 </el-select>
               </el-form-item>
             </template>
@@ -35,9 +36,10 @@
             <template #default="scope">
               <el-form-item :prop="`tpresetContentInfoReq.${scope.$index}.storeId`"
                 :rules="{ required: true, trigger: 'change' }">
-                <el-select v-model="scope.row.storeId" placeholder="请选择门店" style="width: 200px" filterable remote
+                <el-select v-model="scope.row.storeId" placeholder="请搜索并选择门店" style="width: 200px" filterable remote
                   :remote-method="storeRemote" remote-show-suffix>
-                  <el-option v-for="item in storeData.options" :key="item.id" :value="item.id.toString()" :label="item.name" />
+                  <el-option v-for="item in data.business_store[scope.$index]" :key="item.id"
+                    :value="item.id.toString()" :label="item.name" />
                 </el-select>
               </el-form-item>
             </template>
@@ -85,6 +87,7 @@
 <script setup>
 import { list, timeDetail, timeSubmit } from '@/api/content/scene.js'
 import { useBusinessSelect, useStoreSelect, useDeviceList } from '@/hooks/index.js'
+import { computed } from 'vue'
 
 // 公共方法
 const { deviceOptions } = useDeviceList()
@@ -105,7 +108,7 @@ const data = reactive({
   rules: {
     takeId: [{ required: true, message: '请选择预设音频', trigger: 'change' }],
     listDate: [{ type: 'array', required: true, message: '请选择播放时间', trigger: 'change' }],
-    tpresetContentInfoReq: [{ type: 'array', required: true, message: '请新增关联设备', trigger: 'change'}]
+    tpresetContentInfoReq: [{ type: 'array', required: true, message: '请新增关联设备', trigger: 'change' }]
   },
   dialogForm: {
     pageNum: 1,
@@ -115,7 +118,7 @@ const data = reactive({
   dateList: [[]],
   tableData: [],
   // 企业—门店
-  business_store: []
+  business_store: [],
 })
 
 const total = ref(0)
@@ -123,8 +126,8 @@ 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
+    data.form.takeId = e.takeId
+    data.form.takeName = e.takeName
   }
 }
 getAudioList()
@@ -132,16 +135,16 @@ getAudioList()
 // 详情
 const getDetail = (id) => {
   let e = proxy.$route.query
-  if(e.id) {
-    timeDetail({ id: e.id, storeId: e.storeId}).then(res => {
-    if(res.code === 0){
-      data.form = res.data
-      data.dateList = []
+  if (e.id) {
+    timeDetail({ 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()
@@ -160,10 +163,15 @@ function getList() {
 
 // 弹窗
 const dialogVisible = ref(false)
+
 // 打开弹窗
 function getDialog() {
-  dialogVisible.value = true
-  getList()
+  if (!proxy.$route.query.disabled) {
+    dialogVisible.value = true
+    getList()
+  } else {
+    proxy.$modal.msgError('不可编辑已选音频')
+  }
 }
 
 // 选择预设音频
@@ -223,11 +231,40 @@ const getAdd = () => {
 }
 
 // 所属企业
-const handleChangeTenant = (e) => {
+const index = ref(0)
+const handleChangeTenant = (e, i) => {
   storeData.form.tenantId = e
+  index.value = i
   getStore()
 }
 
+watch(() => data.form.tpresetContentInfoReq, (val) => {
+  if (val.length > 0) {
+    val.map(i => {
+      if (!businessData.options.find(j => j.id == i.tenantId)) {
+        businessData.options.push({
+          id: i.tenantId,
+          name: i.tenantName
+        })
+      }
+      storeData.form.tenantId = i.tenantId
+      getStore()
+    })
+  }
+})
+
+watch(() => storeData.options, (val) => {
+  data.business_store[index.value] = val
+  data.form.tpresetContentInfoReq.map(i => {
+    if (!val.find(j => j.id == i.storeId)) {
+      storeData.options.push({
+        id: i.storeId,
+        name: i.storeName
+      })
+    }
+  })
+})
+
 // 删除关联设备
 const getDelete = (index) => {
   data.form.tpresetContentInfoReq.splice(index, 1)

src/views/content/scene/index.vue

@@ -8,8 +8,8 @@
         </template>
       </el-input>
       <draggable class="contentList" v-model="data.tableData" item-key="id" chosenClass="chosenClass" data-id="content"
-        :group="{ name: 'componentGroup', pull: 'clone', put: false }" :sort="false" :move="onMove" @end="onEnd"
-        forceFallback v-loading="loading">
+        :group="{ name: 'componentGroup', pull: 'clone', put: false }" :sort="false" @end="onEnd" forceFallback
+        v-loading="loading">
         <template #item="{ element, index }">
           <div class="item" @click="getDialog(element.takeId)">
             <el-icon class="close" size="18" @click.stop="getDelete(element)">
@@ -101,26 +101,15 @@ function getSearch() {
   getList()
 }
 
-// 拖拽中
-function onMove(params) {
-  if (params.to.childElementCount < 1) {
-    return true
-  } else {
-    return false
-  }
-}
 // 拖拽结束
 function onEnd(params) {
-  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) })
-    }
-  }).catch(() => {
-    params.to.firstChild.remove()
-  })
+  if (params.from.className !== params.to.className) {
+    proxy.$modal.confirm(`是否要添加?`).then(() => {
+      getRouter({ audioList: JSON.stringify(params.item.__draggable_context.element), disabled: true })
+    }).catch(() => {
+      params.to.firstChild.remove()
+    })
+  }
 }
 
 // 弹窗

src/views/content/setting/detail.vue

@@ -3,7 +3,8 @@
     <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, index) in data.form.audioList" :key="item.id">
-          <el-tag v-show="item.type === 0 || item.type === 1" size="large" closable @close="handleClose(index)">
+          <el-tag v-show="item.type === 0 || item.type === 1" size="large" :closable="checkClose()"
+            @close="handleClose(index)">
             {{ item.audioName }}
           </el-tag>
           <div v-show="item.type === 2" class="audio">
@@ -11,7 +12,7 @@
             <span>{{ item.audioName }}</span>
           </div>
         </div>
-        <el-button icon="Plus" @click="getDialog">新增</el-button>
+        <el-button v-if="checkClose()" icon="Plus" @click="getDialog">新增</el-button>
       </el-form-item>
       <el-form-item label="内容名称：" prop="name">
         <el-input v-model="data.form.name" placeholder="请输入内容名称" />
@@ -33,9 +34,10 @@
             <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="handleChangeTenant">
-                  <el-option v-for="item in businessData.options" :key="item.id" :value="item.id" :label="item.name" />
+                <el-select v-model="scope.row.tenantId" placeholder="请搜索并选择企业" style="width: 200px" filterable remote
+                  :remote-method="businessRemote" remote-show-suffix @change="handleChangeTenant($event, scope.$index)">
+                  <el-option v-for="item in businessData.options" :key="item.id" :value="item.id.toString()"
+                    :label="item.name" />
                 </el-select>
               </el-form-item>
             </template>
@@ -44,9 +46,10 @@
             <template #default="scope">
               <el-form-item :prop="`tpresetContentInfoReq.${scope.$index}.storeId`"
                 :rules="{ required: true, trigger: 'change' }">
-                <el-select v-model="scope.row.storeId" placeholder="请选择门店" style="width: 200px" filterable remote
+                <el-select v-model="scope.row.storeId" placeholder="请搜索并选择门店" style="width: 200px" filterable remote
                   :remote-method="storeRemote" remote-show-suffix>
-                  <el-option v-for="item in storeData.options" :key="item.id" :value="item.id" :label="item.name" />
+                  <el-option v-for="item in data.business_store[scope.$index]" :key="item.id"
+                    :value="item.id.toString()" :label="item.name" />
                 </el-select>
               </el-form-item>
             </template>
@@ -185,6 +188,7 @@ const data = reactive({
       required: true, message: '请新增关联', trigger: 'change'
     }]
   },
+  business_store: []
 })
 
 // 传参
@@ -219,6 +223,11 @@ const getDetail = () => {
 }
 getDetail()
 
+// 检测是否是编辑
+const checkClose = () => {
+  return proxy.$route.query.disabled == undefined ? true : false
+}
+
 // 弹窗
 const dialogVisible = ref(false)
 // 打开弹窗
@@ -361,11 +370,40 @@ const getAdd = () => {
 }
 
 // 所属企业
-const handleChangeTenant = (e) => {
+const index = ref(0)
+const handleChangeTenant = (e, i) => {
   storeData.form.tenantId = e
+  index.value = i
   getStore()
 }
 
+watch(() => data.form.tpresetContentInfoReq, (val) => {
+  if (val.length > 0) {
+    val.map(i => {
+      if (!businessData.options.find(j => j.id == i.tenantId)) {
+        businessData.options.push({
+          id: i.tenantId,
+          name: i.tenantName
+        })
+      }
+      storeData.form.tenantId = i.tenantId
+      getStore()
+    })
+  }
+})
+
+watch(() => storeData.options, (val) => {
+  data.business_store[index.value] = val
+  data.form.tpresetContentInfoReq.map(i => {
+    if (!val.find(j => j.id == i.storeId)) {
+      storeData.options.push({
+        id: i.storeId,
+        name: i.storeName
+      })
+    }
+  })
+})
+
 // 取消
 const getClose = () => {
   proxy.$tab.closeOpenPage('/content/setting')

src/views/content/setting/index.vue

@@ -21,8 +21,7 @@
             <el-scrollbar v-else :height="260">
               <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">
+                :group="{ name: 'componentGroup', pull: 'clone', put: false }" :sort="false" @end="onEnd">
                 <template #item="{ element, index }">
                   <div class="item">
                     <span v-show="activeName !== 2" class="item_line" :title="element.name">
@@ -120,27 +119,15 @@ const getSearch = () => {
   getAudio()
 }
 
-// 拖拽内容
-function onMove(params) {
-  if (params.to.childElementCount < 1) {
-    return true
-  } else {
-    return false
-  }
-}
-
 // 拖拽结束
 function onEnd(params) {
-  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)})
-    }
-  }).catch(() => {
-    params.to.firstChild.remove()
-  })
+  if (params.from.className !== params.to.className) {
+    proxy.$modal.confirm(`是否要添加?`).then(() => {
+      getRouter({ audioList: JSON.stringify(params.item.__draggable_context.element) })
+    }).catch(() => {
+      params.to.firstChild.remove()
+    })
+  }
 }
 
 // 新增