DESKTOP-SVI9JE1\muzen vor 1 Jahr
Ursprung
Commit
0e1204c73f
7 geänderte Dateien mit 296 neuen und 3 gelöschten Zeilen
  1. 28 0
      src/api/channel.js
  2. 4 0
      src/common/main.scss
  3. 15 0
      src/pages.json
  4. 208 0
      src/pages/channel/index.vue
  5. 1 1
      src/pages/help/detail.vue
  6. 19 0
      src/pages/ximalaya/index.vue
  7. 21 2
      vue.config.js

+ 28 - 0
src/api/channel.js

@@ -0,0 +1,28 @@
+import request from "../utils/request";
+
+// 列表
+export function list(data) {
+  return request({
+    url: `/Ohplay/Device/CustomBroadcast/pageList`,
+    method: "post",
+    data,
+  });
+}
+
+// 新增
+export function submit(data){
+  return request({
+    url: `/Ohplay/Device/CustomBroadcast/batchAdd`,
+    method: 'post',
+    data
+  })
+}
+
+// 删除
+export function remove(data) {
+  return request({
+    url: `/Ohplay/Device/CustomBroadcast/delete`,
+    method: 'post',
+    data
+  })
+}

+ 4 - 0
src/common/main.scss

@@ -61,4 +61,8 @@ textarea{
 
 textarea{
   padding: 30rpx;
+}
+
+uni-modal{
+  color: #000;
 }

+ 15 - 0
src/pages.json

@@ -153,6 +153,21 @@
 				"navigationBarTitleText": "附近门店",
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			// 添加电台
+			"path": "pages/channel/index",
+			"style": {
+				"navigationStyle": "custom",
+				"onReachBottomDistance": 50
+			}
+		},
+		{
+			// 喜马拉雅授权
+			"path": "pages/ximalaya/index",
+			"style": {
+				"navigationStyle": "custom"
+			}
 		}
 	]
 }

+ 208 - 0
src/pages/channel/index.vue

