大喇叭

2022-06-10 11:34:03 +08:00
parent 5705c75e14
commit deecff9904
7 changed files with 320 additions and 106 deletions
--- a/src/apps/AppBroadcast1/AppEquipment/AppEquipment.vue
+++ b/src/apps/AppBroadcast1/AppEquipment/AppEquipment.vue
@@ -13,24 +13,14 @@
      </div>
    </AiTopFixed>
    <div class="record">
-      <div class="item" @click="toDetail">
+      <div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
        <img src="../img/lb@2x.png" alt="" class="voice-img">
        <div class="info">
          <div class="text">
-            <p>村头大喇叭</p>
-            <span>刘家河居委会</span>
+            <p>{{item.deviceName}}</p>
+            <span>{{item.orgName}}</span>
          </div>
-          <div class="status">在线</div>
-        </div>
-      </div>
-      <div class="item">
-        <img src="../img/lb@2x.png" alt="" class="voice-img">
-        <div class="info">
-          <div class="text">
-            <p>村头大喇叭</p>
-            <span>刘家河居委会</span>
-          </div>
-          <div class="status">在线</div>
+          <div class="status">{{item.devStatus}}</div>
        </div>
      </div>
    </div>
@@ -42,24 +32,46 @@ export default {
  name: "AppEquipment",
  data() {
    return {
+      current: 1,
      areaId: '',
      areaName: '',
-      keyword: ''
+      keyword: '',
+      list: []
    }
  },
  computed: { ...mapState(['user']) },
-  onLoad(option) {
+  onLoad() {
    this.areaId = this.user.areaId
    this.areaName = this.user.areaName
+    this.getList()
  },
  methods: {
    areaSelect(e) {
      this.areaId = e
-      // this.getList()
+      this.getListInit()
+    },
+    getListInit() {
+      this.list = []
+      this.current = 1
+      this.getList()
+    },
+    getList() {
+      this.$http.post(`/app/appdlbquipment/getDlbDeviceList?current=1&size=20&keyword=${this.keyword}`).then((res) => {
+        if (res.code == 0) {
+          if (this.current > 1) {
+            this.list = [...this.list, ...res.data.records]
+          } else {
+            this.list = res.data.records
+          }
+        }
+      })
    },
    toDetail(item) {
      uni.navigateTo({url: `./detail`})
    }
+  },
+  onReachBottom() {
+
  }
 }
 </script>
--- a/src/apps/AppBroadcast1/AppEquipment/detail.vue
+++ b/src/apps/AppBroadcast1/AppEquipment/detail.vue
@@ -7,26 +7,26 @@
    </AiTopFixed>
    <div class="content">
      <div class="info-content" v-if="currIndex != 1">
-        <p>村头大喇叭</p>
+        <p>{{info.deviceName}}</p>
        <div class="info">
          <span>设备编号</span>
-          <span class="color-333">121312312312</span>
+          <span class="color-333">{{info.serialNo}}</span>
        </div>
        <div class="info">
          <span>设备状态</span>
-          <span style="color: #4E8EEE">在线</span>
+          <span style="color: #4E8EEE">{{info.devStatus}}</span>
        </div>
        <div class="info">
          <span>信号强度</span>
-          <span class="color-333">一般</span>
+          <span class="color-333">{{info.network}}</span>
        </div>
        <div class="info">
          <span>音量</span>
-          <span class="color-333"></span>
+          <span class="color-333">{{info.volume}}</span>
        </div>
        <div class="info">
          <span>所属区划</span>
-          <span class="color-333"></span>
+          <span class="color-333">{{info.areaName}}</span>
        </div>
      </div>
      <div class="list-content" v-else>
@@ -47,9 +47,26 @@
      </div>
    </div>
    
-    <div class="btn">设置音量</div>
-    <u-popup v-model="isShow" mode="bottom">
-      
+    <div class="btn" @click="setVolume">设置音量</div>
+    <u-popup v-model="isShow" mode="bottom" class="popup">
+      <div class="title">
+        <span @click="isShow=false">取消</span>
+        <p>设置音量</p>
+        <span @click="confirmAdd">保存</span>
+      </div>
+      <div class="slider-content">
+        <span>1</span>
+        <div class="slider">
+          <u-slider v-model="volume" min="1" max="100" :use-slot="true" block-color="#007BFF" step="10">
+            <view class="">
+              <view class="badge-button">
+                {{volume}}
+              </view>
+            </view>
+          </u-slider>
+        </div>
+        <span>100</span>
+      </div>
    </u-popup>
  </div>
 </template>
@@ -65,6 +82,8 @@ export default {
      currIndex: 1,
      current: 1,
      isShow: false,
+      volume: 10,
+      info: {}
    }
  },
  onLoad(query) {
@@ -78,10 +97,21 @@ export default {
  methods: {
    change(index) {
      this.currIndex = index
-      this.getListInit()
    },
    toTaskDetail(item) {
      uni.navigateTo({url: `./taskDetail`})
+    },
+    setVolume() {
+      this.isShow = true
+      this.volume = this.info.volume * 10 || 10
+    },
+    confirmAdd() {
+      this.$http.post(`/app/appdlbquipment/volumeControl?deviceId=${this.info.deviceId}&volume=${this.volume}`).then((res) => {
+        if (res.code == 0) {
+          this.getDetail()
+          this.$u.toast('音量设置成功')
+        }
+      })
    }
  },

@@ -208,5 +238,54 @@ export default {
    font-weight: 500;
    color: #FFFFFF;
  }
+  .popup{
+    background-color: #fff;
+    .title{
+      padding: 24px 0;
+      line-height: 48px;
+      text-align: center;
+      span{
+        display: inline-block;
+        width: 120px;
+        font-size: 28px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #5297FF;
+        
+      }
+      p{
+        display: inline-block;
+        width: calc(100% - 240px);
+        font-size: 36px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #0F1826;
+      }
+    }
+    .slider-content{
+      padding: 56px 44px 120px;
+      display: flex;
+      span{
+        display: inline-block;
+        font-size: 40px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #666;
+        line-height: 56px;
+      }
+      .slider{
+        display: inline-block;
+        flex: 1;
+        margin: 26px 30px 0;
+      }
+    }
+  }
+
+  ::v-deep .u-slider__button-wrap{
+    margin-top: -40px;
+    font-size: 44px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #666;
+  }
 }
 </style>
--- a/src/apps/AppBroadcast1/AppResourcesManage/AppResourcesManage.vue
+++ b/src/apps/AppBroadcast1/AppResourcesManage/AppResourcesManage.vue
@@ -16,14 +16,19 @@
        <img :src="`${$cdn}video/play-icon.png`" alt="" @click="choose(item)">
        <div class="info">
          <p>{{ item.name ? item.name.split('.')[0] : '-' }}</p>
+          <div>{{ item.createUserName }}{{ item.createTime }}</div>
        </div>
+        <div class="btn">发布</div>
      </div>
    </div>
    <div class="record-text" v-else>
      <div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
+        <div class="info">
          <div>{{ item.name }}</div>
          <p>{{ item.content }}</p>
        </div>
+        <div class="btn">发布</div>
+      </div>
    </div>
    <AiEmpty v-if="!list.length"></AiEmpty>
    <img src="./img/add-icon.png" alt="" class="add-img" @click="add">
@@ -57,8 +62,7 @@ export default {
      typeList: [{label: '全部', value: '0'}, {label: '我创建的', value: '1'},]
    }
  },
