import { GlobalConfig } from '@/share/types'
// import { Script, Link } from 'hono-vite-react-stack-node/components'
import process from 'node:process'

// 全局配置常量
const GLOBAL_CONFIG: GlobalConfig = {
  OSS_BASE_URL: process.env.OSS_BASE_URL || 'https://oss.d8d.fun',
  APP_NAME: process.env.APP_NAME || '多八多Aider',
}

// export const renderer = reactRenderer(({ children }) => {
//   return (
//     <html>
//       <head>
//         <meta charSet="UTF-8" />
//         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
//         <script src="https://ai-oss.d8d.fun/umd/vconsole.3.15.1.min.js"></script>
//         <script dangerouslySetInnerHTML={{ __html: `
//           const init = () => {
//             const urlParams = new URLSearchParams(window.location.search);
//             if (${import.meta.env?.PROD ? "true":"false"} && !urlParams.has('vconsole')) return;
//             var vConsole = new VConsole({
//               theme: urlParams.get('vconsole_theme') || 'light',
//               onReady: function() {
//                 console.log('vConsole is ready');
//               }
//             });
//           }
//           init();
//         `}} />
//         {/* 注入全局配置 */}
//         <script dangerouslySetInnerHTML={{ __html: `window.CONFIG = ${JSON.stringify(GLOBAL_CONFIG)};` }} />

//       </head>
//       <body>
//         {children}
//         <script type="module" src="/src/client/index.tsx"></script>
//       </body>
//     </html> 
//   )
// })

export const Rooter2 = () => {
  return (
    <html>
      <head>
        <meta charSet="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <link href='/src/style.css' rel="stylesheet" />
        <script src="https://ai-oss.d8d.fun/umd/vconsole.3.15.1.min.js"></script>
        <script dangerouslySetInnerHTML={{
          __html: `
          const init = () => {
            const urlParams = new URLSearchParams(window.location.search);
            if (${import.meta.env?.PROD ? "true" : "false"} && !urlParams.has('vconsole')) return;
            var vConsole = new VConsole({
              theme: urlParams.get('vconsole_theme') || 'light',
              onReady: function() {
                console.log('vConsole is ready');
              }
            });
          }
          init();
        `}} />
        {/* 注入全局配置 */}
        <script dangerouslySetInnerHTML={{ __html: `window.CONFIG = ${JSON.stringify(GLOBAL_CONFIG)};` }} />

      </head>
      <body>
        <div id='root' dangerouslySetInnerHTML={{ __html: '<!--app-html-->' }}></div>
        <script type="module" src="/src/client/index.tsx"></script>
      </body>
    </html>
  )
}

export const Rooter = () => {
  return (
    <html lang="en">
      <head>
        <meta charSet="UTF-8" />
        <link rel="icon" type="image/svg+xml" href="/datav/logo.ico" />
        <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1,minimum-scale=1,maximum-scale=1,viewport-fit=cover" />
        <title>荆楚农事智慧农业数据驾驶舱</title>
        <script src="https://ai-oss.d8d.fun/umd/vconsole.3.15.1.min.js"></script>
        <script dangerouslySetInnerHTML={{
          __html: `
          const init = () => {
            const urlParams = new URLSearchParams(window.location.search);
            if (${import.meta.env?.PROD ? "true" : "false"} && !urlParams.has('vconsole')) return;
            var vConsole = new VConsole({
              theme: urlParams.get('vconsole_theme') || 'light',
              onReady: function() {
                console.log('vConsole is ready');
              }
            });
          }
          init();
        `}} />
        {/* 注入全局配置 */}
        <script dangerouslySetInnerHTML={{ __html: `window.CONFIG = ${JSON.stringify(GLOBAL_CONFIG)};` }} />
        <style dangerouslySetInnerHTML={{
          __html: `
            #firstLoad {
                width: 80px;
                height: 80px;
                position: absolute;
                z-index: 999;
                left: 50%;
                top: 50%;
                transform: translate(-50%,-50%)
            }

            #firstLoad span {
                display: inline-block;
                width: 15px;
                height: 15px;
                border-radius: 50%;
                background: #fff;
                position: absolute;
                -webkit-animation: load 1.04s ease infinite
            }

            @-webkit-keyframes load {
                0% {
                    -webkit-transform: scale(1.2);
                    opacity: 1
                }

                100% {
                    -webkit-transform: scale(.3);
                    opacity: .5
                }
            }

            #firstLoad span:first-child {
                left: 0;
                top: 50%;
                margin-top: -10px;
                -webkit-animation-delay: .13s
            }

            #firstLoad span:nth-child(2) {
                left: 10px;
                top: 10px;
                -webkit-animation-delay: .26s
            }

            #firstLoad span:nth-child(3) {
                left: 50%;
                top: 0;
                margin-left: -10px;
                -webkit-animation-delay: .39s
            }

            #firstLoad span:nth-child(4) {
                top: 10px;
                right: 10px;
                -webkit-animation-delay: .52s
            }

            #firstLoad span:nth-child(5) {
                right: 0;
                top: 50%;
                margin-top: -10px;
                -webkit-animation-delay: .65s
            }

            #firstLoad span:nth-child(6) {
                right: 10px;
                bottom: 10px;
                -webkit-animation-delay: .78s
            }

            #firstLoad span:nth-child(7) {
                bottom: 0;
                left: 50%;
                margin-left: -10px;
                -webkit-animation-delay: .91s
            }

            #firstLoad span:nth-child(8) {
                bottom: 10px;
                left: 10px;
                -webkit-animation-delay: 1.04s
            }
        
        `}}
        />
        <script type="module" crossOrigin="" src="/datav/assets/js/index-6530d0f6.js"></script>
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@vue-37836d09.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/vue-router-c7cbbcaa.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/lodash-es-acda58df.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@vueuse-1ddca6f0.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@element-plus-bb6eebe0.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@popperjs-b696b006.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@ctrl-41c0891e.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/d3-array-d83825ab.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/d3-geo-106fc929.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@turf-e5dd68ad.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/dayjs-423c4f07.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/async-validator-7d693152.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/memoize-one-63ab667a.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/normalize-wheel-es-cf7d7ba7.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/@floating-ui-f285e0b8.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/element-plus-842069d4.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/vue-next-wxlogin-91e03b70.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/vue-demi-71ba0ef2.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/pinia-0c8641d4.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/destr-9c6e2924.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/deep-pick-omit-418f72d7.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/pinia-plugin-persistedstate-1ec13968.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/zrender-ee9f2f6d.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/echarts-a77f8af6.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/nprogress-85851b89.js" />
        <link rel="modulepreload" crossOrigin="" href="/datav/assets/js/mapbox-gl-b315653c.js" />
        <link rel="stylesheet" href="/datav/assets/css/element-plus-12e19b9b.css" />
        <link rel="stylesheet" href="/datav/assets/css/vue-next-wxlogin-d8a75ef8.css" />
        <link rel="stylesheet" href="/datav/assets/css/nprogress-771398e6.css" />
        <link rel="stylesheet" href="/datav/assets/css/mapbox-gl-bbaabcf2.css" />
        <link rel="stylesheet" href="/datav/assets/css/index-de466de5.css" />
      </head>
      <body>
        <div id="firstLoad">
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
          <span></span>
        </div>
        <div id="app"></div>
      </body>
    </html>

  )
}