jiang
2022-08-04 d09d8f11f06ee6eeeb4c7f9bd6d35e6fbd49e05f
web_src/src/components/dialog/StreamProxyEdit.vue
@@ -36,8 +36,23 @@
              <el-form-item label="拉流地址" prop="src_url" v-if="proxyParam.type=='ffmpeg'">
                <el-input v-model="proxyParam.src_url" clearable></el-input>
              </el-form-item>
              <el-form-item label="超时时间:秒" prop="timeout_ms" v-if="proxyParam.type=='ffmpeg'">
              <el-form-item label="超时时间:毫秒" prop="timeout_ms" v-if="proxyParam.type=='ffmpeg'">
                <el-input v-model="proxyParam.timeout_ms" clearable></el-input>
              </el-form-item>
              <el-form-item label="节点选择" prop="rtp_type">
                <el-select
                  v-model="proxyParam.mediaServerId"
                  @change="mediaServerIdChange"
                  style="width: 100%"
                  placeholder="请选择拉流节点"
                >
                  <el-option
                    v-for="item in mediaServerList"
                    :key="item.id"
                    :label="item.id"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="FFmpeg命令模板" prop="ffmpeg_cmd_key" v-if="proxyParam.type=='ffmpeg'">
<!--                <el-input v-model="proxyParam.ffmpeg_cmd_key" clearable></el-input>-->
@@ -68,6 +83,7 @@
                  <el-option label="组播" value="2"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="国标平台">
                <el-select
                  v-model="proxyParam.platformGbId"
@@ -89,6 +105,7 @@
                  <el-checkbox label="启用" v-model="proxyParam.enable" ></el-checkbox>
                  <el-checkbox label="转HLS" v-model="proxyParam.enable_hls" ></el-checkbox>
                  <el-checkbox label="MP4录制" v-model="proxyParam.enable_mp4" ></el-checkbox>
                  <el-checkbox label="无人观看自动删除" v-model="proxyParam.enable_remove_none_reader" ></el-checkbox>
                </div>
              </el-form-item>
@@ -106,6 +123,8 @@
</template>
<script>
import MediaServer from './../service/MediaServer'
export default {
  name: "streamProxyEdit",
  props: {},
@@ -134,33 +153,14 @@
      isLoging: false,
      dialogLoading: false,
      onSubmit_text: "立即创建",
      platformList: [{
          id: 1,
          enable: true,
          name: "141",
          serverGBId: "34020000002000000001",
          serverGBDomain: "3402000000",
          serverIP: "192.168.1.141",
          serverPort: 15060,
          deviceGBId: "34020000002000000001",
          deviceIp: "192.168.1.20",
          devicePort: "5060",
          username: "34020000002000000001",
          password: "12345678",
          expires: "300",
          keepTimeout: "60",
          transport: "UDP",
          characterSet: "GB2312",
          ptz: false,
          rtcp: false,
          status: true,
      }],
      platformList: [],
      mediaServer: new MediaServer(),
      proxyParam: {
          name: null,
          type: "default",
          app: null,
          stream: null,
          url: "rtmp://58.200.131.2/livetv/cctv5hd",
          url: "",
          src_url: null,
          timeout_ms: null,
          ffmpeg_cmd_key: null,
@@ -169,8 +169,11 @@
          enable: true,
          enable_hls: true,
          enable_mp4: false,
          enable_remove_none_reader: false,
          platformGbId: null,
          mediaServerId: null,
      },
      mediaServerList:{},
      ffmpegCmdList:{},
      rules: {
@@ -193,26 +196,39 @@
      }
      let that = this;
      this.$axios({
        method: 'get',
        url:`/api/platform/query/10000/0`
        url:`/api/platform/query/10000/1`
      }).then(function (res) {
        that.platformList = res.data.list;
      }).catch(function (error) {
        console.log(error);
      });
      this.$axios({
        method: 'get',
        url:`/api/proxy/ffmpeg_cmd/list`
      }).then(function (res) {
        that.ffmpegCmdList = res.data.data;
      }).catch(function (error) {
        console.log(error);
      });
      this.mediaServer.getOnlineMediaServerList((data)=>{
        this.mediaServerList = data.data;
        this.proxyParam.mediaServerId = this.mediaServerList[0].id
        this.mediaServerIdChange()
      })
    },
    mediaServerIdChange:function (){
      let that = this;
      if (that.proxyParam.mediaServerId !== "auto"){
        that.$axios({
          method: 'get',
          url:`/api/proxy/ffmpeg_cmd/list`,
          params: {
            mediaServerId: that.proxyParam.mediaServerId
          }
        }).then(function (res) {
          that.ffmpegCmdList = res.data.data;
          that.proxyParam.ffmpeg_cmd_key = Object.keys(res.data.data)[0];
        }).catch(function (error) {
          console.log(error);
        });
      }
    },
    onSubmit: function () {
      console.log("onSubmit");
      this.dialogLoading = true;
      var that = this;
      that.$axios({
@@ -239,7 +255,6 @@
      });
    },
    close: function () {
      console.log("关闭添加视频平台");
      this.showDialog = false;
      this.dialogLoading = false;
      this.$refs.streamProxy.resetFields();