-  onLoad(query) {
-    this.isChoose = !!query.isChoose
+  onLoad() {
    this.getList()
    uni.$on('getList', () => {
      this.isMore = false
@@ -92,21 +96,8 @@ export default {
    },

    choose(item) {
-      if (!this.isChoose) {
-        console.log(item.url)
      this.url = item.url
      this.isShow = true
-
-        return false
-      }
-
-      uni.$emit('choose', {
-        mediaId: item.id,
-        mediaName: item.name
-      })
-      uni.navigateBack({
-        delta: 1
-      })
    },

    handerClear() {
@@ -207,7 +198,7 @@ export default {
      }

      .info {
-        width: calc(100% - 70px);
+        width: calc(100% - 256px);
        line-height: 44px;
        font-size: 34px;
        font-family: PingFang-SC-Medium, PingFang-SC;
@@ -220,6 +211,30 @@ export default {
          white-space: nowrap;
          word-break: break-all;
        }
+
+        div{
+          font-size: 26px;
+          font-family: PingFang-SC-Medium, PingFang-SC;
+          font-weight: 500;
+          color: #999;
+          line-height: 36px;
+        } 
+      }
+      .btn{
+        width: 154px;
+        height: 60px;
+        line-height: 60px;
+        text-align: center;
+        background: #3975C6;
+        border-radius: 8px;
+        font-size: 30px;
+        font-family: PingFang-SC-Medium, PingFang-SC;
+        font-weight: 500;
+        color: #FFF;
+        margin-left: 32px;
+      }
+      .bg-AFD0FC{
+        background-color: #AFD0FC;
      }
    }
  }
@@ -233,7 +248,10 @@ export default {
      padding: 32px 30px;
      box-sizing: border-box;
      font-size: 30px;
-
+      display: flex;
+      justify-content: space-between;
+      .info{
+        width: calc(100% - 190px);
        div {
          font-size: 30px;
          font-family: PingFangSC-Medium, PingFang SC;
@@ -271,6 +289,23 @@ export default {
          -webkit-box-orient: vertical;
        }
      }
+       .btn{
+        width: 154px;
+        height: 60px;
+        line-height: 60px;
+        text-align: center;
+        background: #3975C6;
+        border-radius: 8px;
+        font-size: 30px;
+        font-family: PingFang-SC-Medium, PingFang-SC;
+        font-weight: 500;
+        color: #FFF;
+      }
+      .bg-AFD0FC{
+        background-color: #AFD0FC;
+      }
+     
+    }
  }

  .add-img {
--- a/src/apps/AppBroadcast1/AppResourcesManage/detail.vue
+++ b/src/apps/AppBroadcast1/AppResourcesManage/detail.vue
@@ -3,21 +3,59 @@
    <div class="header">
      <img :src="`${$cdn}video/play-icon.png`" alt="">
      <div class="right">
-        <h2>五一活动唱红歌.mp3</h2>
-        <p>2022-06-09 09:43:45</p>
+        <h2>{{info.name}}.mp3</h2>
+        <p>{{info.createTime}}</p>
      </div>
    </div>
-    <div class="content"></div>
+    <div class="content" v-if="info.content">{{info.content}}</div>
    <div class="footer-bottom"></div>
    <div class="footer">
-      <div>删除素材</div>
-      <div class="confirm">发布广播</div>
+      <div @click="del">删除素材</div>
+      <div class="confirm" @click="toAddBroadcast()">发布广播</div>
    </div>
  </div>
 </template>
 <script>
 export default {
-  name: "detail"
+  name: "detail",
+  data() {
+    return {
+      info: {},
+      id: ''
+    }
+  },
+  onLoad(option) {
+    this.id = option.id
+    this.getDetail()
+  },
+
+  onShow() {
+    document.title = '媒资管理'
+  },
+
+  methods: {
+    getDetail() {
+      this.$http.post(`/app/appdlbresource/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code == 0) {
+          this.info = res.data
+        }
+      })
+    },
+    del() {
+      this.$confirm(`是否删除该条素材？`).then(() => {
+        this.$http.post(`/app/appdlbresource/delete?id=${this.id}`).then((res) => {
+          if (res.code == 0) {
+            this.$u.toast('删除成功')
+            uni.$emit('getList')
+            uni.navigateBack()
+          }
+        })
+      })
+    },
+    toAddBroadcast() {
+      uni.navigateTo({ url: `../addPlay?mediaId=${this.info.id}&mediaName=${this.info.name}` })
+    }
+  },
 }
 </script>
 <style lang="scss" scoped>
--- a/src/apps/AppBroadcast1/addPlay.vue
+++ b/src/apps/AppBroadcast1/addPlay.vue
@@ -12,7 +12,8 @@
        <div class="label">播放设备</div>
        <div class="value" @click="toSelectEquipment">
           <!-- @click="selectClick('showEquipment', equipmentList)" -->
-          <span :class="formData.serialName == '请选择' ? 'color-999' : ''">{{ formData.serialName }}</span>
+           <span v-if="equipmentList.length">已选择<span style="color:#4E8EEE;">{{equipmentList.length}}</span>台设备</span>
+           <span v-else style="color:#999;">请选择</span>
          <img src="./img/right-icon.png" alt="">
        </div>
      </div>
@@ -166,14 +167,23 @@ export default {
        minute: false,
        second: false
      },
+      equipmentList: []
    }
  },
-  onLoad() {
+  onLoad(option) {
    uni.$on('chooseMedia', e => {
      console.log(e)
      this.formData.mediaId = e.mediaId
      this.formData.mediaName = e.mediaName
    })
+    uni.$on('chooseEquipment', e => {
+      console.log(e)
+      this.equipmentList = e.equipmentList
+    })
+    if(option.mediaId) {
+      this.formData.mediaName = option.mediaName
+      this.formData.mediaId = option.mediaId
+    }
  },
  onShow() {
    document.title = '音频播放'
--- a/src/apps/AppBroadcast1/selectEquipment.vue
+++ b/src/apps/AppBroadcast1/selectEquipment.vue
@@ -13,31 +13,21 @@
      </div>
    </AiTopFixed>
    <div class="record">
-      <div class="item">
-        <img src="./img/cir.png" alt="" class="check-img">
+      <div class="item" v-for="(item, index) in list" :key="index" @click="checkClick(index)">
+        <img src="./img/select-blue.png" alt="" class="check-img" v-if="item.isCheck">
+        <img src="./img/cir.png" alt="" class="check-img" v-else>
        <img src="./img/lb@2x.png" alt="" class="voice-img">
        <div class="info">
          <div class="text">
-            <p>村头大喇叭</p>
-            <span>刘家河居委会</span>
-          </div>
-          <div class="status">在线</div>
-        </div>
-      </div>
-      <div class="item">
-        <img src="./img/cir.png" alt="" class="check-img">
-        <img src="./img/lb@2x.png" alt="" class="voice-img">
-        <div class="info">
-          <div class="text">
-            <p>村头大喇叭</p>
-            <span>刘家河居委会</span>
+            <p>{{item.deviceName}}</p>
+            <span>{{item.orgName}}</span>
          </div>
          <div class="status">在线</div>
        </div>
      </div>
    </div>
    <div class="btn">
-      <div>确定选择</div>
+      <div @click="confirm">确定选择</div>
    </div>
  </div>
 </template>
@@ -49,19 +39,64 @@ export default {
    return {
      areaId: '',
      areaName: '',
-      keyword: ''
+      keyword: '',
+      list: [],
+      selectList: []
    }
  },
  computed: { ...mapState(['user']) },
  onLoad(option) {
    this.areaId = this.user.areaId
    this.areaName = this.user.areaName
+    this.getList()
  },
  methods: {
    areaSelect(e) {
      this.areaId = e
      // this.getList()
    },
+    getList() {
+      this.$http.post(`/app/appdlbquipment/getDlbDeviceList?current=1&size=20&keyword=${this.keyword}`).then((res) => {
+        if (res.code == 0) {
+          res.data.records.map(item => {
+            item.isCheck = false
+          })
+          if (this.current > 1) {
+            this.list = [...this.list, ...res.data.records]
+          } else {
+            this.list = res.data.records
+          }
+        }
+      })
+    },
+    checkClick(index) {
+      this.list[index].isCheck = !this.list[index].isCheck
+    },
+    confirm() {
+      this.selectList = []
+      this.list.map(item => {
+        if(item.isCheck) {
+          var info = {
+            serialNo: item.deviceName,
+            serialName: item.serialNo
+          }
+          this.selectList.push(info)
+        }
+      })
+      if(!this.selectList.length) {
+        return this.$u.toast('请选择播放设备')
+      }
+      uni.$emit('chooseEquipment', {
+        equipmentList: this.selectList
+      })
+      uni.navigateBack({
+        delta: 1
+      })
+
+    }
+  },
+  onReachBottom() {
+
  }
 }
 </script>
--- a/src/apps/AppBroadcast1/selectMedia.vue
+++ b/src/apps/AppBroadcast1/selectMedia.vue
@@ -124,7 +124,7 @@ export default {
          ...this.search,
          type: this.currIndex === 0 ? 1 : 3,
          current: this.current,
-          size: 10
+          size: 10,
        }
      }).then(res => {
        if (res.code == 0) {
@@ -194,7 +194,11 @@ export default {
 <style lang="scss" scoped>
 .selectMedia {
  padding-bottom: 128px;
-
+  ::v-deep .AiTopFixed{
+    .content{
+      padding: 0;
+    }
+  }
  .tab {
    border-bottom: 1px solid #ddd;
    margin-bottom: 4px;
@@ -313,6 +317,7 @@ export default {
  .currentLeft-top {
    display: flex;
    align-items: center;
+    padding: 32px 32px 0;

    .left {
      width: 200px;