1 |
- import{d as C,k as N,e as q,Z as G,r as J,w,x as W,u as e,U as l,V as _,f as s,a0 as a,E as I,$ as i,a3 as k,F as $,a7 as X,W as Z,a8 as j,X as H}from"./vue-18ee037d.js";import{_ as M}from"./index.vue_vue_type_script_setup_true_lang-e3083022.js";import"./dayjs-4778c158.js";import{a2 as O,aa as S,J as f,a3 as g,ay as Q,N as Y}from"./index-122302b9.js";import{u as ee}from"./usePlay-29f12ad2.js";import{i as te}from"./gb28281-53c246af.js";import{u as L}from"./audio_decoder_hard-e133cc4e.js";import{V as z}from"./jb4-60518ffa.js";import{R as se}from"./Group-ea2dcc3a.js";import{C as ae}from"./index-977bc6d2.js";import{R as oe,C as b}from"./Card-58451e7c.js";import{_ as le,a as re}from"./operate.vue_vue_type_script_setup_true_lang-01dc861c.js";import"./device-88d35103.js";import"./index-ac918f8f.js";import"./index-60ff9924.js";import"./TextArea-1376d3ad.js";import"./index-cc7f4b20.js";import"./mockjs-890b569b.js";import"./useFlexGapSupport-791d0eca.js";import"./index-8c1b53c2.js";import"./index-7e9674b9.js";import"./index-868fc3c0.js";import"./index-41409ae5.js";import"./index-7af791cb.js";const ce={class:"text-center"},ne={key:1,class:"video-player-placeholder"},ie=C({__name:"content",setup(R){const r=N(1),x=[{label:"单屏",value:1},{label:"四分屏",value:4},{label:"九分屏",value:9},{label:"十六分屏",value:16}],m=q(()=>{switch(r.value){case 1:return 24;case 4:return 12;case 9:return 8;case 16:return 6;default:return 24}}),n=()=>document.querySelector(".screen-list"),v=N(null),{toggle:h,isFullscreen:u}=O(v),p=L(),{getActiveInfo:y}=G(p),{updateItem:V,streamList:A,changeStreamList:B,closeAll:F,webrtc:P}=ee(),D=J({selectNum:1});w(r,async()=>{D.selectNum=0,p.setActiveInfo({ID:"",DeviceID:"",DeviceName:"",Name:"",LiveStatus:0});const t=new Array(r.value).fill({}).map(()=>({path:""}));B(t)},{immediate:!0}),W(()=>F()),w(()=>e(y),(t,c)=>{const{ID:o,DeviceID:d}=y.value,E=`${t.ID}/${t.DeviceID}`,K=`${c.ID}/${c.DeviceID}`;t.DeviceID&&E!==K&&te({id:o,channel:d}).finally(()=>{V(y.value,D.selectNum)})});const T=({item:t},c)=>{D.selectNum=c,y.value.DeviceID!==(t==null?void 0:t.DeviceID)&&p.setActiveInfo({ID:(t==null?void 0:t.ID)??"",DeviceID:(t==null?void 0:t.DeviceID)??"",DeviceName:(t==null?void 0:t.DeviceName)??"",Name:(t==null?void 0:t.Name)??"",LiveStatus:(t==null?void 0:t.LiveStatus)??0})},U=()=>{Q.push("/screen-custom")};return(t,c)=>(l(),_("div",ce,[s(e(se),{value:r.value,"onUpdate:value":c[0]||(c[0]=o=>r.value=o),buttonStyle:"solid",options:x,optionType:"button"},null,8,["value"]),s(e(S),{onClick:U},{default:a(()=>[I("自定义分屏")]),_:1}),s(e(S),{onClick:e(h)},{default:a(()=>[s(e(f),{icon:"ant-design:fullscreen-outlined",class:"v-text-bottom"}),I("全屏 ")]),_:1},8,["onClick"]),s(e(oe),{gutter:4,class:"screen-list mt-10px",ref_key:"screenRef",ref:v},{default:a(()=>[e(u)?(l(),i(e(S),{key:0,onClick:e(h),type:"link",class:"absolute right-2 top-2 z-10 text-white"},{default:a(()=>[s(e(f),{icon:"ant-design:fullscreen-exit-outlined",class:"v-text-bottom"}),I(" 退出全屏 ")]),_:1},8,["onClick"])):k("",!0),(l(!0),_($,null,X(e(A),(o,d)=>(l(),i(e(ae),{span:e(m),key:d,class:Z(["mt-4px flex-center",{active:r.value>1&&D.selectNum===d&&!e(u),isFullscreen:e(u)}]),onClick:()=>T(o,d)},{default:a(()=>[o.path?(l(),_($,{key:0},[e(P)?(l(),i(z,{key:0,webrtcStream:o.stream},{default:a(()=>[o.path?(l(),i(e(g),{key:0,class:"position-absolute bottom-0 left-50% cursor-pointer",title:o.path,getPopupContainer:n},{default:a(()=>[s(e(f),{icon:"octicon:ellipsis-16",size:20,color:"#dedede",hoverColor:"#a275d9"})]),_:2},1032,["title"])):k("",!0)]),_:2},1032,["webrtcStream"])):(l(),i(z,{key:1,format:"ws-flv","stream-path":o.path},{default:a(()=>[o.path?(l(),i(e(g),{key:0,class:"position-absolute bottom-0 left-50% cursor-pointer",title:o.path,getPopupContainer:n},{default:a(()=>[s(e(f),{icon:"octicon:ellipsis-16",size:20,color:"#dedede",hoverColor:"#a275d9"})]),_:2},1032,["title"])):k("",!0)]),_:2},1032,["stream-path"]))],64)):(l(),_("div",ne,[s(e(g),{title:"当前无信号,请先选择通道",class:"no-stream-tip cursor-pointer",getPopupContainer:n,placement:"top"},{default:a(()=>[s(e(f),{icon:"pepicons-pop:television-play-off",size:r.value===1?50:24},null,8,["size"])]),_:1})]))]),_:2},1032,["span","class","onClick"]))),128))]),_:1},512)]))}});const ue=Y(ie,[["__scopeId","data-v-5d72656b"]]),pe={class:"w-300px m-l-8px h-full flex-shrink-0"},de=C({name:"Screen"}),Pe=C({...de,setup(R){const r=L(),x=m=>{const{ID:n,DeviceID:v,DeviceName:h,Name:u,LiveStatus:p}=m;r.setActiveInfo({ID:n,DeviceID:v,DeviceName:h,Name:u,LiveStatus:p})};return(m,n)=>(l(),_("div",{class:"flex",style:H({height:"calc(100% - 8px)"})},[s(e(b),{class:"w-342px m-r-8px flex-shrink-0",bordered:!1,bodyStyle:{height:"100%",padding:0}},{default:a(()=>[s(M,{onSelect:x})]),_:1}),s(e(b),{class:"flex-1",bordered:!1,bodyStyle:{height:"100%",padding:"16px"}},{default:a(()=>[s(ue)]),_:1}),j("div",pe,[s(e(b),{class:"m-b-8px",bordered:!1,bodyStyle:{height:"230px",padding:0}},{default:a(()=>[s(le)]),_:1}),s(e(b),{style:{height:"calc(100% - 238px)"},bordered:!1,bodyStyle:{height:"100%",padding:0}},{default:a(()=>[s(re)]),_:1})])],4))}});export{Pe as default};
|