适配推流列表信息

2024-07-16 17:33:18 +08:00
parent 90d298f7a7
commit d7abe7fb75
22 changed files with 1154 additions and 884 deletions
--- a/web_src/src/components/StreamPushEdit.vue
+++ b/web_src/src/components/StreamPushEdit.vue
@@ -0,0 +1,108 @@
+<template>
+  <div id="ChannelEdit" style="width: 100%">
+    <div class="page-header">
+      <div class="page-title">
+        <el-button icon="el-icon-back" size="mini" style="font-size: 20px; color: #000;" type="text" @click="close" ></el-button>
+        <el-divider direction="vertical"></el-divider>
+        编辑推流信息
+      </div>
+      <div class="page-header-btn">
+        <div style="display: inline;">
+          <el-button icon="el-icon-close" size="mini" style="font-size: 20px; color: #000;" type="text" @click="close" ></el-button>
+        </div>
+      </div>
+    </div>
+    <el-tabs tab-position="left">
+      <el-tab-pane label="推流信息编辑">
+        <el-form ref="streamPushForm" status-icon label-width="160px" class="channel-form" v-loading="locading">
+          <el-form-item label="应用名" >
+            <el-input v-model="streamPush.app" placeholder="请输入应用名"></el-input>
+          </el-form-item>
+          <el-form-item label="流ID" >
+            <el-input v-model="streamPush.stream" placeholder="请输入流ID"></el-input>
+          </el-form-item>
+          <el-form-item >
+            <el-button type="primary" @click="onSubmit">保存</el-button>
+            <el-button @click="close">取消</el-button>
+          </el-form-item>
+        </el-form>
+      </el-tab-pane>
+      <el-tab-pane label="国标通道配置" v-if="streamPush.id">
+        <CommonChannelEdit ref="commonChannelEdit" :dataForm="streamPush" :cancel="close"></CommonChannelEdit>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import CommonChannelEdit from './common/CommonChannelEdit'
+
+export default {
+  name: "channelEdit",
+  props: [ 'streamPush', 'closeEdit'],
+  components: {
+    CommonChannelEdit,
+  },
+  created() {
+    console.log(this.streamPush)
+  },
+  data() {
+    return {
+      locading: false,
+    };
+  },
+  methods: {
+    onSubmit: function () {
+      console.log(this.streamPush)
+      this.locading = true
+      if (this.streamPush.id) {
+        this.$axios({
+          method: 'post',
+          url: "/api/push/update",
+          data: this.streamPush
+        }).then((res) => {
+          if (res.data.code === 0) {
+            this.$message.success("保存成功");
+          }else {
+            this.$message.error(res.data.msg)
+          }
+        }).catch((error) => {
+          this.$message.error(error)
+        }).finally(()=>[
+          this.locading = false
+        ])
+      }else {
+        this.$axios({
+          method: 'post',
+          url: "/api/push/add",
+          data: this.streamPush
+        }).then((res) => {
+          if (res.data.code === 0) {
+            this.$message.success("保存成功");
+            this.streamPush = res.data.data
+          }else {
+            this.$message.error(res.data.msg)
+          }
+        }).catch((error) => {
+          this.$message.error(error)
+        }).finally(()=>[
+          this.locading = false
+        ])
+      }
+
+    },
+    close: function () {
+      this.closeEdit()
+    },
+  },
+};
+</script>
+<style>
+.channel-form {
+  display: grid;
+  background-color: #FFFFFF;
+  padding: 1rem 2rem 0 2rem;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 1rem;
+}
+</style>