import {dicts} from "@/utils/dicts";
import axios from 'axios'
import Vue from 'vue'

window.axios = axios
const KENGEE_CDN_BASE = "http://10.0.97.209/presource/datascreen"
const libs = [
  `${KENGEE_CDN_BASE}/js/pinyin.min.js`,
  `${KENGEE_CDN_BASE}/js/dayjs.min.js`,
  `${KENGEE_CDN_BASE}/js/Tween.js`,
  `${KENGEE_CDN_BASE}/js/three/three.min.js`,
  `${KENGEE_CDN_BASE}/js/d3-array.min.js`,
  `${KENGEE_CDN_BASE}/js/d3-geo.min.js`,
  '/presource/datascreen/js/hls.min.js',
  '/presource/datascreen/js/clappr.min.js',
]
window.$loadScript = (type = 'js', url, dom = "body") => {
  let flag = false;
  return new Promise((resolve) => {
    const head = dom == 'head' ? document.getElementsByTagName('head')[0] : document.body;
    for (let i = 0; i < head.children.length; i++) {
      let ele = head.children[i]
      if ((ele.src || '').indexOf(url) !== -1) {
        flag = true;
        resolve();
      }
    }
    if (flag) return;
    let script;
    if (type === 'js') {
      script = document.createElement('script');
      script.type = 'text/javascript';
      script.src = url;
    } else if (type === 'css') {
      script = document.createElement('link');
      script.rel = 'stylesheet';
      script.type = 'text/css';
      script.href = url;
    }
    head.appendChild(script);
    script.onload = function () {
      resolve();
    };
  });
};
window.$glob = {token: "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJoLXVzZXItaWQiOiIxODA4MDM2NzI3NzQzNDU1MjMyIiwiaC1yb2xlLWlkIjoiMTgwODAzNjg5NDQxMjUxMzI4MCIsImV4cCI6MTc1MTQ0NDg0MywibmJmIjoxNzE5OTA4ODQzfQ.Wi6wzArP79mFj3XEzSendOfWHJc1mNuSAlAC1W4zMzI"}
window.$dicts = dicts
window.$waitFor = (target, t = 500) => new Promise(resolve => {
  const interval = setInterval(() => {
    if (target) {
      clearInterval(interval)
      resolve(target)
    }
  }, t)
  if (target) {
    clearInterval(interval)
    resolve(target)
  }
})
window.evenRowBGC = (color = "#09265B") => `transparent;background-image: linear-gradient(-45deg, ${color} 0, ${color} 10%, transparent 10%, transparent 50%,${color} 50%, ${color} 60%, transparent 60%, transparent);background-size: 10px 10px;`

Vue.prototype.$marketBoard = Vue.observable({
  screenId: '5b1849ac-4fc3-451a-844c-3362b47341ef',
  search: {"groupCodeList": [], "currentDate": "20240701", "compareDate": "20240630", "hourNum": "18"}
})
Vue.prototype.$multipleStoreBoard = Vue.observable({
  search: {"groupCodeList": [], "hourNum": "", type: "1"}
})
Vue.prototype.$storeBoard = Vue.observable({
  currentDate: "20240705",
  dialog: false,
  aroundStock: [],
  query: {},
  search: {}
})
Vue.component("HlsPlayer", {
  render: (h) => h('div', {style: {width: '100%', height: '100%'}}),
  props: {
    url: {default: "https://open.ys7.com/v3/openlive/155715496_1_1.m3u8?expire=1747359002&id=712960386311127040&t=c9c6ad362940b1fb4ea7a736cec78980aa9ad1d27d6e3eddf75788c0564e9d7b&ev=100"}
  },
  mounted() {
    const {Hls,Clappr} = window
    // if (Hls && this.url) {
    //   if (Hls.isSupported()) {
    //     const hls = new Hls()
    //     hls.loadSource(this.url)
    //     hls.attachMedia(this.$el)
    //   } else if (this.$el.canPlayType('application/vnd.apple.mpegurl')) {
    //     this.$el.src = this.url;
    //   }
    // }
    if(Clappr && this.url) {
      const player = new Clappr.Player({
        mute: true, //静音为true
        width: '100%',
        height: '100%',
        source: this.url,
        autoPlay: true,
        disableCanAutoPlay: true, //禁用检测浏览器是否可以自动播放视频
        hideMediaControl: true, //禁用媒体控制自动隐藏
        hideMediaControlDelay: 100, //更改默认的媒体控件自动隐藏超时值
        hideVolumeBar: true, //当嵌入的宽度小于320时，音量条将被隐藏
        exitFullscreenOnEnd: false, //禁用播放器将在媒体结束时自动退出全屏显示，即播放结束后不会退出全屏
        mediacontrol: {seekbar: "#000", buttons: "#FFF"}, //定义进度条和底部暂停等图标的颜色
      })
      player.attachTo(this.$el)
    }
  }
})
Vue.component("tableColumn", {
  props: {
    column: {default: () => ({})}
  },
  render(h) {
    const config = this.$props.column
    return h('el-table-column', {props: {...config, label: `${config.label}` || "-"}},
      config.children?.map(col => h("tableColumn", {props: {column: col}})) || h('template', {
        slotScope: {
          default: ({row}) => {
            config.custom ? h('div', {style: {color: row.preSaleNum > row.stockNum ? 'red' : '#fff'}}, '周边库存情况') :
              h('span', row[config.prop] || '')
          }
        }
      }))
  },
})


export default Promise.all([
  import("./fetch"),
  ...libs.map(url => $loadScript('js', url)),
])