mirror of
https://github.com/Monibuca/plugin-record.git
synced 2025-11-02 12:44:10 +08:00
更新UI
This commit is contained in:
李宇翔
218
ui/dist/plugin-record.common.js
vendored
218
ui/dist/plugin-record.common.js
vendored
@@ -87,17 +87,6 @@ module.exports =
|
||||
/************************************************************************/
|
||||
/******/ ({
|
||||
|
||||
/***/ "034f":
|
||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("85ec");
|
||||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* unused harmony reexport * */
|
||||
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "0e05":
|
||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
@@ -109,14 +98,25 @@ module.exports =
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "85ec":
|
||||
/***/ "39a8":
|
||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_3ce37488_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("b3f8");
|
||||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_3ce37488_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_3ce37488_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* unused harmony reexport * */
|
||||
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_3ce37488_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "a189":
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
// extracted by mini-css-extract-plugin
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "a189":
|
||||
/***/ "b3f8":
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
// extracted by mini-css-extract-plugin
|
||||
@@ -190,12 +190,12 @@ if (typeof window !== 'undefined') {
|
||||
// Indicate to webpack that this file can be concatenated
|
||||
/* harmony default export */ var setPublicPath = (null);
|
||||
|
||||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5b04a8fd-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=template&id=655db994&
|
||||
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('mu-tabs',{attrs:{"value":_vm.active1,"indicator-color":"#80deea","inverse":"","center":""},on:{"update:value":function($event){_vm.active1=$event}}},[_c('mu-tab',[_vm._v("直播流")]),_c('mu-tab',[_vm._v("录制的视频")])],1),(_vm.Rooms.length==0 && _vm.active1==0)?_c('div',{staticClass:"empty"},[_c('Icon',{attrs:{"type":"md-wine","size":"50"}}),_vm._v("没有任何房间 ")],1):(_vm.active1==0)?_vm._l((_vm.Rooms),function(item){return _c('mu-card',{key:item.StreamPath,staticClass:"room"},[_c('mu-card-title',{attrs:{"title":item.StreamPath,"sub-title":item.StartTime}}),_c('mu-card-text',[_c('p',[_vm._v(" "+_vm._s(_vm.SoundFormat(item.AudioInfo.SoundFormat))+" "+_vm._s(item.AudioInfo.PacketCount)+" "+_vm._s(_vm.SoundRate(item.AudioInfo.SoundRate))+" 声道:"+_vm._s(item.AudioInfo.SoundType)+" ")]),_c('p',[_vm._v(" "+_vm._s(_vm.CodecID(item.VideoInfo.CodecID))+" "+_vm._s(item.VideoInfo.PacketCount)+" "+_vm._s(item.VideoInfo.SPSInfo.Width)+"x"+_vm._s(item.VideoInfo.SPSInfo.Height)+" ")])]),_c('mu-card-actions',[(_vm.isRecording(item))?_c('mu-button',{staticClass:"recording",attrs:{"icon":""},on:{"click":function($event){return _vm.stopRecord(item)}}},[_c('mu-icon',{attrs:{"value":"fiber_manual_record"}})],1):_c('mu-button',{attrs:{"icon":""},on:{"click":function($event){return _vm.record(item)}}},[_c('mu-icon',{attrs:{"value":"fiber_manual_record"}})],1)],1)],1)}):_vm._e(),(_vm.active1==1)?_c('Records',{ref:"recordsPanel"}):_vm._e()],2)}
|
||||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5b04a8fd-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=template&id=3ce37488&scoped=true&
|
||||
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('mu-tabs',{attrs:{"value":_vm.active1,"indicator-color":"#80deea","inverse":"","center":""},on:{"update:value":function($event){_vm.active1=$event}}},[_c('mu-tab',[_vm._v("直播流")]),_c('mu-tab',[_vm._v("录制的视频")])],1),(_vm.active1==0)?_c('mu-data-table',{attrs:{"columns":_vm.columns,"data":_vm.$store.state.Room,"min-col-width":50},on:{"row-click":function (i,r){ return _vm.isRecording(r)?_vm.stopRecord(r):_vm.record(r); }},scopedSlots:_vm._u([{key:"default",fn:function(scope){return [(_vm.isRecording(scope.row))?_c('td',{staticClass:"is-center"}):_c('td',{staticClass:"is-center"}),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(scope.row.StreamPath))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(scope.row.Type||"await"))]),_c('td',{staticClass:"is-center"},[_c('StartTime',{attrs:{"value":scope.row.StartTime}})],1),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(_vm.SoundFormat(scope.row.AudioInfo.SoundFormat)))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(_vm.SoundRate(scope.row.AudioInfo.SoundRate)))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(scope.row.AudioInfo.SoundType))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(_vm.CodecID(scope.row.VideoInfo.CodecID)))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(scope.row.VideoInfo.SPSInfo.Width)+"x"+_vm._s(scope.row.VideoInfo.SPSInfo.Height))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(scope.row.AudioInfo.PacketCount)+"/"+_vm._s(scope.row.VideoInfo.PacketCount))]),_c('td',{staticClass:"is-center"},[_vm._v(_vm._s(_vm.getSubscriberCount(scope.row)))])]}}],null,false,1124011921)}):_vm._e(),(_vm.active1==1)?_c('Records',{ref:"recordsPanel"}):_vm._e()],1)}
|
||||
var staticRenderFns = []
|
||||
|
||||
|
||||
// CONCATENATED MODULE: ./src/App.vue?vue&type=template&id=655db994&
|
||||
// CONCATENATED MODULE: ./src/App.vue?vue&type=template&id=3ce37488&scoped=true&
|
||||
|
||||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"5b04a8fd-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Records.vue?vue&type=template&id=7c800264&scoped=true&
|
||||
var Recordsvue_type_template_id_7c800264_scoped_true_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"records"},_vm._l((_vm.data),function(item){return _c('mu-card',{key:item},[_c('mu-card-title',{attrs:{"title":item.Path,"sub-title":_vm.unitFormat(item.Size)+' '+_vm.toDurationStr(item.Duration)}}),_c('mu-card-actions',[_c('mu-button',{attrs:{"icon":"","small":""},on:{"click":function($event){return _vm.play(item)}}},[_c('mu-icon',{attrs:{"value":"play_arrow"}})],1),_c('mu-button',{attrs:{"icon":"","small":""},on:{"click":function($event){return _vm.deleteFlv(item)}}},[_c('mu-icon',{attrs:{"value":"delete_forever"}})],1)],1)],1)}),1)}
|
||||
@@ -440,41 +440,7 @@ var component = normalizeComponent(
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
|
||||
let roomsES = null;
|
||||
const SoundFormat = {
|
||||
0: "Linear PCM, platform endian",
|
||||
1: "ADPCM",
|
||||
2: "MP3",
|
||||
3: "Linear PCM, little endian",
|
||||
4: "Nellymoser 16kHz mono",
|
||||
5: "Nellymoser 8kHz mono",
|
||||
6: "Nellymoser",
|
||||
7: "G.711 A-law logarithmic PCM",
|
||||
8: "G.711 mu-law logarithmic PCM",
|
||||
9: "reserved",
|
||||
10: "AAC",
|
||||
11: "Speex",
|
||||
14: "MP3 8Khz",
|
||||
15: "Device-specific sound"
|
||||
};
|
||||
const CodecID = {
|
||||
1: "JPEG (currently unused)",
|
||||
2: "Sorenson H.263",
|
||||
3: "Screen video",
|
||||
4: "On2 VP6",
|
||||
5: "On2 VP6 with alpha channel",
|
||||
6: "Screen video version 2",
|
||||
7: "AVC",
|
||||
12: "H265"
|
||||
};
|
||||
|
||||
/* harmony default export */ var Appvue_type_script_lang_js_ = ({
|
||||
components: {
|
||||
@@ -482,55 +448,81 @@ const CodecID = {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Rooms: [],
|
||||
typeMap: {
|
||||
Receiver: "📡",
|
||||
FlvFile: "🎥",
|
||||
TS: "🎬",
|
||||
HLS: "🍎",
|
||||
"": "⏳",
|
||||
Match365: "🏆",
|
||||
RTMP: "🚠"
|
||||
}
|
||||
columns: [
|
||||
{
|
||||
title: "房间",
|
||||
name: "StreamPath",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
title: "类型",
|
||||
name: "Type",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
name: "StartTime",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
title: "音频格式",
|
||||
name: "AudioInfo"
|
||||
},
|
||||
{
|
||||
title: "采样率",
|
||||
name: "AudioInfo"
|
||||
},
|
||||
{
|
||||
title: "声道",
|
||||
name: "AudioInfo"
|
||||
},
|
||||
{
|
||||
title: "视频格式",
|
||||
name: "VideoInfo"
|
||||
},
|
||||
{
|
||||
title: "分辨率",
|
||||
name: "VideoInfo"
|
||||
},
|
||||
{
|
||||
title: "数据包",
|
||||
name: ""
|
||||
},
|
||||
{
|
||||
title: "订阅者",
|
||||
name: "Subscribes"
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
SoundFormat(soundFormat) {
|
||||
return SoundFormat[soundFormat];
|
||||
},
|
||||
CodecID(codec) {
|
||||
return CodecID[codec];
|
||||
},
|
||||
SoundRate(rate) {
|
||||
return rate > 1000 ? rate / 1000 + "kHz" : rate + "Hz";
|
||||
},
|
||||
record(item) {
|
||||
this.$Modal.confirm({
|
||||
title: "提示",
|
||||
content:
|
||||
"<p>是否使用追加模式</p><small>选择取消将覆盖已有文件</small>",
|
||||
onOk: () => {
|
||||
window.ajax.get(
|
||||
"/record/flv?append=true",
|
||||
{ streamPath: item.StreamPath },
|
||||
x => {
|
||||
if (x == "success") {
|
||||
this.$Message.success("开始录制(追加模式)");
|
||||
} else {
|
||||
this.$Message.error(x);
|
||||
let append = false;
|
||||
this.$confirm(
|
||||
h =>
|
||||
h("mu-switch", {
|
||||
props: {
|
||||
label: "追加模式"
|
||||
},
|
||||
on: {
|
||||
change(value) {
|
||||
append = value;
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
onCancel: () => {
|
||||
window.ajax.get(
|
||||
"/record/flv",
|
||||
}),
|
||||
"是否开始录制"
|
||||
).then(result => {
|
||||
if (result) {
|
||||
this.ajax.get(
|
||||
"/record/flv?append=" + append,
|
||||
{ streamPath: item.StreamPath },
|
||||
x => {
|
||||
if (x == "success") {
|
||||
this.$Message.success("开始录制");
|
||||
this.$toast.success(
|
||||
"开始录制" + (append ? "(追加模式)" : "")
|
||||
);
|
||||
} else {
|
||||
this.$Message.error(x);
|
||||
this.$toast.error(x);
|
||||
}
|
||||
}
|
||||
);
|
||||
@@ -538,51 +530,33 @@ const CodecID = {
|
||||
});
|
||||
},
|
||||
stopRecord(item) {
|
||||
window.ajax.get(
|
||||
"/record/flv/stop",
|
||||
{ streamPath: item.StreamPath },
|
||||
x => {
|
||||
if (x == "success") {
|
||||
this.$Message.success("停止录制");
|
||||
} else {
|
||||
this.$Message.error(x);
|
||||
this.$confirm("是否停止录制", "提示").then(result => {
|
||||
this.ajax.get(
|
||||
"/record/flv/stop",
|
||||
{ streamPath: item.StreamPath },
|
||||
x => {
|
||||
if (x == "success") {
|
||||
this.$toast.success("停止录制");
|
||||
} else {
|
||||
this.$toast.error(x);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
);
|
||||
});
|
||||
},
|
||||
isRecording(item) {
|
||||
return (
|
||||
item.SubscriberInfo &&
|
||||
item.SubscriberInfo.find(x => x.Type == "FlvRecord")
|
||||
);
|
||||
},
|
||||
fetchRooms() {
|
||||
roomsES = new EventSource("/api/summary");
|
||||
roomsES.onmessage = evt => {
|
||||
if (!evt.data) return;
|
||||
let summary = JSON.parse(evt.data);
|
||||
this.Rooms = (summary && summary.Rooms) || [];
|
||||
this.Rooms.sort((a, b) =>
|
||||
a.StreamPath > b.StreamPath ? 1 : -1
|
||||
);
|
||||
};
|
||||
},
|
||||
onClickTab(name) {
|
||||
this.$refs.recordsPanel.onVisible(name == "recordsPanel");
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchRooms();
|
||||
},
|
||||
destroyed() {
|
||||
roomsES.close();
|
||||
}
|
||||
});
|
||||
|
||||
// CONCATENATED MODULE: ./src/App.vue?vue&type=script&lang=js&
|
||||
/* harmony default export */ var src_Appvue_type_script_lang_js_ = (Appvue_type_script_lang_js_);
|
||||
// EXTERNAL MODULE: ./src/App.vue?vue&type=style&index=0&lang=css&
|
||||
var Appvue_type_style_index_0_lang_css_ = __webpack_require__("034f");
|
||||
// EXTERNAL MODULE: ./src/App.vue?vue&type=style&index=0&id=3ce37488&scoped=true&lang=css&
|
||||
var Appvue_type_style_index_0_id_3ce37488_scoped_true_lang_css_ = __webpack_require__("39a8");
|
||||
|
||||
// CONCATENATED MODULE: ./src/App.vue
|
||||
|
||||
@@ -599,7 +573,7 @@ var App_component = normalizeComponent(
|
||||
staticRenderFns,
|
||||
false,
|
||||
null,
|
||||
null,
|
||||
"3ce37488",
|
||||
null
|
||||
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user