@das-fed/ui 1.1.4 → 6.3.0-beta.0

package/packages/business-components/video-dialog/index.js

@@ -0,0 +1,1041 @@
+import { defineComponent, useCssVars, ref as ref$1, computed, nextTick as nextTick$1, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, Fragment, renderList, createBlock, withCtx, withModifiers, createVNode, createElementVNode, watch as watch$1, toDisplayString, pushScopeId, popScopeId, toRefs, onMounted as onMounted$1 } from 'vue';
+import { withInstall } from '@das-fed/utils';
+import { DasTooltip, DasIcon, DasLivePlayer, DasSpin, DasDialog } from '@das-fed/ui';
+import { getCurrentScope, onScopeDispose, unref, getCurrentInstance, onMounted, nextTick, ref, watch } from 'vue-demi';
+import { createService } from '@das-fed/utils/api-services/src/create-service';
+import { getProjectInfo, getToken } from '@das-fed/utils/common-info';
+
+var _a;
+const isClient = typeof window !== "undefined";
+const isString = (val) => typeof val === "string";
+const noop = () => {
+};
+isClient && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
+
+function resolveUnref(r) {
+  return typeof r === "function" ? r() : unref(r);
+}
+function identity(arg) {
+  return arg;
+}
+
+function tryOnScopeDispose(fn) {
+  if (getCurrentScope()) {
+    onScopeDispose(fn);
+    return true;
+  }
+  return false;
+}
+
+function tryOnMounted(fn, sync = true) {
+  if (getCurrentInstance())
+    onMounted(fn);
+  else if (sync)
+    fn();
+  else
+    nextTick(fn);
+}
+
+function unrefElement(elRef) {
+  var _a;
+  const plain = resolveUnref(elRef);
+  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
+}
+
+const defaultWindow = isClient ? window : void 0;
+const defaultDocument = isClient ? window.document : void 0;
+
+function useEventListener(...args) {
+  let target;
+  let events;
+  let listeners;
+  let options;
+  if (isString(args[0]) || Array.isArray(args[0])) {
+    [events, listeners, options] = args;
+    target = defaultWindow;
+  } else {
+    [target, events, listeners, options] = args;
+  }
+  if (!target)
+    return noop;
+  if (!Array.isArray(events))
+    events = [events];
+  if (!Array.isArray(listeners))
+    listeners = [listeners];
+  const cleanups = [];
+  const cleanup = () => {
+    cleanups.forEach((fn) => fn());
+    cleanups.length = 0;
+  };
+  const register = (el, event, listener, options2) => {
+    el.addEventListener(event, listener, options2);
+    return () => el.removeEventListener(event, listener, options2);
+  };
+  const stopWatch = watch(() => [unrefElement(target), resolveUnref(options)], ([el, options2]) => {
+    cleanup();
+    if (!el)
+      return;
+    cleanups.push(...events.flatMap((event) => {
+      return listeners.map((listener) => register(el, event, listener, options2));
+    }));
+  }, { immediate: true, flush: "post" });
+  const stop = () => {
+    stopWatch();
+    cleanup();
+  };
+  tryOnScopeDispose(stop);
+  return stop;
+}
+
+function useSupported(callback, sync = false) {
+  const isSupported = ref();
+  const update = () => isSupported.value = Boolean(callback());
+  update();
+  tryOnMounted(update, sync);
+  return isSupported;
+}
+
+const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
+const globalKey = "__vueuse_ssr_handlers__";
+_global[globalKey] = _global[globalKey] || {};
+
+const functionsMap = [
+  [
+    "requestFullscreen",
+    "exitFullscreen",
+    "fullscreenElement",
+    "fullscreenEnabled",
+    "fullscreenchange",
+    "fullscreenerror"
+  ],
+  [
+    "webkitRequestFullscreen",
+    "webkitExitFullscreen",
+    "webkitFullscreenElement",
+    "webkitFullscreenEnabled",
+    "webkitfullscreenchange",
+    "webkitfullscreenerror"
+  ],
+  [
+    "webkitRequestFullScreen",
+    "webkitCancelFullScreen",
+    "webkitCurrentFullScreenElement",
+    "webkitCancelFullScreen",
+    "webkitfullscreenchange",
+    "webkitfullscreenerror"
+  ],
+  [
+    "mozRequestFullScreen",
+    "mozCancelFullScreen",
+    "mozFullScreenElement",
+    "mozFullScreenEnabled",
+    "mozfullscreenchange",
+    "mozfullscreenerror"
+  ],
+  [
+    "msRequestFullscreen",
+    "msExitFullscreen",
+    "msFullscreenElement",
+    "msFullscreenEnabled",
+    "MSFullscreenChange",
+    "MSFullscreenError"
+  ]
+];
+function useFullscreen(target, options = {}) {
+  const { document = defaultDocument, autoExit = false } = options;
+  const targetRef = target || (document == null ? void 0 : document.querySelector("html"));
+  const isFullscreen = ref(false);
+  let map = functionsMap[0];
+  const isSupported = useSupported(() => {
+    if (!document) {
+      return false;
+    } else {
+      for (const m of functionsMap) {
+        if (m[1] in document) {
+          map = m;
+          return true;
+        }
+      }
+    }
+    return false;
+  });
+  const [REQUEST, EXIT, ELEMENT, , EVENT] = map;
+  async function exit() {
+    if (!isSupported.value)
+      return;
+    if (document == null ? void 0 : document[ELEMENT])
+      await document[EXIT]();
+    isFullscreen.value = false;
+  }
+  async function enter() {
+    if (!isSupported.value)
+      return;
+    await exit();
+    const target2 = unrefElement(targetRef);
+    if (target2) {
+      await target2[REQUEST]();
+      isFullscreen.value = true;
+    }
+  }
+  async function toggle() {
+    if (isFullscreen.value)
+      await exit();
+    else
+      await enter();
+  }
+  if (document) {
+    useEventListener(document, EVENT, () => {
+      isFullscreen.value = !!(document == null ? void 0 : document[ELEMENT]);
+    }, false);
+  }
+  if (autoExit)
+    tryOnScopeDispose(exit);
+  return {
+    isSupported,
+    isFullscreen,
+    enter,
+    exit,
+    toggle
+  };
+}
+
+var SwipeDirection;
+(function(SwipeDirection2) {
+  SwipeDirection2["UP"] = "UP";
+  SwipeDirection2["RIGHT"] = "RIGHT";
+  SwipeDirection2["DOWN"] = "DOWN";
+  SwipeDirection2["LEFT"] = "LEFT";
+  SwipeDirection2["NONE"] = "NONE";
+})(SwipeDirection || (SwipeDirection = {}));
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+const _TransitionPresets = {
+  easeInSine: [0.12, 0, 0.39, 0],
+  easeOutSine: [0.61, 1, 0.88, 1],
+  easeInOutSine: [0.37, 0, 0.63, 1],
+  easeInQuad: [0.11, 0, 0.5, 0],
+  easeOutQuad: [0.5, 1, 0.89, 1],
+  easeInOutQuad: [0.45, 0, 0.55, 1],
+  easeInCubic: [0.32, 0, 0.67, 0],
+  easeOutCubic: [0.33, 1, 0.68, 1],
+  easeInOutCubic: [0.65, 0, 0.35, 1],
+  easeInQuart: [0.5, 0, 0.75, 0],
+  easeOutQuart: [0.25, 1, 0.5, 1],
+  easeInOutQuart: [0.76, 0, 0.24, 1],
+  easeInQuint: [0.64, 0, 0.78, 0],
+  easeOutQuint: [0.22, 1, 0.36, 1],
+  easeInOutQuint: [0.83, 0, 0.17, 1],
+  easeInExpo: [0.7, 0, 0.84, 0],
+  easeOutExpo: [0.16, 1, 0.3, 1],
+  easeInOutExpo: [0.87, 0, 0.13, 1],
+  easeInCirc: [0.55, 0, 1, 0.45],
+  easeOutCirc: [0, 0.55, 0.45, 1],
+  easeInOutCirc: [0.85, 0, 0.15, 1],
+  easeInBack: [0.36, 0, 0.66, -0.56],
+  easeOutBack: [0.34, 1.56, 0.64, 1],
+  easeInOutBack: [0.68, -0.6, 0.32, 1.6]
+};
+__spreadValues({
+  linear: identity
+}, _TransitionPresets);
+
+var _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "GridItem",
+  props: {
+    active: { type: Boolean, required: true },
+    gridNum: { type: Number, required: true }
+  },
+  emits: ["itemClick"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    useCssVars((_ctx) => ({
+      "083b179d-size": size.value
+    }));
+    const props = __props;
+    const emits = __emit;
+    const containerRef = ref$1();
+    const { toggle, isFullscreen } = useFullscreen(containerRef);
+    const handleDBclick = () => {
+      if (containerRef.value != document.fullscreenElement) {
+        if (isFullscreen.value) {
+          isFullscreen.value = false;
+          nextTick$1(() => {
+            toggle();
+          });
+        } else {
+          toggle();
+        }
+      }
+    };
+    const handleItemClick = () => {
+      emits("itemClick");
+    };
+    const size = computed(() => `calc(100% / ${Math.sqrt(props.gridNum)})`);
+    const __returned__ = { props, emits, containerRef, toggle, isFullscreen, handleDBclick, handleItemClick, size };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock(
+    "div",
+    {
+      ref: "containerRef",
+      class: normalizeClass(["wrapper", { "is-active": $setup.props.active }]),
+      onDblclick: _cache[0] || (_cache[0] = ($event) => $setup.handleDBclick()),
+      onClick: _cache[1] || (_cache[1] = ($event) => $setup.handleItemClick())
+    },
+    [
+      renderSlot(_ctx.$slots, "default", {}, void 0, true)
+    ],
+    34
+    /* CLASS, NEED_HYDRATION */
+  );
+}
+var GridItem = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$4], ["__scopeId", "data-v-083b179d"], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/business-components/video-dialog/src/component/GridLayout/GridItem.vue"]]);
+
+var _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  __name: "GridLayout",
+  props: {
+    gridNum: { type: Number, required: true },
+    activeIndex: { type: Number, required: true, default: 0 },
+    showFn: { type: Function, required: true }
+  },
+  emits: ["update:activeIndex"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emits = __emit;
+    const handleItemClick = (index) => {
+      emits("update:activeIndex", index);
+    };
+    const __returned__ = { props, emits, handleItemClick, GridItem };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _hoisted_1$2 = { class: "layout-wrapper" };
+function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$2, [
+    createCommentVNode(' :active="index === activeIndex" '),
+    (openBlock(true), createElementBlock(
+      Fragment,
+      null,
+      renderList($setup.props.gridNum, (item, index) => {
+        return openBlock(), createBlock($setup["GridItem"], {
+          active: false,
+          "grid-num": $setup.props.gridNum,
+          onItemClick: ($event) => $setup.handleItemClick(index)
+        }, {
+          default: withCtx(() => [
+            $props.showFn(index) ? renderSlot(_ctx.$slots, "default", {
+              key: 0,
+              index
+            }, void 0, true) : createCommentVNode("v-if", true)
+          ]),
+          _: 2
+          /* DYNAMIC */
+        }, 1032, ["grid-num", "onItemClick"]);
+      }),
+      256
+      /* UNKEYED_FRAGMENT */
+    ))
+  ]);
+}
+var GridLayout = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3], ["__scopeId", "data-v-52a0876d"], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/business-components/video-dialog/src/component/GridLayout/GridLayout.vue"]]);
+
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+var dayjs_min = {exports: {}};
+
+(function (module, exports) {
+	!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O})); 
+} (dayjs_min));
+
+var dayjs_minExports = dayjs_min.exports;
+var dayjs = /*@__PURE__*/getDefaultExportFromCjs(dayjs_minExports);
+
+var _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "DirectionControl",
+  emits: ["change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const emits = __emit;
+    const directionControl = (direction) => {
+      emits("change", direction);
+    };
+    const __returned__ = { emits, directionControl, get DasTooltip() {
+      return DasTooltip;
+    } };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock(
+    "div",
+    {
+      class: "direction-control",
+      onDblclick: _cache[9] || (_cache[9] = withModifiers((event) => event.stopPropagation(), ["stop"]))
+    },
+    [
+      createVNode($setup["DasTooltip"], { content: "\u5DE6\u4E0A" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-top-left",
+            onClick: _cache[0] || (_cache[0] = withModifiers(($event) => $setup.directionControl("leftUp"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u4E0A" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-top",
+            onClick: _cache[1] || (_cache[1] = withModifiers(($event) => $setup.directionControl("up"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u53F3\u4E0A" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-top-right",
+            onClick: _cache[2] || (_cache[2] = withModifiers(($event) => $setup.directionControl("rightUp"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u5DE6" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-left",
+            onClick: _cache[3] || (_cache[3] = withModifiers(($event) => $setup.directionControl("left"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u81EA\u52A8" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-auto",
+            onClick: _cache[4] || (_cache[4] = withModifiers(($event) => $setup.directionControl("auto"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u53F3" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-right",
+            onClick: _cache[5] || (_cache[5] = withModifiers(($event) => $setup.directionControl("right"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u5DE6\u4E0B" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-bottom-left",
+            onClick: _cache[6] || (_cache[6] = withModifiers(($event) => $setup.directionControl("leftDown"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u4E0B" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-bottom",
+            onClick: _cache[7] || (_cache[7] = withModifiers(($event) => $setup.directionControl("down"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      }),
+      createVNode($setup["DasTooltip"], { content: "\u53F3\u4E0B" }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: "icon icon-bottom-right",
+            onClick: _cache[8] || (_cache[8] = withModifiers(($event) => $setup.directionControl("rightDown"), ["stop"]))
+          })
+        ]),
+        _: 1
+        /* STABLE */
+      })
+    ],
+    32
+    /* NEED_HYDRATION */
+  );
+}
+var DirectionControl = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2], ["__scopeId", "data-v-4e297881"], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/business-components/video-dialog/src/component/Player/DirectionControl.vue"]]);
+
+var _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: {
+    videoUrl: { type: String, required: false },
+    title: { type: String, required: true },
+    type: { type: String, required: true },
+    loading: { type: Boolean, required: true },
+    playbackRate: { type: Number, required: false, default: 1 },
+    paused: { type: Boolean, required: false, default: false },
+    authType: { type: Array, required: false, default: () => [] },
+    onReplay: { type: Function, required: false }
+  },
+  emits: ["close", "directionControl", "zoomControl"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emits = __emit;
+    const muted = ref$1(true);
+    const player = ref$1();
+    const directionControlVisible = ref$1(false);
+    const dasLivePlayerRef = ref$1();
+    const video = computed(() => dasLivePlayerRef.value?.video);
+    const ended = ref$1(false);
+    const showPlayer = ref$1(true);
+    const handleClose = () => {
+      emits("close");
+    };
+    const handlePlayerLoaded = (_player) => {
+      player.value = _player;
+      player.value.on(window.mpegts.Events.ERROR, (data) => {
+        console.log("player error", data);
+      });
+    };
+    const toggleMuted = () => {
+      muted.value = !muted.value;
+      if (player.value) {
+        player.value.muted = muted.value;
+      }
+    };
+    const toggleDirectionControl = () => {
+      directionControlVisible.value = !directionControlVisible.value;
+    };
+    const imgSrc = ref$1("");
+    const handleScreenshot = () => {
+      const canvas = document.createElement("canvas");
+      if (video.value) {
+        canvas.width = video.value.clientWidth;
+        canvas.height = video.value.clientHeight;
+        const context = canvas.getContext("2d");
+        context?.drawImage(video.value, 0, 0, canvas.width, canvas.height);
+        const oGrayImg = canvas.toDataURL("image/jpg");
+        const str = `\u3010${props.title}\u3011${dayjs().format("YYYYMMDDHHmmss").toString()}.jpg`;
+        imgSrc.value = oGrayImg;
+        if ("download" in document.createElement("a")) {
+          const elem = document.createElement("a");
+          elem.download = str;
+          elem.style.display = "none";
+          elem.href = oGrayImg;
+          document.body.appendChild(elem);
+          document.body.appendChild(canvas);
+          elem.click();
+          URL.revokeObjectURL(elem.href);
+          document.body.removeChild(elem);
+          document.body.removeChild(canvas);
+        }
+      }
+    };
+    const directionControl = (direction) => {
+      emits("directionControl", direction);
+    };
+    const zoomControl = (zoom) => {
+      emits("zoomControl", zoom);
+    };
+    const hasAuth = (type) => {
+      return props.authType.includes(type);
+    };
+    watch$1(
+      () => video.value,
+      () => {
+        if (video.value) {
+          video.value.addEventListener("ended", () => {
+            ended.value = true;
+            if (props.type === "playback") {
+              showPlayer.value = false;
+            }
+          });
+        }
+      }
+    );
+    watch$1(
+      () => video.value,
+      () => {
+        if (video.value) {
+          nextTick$1(() => {
+            video.value.playbackRate = props.playbackRate || 1;
+          });
+        }
+      }
+    );
+    watch$1(
+      () => player.value,
+      () => {
+        if (player.value) {
+          nextTick$1(() => {
+            player.value.muted = muted.value;
+          });
+        }
+      }
+    );
+    watch$1(
+      () => props.playbackRate,
+      () => {
+        if (video.value) {
+          video.value.playbackRate = props.playbackRate || 1;
+        }
+      },
+      {
+        immediate: true
+      }
+    );
+    watch$1(
+      () => props.paused,
+      () => {
+        if (player.value) {
+          if (props.paused) {
+            player.value.pause();
+          } else {
+            player.value.play();
+          }
+        }
+      }
+    );
+    watch$1(
+      () => props.videoUrl,
+      () => {
+        showPlayer.value = false;
+        nextTick$1(() => {
+          showPlayer.value = true;
+        });
+      }
+    );
+    const __returned__ = { props, emits, muted, player, directionControlVisible, dasLivePlayerRef, video, ended, showPlayer, handleClose, handlePlayerLoaded, toggleMuted, toggleDirectionControl, imgSrc, handleScreenshot, directionControl, zoomControl, hasAuth, get DasIcon() {
+      return DasIcon;
+    }, get DasLivePlayer() {
+      return DasLivePlayer;
+    }, get DasSpin() {
+      return DasSpin;
+    }, get DasTooltip() {
+      return DasTooltip;
+    }, DirectionControl };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _withScopeId = (n) => (pushScopeId("data-v-d319f5c0"), n = n(), popScopeId(), n);
+const _hoisted_1$1 = { class: "video-wrapper" };
+const _hoisted_2 = { class: "video-top" };
+const _hoisted_3 = { class: "video-top_l" };
+const _hoisted_4 = { class: "video-title-wrapper" };
+const _hoisted_5 = { class: "video-title" };
+const _hoisted_6 = { class: "video-top_r" };
+const _hoisted_7 = {
+  key: 0,
+  class: "play-status"
+};
+const _hoisted_8 = { class: "video-bottom" };
+const _hoisted_9 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
+  "div",
+  { class: "video-bottom_l" },
+  null,
+  -1
+  /* HOISTED */
+));
+const _hoisted_10 = { class: "video-bottom_r" };
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$1, [
+    createVNode($setup["DasSpin"], {
+      spinning: $setup.props.loading,
+      type: "component",
+      tip: "\u52A0\u8F7D\u4E2D..."
+    }, {
+      default: withCtx(() => [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("div", _hoisted_4, [
+              createElementVNode(
+                "div",
+                _hoisted_5,
+                toDisplayString($setup.props.title.length > 20 ? $setup.props.title.slice(0, 19) + "..." : $setup.props.title),
+                1
+                /* TEXT */
+              )
+            ])
+          ]),
+          createElementVNode("div", _hoisted_6, [
+            ["live"].includes($props.type) ? (openBlock(), createElementBlock("span", _hoisted_7, "\u6B63\u5728\u5B9E\u65F6\u9884\u89C8")) : createCommentVNode("v-if", true),
+            createCommentVNode(' <das-icon class="icon close-icon" icon="close" @click.stop="handleClose"></das-icon> ')
+          ])
+        ]),
+        $setup.props.videoUrl && $setup.showPlayer ? (openBlock(), createBlock($setup["DasLivePlayer"], {
+          key: 0,
+          type: "flv",
+          ref: "dasLivePlayerRef",
+          muted: $setup.muted,
+          onLoaded: $setup.handlePlayerLoaded,
+          src: $setup.props.videoUrl
+        }, null, 8, ["muted", "src"])) : createCommentVNode("v-if", true),
+        createElementVNode("div", _hoisted_8, [
+          _hoisted_9,
+          createElementVNode("div", _hoisted_10, [
+            createElementVNode(
+              "div",
+              {
+                class: "controls",
+                onDblclick: _cache[2] || (_cache[2] = withModifiers((event) => event.stopPropagation(), ["stop"]))
+              },
+              [
+                createVNode($setup["DasTooltip"], { content: "\u58F0\u97F3" }, {
+                  default: withCtx(() => [
+                    createVNode($setup["DasIcon"], {
+                      class: "icon icon-volume",
+                      icon: $setup.muted ? "muted" : "volume",
+                      onClick: withModifiers($setup.toggleMuted, ["stop"])
+                    }, null, 8, ["icon"])
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }),
+                createVNode($setup["DasTooltip"], { content: "\u622A\u56FE" }, {
+                  default: withCtx(() => [
+                    createVNode($setup["DasIcon"], {
+                      class: "icon icon-screenshot",
+                      icon: "screenshot",
+                      onClick: withModifiers($setup.handleScreenshot, ["stop"])
+                    })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }),
+                $setup.hasAuth("control") ? (openBlock(), createBlock($setup["DasTooltip"], {
+                  key: 0,
+                  content: "\u805A\u7126-"
+                }, {
+                  default: withCtx(() => [
+                    ["live", "polling"].includes($setup.props.type) ? (openBlock(), createBlock($setup["DasIcon"], {
+                      key: 0,
+                      class: "icon icon-shrink",
+                      icon: "shrink",
+                      onClick: _cache[0] || (_cache[0] = withModifiers(($event) => $setup.zoomControl("zoomOut"), ["stop"]))
+                    })) : createCommentVNode("v-if", true)
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })) : createCommentVNode("v-if", true),
+                $setup.hasAuth("control") ? (openBlock(), createBlock($setup["DasTooltip"], {
+                  key: 1,
+                  content: "\u805A\u7126+"
+                }, {
+                  default: withCtx(() => [
+                    ["live", "polling"].includes($setup.props.type) ? (openBlock(), createBlock($setup["DasIcon"], {
+                      key: 0,
+                      class: "icon icon-enlarge",
+                      icon: "enlarge",
+                      onClick: _cache[1] || (_cache[1] = withModifiers(($event) => $setup.zoomControl("zoomIn"), ["stop"]))
+                    })) : createCommentVNode("v-if", true)
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })) : createCommentVNode("v-if", true),
+                $setup.hasAuth("control") ? (openBlock(), createBlock($setup["DasTooltip"], {
+                  key: 2,
+                  content: "\u65B9\u5411\u63A7\u5236"
+                }, {
+                  default: withCtx(() => [
+                    ["live", "polling"].includes($setup.props.type) ? (openBlock(), createBlock($setup["DasIcon"], {
+                      key: 0,
+                      class: "icon icon-direction-control",
+                      icon: "direction-control",
+                      onClick: withModifiers($setup.toggleDirectionControl, ["stop"])
+                    })) : createCommentVNode("v-if", true)
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })) : createCommentVNode("v-if", true)
+              ],
+              32
+              /* NEED_HYDRATION */
+            )
+          ])
+        ]),
+        $setup.directionControlVisible ? (openBlock(), createBlock($setup["DirectionControl"], {
+          key: 1,
+          onChange: $setup.directionControl
+        })) : createCommentVNode("v-if", true)
+      ]),
+      _: 1
+      /* STABLE */
+    }, 8, ["spinning"])
+  ]);
+}
+var Player = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__scopeId", "data-v-d319f5c0"], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/business-components/video-dialog/src/component/Player/index.vue"]]);
+
+const bemsBase = `/api/intelligent-security/video/v1`;
+const version = "v1";
+const permissiontService = createService(`/api/enterpriseright/permission/${version}`);
+const service = createService(`${bemsBase}`, mergeCommonParams);
+function mergeCommonParams(config) {
+  const projectId = getProjectInfo() ? getProjectInfo().id : 1;
+  if (!config.params) config.params = {};
+  config.params.project = projectId;
+  config.params.projectId = projectId;
+  return config;
+}
+function paramsToQuery(params) {
+  const searchParams = new URLSearchParams("");
+  for (let [key, val] of Object.entries(params)) {
+    searchParams.append(key, val);
+  }
+  return searchParams.toString();
+}
+function operateDevice(params) {
+  return service.post(`/device/ptz?${paramsToQuery(params)}`)().run();
+}
+function getRealTimeUrl(params) {
+  return service.post(`/device/video/url/preview?${paramsToQuery(params)}`)().run();
+}
+permissiontService.post("data/device-auth");
+
+const withToken = (url) => {
+  const token = getToken();
+  return `${url}?token=${token}`;
+};
+ref$1([]);
+
+var PlayerProvider = /* @__PURE__ */ defineComponent({
+  props: {
+    deviceInfo: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(props, {
+    slots
+  }) {
+    const {
+      deviceInfo
+    } = toRefs(props);
+    const loading = ref$1(false);
+    const videoUrl = ref$1("");
+    const fetchData = async () => {
+      if (!deviceInfo.value?.deviceId) return;
+      loading.value = true;
+      const [error, data] = await getRealTimeUrl({
+        productId: deviceInfo.value.productId,
+        deviceId: deviceInfo.value.deviceId
+      });
+      if (!error) {
+        videoUrl.value = withToken(data.playStreamURL);
+      }
+      loading.value = false;
+    };
+    const onDirectionControl = (direction) => {
+      operateDevice({
+        productId: deviceInfo.value.productId,
+        deviceId: deviceInfo.value.deviceId,
+        direction,
+        zoom: ""
+      });
+    };
+    const onZoomControl = (zoom) => {
+      operateDevice({
+        productId: deviceInfo.value.productId,
+        deviceId: deviceInfo.value.deviceId,
+        direction: "",
+        zoom
+      });
+    };
+    onMounted$1(() => {
+      fetchData();
+    });
+    watch$1(() => deviceInfo.value, () => {
+      fetchData();
+    }, {
+      deep: true
+    });
+    return () => createVNode(Fragment, null, [slots.default({
+      videoUrl: videoUrl.value,
+      loading: loading.value,
+      onDirectionControl,
+      onZoomControl
+    })]);
+  }
+});
+
+function useVideo(props) {
+  const activeIndex = ref$1(0);
+  const gridLayoutRef = ref$1();
+  const {
+    toggle: toggleFullscreen,
+    isFullscreen
+  } = useFullscreen(gridLayoutRef);
+  const render = () => createVNode(GridLayout, {
+    "ref": gridLayoutRef,
+    "gridNum": props.gridNum,
+    "activeIndex": activeIndex.value,
+    "onUpdate:activeIndex": ($event) => activeIndex.value = $event,
+    "showFn": (index) => !!props.deviceList[index]
+  }, {
+    default: ({
+      index
+    }) => {
+      const currentDevice = props.deviceList[index];
+      return createVNode(PlayerProvider, {
+        "deviceInfo": currentDevice
+      }, {
+        default: ({
+          videoUrl,
+          onDirectionControl,
+          onZoomControl,
+          loading
+        }) => createVNode(Player, {
+          "type": "live",
+          "loading": loading,
+          "videoUrl": videoUrl,
+          "title": currentDevice.deviceName,
+          "onDirectionControl": onDirectionControl,
+          "onZoomControl": onZoomControl,
+          "authType": currentDevice.authType === 2 ? ["control"] : []
+        }, null)
+      });
+    }
+  });
+  return {
+    render,
+    toggleFullscreen
+  };
+}
+
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: {
+    visible: { type: Boolean, required: true, default: false },
+    deviceList: { type: Array, required: true, default: () => [] },
+    gridNum: { type: Number, required: true, default: 4 }
+  },
+  emits: ["update:visible"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    __expose();
+    const props = __props;
+    const emit = __emit;
+    const dialogVisible = computed({
+      get: () => props.visible,
+      set: (val) => emit("update:visible", val)
+    });
+    const { render: Video, toggleFullscreen } = useVideo(props);
+    const videoDialogWidthClass = computed(() => {
+      let className = {};
+      switch (props.gridNum) {
+        case 1:
+          className = "one-video";
+          break;
+        case 4:
+          className = "four-video";
+          break;
+        case 9:
+          className = "nine-video";
+          break;
+      }
+      return className;
+    });
+    const __returned__ = { props, emit, dialogVisible, Video, toggleFullscreen, videoDialogWidthClass, get DasDialog() {
+      return DasDialog;
+    }, get DasIcon() {
+      return DasIcon;
+    }, get DasTooltip() {
+      return DasTooltip;
+    } };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+});
+
+const _hoisted_1 = /* @__PURE__ */ createElementVNode(
+  "div",
+  null,
+  [
+    /* @__PURE__ */ createElementVNode("span", null, "\u89C6\u9891\u76D1\u63A7")
+  ],
+  -1
+  /* HOISTED */
+);
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createBlock($setup["DasDialog"], {
+    size: "mini",
+    title: "\u89C6\u9891\u76D1\u63A7",
+    "custom-class": `das-linakge-video-dialog ${$setup.videoDialogWidthClass}`,
+    modelValue: $setup.dialogVisible,
+    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => $setup.dialogVisible = $event),
+    bodyStyle: { padding: 0 },
+    "close-on-click-modal": false,
+    "close-on-press-escape": false,
+    modal: false,
+    "header-style": { display: "flex", justifyContent: "space-between", alignItems: "center" }
+  }, {
+    header: withCtx(() => [
+      _hoisted_1,
+      createVNode($setup["DasTooltip"], { content: "\u9875\u9762\u5168\u5C4F" }, {
+        default: withCtx(() => [
+          createVNode($setup["DasIcon"], {
+            class: "icon",
+            icon: "fullscreen2",
+            color: "#999",
+            onClick: $setup.toggleFullscreen
+          }, null, 8, ["onClick"])
+        ]),
+        _: 1
+        /* STABLE */
+      })
+    ]),
+    default: withCtx(() => [
+      $setup.dialogVisible ? (openBlock(), createBlock($setup["Video"], { key: 0 })) : createCommentVNode("v-if", true)
+    ]),
+    _: 1
+    /* STABLE */
+  }, 8, ["custom-class", "modelValue"]);
+}
+var videoDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/business-components/video-dialog/src/index.vue"]]);
+
+const DasVideoDialog = withInstall(videoDialog);
+const DasVideoDialogRef = () => ref$1(null);
+
+export { DasVideoDialog, DasVideoDialogRef, useVideo };