设备-内容/素材-上传限制/发布-数量问题

src/api/device/deviceList.js

@@ -36,3 +36,12 @@ export function ReqRemoveDevice(parameter) {
     data: parameter
   })
 }
+
+// 根据设备id获取该设备发布内容
+export function FetchFindReleaseDetailsByDeviceId(parameter) {
+  return request({
+    url: 'api/device/findReleaseDetailsByDeviceId',
+    method: 'get',
+    params: parameter
+  })
+}

src/views/components/upload.vue

@@ -100,7 +100,8 @@ export default {
       loading_txt: '暂停',
       colors: '#1e9f4c',
       uploadListData: [],
-      filePercentTxt: '上传中'
+      filePercentTxt: '上传中',
+      isActiveType: null
     }
   },
   mounted() {
@@ -111,6 +112,17 @@ export default {
       // 获取文件
       this.file = e.target.files[0]
       console.log(this.file)
+      console.log(this.isActiveType)
+      if (this.isActiveType == 0) {
+        this.$message.error('请上传图片文件！')
+        return
+      } else if (this.isActiveType == 1) {
+        this.$message.error('请上传视频文件！')
+        return
+      } else if (this.isActiveType == 2) {
+        this.$message.error('请上传音频文件！')
+        return
+      }
       this.formatType = this.file.type.substring(0, this.file.type.indexOf('/'))
       console.log('formatType', this.formatType)
       this.fileNames = this.file.name

src/views/device/index.vue

@@ -91,38 +91,26 @@
     <div class="publish_layer">
       <el-dialog title="发布内容" :close-on-click-modal="false" :visible.sync="contentVisible" width="970px" height="590px">
         <div class="content_warp">
-          <h4>图片</h4>
-          <ul class="item_list">
-            <li class="item_cont">
-              <img src="@/assets/images/background.jpg" alt />
+          <div v-for="(items,index) in contentDevice" :key="index" class="release_list">
+            <h4>发布名称 {{ items.relaase_name }} </h4>
+            <p style="margin-bottom: 10px"> 发布时间 {{ items.release_start.split("00:00:00")[0] }} </p>
+            <div class="device_cont_list">
+              <!-- <div v-if="items.bgm_main != null && items.bgm_name != null" class="material_item item_cont">
+                <div class="radio_img"></div>
+                <div class="file_name">{{ items.bgm_name }}</div>
+              </div> -->
+              <div v-for="(item, i) in items.show_materials" :key="'list-'+i" class="material_item item_cont">
+                <img v-if="item.img_path || item.material_type == 1" :src="item.img_path" alt />
+                <div v-if="!item.img_path && item.material_type == 2" class="radio_img"></div>
                 <div class="item_format">
-                <span class="item_type">JPG</span>
+                  <span class="item_type">{{ item.deposit_url | getFileFormat }}</span>
+                  <span v-if="item.material_type !== '0'" class="item_time">{{ item.duration | getSeconds }}</span>
+                </div>
+                <div class="file_name">{{ item.material_name }}</div>
+                <div v-if="item.bgm_name && item.material_type == 0" class="bgm_name">背景音乐:{{ item.bgm_name }}</div>
               </div>
-              <div class="file_name">人工智能</div>
-            </li>
-          </ul>
-          <h4>视频</h4>
-          <ul class="item_list">
-            <li class="item_cont">
-              <img src="@/assets/images/background.jpg" alt />
-              <div class="item_format">
-                <span class="item_type">Video</span>
-                <span class="item_time">03:00</span>
             </div>
-              <div class="file_name">防控疫情小贴士</div>
-            </li>
-          </ul>
-          <h4>音频</h4>
-          <ul class="item_list">
-            <li class="item_cont">
-              <div class="radio_img"></div>
-              <div class="item_format">
-                <span class="item_type">Video</span>
-                <span class="item_time">03:00</span>
           </div>
-              <div class="file_name">防控疫情小贴士</div>
-            </li>
-          </ul>
         </div>
       </el-dialog>
     </div>
@@ -142,13 +130,19 @@
 </template>
 
 <script>
-import { ReqDeviceEdit, ReqDeviceList, ReqQueryDevice, ReqRemoveDevice } from '@/api/device/deviceList.js'
-import { parseTime } from '@/utils/index.js'
+import { ReqDeviceEdit, ReqDeviceList, ReqQueryDevice, ReqRemoveDevice, FetchFindReleaseDetailsByDeviceId } from '@/api/device/deviceList.js'
+import { parseTime, getSeconds, getFileFormat } from '@/utils/index.js'
 export default {
   name: 'Device',
   filters: {
     parseTime(time, cFormat) {
       return parseTime(time, cFormat)
+    },
+    getSeconds(s) {
+      return getSeconds(s)
+    },
+    getFileFormat(s) {
+      return getFileFormat(s)
     }
   },
   data() {
@@ -166,6 +160,7 @@ export default {
       // 编辑的对话框
       addFromVisible: false,
       contentVisible: false,
+      contentDevice: [],
       recordVisible: false,
       // 设备列表的数据
       deviceList: [],
@@ -257,8 +252,17 @@ export default {
     },
     // 查看
     handleClick(row) {
-      // console.log(row)
+      console.log(row)
       this.contentVisible = true
+      const params = {
+        device_id: row.device_id
+      }
+      FetchFindReleaseDetailsByDeviceId(params).then(res => {
+        if (res.code === 200) {
+          console.log(res)
+          this.contentDevice = res.data
+        }
+      })
     },
     // 修改设备信息并提交
     submitForm(formName) {
@@ -330,4 +334,28 @@ export default {
     color: #333;
   }
 }
+.release_list{
+  margin-bottom: 40px;
+}
+.device_cont_list{
+  display: flex;
+  flex-wrap: wrap;
+  .item_cont{
+    overflow: inherit;
+  }
+  .bgm_name{
+    font-size: 12px;
+    padding: 10px 0;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -moz-user-select: none; /*火狐*/
+    -webkit-user-select: none; /*webkit浏览器*/
+    -ms-user-select: none; /*IE10*/
+    -khtml-user-select: none; /*早期浏览器*/
+    user-select: none;
+  }
+}
 </style>

src/views/immediateRelease/index.vue

@@ -65,8 +65,8 @@
         <el-col class="step_1">第二步：选择内容</el-col>
         <el-col class="step_form">
           <div class="step_select">
-            <div>已选内容： 0</div>
-            <div>内容总时长：0.00s</div>
+            <div>已选内容： {{ selectTotal }}</div>
+            <div>内容总时长：{{ selectTotalTime }}s</div>
             <div>添加BGM：<el-button class="step_select_audio" type="primary" round @click="selectAudioCont(0,-1)">选择文件</el-button>
             </div>
           </div>
@@ -207,7 +207,7 @@
           </div>
         </div>
         <div slot="footer" class="dialog-footer">
-          <el-button type="primary" round @click="listEditVisible = false">保 存</el-button>
+          <el-button type="primary" round @click="saveEdit">保 存</el-button>
           <el-button round @click="listEditVisible = false">取 消</el-button>
         </div>
       </el-dialog>
@@ -394,7 +394,10 @@ export default {
       activeItemIndex: 0,
       release_id: null, // 发布编辑
       releaseInfo: null,
-      isEditMaterial: []
+      isEditMaterial: [],
+      selectTotal: 0,
+      selectTotalTime: 0.00,
+      selectEditD: []
     }
   },
   computed: {
@@ -408,6 +411,7 @@ export default {
   created() {
     this.selectedMaterial = []
     this.selectedMaterial = JSON.parse(localStorage.getItem('selectedMaterial'))
+    this.getSelectTotal()
   },
   mounted() {
     if (this.$route.path === '/release') {
@@ -423,6 +427,26 @@ export default {
     }
   },
   methods: {
+    getSelectTotal() {
+      if (this.selectedMaterial) {
+        const result = []
+        this.selectedMaterial.some(item => {
+          if (item.material_type == 0) {
+            if (item.showAudioName && item.showAudioUrl) {
+              result.push(item)
+            }
+          }
+        })
+        this.selectTotal = this.selectedMaterial.length + result.length
+        console.log(this.selectedMaterial)
+        console.log(this.selectedMaterial.length)
+        console.log(result.length)
+      }
+    },
+    saveEdit() {
+      this.listEditVisible = false
+      this.getSelectTotal()
+    },
     // 编辑带来 release_id
     editRelease() {
       const release_id = JSON.parse(localStorage.getItem('releaseId'))
@@ -468,6 +492,7 @@ export default {
           FetchFindMaterialById(params).then(res => {
             if (res.code == 200) {
               this.selectedMaterial = res.data
+
               // 判断拿ranking来排序
               this.selectedMaterial.filter((item, index) => {
                 this.isEditMaterial.some(items => {
@@ -483,10 +508,11 @@ export default {
                   item.showTime = this.isEditMaterial[index].duration
                   item.showAnimation = this.isEditMaterial[index].effect
                   item.showAnimationName = this.animationData[item.showAnimation].name
-                  item.showAudioUrl = this.isEditMaterial[index].bgm_path
+                  item.showAudioUrl = this.isEditMaterial[index].bgm_url
                   item.showAudioName = this.isEditMaterial[index].bgm_name
                 }
               })
+              this.getSelectTotal()
             }
           })
           // 设备list
@@ -793,6 +819,7 @@ export default {
             this.selectedMaterial = []
             this.selectedMaterial.push(this.audioListData[index])
           }
+          this.getSelectTotal()
           // localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
         } else {
           this.selectedEditData[this.thisEditIndex].showAudioName = this.audioListData[index].material_name
@@ -891,6 +918,7 @@ export default {
         })
       }
       // localStorage.setItem('selectedMaterial', JSON.stringify(this.selectedMaterial))
+      this.getSelectTotal()
       this.mulitText = '多选'
     },
     // 素材选择 - 取消按钮

src/views/materialContent/materialList/index.vue

@@ -182,6 +182,25 @@ export default {
     },
     activeIndex(newName, oldName) {
       this.tabIndex = newName
+      this.$nextTick(() => {
+        switch (this.tabIndex) {
+          case '0':
+            this.$refs.uploadMaterial.isActiveType = null
+            break
+          case '1':
+            this.formatType = 1
+            this.$refs.uploadMaterial.isActiveType = 0
+            break
+          case '2':
+            this.formatType = 2
+            this.$refs.uploadMaterial.isActiveType = 1
+            break
+          case '3':
+            this.formatType = 2
+            this.$refs.uploadMaterial.isActiveType = 2
+            break
+        }
+      })
     },
     '$route.query.folderTag'(Val) {
       console.log(Val)