@ccos/webos-vue/dist/es/index13.mjs

A Web-Ui Framework for Skyworth/Coocaa TV

import { ref, reactive, inject, onBeforeMount, onMounted, onBeforeUnmount, watch, openBlock, createElementBlock, normalizeStyle, renderSlot, createCommentVNode } from "vue";
import { px2vw, gapValue } from "./index45.mjs";
import "./index46.mjs";
import _export_sfc from "./index34.mjs";
const _sfc_main = {
  __name: "unit",
  setup(__props) {
    const curUnitRef = ref(null);
    const childRender = ref(false);
    const unitStyle = reactive({});
    let unitKey = 0;
    let rowIndex = 0;
    let colIndex = 0;
    let segment = inject("equal-divide-part-segment");
    let unitWidth = inject("equal-divide-part-unit-width");
    let unitHeight = inject("equal-divide-part-unit-height");
    let unitKeyList = inject("equal-divide-part-unit-keys");
    let notifyUnitChanged = inject("equal-divide-part-unit-changed");
    function getKey() {
      let randomNum1 = Math.floor(1e6 * Math.random());
      let randomNum2 = Math.floor(1e6 * Math.random());
      let randomNum3 = Math.floor(1e6 * Math.random());
      let randomNum4 = Math.floor(1e6 * Math.random());
      let randomNum5 = Math.floor(1e6 * Math.random());
      let randomNum6 = Math.floor(1e6 * Math.random());
      let key = `${randomNum1}-${randomNum2}-${randomNum3}-${randomNum4}-${randomNum5}-${randomNum6}`;
      return key;
    }
    const addCurrentUnitKey = () => {
      unitKey = getKey();
      if (unitKeyList.value.indexOf(unitKey) < 0) {
        unitKeyList.value.push(unitKey);
        if (notifyUnitChanged) {
          notifyUnitChanged();
        }
      }
    };
    const delCurrentUnitKey = () => {
      let index = unitKeyList.value.indexOf(unitKey);
      if (index < 0) {
        return;
      }
      unitKeyList.value.splice(index, 1);
      if (notifyUnitChanged) {
        notifyUnitChanged();
      }
    };
    const getCurrentUnitKeyIndex = (key) => {
      return unitKeyList.value.indexOf(key);
    };
    const updateUnitLayout = (segment2, unitWidth2, unitHeight2) => {
      if (!unitWidth2 || !unitHeight2 || segment2 <= 0) {
        childRender.value = false;
        return;
      }
      let unitIndex = getCurrentUnitKeyIndex(unitKey);
      rowIndex = parseInt(unitIndex / segment2);
      colIndex = unitIndex % segment2;
      const x = colIndex * (unitWidth2 + gapValue);
      const y = rowIndex * (unitHeight2 + gapValue);
      unitStyle["position"] = "absolute";
      unitStyle["width"] = "" + px2vw(unitWidth2) + "vw";
      unitStyle["height"] = "" + px2vw(unitHeight2) + "vw";
      unitStyle["left"] = "" + px2vw(x) + "vw";
      unitStyle["top"] = "" + px2vw(y) + "vw";
      childRender.value = true;
    };
    onBeforeMount(() => {
    });
    onMounted(() => {
    });
    onBeforeUnmount(() => {
      delCurrentUnitKey();
    });
    watch([segment, unitWidth, unitHeight], ([segment2, unitWidth2, unitHeight2]) => {
      updateUnitLayout(segment2, unitWidth2, unitHeight2);
    });
    addCurrentUnitKey();
    updateUnitLayout(segment.value, unitWidth.value, unitHeight.value);
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        ref_key: "curUnitRef",
        ref: curUnitRef,
        style: normalizeStyle(unitStyle),
        class: "unit1"
      }, [
        childRender.value ? renderSlot(_ctx.$slots, "default", { key: 0 }, void 0, true) : createCommentVNode("", true)
      ], 4);
    };
  }
};
const TvUnit = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8cd35672"]]);
export {
  TvUnit as default
};