@@ -0,0 +1,208 @@
+<template>
+  <div class='app-container'>
+    <h1>猫王音响-添加电台</h1>
+    <h1>请输入要添加的网络电台信息</h1>
+    <div class="form" v-for="(item, index) in form" :key="index">
+      <div>电台{{ index + 1 }}</div>
+      <uni-icons v-show="index !== 0" class="close" type="closeempty" color="#FFF" size="18" @click="getClose(index)" />
+      <input type="text" v-model="item.name" placeholder="请输入电台名称">
+      <input type="text" v-model="item.url" placeholder="请输入链接地址">
+    </div>
+    <button v-show="form.length < 3" class="plus" @click="getAdd">+ 新增</button>
+    <button class="submit" type="submit" circle @click="getSubmit">提交</button>
+    <div class="list">
+      <h2>已添加的电台</h2>
+      <div class="item" v-for="item in list" :key="item.id">
+        <div>{{ item.name }}</div>
+        <div>{{ item.url }}</div>
+        <uni-icons class="delete" type="more-filled" size="24" @click="getDelete(item)" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { list, submit, remove } from "@/api/channel"
+export default {
+  data() {
+    return {
+      // 设备信息
+      dev: {},
+      // 列表表单
+      listForm: {
+        pageNum: 1,
+        pageSize: 10
+      },
+      // 列表
+      list: [],
+      // 更多
+      hasMore: false,
+      // 表单
+      form: [{
+        name: "",
+        url: ""
+      }]
+    }
+  },
+  onLoad(e) {
+    this.dev = e
+    this.getList()
+  },
+  methods: {
+    // 列表
+    getList() {
+      list({ ...this.dev, ...this.listForm }).then(res => {
+        if (res.data.code === 0) {
+          res.data.data.records.map(i => this.list.push(i))
+          this.hasMore = res.data.data.hasMore
+        }
+      })
+    },
+
+    // 添加
+    getAdd() {
+      this.form.push({
+        name: "",
+        url: ""
+      })
+    },
+
+    // 关闭
+    getClose(index) {
+      this.form.splice(index, 1)
+    },
+
+    // 提交
+    getSubmit() {
+      var rules = false
+      this.form.map(i => {
+        if (i.name !== "" && i.url !== "") {
+          i.deviceMac = this.dev.deviceMac
+          i.deviceType = this.dev.deviceType
+          i.sign = this.dev.sign
+          rules = true
+        }
+      })
+      if (rules) {
+        submit(this.form).then(res => {
+          if (res.data.code === 0) {
+            this.list = []
+            this.getList()
+            this.form = [{
+              name: "",
+              url: ""
+            }]
+          }
+        })
+      } else {
+        uni.showToast({
+          title: '电台信息不能为空!',
+          icon: 'none'
+        })
+      }
+    },
+
+    // 删除
+    getDelete(item) {
+      uni.showModal({
+        title: '提示',
+        content: `是否删除名称为${item.name}的电台?`,
+        confirmColor: '#78B06A',
+        success: (e) => {
+          if (e.confirm) {
+            remove({
+              id: item.id,
+              ...this.dev
+            }).then(res => {
+              if (res.data.code === 0) {
+                this.list = []
+                this.getList(this.dev)
+              }
+            })
+          }
+        }
+      })
+    }
+  },
+  onReachBottom() {
+    if(this.hasMore) {
+      this.listForm.pageNum++
+      this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.plus {
+  width: 160rpx;
+  height: 70rpx;
+  line-height: 70rpx;
+  font-size: 28rpx;
+  margin: 0;
+  font-weight: bold;
+  background: none;
+  color: #FFF;
+  border: 1px solid #FFF;
+}
+
+h1 {
+  font-size: 16px;
+  line-height: 50px;
+  text-align: center;
+}
+
+h2 {
+  font-size: 16px;
+  line-height: 50px;
+}
+
+.list {
+  .item {
+    border: 1px solid #FFF;
+    border-radius: 8px;
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+    position: relative;
+    margin-bottom: 15px;
+    background-color: #FFF;
+    color: #000;
+
+    .delete {
+      position: absolute;
+      right: 20px;
+      transform: rotate(90deg);
+    }
+  }
+}
+
+.form {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  margin: 8px 0;
+  border: 1px solid #FFF;
+  padding: 20px;
+  border-radius: 8px;
+  position: relative;
+
+  uni-input {
+    background-color: #FFF;
+    color: #000;
+  }
+
+  .close {
+    position: absolute;
+    right: 10px;
+    top: 10px;
+  }
+}
+
+.submit {
+  height: 80rpx;
+  line-height: 80rpx;
+  margin-top: 10px;
+}
+</style>

+ 1 - 1
src/pages/help/detail.vue

@@ -58,7 +58,7 @@ export default {
   },
   onReachBottom() {
     if (this.hasMore) {
-      this.form.pageNum += 1
+      this.form.pageNum++
       this.getDetail()
     }
   }

+ 19 - 0
src/pages/ximalaya/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class='app-container'></div>
+</template>
+
+<script>
+export default {
+  data() {
+    return  {
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  }
+}
+</script>

+ 21 - 2
vue.config.js

@@ -1,3 +1,22 @@
+const port = process.env.port || process.env.npm_config_port || 80 // 端口
+
 module.exports = {
-  transpileDependencies: ['@zebra-ui']
-}
+  transpileDependencies: ['@zebra-ui'],
+  // webpack-dev-server 相关配置
+  devServer: {
+    host: '0.0.0.0',
+    port: port,
+    open: true,
+    proxy: {
+      // detail: https://cli.vuejs.org/config/#devserver-proxy
+      [process.env.VUE_APP_BASE_API]: {
+        target: `https://o3tapi.radio1964.com/web`,
+        changeOrigin: true,
+        pathRewrite: {
+          ['^' + process.env.VUE_APP_BASE_API]: ''
+        }
+      }
+    },
+    disableHostCheck: true
+  }
+}