Merge branch 'perf/three/10-22/2024' into 'main_dev'

perf(src/packages): 调整3D模型布局和新增保存缩略图

See merge request yunteng/thingskit-view!296

@@ -35,8 +35,6 @@
     <script type="module" src="./js/libs/ternjs/doc_comment.js"></script>
     <script type="module" src="./js/libs/tern-threejs/threejs.js"></script>
     <script type="module" src="./js/libs/signals.min.js"></script>
-    <script type="module" src="./js/libs/axios.min.js"></script>
-    <script type="module" src="./js/libs/http/config.js"></script>
     <script type="module" src="./main.js"></script>
   </body>
 </html>

 import { UIPanel, UIRow, UIHorizontalRule } from './libs/ui.js'
 import useMessage from './MessageDialog.js'
 import { saveOrUpdateThreeJsModel } from './libs/http/api.js'
+import html2canvas from 'html2canvas'
+import { fetchRouteParamsLocation } from '@/utils'
+import { uploadFile } from '@/api/external/contentSave/content'
+import { base64toFile } from '../utils/Base64ToFile.js'
 
 function MenubarFile(editor) {
   const strings = editor.strings
@@ -137,16 +141,34 @@ function MenubarFile(editor) {
   /**
    * THINGS_KIT 修改
    */
+
   option = new UIRow()
     .addClass('option')
     .setTextContent(strings.getKey('menubar/file/save'))
     .onClick(async function () {
+      // 获取缩略图片
+      const range = document.querySelector('#viewport').children[3]
+      // 生成图片
+      const canvasImage = await html2canvas(range, {
+        backgroundColor: null,
+        allowTaint: true,
+        useCORS: true,
+        logging: false
+      })
+      // 上传预览图
+      const uploadParams = new FormData()
+      uploadParams.append(
+        'file',
+        base64toFile(canvasImage.toDataURL(), `${fetchRouteParamsLocation()}_index_preview.png`)
+      )
+      const uploadRes = await uploadFile(uploadParams)
       const file_json = editor.toJSON()
       const paramsStr = window.location.search
       const params = new URLSearchParams(paramsStr)
       const file_uuid = params.get('three_file_uuid')
       await saveOrUpdateThreeJsModel({
         id: file_uuid,
+        imageUrl: uploadRes?.fileDownloadUri,
         data: file_json
       })
       const { success } = useMessage()

-import * as THREE from 'three';
+import * as THREE from 'three'
 
-import { UIBreak, UIButton, UIInteger, UIPanel, UIRow, UISelect, UIText } from './libs/ui.js';
+import { UIBreak, UIButton, UIInteger, UIPanel, UIRow, UISelect, UIText } from './libs/ui.js'
 
-import { ViewportPathtracer } from './Viewport.Pathtracer.js';
+import { ViewportPathtracer } from './Viewport.Pathtracer.js'
 
-function SidebarProjectImage( editor ) {
+function SidebarProjectImage(editor) {
+  const strings = editor.strings
 
-	const strings = editor.strings;
+  const container = new UIPanel()
+  container.setId('render')
 
-	const container = new UIPanel();
-	container.setId( 'render' );
+  // Image
 
-	// Image
+  container.add(new UIText(strings.getKey('sidebar/project/image')).setTextTransform('uppercase'))
+  container.add(new UIBreak(), new UIBreak())
 
-	container.add( new UIText( strings.getKey( 'sidebar/project/image' ) ).setTextTransform( 'uppercase' ) );
-	container.add( new UIBreak(), new UIBreak() );
+  // Shading
 
-	// Shading
+  const shadingRow = new UIRow()
+  container.add(shadingRow)
 
-	const shadingRow = new UIRow();
-	container.add( shadingRow );
+  shadingRow.add(new UIText(strings.getKey('sidebar/project/shading')).setClass('Label'))
 
-	shadingRow.add( new UIText( strings.getKey( 'sidebar/project/shading' ) ).setClass( 'Label' ) );
+  const shadingTypeSelect = new UISelect()
+    .setOptions({
+      solid: 'SOLID',
+      realistic: 'REALISTIC'
+    })
+    .setWidth('170px')
+    .onChange(refreshShadingRow)
+    .setValue('solid')
+  shadingRow.add(shadingTypeSelect)
 
-	const shadingTypeSelect = new UISelect().setOptions( {
-		'solid': 'SOLID',
-		'realistic': 'REALISTIC'
-	} ).setWidth( '170px' ).onChange( refreshShadingRow ).setValue( 'solid' );
-	shadingRow.add( shadingTypeSelect );
+  const pathTracerMinSamples = 3
+  const pathTracerMaxSamples = 65536
+  const samplesNumber = new UIInteger(16).setRange(pathTracerMinSamples, pathTracerMaxSamples)
 
-	const pathTracerMinSamples = 3;
-	const pathTracerMaxSamples = 65536;
-	const samplesNumber = new UIInteger( 16 ).setRange( pathTracerMinSamples, pathTracerMaxSamples );
+  const samplesRow = new UIRow()
+  samplesRow.add(new UIText(strings.getKey('sidebar/project/image/samples')).setClass('Label'))
+  samplesRow.add(samplesNumber)
 
-	const samplesRow = new UIRow();
-	samplesRow.add( new UIText( strings.getKey( 'sidebar/project/image/samples' ) ).setClass( 'Label' ) );
-	samplesRow.add( samplesNumber );
+  container.add(samplesRow)
 
-	container.add( samplesRow );
+  function refreshShadingRow() {
+    samplesRow.setHidden(shadingTypeSelect.getValue() !== 'realistic')
+  }
 
-	function refreshShadingRow() {
+  refreshShadingRow()
 
-		samplesRow.setHidden( shadingTypeSelect.getValue() !== 'realistic' );
+  // Resolution
 
-	}
+  const resolutionRow = new UIRow()
+  container.add(resolutionRow)
 
-	refreshShadingRow();
+  resolutionRow.add(new UIText(strings.getKey('sidebar/project/resolution')).setClass('Label'))
 
-	// Resolution
+  const imageWidth = new UIInteger(1024).setTextAlign('center').setWidth('28px')
+  resolutionRow.add(imageWidth)
 
-	const resolutionRow = new UIRow();
-	container.add( resolutionRow );
+  resolutionRow.add(new UIText('×').setTextAlign('center').setFontSize('12px').setWidth('12px'))
 
-	resolutionRow.add( new UIText( strings.getKey( 'sidebar/project/resolution' ) ).setClass( 'Label' ) );
+  const imageHeight = new UIInteger(1024).setTextAlign('center').setWidth('28px')
+  resolutionRow.add(imageHeight)
 
-	const imageWidth = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
-	resolutionRow.add( imageWidth );
+  // Render
 
-	resolutionRow.add( new UIText( '×' ).setTextAlign( 'center' ).setFontSize( '12px' ).setWidth( '12px' ) );
+  const renderButton = new UIButton(strings.getKey('sidebar/project/render'))
+  renderButton.setWidth('170px')
+  renderButton.setMarginLeft('120px')
+  renderButton.onClick(async () => {
+    if (shadingTypeSelect.getValue() === 'realistic') {
+      let isMaterialsValid = true
 
-	const imageHeight = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
-	resolutionRow.add( imageHeight );
+      editor.scene.traverseVisible(object => {
+        if (object.isMesh) {
+          const materials = Array.isArray(object.material) ? object.material : [object.material]
 
-	// Render
+          for (let i = 0; i < materials.length; i++) {
+            const material = materials[i]
 
-	const renderButton = new UIButton( strings.getKey( 'sidebar/project/render' ) );
-	renderButton.setWidth( '170px' );
-	renderButton.setMarginLeft( '120px' );
-	renderButton.onClick( async () => {
+            if (!material.isMeshStandardMaterial) {
+              isMaterialsValid = false
+              return
+            }
+          }
+        }
+      })
 
-		if ( shadingTypeSelect.getValue() === 'realistic' ) {
+      if (isMaterialsValid === false) {
+        alert(strings.getKey('prompt/rendering/realistic/unsupportedMaterial'))
+        return
+      }
+    }
 
-			let isMaterialsValid = true;
+    //
 
-			editor.scene.traverseVisible( ( object ) => {
+    const json = editor.toJSON()
+    const project = json.project
 
-				if ( object.isMesh ) {
+    //
 
-					const materials = Array.isArray( object.material ) ? object.material : [ object.material ];
+    const loader = new THREE.ObjectLoader()
 
-					for ( let i = 0; i < materials.length; i ++ ) {
+    const camera = loader.parse(json.camera)
+    camera.aspect = imageWidth.getValue() / imageHeight.getValue()
+    camera.updateProjectionMatrix()
+    camera.updateMatrixWorld()
 
-						const material = materials[ i ];
+    const scene = loader.parse(json.scene)
 
-						if ( ! material.isMeshStandardMaterial ) {
+    const renderer = new THREE.WebGLRenderer({ antialias: true, preserveDrawingBuffer: true })
+    renderer.setSize(imageWidth.getValue(), imageHeight.getValue())
 
-							isMaterialsValid = false;
-							return;
+    if (project.shadows !== undefined) renderer.shadowMap.enabled = project.shadows
+    if (project.shadowType !== undefined) renderer.shadowMap.type = project.shadowType
+    if (project.toneMapping !== undefined) renderer.toneMapping = project.toneMapping
+    if (project.toneMappingExposure !== undefined) renderer.toneMappingExposure = project.toneMappingExposure
 
-						}
+    // popup
 
-					}
+    const width = imageWidth.getValue() / window.devicePixelRatio
+    const height = imageHeight.getValue() / window.devicePixelRatio
 
-				}
+    const left = (screen.width - width) / 2
+    const top = (screen.height - height) / 2
 
-			} );
+    const output = window.open('', '_blank', `location=no,left=${left},top=${top},width=${width},height=${height}`)
 
-			if ( isMaterialsValid === false ) {
+    const meta = document.createElement('meta')
+    meta.name = 'viewport'
+    meta.content = 'width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0'
+    output.document.head.appendChild(meta)
 
-				alert( strings.getKey( 'prompt/rendering/realistic/unsupportedMaterial' ) );
-				return;
+    output.document.body.style.background = '#000'
+    output.document.body.style.margin = '0px'
+    output.document.body.style.overflow = 'hidden'
 
-			}
+    const canvas = renderer.domElement
+    canvas.style.width = width + 'px'
+    canvas.style.height = height + 'px'
+    output.document.body.appendChild(canvas)
 
-		}
+    //
 
-		//
+    switch (shadingTypeSelect.getValue()) {
+      case 'solid':
+        renderer.render(scene, camera)
+        renderer.dispose()
 
-		const json = editor.toJSON();
-		const project = json.project;
+        break
 
-		//
+      case 'realistic':
+        const status = document.createElement('div')
+        status.style.position = 'absolute'
+        status.style.top = '10px'
+        status.style.left = '10px'
+        status.style.color = 'white'
+        status.style.fontFamily = 'system-ui'
+        status.style.fontSize = '12px'
+        output.document.body.appendChild(status)
 
-		const loader = new THREE.ObjectLoader();
+        const pathTracer = new ViewportPathtracer(renderer)
+        pathTracer.init(scene, camera)
+        pathTracer.setSize(imageWidth.getValue(), imageHeight.getValue())
 
-		const camera = loader.parse( json.camera );
-		camera.aspect = imageWidth.getValue() / imageHeight.getValue();
-		camera.updateProjectionMatrix();
-		camera.updateMatrixWorld();
+        const maxSamples = Math.max(pathTracerMinSamples, Math.min(pathTracerMaxSamples, samplesNumber.getValue()))
 
-		const scene = loader.parse( json.scene );
+        function animate() {
+          if (output.closed === true) return
 
-		const renderer = new THREE.WebGLRenderer( { antialias: true } );
-		renderer.setSize( imageWidth.getValue(), imageHeight.getValue() );
+          const samples = Math.floor(pathTracer.getSamples()) + 1
 
-		if ( project.shadows !== undefined ) renderer.shadowMap.enabled = project.shadows;
-		if ( project.shadowType !== undefined ) renderer.shadowMap.type = project.shadowType;
-		if ( project.toneMapping !== undefined ) renderer.toneMapping = project.toneMapping;
-		if ( project.toneMappingExposure !== undefined ) renderer.toneMappingExposure = project.toneMappingExposure;
+          if (samples < maxSamples) {
+            requestAnimationFrame(animate)
+          }
 
-		// popup
+          pathTracer.update()
 
-		const width = imageWidth.getValue() / window.devicePixelRatio;
-		const height = imageHeight.getValue() / window.devicePixelRatio;
+          const progress = Math.floor((samples / maxSamples) * 100)
 
-		const left = ( screen.width - width ) / 2;
-		const top = ( screen.height - height ) / 2;
+          status.textContent = `${samples} / ${maxSamples} ( ${progress}% )`
 
-		const output = window.open( '', '_blank', `location=no,left=${left},top=${top},width=${width},height=${height}` );
+          if (progress === 100) {
+            status.textContent += ' ✓'
+          }
+        }
 
-		const meta = document.createElement( 'meta' );
-		meta.name = 'viewport';
-		meta.content = 'width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0';
-		output.document.head.appendChild( meta );
+        animate()
 
-		output.document.body.style.background = '#000';
-		output.document.body.style.margin = '0px';
-		output.document.body.style.overflow = 'hidden';
+        break
+    }
+  })
+  container.add(renderButton)
 
-		const canvas = renderer.domElement;
-		canvas.style.width = width + 'px';
-		canvas.style.height = height + 'px';
-		output.document.body.appendChild( canvas );
-
-		//
-
-		switch ( shadingTypeSelect.getValue() ) {
-
-			case 'solid':
-
-				renderer.render( scene, camera );
-				renderer.dispose();
-
-				break;
-
-			case 'realistic':
-
-				const status = document.createElement( 'div' );
-				status.style.position = 'absolute';
-				status.style.top = '10px';
-				status.style.left = '10px';
-				status.style.color = 'white';
-				status.style.fontFamily = 'system-ui';
-				status.style.fontSize = '12px';
-				output.document.body.appendChild( status );
-
-				const pathTracer = new ViewportPathtracer( renderer );
-				pathTracer.init( scene, camera );
-				pathTracer.setSize( imageWidth.getValue(), imageHeight.getValue() );
-
-				const maxSamples = Math.max( pathTracerMinSamples, Math.min( pathTracerMaxSamples, samplesNumber.getValue() ) );
-
-				function animate() {
-
-					if ( output.closed === true ) return;
-
-					const samples = Math.floor( pathTracer.getSamples() ) + 1;
-
-					if ( samples < maxSamples ) {
-
-						requestAnimationFrame( animate );
-
-					}
-
-					pathTracer.update();
-
-					const progress = Math.floor( samples / maxSamples * 100 );
-
-					status.textContent = `${ samples } / ${ maxSamples } ( ${ progress }% )`;
-
-					if ( progress === 100 ) {
-
-						status.textContent += ' ✓';
-
-					}
-
-				}
-
-				animate();
-
-				break;
-
-		}
-
-	} );
-	container.add( renderButton );
-
-	//
-
-	return container;
+  //
 
+  return container
 }
 
-export { SidebarProjectImage };
+export { SidebarProjectImage }

-import * as THREE from 'three';
+import * as THREE from 'three'
 
-import { UINumber, UIPanel, UIRow, UISelect, UIText } from './libs/ui.js';
-import { UIBoolean } from './libs/ui.three.js';
+import { UINumber, UIPanel, UIRow, UISelect, UIText } from './libs/ui.js'
+import { UIBoolean } from './libs/ui.three.js'
 
-function SidebarProjectRenderer( editor ) {
+function SidebarProjectRenderer(editor) {
+  const config = editor.config
+  const signals = editor.signals
+  const strings = editor.strings
 
-	const config = editor.config;
-	const signals = editor.signals;
-	const strings = editor.strings;
+  let currentRenderer = null
 
-	let currentRenderer = null;
+  const container = new UIPanel()
+  container.setBorderTop('0px')
 
-	const container = new UIPanel();
-	container.setBorderTop( '0px' );
+  // Antialias
 
-	// Antialias
+  const antialiasRow = new UIRow()
+  container.add(antialiasRow)
 
-	const antialiasRow = new UIRow();
-	container.add( antialiasRow );
+  antialiasRow.add(new UIText(strings.getKey('sidebar/project/antialias')).setClass('Label'))
 
-	antialiasRow.add( new UIText( strings.getKey( 'sidebar/project/antialias' ) ).setClass( 'Label' ) );
+  const antialiasBoolean = new UIBoolean(config.getKey('project/renderer/antialias')).onChange(createRenderer)
+  antialiasRow.add(antialiasBoolean)
 
-	const antialiasBoolean = new UIBoolean( config.getKey( 'project/renderer/antialias' ) ).onChange( createRenderer );
-	antialiasRow.add( antialiasBoolean );
-
-	// Shadows
-
-	const shadowsRow = new UIRow();
-	container.add( shadowsRow );
-
-	shadowsRow.add( new UIText( strings.getKey( 'sidebar/project/shadows' ) ).setClass( 'Label' ) );
-
-	const shadowsBoolean = new UIBoolean( config.getKey( 'project/renderer/shadows' ) ).onChange( updateShadows );
-	shadowsRow.add( shadowsBoolean );
-
-	const shadowTypeSelect = new UISelect().setOptions( {
-		0: 'Basic',
-		1: 'PCF',
-		2: 'PCF Soft',
-		//	3: 'VSM'
-	} ).setWidth( '125px' ).onChange( updateShadows );
-	shadowTypeSelect.setValue( config.getKey( 'project/renderer/shadowType' ) );
-	shadowsRow.add( shadowTypeSelect );
-
-	function updateShadows() {
-
-		currentRenderer.shadowMap.enabled = shadowsBoolean.getValue();
-		currentRenderer.shadowMap.type = parseFloat( shadowTypeSelect.getValue() );
-
-		signals.rendererUpdated.dispatch();
-
-	}
-
-	// Tonemapping
-
-	const toneMappingRow = new UIRow();
-	container.add( toneMappingRow );
-
-	toneMappingRow.add( new UIText( strings.getKey( 'sidebar/project/toneMapping' ) ).setClass( 'Label' ) );
-
-	const toneMappingSelect = new UISelect().setOptions( {
-		0: 'No',
-		1: 'Linear',
-		2: 'Reinhard',
-		3: 'Cineon',
-		4: 'ACESFilmic',
-		6: 'AgX',
-		7: 'Neutral'
-	} ).setWidth( '120px' ).onChange( updateToneMapping );
-	toneMappingSelect.setValue( config.getKey( 'project/renderer/toneMapping' ) );
-	toneMappingRow.add( toneMappingSelect );
-
-	const toneMappingExposure = new UINumber( config.getKey( 'project/renderer/toneMappingExposure' ) );
-	toneMappingExposure.setDisplay( toneMappingSelect.getValue() === '0' ? 'none' : '' );
-	toneMappingExposure.setWidth( '30px' ).setMarginLeft( '10px' );
-	toneMappingExposure.setRange( 0, 10 );
-	toneMappingExposure.onChange( updateToneMapping );
-	toneMappingRow.add( toneMappingExposure );
-
-	function updateToneMapping() {
-
-		toneMappingExposure.setDisplay( toneMappingSelect.getValue() === '0' ? 'none' : '' );
-
-		currentRenderer.toneMapping = parseFloat( toneMappingSelect.getValue() );
-		currentRenderer.toneMappingExposure = toneMappingExposure.getValue();
-		signals.rendererUpdated.dispatch();
-
-	}
-
-	//
-
-	function createRenderer() {
-
-		currentRenderer = new THREE.WebGLRenderer( { antialias: antialiasBoolean.getValue() } );
-		currentRenderer.shadowMap.enabled = shadowsBoolean.getValue();
-		currentRenderer.shadowMap.type = parseFloat( shadowTypeSelect.getValue() );
-		currentRenderer.toneMapping = parseFloat( toneMappingSelect.getValue() );
-		currentRenderer.toneMappingExposure = toneMappingExposure.getValue();
-
-		signals.rendererCreated.dispatch( currentRenderer );
-		signals.rendererUpdated.dispatch();
-
-	}
-
-	createRenderer();
-
-
-	// Signals
-
-	signals.editorCleared.add( function () {
-
-		currentRenderer.shadowMap.enabled = true;
-		currentRenderer.shadowMap.type = THREE.PCFShadowMap;
-		currentRenderer.toneMapping = THREE.NoToneMapping;
-		currentRenderer.toneMappingExposure = 1;
-
-		shadowsBoolean.setValue( currentRenderer.shadowMap.enabled );
-		shadowTypeSelect.setValue( currentRenderer.shadowMap.type );
-		toneMappingSelect.setValue( currentRenderer.toneMapping );
-		toneMappingExposure.setValue( currentRenderer.toneMappingExposure );
-		toneMappingExposure.setDisplay( currentRenderer.toneMapping === 0 ? 'none' : '' );
-
-		signals.rendererUpdated.dispatch();
-
-	} );
-
-	signals.rendererUpdated.add( function () {
-
-		config.setKey(
-			'project/renderer/antialias', antialiasBoolean.getValue(),
-			'project/renderer/shadows', shadowsBoolean.getValue(),
-			'project/renderer/shadowType', parseFloat( shadowTypeSelect.getValue() ),
-			'project/renderer/toneMapping', parseFloat( toneMappingSelect.getValue() ),
-			'project/renderer/toneMappingExposure', toneMappingExposure.getValue()
-		);
-
-	} );
-
-	return container;
+  // Shadows
 
+  const shadowsRow = new UIRow()
+  container.add(shadowsRow)
+
+  shadowsRow.add(new UIText(strings.getKey('sidebar/project/shadows')).setClass('Label'))
+
+  const shadowsBoolean = new UIBoolean(config.getKey('project/renderer/shadows')).onChange(updateShadows)
+  shadowsRow.add(shadowsBoolean)
+
+  const shadowTypeSelect = new UISelect()
+    .setOptions({
+      0: 'Basic',
+      1: 'PCF',
+      2: 'PCF Soft'
+      //	3: 'VSM'
+    })
+    .setWidth('125px')
+    .onChange(updateShadows)
+  shadowTypeSelect.setValue(config.getKey('project/renderer/shadowType'))
+  shadowsRow.add(shadowTypeSelect)
+
+  function updateShadows() {
+    currentRenderer.shadowMap.enabled = shadowsBoolean.getValue()
+    currentRenderer.shadowMap.type = parseFloat(shadowTypeSelect.getValue())
+
+    signals.rendererUpdated.dispatch()
+  }
+
+  // Tonemapping
+
+  const toneMappingRow = new UIRow()
+  container.add(toneMappingRow)
+
+  toneMappingRow.add(new UIText(strings.getKey('sidebar/project/toneMapping')).setClass('Label'))
+
+  const toneMappingSelect = new UISelect()
+    .setOptions({
+      0: 'No',
+      1: 'Linear',
+      2: 'Reinhard',
+      3: 'Cineon',
+      4: 'ACESFilmic',
+      6: 'AgX',
+      7: 'Neutral'
+    })
+    .setWidth('120px')
+    .onChange(updateToneMapping)
+  toneMappingSelect.setValue(config.getKey('project/renderer/toneMapping'))
+  toneMappingRow.add(toneMappingSelect)
+
+  const toneMappingExposure = new UINumber(config.getKey('project/renderer/toneMappingExposure'))
+  toneMappingExposure.setDisplay(toneMappingSelect.getValue() === '0' ? 'none' : '')
+  toneMappingExposure.setWidth('30px').setMarginLeft('10px')
+  toneMappingExposure.setRange(0, 10)
+  toneMappingExposure.onChange(updateToneMapping)
+  toneMappingRow.add(toneMappingExposure)
+
+  function updateToneMapping() {
+    toneMappingExposure.setDisplay(toneMappingSelect.getValue() === '0' ? 'none' : '')
+
+    currentRenderer.toneMapping = parseFloat(toneMappingSelect.getValue())
+    currentRenderer.toneMappingExposure = toneMappingExposure.getValue()
+    signals.rendererUpdated.dispatch()
+  }
+
+  //
+
+  function createRenderer() {
+    currentRenderer = new THREE.WebGLRenderer({ antialias: antialiasBoolean.getValue(), preserveDrawingBuffer: true })
+    currentRenderer.shadowMap.enabled = shadowsBoolean.getValue()
+    currentRenderer.shadowMap.type = parseFloat(shadowTypeSelect.getValue())
+    currentRenderer.toneMapping = parseFloat(toneMappingSelect.getValue())
+    currentRenderer.toneMappingExposure = toneMappingExposure.getValue()
+
+    signals.rendererCreated.dispatch(currentRenderer)
+    signals.rendererUpdated.dispatch()
+  }
+
+  createRenderer()
+
+  // Signals
+
+  signals.editorCleared.add(function () {
+    currentRenderer.shadowMap.enabled = true
+    currentRenderer.shadowMap.type = THREE.PCFShadowMap
+    currentRenderer.toneMapping = THREE.NoToneMapping
+    currentRenderer.toneMappingExposure = 1
+
+    shadowsBoolean.setValue(currentRenderer.shadowMap.enabled)
+    shadowTypeSelect.setValue(currentRenderer.shadowMap.type)
+    toneMappingSelect.setValue(currentRenderer.toneMapping)
+    toneMappingExposure.setValue(currentRenderer.toneMappingExposure)
+    toneMappingExposure.setDisplay(currentRenderer.toneMapping === 0 ? 'none' : '')
+
+    signals.rendererUpdated.dispatch()
+  })
+
+  signals.rendererUpdated.add(function () {
+    config.setKey(
+      'project/renderer/antialias',
+      antialiasBoolean.getValue(),
+      'project/renderer/shadows',
+      shadowsBoolean.getValue(),
+      'project/renderer/shadowType',
+      parseFloat(shadowTypeSelect.getValue()),
+      'project/renderer/toneMapping',
+      parseFloat(toneMappingSelect.getValue()),
+      'project/renderer/toneMappingExposure',
+      toneMappingExposure.getValue()
+    )
+  })
+
+  return container
 }
 
-export { SidebarProjectRenderer };
+export { SidebarProjectRenderer }

 var APP = {
+  Player: function () {
+    var renderer = new THREE.WebGLRenderer({ antialias: true, preserveDrawingBuffer: true })
+    renderer.setPixelRatio(window.devicePixelRatio) // TODO: Use player.setPixelRatio()
 
-	Player: function () {
+    var loader = new THREE.ObjectLoader()
+    var camera, scene
 
-		var renderer = new THREE.WebGLRenderer( { antialias: true } );
-		renderer.setPixelRatio( window.devicePixelRatio ); // TODO: Use player.setPixelRatio()
+    var events = {}
 
-		var loader = new THREE.ObjectLoader();
-		var camera, scene;
+    var dom = document.createElement('div')
+    dom.appendChild(renderer.domElement)
 
-		var events = {};
+    this.dom = dom
+    this.canvas = renderer.domElement
 
-		var dom = document.createElement( 'div' );
-		dom.appendChild( renderer.domElement );
+    this.width = 500
+    this.height = 500
 
-		this.dom = dom;
-		this.canvas = renderer.domElement;
+    this.load = function (json) {
+      var project = json.project
 
-		this.width = 500;
-		this.height = 500;
+      if (project.shadows !== undefined) renderer.shadowMap.enabled = project.shadows
+      if (project.shadowType !== undefined) renderer.shadowMap.type = project.shadowType
+      if (project.toneMapping !== undefined) renderer.toneMapping = project.toneMapping
+      if (project.toneMappingExposure !== undefined) renderer.toneMappingExposure = project.toneMappingExposure
 
-		this.load = function ( json ) {
+      this.setScene(loader.parse(json.scene))
+      this.setCamera(loader.parse(json.camera))
 
-			var project = json.project;
+      events = {
+        init: [],
+        start: [],
+        stop: [],
+        keydown: [],
+        keyup: [],
+        pointerdown: [],
+        pointerup: [],
+        pointermove: [],
+        update: []
+      }
 
-			if ( project.shadows !== undefined ) renderer.shadowMap.enabled = project.shadows;
-			if ( project.shadowType !== undefined ) renderer.shadowMap.type = project.shadowType;
-			if ( project.toneMapping !== undefined ) renderer.toneMapping = project.toneMapping;
-			if ( project.toneMappingExposure !== undefined ) renderer.toneMappingExposure = project.toneMappingExposure;
+      var scriptWrapParams = 'player,renderer,scene,camera'
+      var scriptWrapResultObj = {}
 
-			this.setScene( loader.parse( json.scene ) );
-			this.setCamera( loader.parse( json.camera ) );
+      for (var eventKey in events) {
+        scriptWrapParams += ',' + eventKey
+        scriptWrapResultObj[eventKey] = eventKey
+      }
 
-			events = {
-				init: [],
-				start: [],
-				stop: [],
-				keydown: [],
-				keyup: [],
-				pointerdown: [],
-				pointerup: [],
-				pointermove: [],
-				update: []
-			};
+      var scriptWrapResult = JSON.stringify(scriptWrapResultObj).replace(/\"/g, '')
 
-			var scriptWrapParams = 'player,renderer,scene,camera';
-			var scriptWrapResultObj = {};
+      for (var uuid in json.scripts) {
+        var object = scene.getObjectByProperty('uuid', uuid, true)
 
-			for ( var eventKey in events ) {
+        if (object === undefined) {
+          console.warn('APP.Player: Script without object.', uuid)
+          continue
+        }
 
-				scriptWrapParams += ',' + eventKey;
-				scriptWrapResultObj[ eventKey ] = eventKey;
+        var scripts = json.scripts[uuid]
 
-			}
+        for (var i = 0; i < scripts.length; i++) {
+          var script = scripts[i]
 
-			var scriptWrapResult = JSON.stringify( scriptWrapResultObj ).replace( /\"/g, '' );
+          var functions = new Function(scriptWrapParams, script.source + '\nreturn ' + scriptWrapResult + ';').bind(
+            object
+          )(this, renderer, scene, camera)
 
-			for ( var uuid in json.scripts ) {
+          for (var name in functions) {
+            if (functions[name] === undefined) continue
 
-				var object = scene.getObjectByProperty( 'uuid', uuid, true );
+            if (events[name] === undefined) {
+              console.warn('APP.Player: Event type not supported (', name, ')')
+              continue
+            }
 
-				if ( object === undefined ) {
+            events[name].push(functions[name].bind(object))
+          }
+        }
+      }
 
-					console.warn( 'APP.Player: Script without object.', uuid );
-					continue;
+      dispatch(events.init, arguments)
+    }
 
-				}
+    this.setCamera = function (value) {
+      camera = value
+      camera.aspect = this.width / this.height
+      camera.updateProjectionMatrix()
+    }
 
-				var scripts = json.scripts[ uuid ];
+    this.setScene = function (value) {
+      scene = value
+    }
 
-				for ( var i = 0; i < scripts.length; i ++ ) {
+    this.setPixelRatio = function (pixelRatio) {
+      renderer.setPixelRatio(pixelRatio)
+    }
 
-					var script = scripts[ i ];
+    this.setSize = function (width, height) {
+      this.width = width
+      this.height = height
 
-					var functions = ( new Function( scriptWrapParams, script.source + '\nreturn ' + scriptWrapResult + ';' ).bind( object ) )( this, renderer, scene, camera );
+      if (camera) {
+        camera.aspect = this.width / this.height
+        camera.updateProjectionMatrix()
+      }
 
-					for ( var name in functions ) {
+      renderer.setSize(width, height)
+    }
 
-						if ( functions[ name ] === undefined ) continue;
+    function dispatch(array, event) {
+      for (var i = 0, l = array.length; i < l; i++) {
+        array[i](event)
+      }
+    }
 
-						if ( events[ name ] === undefined ) {
+    var time, startTime, prevTime
 
-							console.warn( 'APP.Player: Event type not supported (', name, ')' );
-							continue;
+    function animate() {
+      time = performance.now()
 
-						}
+      try {
+        dispatch(events.update, { time: time - startTime, delta: time - prevTime })
+      } catch (e) {
+        console.error(e.message || e, e.stack || '')
+      }
 
-						events[ name ].push( functions[ name ].bind( object ) );
+      renderer.render(scene, camera)
 
-					}
+      prevTime = time
+    }
 
-				}
+    this.play = function () {
+      startTime = prevTime = performance.now()
 
-			}
+      document.addEventListener('keydown', onKeyDown)
+      document.addEventListener('keyup', onKeyUp)
+      document.addEventListener('pointerdown', onPointerDown)
+      document.addEventListener('pointerup', onPointerUp)
+      document.addEventListener('pointermove', onPointerMove)
 
-			dispatch( events.init, arguments );
+      dispatch(events.start, arguments)
 
-		};
+      renderer.setAnimationLoop(animate)
+    }
 
-		this.setCamera = function ( value ) {
+    this.stop = function () {
+      document.removeEventListener('keydown', onKeyDown)
+      document.removeEventListener('keyup', onKeyUp)
+      document.removeEventListener('pointerdown', onPointerDown)
+      document.removeEventListener('pointerup', onPointerUp)
+      document.removeEventListener('pointermove', onPointerMove)
 
-			camera = value;
-			camera.aspect = this.width / this.height;
-			camera.updateProjectionMatrix();
+      dispatch(events.stop, arguments)
 
-		};
+      renderer.setAnimationLoop(null)
+    }
 
-		this.setScene = function ( value ) {
+    this.render = function (time) {
+      dispatch(events.update, { time: time * 1000, delta: 0 /* TODO */ })
 
-			scene = value;
+      renderer.render(scene, camera)
+    }
 
-		};
+    this.dispose = function () {
+      renderer.dispose()
 
-		this.setPixelRatio = function ( pixelRatio ) {
+      camera = undefined
+      scene = undefined
+    }
 
-			renderer.setPixelRatio( pixelRatio );
+    //
 
-		};
+    function onKeyDown(event) {
+      dispatch(events.keydown, event)
+    }
 
-		this.setSize = function ( width, height ) {
+    function onKeyUp(event) {
+      dispatch(events.keyup, event)
+    }
 
-			this.width = width;
-			this.height = height;
+    function onPointerDown(event) {
+      dispatch(events.pointerdown, event)
+    }
 
-			if ( camera ) {
+    function onPointerUp(event) {
+      dispatch(events.pointerup, event)
+    }
 
-				camera.aspect = this.width / this.height;
-				camera.updateProjectionMatrix();
+    function onPointerMove(event) {
+      dispatch(events.pointermove, event)
+    }
+  }
+}
 
-			}
-
-			renderer.setSize( width, height );
-
-		};
-
-		function dispatch( array, event ) {
-
-			for ( var i = 0, l = array.length; i < l; i ++ ) {
-
-				array[ i ]( event );
-
-			}
-
-		}
-
-		var time, startTime, prevTime;
-
-		function animate() {
-
-			time = performance.now();
-
-			try {
-
-				dispatch( events.update, { time: time - startTime, delta: time - prevTime } );
-
-			} catch ( e ) {
-
-				console.error( ( e.message || e ), ( e.stack || '' ) );
-
-			}
-
-			renderer.render( scene, camera );
-
-			prevTime = time;
-
-		}
-
-		this.play = function () {
-
-			startTime = prevTime = performance.now();
-
-			document.addEventListener( 'keydown', onKeyDown );
-			document.addEventListener( 'keyup', onKeyUp );
-			document.addEventListener( 'pointerdown', onPointerDown );
-			document.addEventListener( 'pointerup', onPointerUp );
-			document.addEventListener( 'pointermove', onPointerMove );
-
-			dispatch( events.start, arguments );
-
-			renderer.setAnimationLoop( animate );
-
-		};
-
-		this.stop = function () {
-
-			document.removeEventListener( 'keydown', onKeyDown );
-			document.removeEventListener( 'keyup', onKeyUp );
-			document.removeEventListener( 'pointerdown', onPointerDown );
-			document.removeEventListener( 'pointerup', onPointerUp );
-			document.removeEventListener( 'pointermove', onPointerMove );
-
-			dispatch( events.stop, arguments );
-
-			renderer.setAnimationLoop( null );
-
-		};
-
-		this.render = function ( time ) {
-
-			dispatch( events.update, { time: time * 1000, delta: 0 /* TODO */ } );
-
-			renderer.render( scene, camera );
-
-		};
-
-		this.dispose = function () {
-
-			renderer.dispose();
-
-			camera = undefined;
-			scene = undefined;
-
-		};
-
-		//
-
-		function onKeyDown( event ) {
-
-			dispatch( events.keydown, event );
-
-		}
-
-		function onKeyUp( event ) {
-
-			dispatch( events.keyup, event );
-
-		}
-
-		function onPointerDown( event ) {
-
-			dispatch( events.pointerdown, event );
-
-		}
-
-		function onPointerUp( event ) {
-
-			dispatch( events.pointerup, event );
-
-		}
-
-		function onPointerMove( event ) {
-
-			dispatch( events.pointermove, event );
-
-		}
-
-	}
-
-};
-
-export { APP };
+export { APP }

-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).axios=t()}(this,(function(){"use strict";function e(e){var r,n;function o(r,n){try{var a=e[r](n),u=a.value,s=u instanceof t;Promise.resolve(s?u.v:u).then((function(t){if(s){var n="return"===r?"return":"next";if(!u.k||t.done)return o(n,t);t=e[n](t).value}i(a.done?"return":"normal",t)}),(function(e){o("throw",e)}))}catch(e){i("throw",e)}}function i(e,t){switch(e){case"return":r.resolve({value:t,done:!0});break;case"throw":r.reject(t);break;default:r.resolve({value:t,done:!1})}(r=r.next)?o(r.key,r.arg):n=null}this._invoke=function(e,t){return new Promise((function(i,a){var u={key:e,arg:t,resolve:i,reject:a,next:null};n?n=n.next=u:(r=n=u,o(e,t))}))},"function"!=typeof e.return&&(this.return=void 0)}function t(e,t){this.v=e,this.k=t}function r(e){var r={},n=!1;function o(r,o){return n=!0,o=new Promise((function(t){t(e[r](o))})),{done:!1,value:new t(o,1)}}return r["undefined"!=typeof Symbol&&Symbol.iterator||"@@iterator"]=function(){return this},r.next=function(e){return n?(n=!1,e):o("next",e)},"function"==typeof e.throw&&(r.throw=function(e){if(n)throw n=!1,e;return o("throw",e)}),"function"==typeof e.return&&(r.return=function(e){return n?(n=!1,e):o("return",e)}),r}function n(e){var t,r,n,i=2;for("undefined"!=typeof Symbol&&(r=Symbol.asyncIterator,n=Symbol.iterator);i--;){if(r&&null!=(t=e[r]))return t.call(e);if(n&&null!=(t=e[n]))return new o(t.call(e));r="@@asyncIterator",n="@@iterator"}throw new TypeError("Object is not async iterable")}function o(e){function t(e){if(Object(e)!==e)return Promise.reject(new TypeError(e+" is not an object."));var t=e.done;return Promise.resolve(e.value).then((function(e){return{value:e,done:t}}))}return o=function(e){this.s=e,this.n=e.next},o.prototype={s:null,n:null,next:function(){return t(this.n.apply(this.s,arguments))},return:function(e){var r=this.s.return;return void 0===r?Promise.resolve({value:e,done:!0}):t(r.apply(this.s,arguments))},throw:function(e){var r=this.s.return;return void 0===r?Promise.reject(e):t(r.apply(this.s,arguments))}},new o(e)}function i(e){return new t(e,0)}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function u(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?a(Object(r),!0).forEach((function(t){m(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):a(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function s(){s=function(){return t};var e,t={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(e,t,r){e[t]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",u=i.asyncIterator||"@@asyncIterator",c=i.toStringTag||"@@toStringTag";function f(e,t,r){return Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{f({},"")}catch(e){f=function(e,t,r){return e[t]=r}}function l(e,t,r,n){var i=t&&t.prototype instanceof m?t:m,a=Object.create(i.prototype),u=new P(n||[]);return o(a,"_invoke",{value:T(e,r,u)}),a}function h(e,t,r){try{return{type:"normal",arg:e.call(t,r)}}catch(e){return{type:"throw",arg:e}}}t.wrap=l;var p="suspendedStart",d="executing",v="completed",y={};function m(){}function b(){}function g(){}var w={};f(w,a,(function(){return this}));var E=Object.getPrototypeOf,O=E&&E(E(L([])));O&&O!==r&&n.call(O,a)&&(w=O);var S=g.prototype=m.prototype=Object.create(w);function x(e){["next","throw","return"].forEach((function(t){f(e,t,(function(e){return this._invoke(t,e)}))}))}function R(e,t){function r(o,i,a,u){var s=h(e[o],e,i);if("throw"!==s.type){var c=s.arg,f=c.value;return f&&"object"==typeof f&&n.call(f,"__await")?t.resolve(f.__await).then((function(e){r("next",e,a,u)}),(function(e){r("throw",e,a,u)})):t.resolve(f).then((function(e){c.value=e,a(c)}),(function(e){return r("throw",e,a,u)}))}u(s.arg)}var i;o(this,"_invoke",{value:function(e,n){function o(){return new t((function(t,o){r(e,n,t,o)}))}return i=i?i.then(o,o):o()}})}function T(t,r,n){var o=p;return function(i,a){if(o===d)throw new Error("Generator is already running");if(o===v){if("throw"===i)throw a;return{value:e,done:!0}}for(n.method=i,n.arg=a;;){var u=n.delegate;if(u){var s=k(u,n);if(s){if(s===y)continue;return s}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===p)throw o=v,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=d;var c=h(t,r,n);if("normal"===c.type){if(o=n.done?v:"suspendedYield",c.arg===y)continue;return{value:c.arg,done:n.done}}"throw"===c.type&&(o=v,n.method="throw",n.arg=c.arg)}}}function k(t,r){var n=r.method,o=t.iterator[n];if(o===e)return r.delegate=null,"throw"===n&&t.iterator.return&&(r.method="return",r.arg=e,k(t,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=h(o,t.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[t.resultName]=a.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function A(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function j(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function P(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(A,this),this.reset(!0)}function L(t){if(t||""===t){var r=t[a];if(r)return r.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var o=-1,i=function r(){for(;++o<t.length;)if(n.call(t,o))return r.value=t[o],r.done=!1,r;return r.value=e,r.done=!0,r};return i.next=i}}throw new TypeError(typeof t+" is not iterable")}return b.prototype=g,o(S,"constructor",{value:g,configurable:!0}),o(g,"constructor",{value:b,configurable:!0}),b.displayName=f(g,c,"GeneratorFunction"),t.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===b||"GeneratorFunction"===(t.displayName||t.name))},t.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,g):(e.__proto__=g,f(e,c,"GeneratorFunction")),e.prototype=Object.create(S),e},t.awrap=function(e){return{__await:e}},x(R.prototype),f(R.prototype,u,(function(){return this})),t.AsyncIterator=R,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new R(l(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(e){return e.done?e.value:a.next()}))},x(S),f(S,c,"Generator"),f(S,a,(function(){return this})),f(S,"toString",(function(){return"[object Generator]"})),t.keys=function(e){var t=Object(e),r=[];for(var n in t)r.push(n);return r.reverse(),function e(){for(;r.length;){var n=r.pop();if(n in t)return e.value=n,e.done=!1,e}return e.done=!0,e}},t.values=L,P.prototype={constructor:P,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=e,this.done=!1,this.delegate=null,this.method="next",this.arg=e,this.tryEntries.forEach(j),!t)for(var r in this)"t"===r.charAt(0)&&n.call(this,r)&&!isNaN(+r.slice(1))&&(this[r]=e)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var r=this;function o(n,o){return u.type="throw",u.arg=t,r.next=n,o&&(r.method="next",r.arg=e),!!o}for(var i=this.tryEntries.length-1;i>=0;--i){var a=this.tryEntries[i],u=a.completion;if("root"===a.tryLoc)return o("end");if(a.tryLoc<=this.prev){var s=n.call(a,"catchLoc"),c=n.call(a,"finallyLoc");if(s&&c){if(this.prev<a.catchLoc)return o(a.catchLoc,!0);if(this.prev<a.finallyLoc)return o(a.finallyLoc)}else if(s){if(this.prev<a.catchLoc)return o(a.catchLoc,!0)}else{if(!c)throw new Error("try statement without catch or finally");if(this.prev<a.finallyLoc)return o(a.finallyLoc)}}}},abrupt:function(e,t){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var i=o;break}}i&&("break"===e||"continue"===e)&&i.tryLoc<=t&&t<=i.finallyLoc&&(i=null);var a=i?i.completion:{};return a.type=e,a.arg=t,i?(this.method="next",this.next=i.finallyLoc,y):this.complete(a)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),y},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var r=this.tryEntries[t];if(r.finallyLoc===e)return this.complete(r.completion,r.afterLoc),j(r),y}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var r=this.tryEntries[t];if(r.tryLoc===e){var n=r.completion;if("throw"===n.type){var o=n.arg;j(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:L(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}function c(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}function f(e){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f(e)}function l(t){return function(){return new e(t.apply(this,arguments))}}function h(e,t,r,n,o,i,a){try{var u=e[i](a),s=u.value}catch(e){return void r(e)}u.done?t(s):Promise.resolve(s).then(n,o)}function p(e){return function(){var t=this,r=arguments;return new Promise((function(n,o){var i=e.apply(t,r);function a(e){h(i,n,o,a,u,"next",e)}function u(e){h(i,n,o,a,u,"throw",e)}a(void 0)}))}}function d(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function v(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,c(n.key),n)}}function y(e,t,r){return t&&v(e.prototype,t),r&&v(e,r),Object.defineProperty(e,"prototype",{writable:!1}),e}function m(e,t,r){return(t=c(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function b(e,t){return w(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i,a,u=[],s=!0,c=!1;try{if(i=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;s=!1}else for(;!(s=(n=i.call(r)).done)&&(u.push(n.value),u.length!==t);s=!0);}catch(e){c=!0,o=e}finally{try{if(!s&&null!=r.return&&(a=r.return(),Object(a)!==a))return}finally{if(c)throw o}}return u}}(e,t)||O(e,t)||x()}function g(e){return function(e){if(Array.isArray(e))return S(e)}(e)||E(e)||O(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function w(e){if(Array.isArray(e))return e}function E(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function O(e,t){if(e){if("string"==typeof e)return S(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?S(e,t):void 0}}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function x(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function R(e,t){return function(){return e.apply(t,arguments)}}e.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},e.prototype.next=function(e){return this._invoke("next",e)},e.prototype.throw=function(e){return this._invoke("throw",e)},e.prototype.return=function(e){return this._invoke("return",e)};var T,k=Object.prototype.toString,A=Object.getPrototypeOf,j=(T=Object.create(null),function(e){var t=k.call(e);return T[t]||(T[t]=t.slice(8,-1).toLowerCase())}),P=function(e){return e=e.toLowerCase(),function(t){return j(t)===e}},L=function(e){return function(t){return f(t)===e}},N=Array.isArray,_=L("undefined");var C=P("ArrayBuffer");var F=L("string"),U=L("function"),B=L("number"),D=function(e){return null!==e&&"object"===f(e)},I=function(e){if("object"!==j(e))return!1;var t=A(e);return!(null!==t&&t!==Object.prototype&&null!==Object.getPrototypeOf(t)||Symbol.toStringTag in e||Symbol.iterator in e)},q=P("Date"),M=P("File"),z=P("Blob"),H=P("FileList"),J=P("URLSearchParams"),W=b(["ReadableStream","Request","Response","Headers"].map(P),4),G=W[0],K=W[1],V=W[2],X=W[3];function $(e,t){var r,n,o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=o.allOwnKeys,a=void 0!==i&&i;if(null!=e)if("object"!==f(e)&&(e=[e]),N(e))for(r=0,n=e.length;r<n;r++)t.call(null,e[r],r,e);else{var u,s=a?Object.getOwnPropertyNames(e):Object.keys(e),c=s.length;for(r=0;r<c;r++)u=s[r],t.call(null,e[u],u,e)}}function Y(e,t){t=t.toLowerCase();for(var r,n=Object.keys(e),o=n.length;o-- >0;)if(t===(r=n[o]).toLowerCase())return r;return null}var Q="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:"undefined"!=typeof window?window:global,Z=function(e){return!_(e)&&e!==Q};var ee,te=(ee="undefined"!=typeof Uint8Array&&A(Uint8Array),function(e){return ee&&e instanceof ee}),re=P("HTMLFormElement"),ne=function(e){var t=Object.prototype.hasOwnProperty;return function(e,r){return t.call(e,r)}}(),oe=P("RegExp"),ie=function(e,t){var r=Object.getOwnPropertyDescriptors(e),n={};$(r,(function(r,o){var i;!1!==(i=t(r,o,e))&&(n[o]=i||r)})),Object.defineProperties(e,n)},ae="abcdefghijklmnopqrstuvwxyz",ue="0123456789",se={DIGIT:ue,ALPHA:ae,ALPHA_DIGIT:ae+ae.toUpperCase()+ue};var ce,fe,le,he,pe=P("AsyncFunction"),de=(ce="function"==typeof setImmediate,fe=U(Q.postMessage),ce?setImmediate:fe?(le="axios@".concat(Math.random()),he=[],Q.addEventListener("message",(function(e){var t=e.source,r=e.data;t===Q&&r===le&&he.length&&he.shift()()}),!1),function(e){he.push(e),Q.postMessage(le,"*")}):function(e){return setTimeout(e)}),ve="undefined"!=typeof queueMicrotask?queueMicrotask.bind(Q):"undefined"!=typeof process&&process.nextTick||de,ye={isArray:N,isArrayBuffer:C,isBuffer:function(e){return null!==e&&!_(e)&&null!==e.constructor&&!_(e.constructor)&&U(e.constructor.isBuffer)&&e.constructor.isBuffer(e)},isFormData:function(e){var t;return e&&("function"==typeof FormData&&e instanceof FormData||U(e.append)&&("formdata"===(t=j(e))||"object"===t&&U(e.toString)&&"[object FormData]"===e.toString()))},isArrayBufferView:function(e){return"undefined"!=typeof ArrayBuffer&&ArrayBuffer.isView?ArrayBuffer.isView(e):e&&e.buffer&&C(e.buffer)},isString:F,isNumber:B,isBoolean:function(e){return!0===e||!1===e},isObject:D,isPlainObject:I,isReadableStream:G,isRequest:K,isResponse:V,isHeaders:X,isUndefined:_,isDate:q,isFile:M,isBlob:z,isRegExp:oe,isFunction:U,isStream:function(e){return D(e)&&U(e.pipe)},isURLSearchParams:J,isTypedArray:te,isFileList:H,forEach:$,merge:function e(){for(var t=Z(this)&&this||{},r=t.caseless,n={},o=function(t,o){var i=r&&Y(n,o)||o;I(n[i])&&I(t)?n[i]=e(n[i],t):I(t)?n[i]=e({},t):N(t)?n[i]=t.slice():n[i]=t},i=0,a=arguments.length;i<a;i++)arguments[i]&&$(arguments[i],o);return n},extend:function(e,t,r){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=n.allOwnKeys;return $(t,(function(t,n){r&&U(t)?e[n]=R(t,r):e[n]=t}),{allOwnKeys:o}),e},trim:function(e){return e.trim?e.trim():e.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,"")},stripBOM:function(e){return 65279===e.charCodeAt(0)&&(e=e.slice(1)),e},inherits:function(e,t,r,n){e.prototype=Object.create(t.prototype,n),e.prototype.constructor=e,Object.defineProperty(e,"super",{value:t.prototype}),r&&Object.assign(e.prototype,r)},toFlatObject:function(e,t,r,n){var o,i,a,u={};if(t=t||{},null==e)return t;do{for(i=(o=Object.getOwnPropertyNames(e)).length;i-- >0;)a=o[i],n&&!n(a,e,t)||u[a]||(t[a]=e[a],u[a]=!0);e=!1!==r&&A(e)}while(e&&(!r||r(e,t))&&e!==Object.prototype);return t},kindOf:j,kindOfTest:P,endsWith:function(e,t,r){e=String(e),(void 0===r||r>e.length)&&(r=e.length),r-=t.length;var n=e.indexOf(t,r);return-1!==n&&n===r},toArray:function(e){if(!e)return null;if(N(e))return e;var t=e.length;if(!B(t))return null;for(var r=new Array(t);t-- >0;)r[t]=e[t];return r},forEachEntry:function(e,t){for(var r,n=(e&&e[Symbol.iterator]).call(e);(r=n.next())&&!r.done;){var o=r.value;t.call(e,o[0],o[1])}},matchAll:function(e,t){for(var r,n=[];null!==(r=e.exec(t));)n.push(r);return n},isHTMLForm:re,hasOwnProperty:ne,hasOwnProp:ne,reduceDescriptors:ie,freezeMethods:function(e){ie(e,(function(t,r){if(U(e)&&-1!==["arguments","caller","callee"].indexOf(r))return!1;var n=e[r];U(n)&&(t.enumerable=!1,"writable"in t?t.writable=!1:t.set||(t.set=function(){throw Error("Can not rewrite read-only method '"+r+"'")}))}))},toObjectSet:function(e,t){var r={},n=function(e){e.forEach((function(e){r[e]=!0}))};return N(e)?n(e):n(String(e).split(t)),r},toCamelCase:function(e){return e.toLowerCase().replace(/[-_\s]([a-z\d])(\w*)/g,(function(e,t,r){return t.toUpperCase()+r}))},noop:function(){},toFiniteNumber:function(e,t){return null!=e&&Number.isFinite(e=+e)?e:t},findKey:Y,global:Q,isContextDefined:Z,ALPHABET:se,generateString:function(){for(var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:16,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:se.ALPHA_DIGIT,r="",n=t.length;e--;)r+=t[Math.random()*n|0];return r},isSpecCompliantForm:function(e){return!!(e&&U(e.append)&&"FormData"===e[Symbol.toStringTag]&&e[Symbol.iterator])},toJSONObject:function(e){var t=new Array(10);return function e(r,n){if(D(r)){if(t.indexOf(r)>=0)return;if(!("toJSON"in r)){t[n]=r;var o=N(r)?[]:{};return $(r,(function(t,r){var i=e(t,n+1);!_(i)&&(o[r]=i)})),t[n]=void 0,o}}return r}(e,0)},isAsyncFn:pe,isThenable:function(e){return e&&(D(e)||U(e))&&U(e.then)&&U(e.catch)},setImmediate:de,asap:ve};function me(e,t,r,n,o){Error.call(this),Error.captureStackTrace?Error.captureStackTrace(this,this.constructor):this.stack=(new Error).stack,this.message=e,this.name="AxiosError",t&&(this.code=t),r&&(this.config=r),n&&(this.request=n),o&&(this.response=o,this.status=o.status?o.status:null)}ye.inherits(me,Error,{toJSON:function(){return{message:this.message,name:this.name,description:this.description,number:this.number,fileName:this.fileName,lineNumber:this.lineNumber,columnNumber:this.columnNumber,stack:this.stack,config:ye.toJSONObject(this.config),code:this.code,status:this.status}}});var be=me.prototype,ge={};["ERR_BAD_OPTION_VALUE","ERR_BAD_OPTION","ECONNABORTED","ETIMEDOUT","ERR_NETWORK","ERR_FR_TOO_MANY_REDIRECTS","ERR_DEPRECATED","ERR_BAD_RESPONSE","ERR_BAD_REQUEST","ERR_CANCELED","ERR_NOT_SUPPORT","ERR_INVALID_URL"].forEach((function(e){ge[e]={value:e}})),Object.defineProperties(me,ge),Object.defineProperty(be,"isAxiosError",{value:!0}),me.from=function(e,t,r,n,o,i){var a=Object.create(be);return ye.toFlatObject(e,a,(function(e){return e!==Error.prototype}),(function(e){return"isAxiosError"!==e})),me.call(a,e.message,t,r,n,o),a.cause=e,a.name=e.name,i&&Object.assign(a,i),a};function we(e){return ye.isPlainObject(e)||ye.isArray(e)}function Ee(e){return ye.endsWith(e,"[]")?e.slice(0,-2):e}function Oe(e,t,r){return e?e.concat(t).map((function(e,t){return e=Ee(e),!r&&t?"["+e+"]":e})).join(r?".":""):t}var Se=ye.toFlatObject(ye,{},null,(function(e){return/^is[A-Z]/.test(e)}));function xe(e,t,r){if(!ye.isObject(e))throw new TypeError("target must be an object");t=t||new FormData;var n=(r=ye.toFlatObject(r,{metaTokens:!0,dots:!1,indexes:!1},!1,(function(e,t){return!ye.isUndefined(t[e])}))).metaTokens,o=r.visitor||c,i=r.dots,a=r.indexes,u=(r.Blob||"undefined"!=typeof Blob&&Blob)&&ye.isSpecCompliantForm(t);if(!ye.isFunction(o))throw new TypeError("visitor must be a function");function s(e){if(null===e)return"";if(ye.isDate(e))return e.toISOString();if(!u&&ye.isBlob(e))throw new me("Blob is not supported. Use a Buffer instead.");return ye.isArrayBuffer(e)||ye.isTypedArray(e)?u&&"function"==typeof Blob?new Blob([e]):Buffer.from(e):e}function c(e,r,o){var u=e;if(e&&!o&&"object"===f(e))if(ye.endsWith(r,"{}"))r=n?r:r.slice(0,-2),e=JSON.stringify(e);else if(ye.isArray(e)&&function(e){return ye.isArray(e)&&!e.some(we)}(e)||(ye.isFileList(e)||ye.endsWith(r,"[]"))&&(u=ye.toArray(e)))return r=Ee(r),u.forEach((function(e,n){!ye.isUndefined(e)&&null!==e&&t.append(!0===a?Oe([r],n,i):null===a?r:r+"[]",s(e))})),!1;return!!we(e)||(t.append(Oe(o,r,i),s(e)),!1)}var l=[],h=Object.assign(Se,{defaultVisitor:c,convertValue:s,isVisitable:we});if(!ye.isObject(e))throw new TypeError("data must be an object");return function e(r,n){if(!ye.isUndefined(r)){if(-1!==l.indexOf(r))throw Error("Circular reference detected in "+n.join("."));l.push(r),ye.forEach(r,(function(r,i){!0===(!(ye.isUndefined(r)||null===r)&&o.call(t,r,ye.isString(i)?i.trim():i,n,h))&&e(r,n?n.concat(i):[i])})),l.pop()}}(e),t}function Re(e){var t={"!":"%21","'":"%27","(":"%28",")":"%29","~":"%7E","%20":"+","%00":"\0"};return encodeURIComponent(e).replace(/[!'()~]|%20|%00/g,(function(e){return t[e]}))}function Te(e,t){this._pairs=[],e&&xe(e,this,t)}var ke=Te.prototype;function Ae(e){return encodeURIComponent(e).replace(/%3A/gi,":").replace(/%24/g,"$").replace(/%2C/gi,",").replace(/%20/g,"+").replace(/%5B/gi,"[").replace(/%5D/gi,"]")}function je(e,t,r){if(!t)return e;var n,o=r&&r.encode||Ae,i=r&&r.serialize;if(n=i?i(t,r):ye.isURLSearchParams(t)?t.toString():new Te(t,r).toString(o)){var a=e.indexOf("#");-1!==a&&(e=e.slice(0,a)),e+=(-1===e.indexOf("?")?"?":"&")+n}return e}ke.append=function(e,t){this._pairs.push([e,t])},ke.toString=function(e){var t=e?function(t){return e.call(this,t,Re)}:Re;return this._pairs.map((function(e){return t(e[0])+"="+t(e[1])}),"").join("&")};var Pe=function(){function e(){d(this,e),this.handlers=[]}return y(e,[{key:"use",value:function(e,t,r){return this.handlers.push({fulfilled:e,rejected:t,synchronous:!!r&&r.synchronous,runWhen:r?r.runWhen:null}),this.handlers.length-1}},{key:"eject",value:function(e){this.handlers[e]&&(this.handlers[e]=null)}},{key:"clear",value:function(){this.handlers&&(this.handlers=[])}},{key:"forEach",value:function(e){ye.forEach(this.handlers,(function(t){null!==t&&e(t)}))}}]),e}(),Le={silentJSONParsing:!0,forcedJSONParsing:!0,clarifyTimeoutError:!1},Ne={isBrowser:!0,classes:{URLSearchParams:"undefined"!=typeof URLSearchParams?URLSearchParams:Te,FormData:"undefined"!=typeof FormData?FormData:null,Blob:"undefined"!=typeof Blob?Blob:null},protocols:["http","https","file","blob","url","data"]},_e="undefined"!=typeof window&&"undefined"!=typeof document,Ce="object"===("undefined"==typeof navigator?"undefined":f(navigator))&&navigator||void 0,Fe=_e&&(!Ce||["ReactNative","NativeScript","NS"].indexOf(Ce.product)<0),Ue="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope&&"function"==typeof self.importScripts,Be=_e&&window.location.href||"http://localhost",De=u(u({},Object.freeze({__proto__:null,hasBrowserEnv:_e,hasStandardBrowserWebWorkerEnv:Ue,hasStandardBrowserEnv:Fe,navigator:Ce,origin:Be})),Ne);function Ie(e){function t(e,r,n,o){var i=e[o++];if("__proto__"===i)return!0;var a=Number.isFinite(+i),u=o>=e.length;return i=!i&&ye.isArray(n)?n.length:i,u?(ye.hasOwnProp(n,i)?n[i]=[n[i],r]:n[i]=r,!a):(n[i]&&ye.isObject(n[i])||(n[i]=[]),t(e,r,n[i],o)&&ye.isArray(n[i])&&(n[i]=function(e){var t,r,n={},o=Object.keys(e),i=o.length;for(t=0;t<i;t++)n[r=o[t]]=e[r];return n}(n[i])),!a)}if(ye.isFormData(e)&&ye.isFunction(e.entries)){var r={};return ye.forEachEntry(e,(function(e,n){t(function(e){return ye.matchAll(/\w+|\[(\w*)]/g,e).map((function(e){return"[]"===e[0]?"":e[1]||e[0]}))}(e),n,r,0)})),r}return null}var qe={transitional:Le,adapter:["xhr","http","fetch"],transformRequest:[function(e,t){var r,n=t.getContentType()||"",o=n.indexOf("application/json")>-1,i=ye.isObject(e);if(i&&ye.isHTMLForm(e)&&(e=new FormData(e)),ye.isFormData(e))return o?JSON.stringify(Ie(e)):e;if(ye.isArrayBuffer(e)||ye.isBuffer(e)||ye.isStream(e)||ye.isFile(e)||ye.isBlob(e)||ye.isReadableStream(e))return e;if(ye.isArrayBufferView(e))return e.buffer;if(ye.isURLSearchParams(e))return t.setContentType("application/x-www-form-urlencoded;charset=utf-8",!1),e.toString();if(i){if(n.indexOf("application/x-www-form-urlencoded")>-1)return function(e,t){return xe(e,new De.classes.URLSearchParams,Object.assign({visitor:function(e,t,r,n){return De.isNode&&ye.isBuffer(e)?(this.append(t,e.toString("base64")),!1):n.defaultVisitor.apply(this,arguments)}},t))}(e,this.formSerializer).toString();if((r=ye.isFileList(e))||n.indexOf("multipart/form-data")>-1){var a=this.env&&this.env.FormData;return xe(r?{"files[]":e}:e,a&&new a,this.formSerializer)}}return i||o?(t.setContentType("application/json",!1),function(e,t,r){if(ye.isString(e))try{return(t||JSON.parse)(e),ye.trim(e)}catch(e){if("SyntaxError"!==e.name)throw e}return(r||JSON.stringify)(e)}(e)):e}],transformResponse:[function(e){var t=this.transitional||qe.transitional,r=t&&t.forcedJSONParsing,n="json"===this.responseType;if(ye.isResponse(e)||ye.isReadableStream(e))return e;if(e&&ye.isString(e)&&(r&&!this.responseType||n)){var o=!(t&&t.silentJSONParsing)&&n;try{return JSON.parse(e)}catch(e){if(o){if("SyntaxError"===e.name)throw me.from(e,me.ERR_BAD_RESPONSE,this,null,this.response);throw e}}}return e}],timeout:0,xsrfCookieName:"XSRF-TOKEN",xsrfHeaderName:"X-XSRF-TOKEN",maxContentLength:-1,maxBodyLength:-1,env:{FormData:De.classes.FormData,Blob:De.classes.Blob},validateStatus:function(e){return e>=200&&e<300},headers:{common:{Accept:"application/json, text/plain, */*","Content-Type":void 0}}};ye.forEach(["delete","get","head","post","put","patch"],(function(e){qe.headers[e]={}}));var Me=qe,ze=ye.toObjectSet(["age","authorization","content-length","content-type","etag","expires","from","host","if-modified-since","if-unmodified-since","last-modified","location","max-forwards","proxy-authorization","referer","retry-after","user-agent"]),He=Symbol("internals");function Je(e){return e&&String(e).trim().toLowerCase()}function We(e){return!1===e||null==e?e:ye.isArray(e)?e.map(We):String(e)}function Ge(e,t,r,n,o){return ye.isFunction(n)?n.call(this,t,r):(o&&(t=r),ye.isString(t)?ye.isString(n)?-1!==t.indexOf(n):ye.isRegExp(n)?n.test(t):void 0:void 0)}var Ke=function(e,t){function r(e){d(this,r),e&&this.set(e)}return y(r,[{key:"set",value:function(e,t,r){var n=this;function o(e,t,r){var o=Je(t);if(!o)throw new Error("header name must be a non-empty string");var i=ye.findKey(n,o);(!i||void 0===n[i]||!0===r||void 0===r&&!1!==n[i])&&(n[i||t]=We(e))}var i=function(e,t){return ye.forEach(e,(function(e,r){return o(e,r,t)}))};if(ye.isPlainObject(e)||e instanceof this.constructor)i(e,t);else if(ye.isString(e)&&(e=e.trim())&&!/^[-_a-zA-Z0-9^`|~,!#$%&'*+.]+$/.test(e.trim()))i(function(e){var t,r,n,o={};return e&&e.split("\n").forEach((function(e){n=e.indexOf(":"),t=e.substring(0,n).trim().toLowerCase(),r=e.substring(n+1).trim(),!t||o[t]&&ze[t]||("set-cookie"===t?o[t]?o[t].push(r):o[t]=[r]:o[t]=o[t]?o[t]+", "+r:r)})),o}(e),t);else if(ye.isHeaders(e)){var a,u=function(e,t){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!r){if(Array.isArray(e)||(r=O(e))||t&&e&&"number"==typeof e.length){r&&(e=r);var n=0,o=function(){};return{s:o,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var i,a=!0,u=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return a=e.done,e},e:function(e){u=!0,i=e},f:function(){try{a||null==r.return||r.return()}finally{if(u)throw i}}}}(e.entries());try{for(u.s();!(a=u.n()).done;){var s=b(a.value,2),c=s[0];o(s[1],c,r)}}catch(e){u.e(e)}finally{u.f()}}else null!=e&&o(t,e,r);return this}},{key:"get",value:function(e,t){if(e=Je(e)){var r=ye.findKey(this,e);if(r){var n=this[r];if(!t)return n;if(!0===t)return function(e){for(var t,r=Object.create(null),n=/([^\s,;=]+)\s*(?:=\s*([^,;]+))?/g;t=n.exec(e);)r[t[1]]=t[2];return r}(n);if(ye.isFunction(t))return t.call(this,n,r);if(ye.isRegExp(t))return t.exec(n);throw new TypeError("parser must be boolean|regexp|function")}}}},{key:"has",value:function(e,t){if(e=Je(e)){var r=ye.findKey(this,e);return!(!r||void 0===this[r]||t&&!Ge(0,this[r],r,t))}return!1}},{key:"delete",value:function(e,t){var r=this,n=!1;function o(e){if(e=Je(e)){var o=ye.findKey(r,e);!o||t&&!Ge(0,r[o],o,t)||(delete r[o],n=!0)}}return ye.isArray(e)?e.forEach(o):o(e),n}},{key:"clear",value:function(e){for(var t=Object.keys(this),r=t.length,n=!1;r--;){var o=t[r];e&&!Ge(0,this[o],o,e,!0)||(delete this[o],n=!0)}return n}},{key:"normalize",value:function(e){var t=this,r={};return ye.forEach(this,(function(n,o){var i=ye.findKey(r,o);if(i)return t[i]=We(n),void delete t[o];var a=e?function(e){return e.trim().toLowerCase().replace(/([a-z\d])(\w*)/g,(function(e,t,r){return t.toUpperCase()+r}))}(o):String(o).trim();a!==o&&delete t[o],t[a]=We(n),r[a]=!0})),this}},{key:"concat",value:function(){for(var e,t=arguments.length,r=new Array(t),n=0;n<t;n++)r[n]=arguments[n];return(e=this.constructor).concat.apply(e,[this].concat(r))}},{key:"toJSON",value:function(e){var t=Object.create(null);return ye.forEach(this,(function(r,n){null!=r&&!1!==r&&(t[n]=e&&ye.isArray(r)?r.join(", "):r)})),t}},{key:Symbol.iterator,value:function(){return Object.entries(this.toJSON())[Symbol.iterator]()}},{key:"toString",value:function(){return Object.entries(this.toJSON()).map((function(e){var t=b(e,2);return t[0]+": "+t[1]})).join("\n")}},{key:Symbol.toStringTag,get:function(){return"AxiosHeaders"}}],[{key:"from",value:function(e){return e instanceof this?e:new this(e)}},{key:"concat",value:function(e){for(var t=new this(e),r=arguments.length,n=new Array(r>1?r-1:0),o=1;o<r;o++)n[o-1]=arguments[o];return n.forEach((function(e){return t.set(e)})),t}},{key:"accessor",value:function(e){var t=(this[He]=this[He]={accessors:{}}).accessors,r=this.prototype;function n(e){var n=Je(e);t[n]||(!function(e,t){var r=ye.toCamelCase(" "+t);["get","set","has"].forEach((function(n){Object.defineProperty(e,n+r,{value:function(e,r,o){return this[n].call(this,t,e,r,o)},configurable:!0})}))}(r,e),t[n]=!0)}return ye.isArray(e)?e.forEach(n):n(e),this}}]),r}();Ke.accessor(["Content-Type","Content-Length","Accept","Accept-Encoding","User-Agent","Authorization"]),ye.reduceDescriptors(Ke.prototype,(function(e,t){var r=e.value,n=t[0].toUpperCase()+t.slice(1);return{get:function(){return r},set:function(e){this[n]=e}}})),ye.freezeMethods(Ke);var Ve=Ke;function Xe(e,t){var r=this||Me,n=t||r,o=Ve.from(n.headers),i=n.data;return ye.forEach(e,(function(e){i=e.call(r,i,o.normalize(),t?t.status:void 0)})),o.normalize(),i}function $e(e){return!(!e||!e.__CANCEL__)}function Ye(e,t,r){me.call(this,null==e?"canceled":e,me.ERR_CANCELED,t,r),this.name="CanceledError"}function Qe(e,t,r){var n=r.config.validateStatus;r.status&&n&&!n(r.status)?t(new me("Request failed with status code "+r.status,[me.ERR_BAD_REQUEST,me.ERR_BAD_RESPONSE][Math.floor(r.status/100)-4],r.config,r.request,r)):e(r)}function Ze(e,t){e=e||10;var r,n=new Array(e),o=new Array(e),i=0,a=0;return t=void 0!==t?t:1e3,function(u){var s=Date.now(),c=o[a];r||(r=s),n[i]=u,o[i]=s;for(var f=a,l=0;f!==i;)l+=n[f++],f%=e;if((i=(i+1)%e)===a&&(a=(a+1)%e),!(s-r<t)){var h=c&&s-c;return h?Math.round(1e3*l/h):void 0}}}function et(e,t){var r,n,o=0,i=1e3/t,a=function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:Date.now();o=i,r=null,n&&(clearTimeout(n),n=null),e.apply(null,t)};return[function(){for(var e=Date.now(),t=e-o,u=arguments.length,s=new Array(u),c=0;c<u;c++)s[c]=arguments[c];t>=i?a(s,e):(r=s,n||(n=setTimeout((function(){n=null,a(r)}),i-t)))},function(){return r&&a(r)}]}ye.inherits(Ye,me,{__CANCEL__:!0});var tt=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:3,n=0,o=Ze(50,250);return et((function(r){var i=r.loaded,a=r.lengthComputable?r.total:void 0,u=i-n,s=o(u);n=i;var c=m({loaded:i,total:a,progress:a?i/a:void 0,bytes:u,rate:s||void 0,estimated:s&&a&&i<=a?(a-i)/s:void 0,event:r,lengthComputable:null!=a},t?"download":"upload",!0);e(c)}),r)},rt=function(e,t){var r=null!=e;return[function(n){return t[0]({lengthComputable:r,total:e,loaded:n})},t[1]]},nt=function(e){return function(){for(var t=arguments.length,r=new Array(t),n=0;n<t;n++)r[n]=arguments[n];return ye.asap((function(){return e.apply(void 0,r)}))}},ot=De.hasStandardBrowserEnv?function(){var e,t=De.navigator&&/(msie|trident)/i.test(De.navigator.userAgent),r=document.createElement("a");function n(e){var n=e;return t&&(r.setAttribute("href",n),n=r.href),r.setAttribute("href",n),{href:r.href,protocol:r.protocol?r.protocol.replace(/:$/,""):"",host:r.host,search:r.search?r.search.replace(/^\?/,""):"",hash:r.hash?r.hash.replace(/^#/,""):"",hostname:r.hostname,port:r.port,pathname:"/"===r.pathname.charAt(0)?r.pathname:"/"+r.pathname}}return e=n(window.location.href),function(t){var r=ye.isString(t)?n(t):t;return r.protocol===e.protocol&&r.host===e.host}}():function(){return!0},it=De.hasStandardBrowserEnv?{write:function(e,t,r,n,o,i){var a=[e+"="+encodeURIComponent(t)];ye.isNumber(r)&&a.push("expires="+new Date(r).toGMTString()),ye.isString(n)&&a.push("path="+n),ye.isString(o)&&a.push("domain="+o),!0===i&&a.push("secure"),document.cookie=a.join("; ")},read:function(e){var t=document.cookie.match(new RegExp("(^|;\\s*)("+e+")=([^;]*)"));return t?decodeURIComponent(t[3]):null},remove:function(e){this.write(e,"",Date.now()-864e5)}}:{write:function(){},read:function(){return null},remove:function(){}};function at(e,t){return e&&!/^([a-z][a-z\d+\-.]*:)?\/\//i.test(t)?function(e,t){return t?e.replace(/\/?\/$/,"")+"/"+t.replace(/^\/+/,""):e}(e,t):t}var ut=function(e){return e instanceof Ve?u({},e):e};function st(e,t){t=t||{};var r={};function n(e,t,r){return ye.isPlainObject(e)&&ye.isPlainObject(t)?ye.merge.call({caseless:r},e,t):ye.isPlainObject(t)?ye.merge({},t):ye.isArray(t)?t.slice():t}function o(e,t,r){return ye.isUndefined(t)?ye.isUndefined(e)?void 0:n(void 0,e,r):n(e,t,r)}function i(e,t){if(!ye.isUndefined(t))return n(void 0,t)}function a(e,t){return ye.isUndefined(t)?ye.isUndefined(e)?void 0:n(void 0,e):n(void 0,t)}function u(r,o,i){return i in t?n(r,o):i in e?n(void 0,r):void 0}var s={url:i,method:i,data:i,baseURL:a,transformRequest:a,transformResponse:a,paramsSerializer:a,timeout:a,timeoutMessage:a,withCredentials:a,withXSRFToken:a,adapter:a,responseType:a,xsrfCookieName:a,xsrfHeaderName:a,onUploadProgress:a,onDownloadProgress:a,decompress:a,maxContentLength:a,maxBodyLength:a,beforeRedirect:a,transport:a,httpAgent:a,httpsAgent:a,cancelToken:a,socketPath:a,responseEncoding:a,validateStatus:u,headers:function(e,t){return o(ut(e),ut(t),!0)}};return ye.forEach(Object.keys(Object.assign({},e,t)),(function(n){var i=s[n]||o,a=i(e[n],t[n],n);ye.isUndefined(a)&&i!==u||(r[n]=a)})),r}var ct,ft,lt=function(e){var t,r,n=st({},e),o=n.data,i=n.withXSRFToken,a=n.xsrfHeaderName,u=n.xsrfCookieName,s=n.headers,c=n.auth;if(n.headers=s=Ve.from(s),n.url=je(at(n.baseURL,n.url),e.params,e.paramsSerializer),c&&s.set("Authorization","Basic "+btoa((c.username||"")+":"+(c.password?unescape(encodeURIComponent(c.password)):""))),ye.isFormData(o))if(De.hasStandardBrowserEnv||De.hasStandardBrowserWebWorkerEnv)s.setContentType(void 0);else if(!1!==(t=s.getContentType())){var f=t?t.split(";").map((function(e){return e.trim()})).filter(Boolean):[],l=w(r=f)||E(r)||O(r)||x(),h=l[0],p=l.slice(1);s.setContentType([h||"multipart/form-data"].concat(g(p)).join("; "))}if(De.hasStandardBrowserEnv&&(i&&ye.isFunction(i)&&(i=i(n)),i||!1!==i&&ot(n.url))){var d=a&&u&&it.read(u);d&&s.set(a,d)}return n},ht="undefined"!=typeof XMLHttpRequest&&function(e){return new Promise((function(t,r){var n,o,i,a,u,s=lt(e),c=s.data,f=Ve.from(s.headers).normalize(),l=s.responseType,h=s.onUploadProgress,p=s.onDownloadProgress;function d(){a&&a(),u&&u(),s.cancelToken&&s.cancelToken.unsubscribe(n),s.signal&&s.signal.removeEventListener("abort",n)}var v=new XMLHttpRequest;function y(){if(v){var n=Ve.from("getAllResponseHeaders"in v&&v.getAllResponseHeaders());Qe((function(e){t(e),d()}),(function(e){r(e),d()}),{data:l&&"text"!==l&&"json"!==l?v.response:v.responseText,status:v.status,statusText:v.statusText,headers:n,config:e,request:v}),v=null}}if(v.open(s.method.toUpperCase(),s.url,!0),v.timeout=s.timeout,"onloadend"in v?v.onloadend=y:v.onreadystatechange=function(){v&&4===v.readyState&&(0!==v.status||v.responseURL&&0===v.responseURL.indexOf("file:"))&&setTimeout(y)},v.onabort=function(){v&&(r(new me("Request aborted",me.ECONNABORTED,e,v)),v=null)},v.onerror=function(){r(new me("Network Error",me.ERR_NETWORK,e,v)),v=null},v.ontimeout=function(){var t=s.timeout?"timeout of "+s.timeout+"ms exceeded":"timeout exceeded",n=s.transitional||Le;s.timeoutErrorMessage&&(t=s.timeoutErrorMessage),r(new me(t,n.clarifyTimeoutError?me.ETIMEDOUT:me.ECONNABORTED,e,v)),v=null},void 0===c&&f.setContentType(null),"setRequestHeader"in v&&ye.forEach(f.toJSON(),(function(e,t){v.setRequestHeader(t,e)})),ye.isUndefined(s.withCredentials)||(v.withCredentials=!!s.withCredentials),l&&"json"!==l&&(v.responseType=s.responseType),p){var m=b(tt(p,!0),2);i=m[0],u=m[1],v.addEventListener("progress",i)}if(h&&v.upload){var g=b(tt(h),2);o=g[0],a=g[1],v.upload.addEventListener("progress",o),v.upload.addEventListener("loadend",a)}(s.cancelToken||s.signal)&&(n=function(t){v&&(r(!t||t.type?new Ye(null,e,v):t),v.abort(),v=null)},s.cancelToken&&s.cancelToken.subscribe(n),s.signal&&(s.signal.aborted?n():s.signal.addEventListener("abort",n)));var w,E,O=(w=s.url,(E=/^([-+\w]{1,25})(:?\/\/|:)/.exec(w))&&E[1]||"");O&&-1===De.protocols.indexOf(O)?r(new me("Unsupported protocol "+O+":",me.ERR_BAD_REQUEST,e)):v.send(c||null)}))},pt=function(e,t){var r=(e=e?e.filter(Boolean):[]).length;if(t||r){var n,o=new AbortController,i=function(e){if(!n){n=!0,u();var t=e instanceof Error?e:this.reason;o.abort(t instanceof me?t:new Ye(t instanceof Error?t.message:t))}},a=t&&setTimeout((function(){a=null,i(new me("timeout ".concat(t," of ms exceeded"),me.ETIMEDOUT))}),t),u=function(){e&&(a&&clearTimeout(a),a=null,e.forEach((function(e){e.unsubscribe?e.unsubscribe(i):e.removeEventListener("abort",i)})),e=null)};e.forEach((function(e){return e.addEventListener("abort",i)}));var s=o.signal;return s.unsubscribe=function(){return ye.asap(u)},s}},dt=s().mark((function e(t,r){var n,o,i;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(n=t.byteLength,r&&!(n<r)){e.next=5;break}return e.next=4,t;case 4:return e.abrupt("return");case 5:o=0;case 6:if(!(o<n)){e.next=13;break}return i=o+r,e.next=10,t.slice(o,i);case 10:o=i,e.next=6;break;case 13:case"end":return e.stop()}}),e)})),vt=function(){var e=l(s().mark((function e(t,o){var a,u,c,f,l,h;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:a=!1,u=!1,e.prev=2,f=n(yt(t));case 4:return e.next=6,i(f.next());case 6:if(!(a=!(l=e.sent).done)){e.next=12;break}return h=l.value,e.delegateYield(r(n(dt(h,o))),"t0",9);case 9:a=!1,e.next=4;break;case 12:e.next=18;break;case 14:e.prev=14,e.t1=e.catch(2),u=!0,c=e.t1;case 18:if(e.prev=18,e.prev=19,!a||null==f.return){e.next=23;break}return e.next=23,i(f.return());case 23:if(e.prev=23,!u){e.next=26;break}throw c;case 26:return e.finish(23);case 27:return e.finish(18);case 28:case"end":return e.stop()}}),e,null,[[2,14,18,28],[19,,23,27]])})));return function(t,r){return e.apply(this,arguments)}}(),yt=function(){var e=l(s().mark((function e(t){var o,a,u,c;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(!t[Symbol.asyncIterator]){e.next=3;break}return e.delegateYield(r(n(t)),"t0",2);case 2:return e.abrupt("return");case 3:o=t.getReader(),e.prev=4;case 5:return e.next=7,i(o.read());case 7:if(a=e.sent,u=a.done,c=a.value,!u){e.next=12;break}return e.abrupt("break",16);case 12:return e.next=14,c;case 14:e.next=5;break;case 16:return e.prev=16,e.next=19,i(o.cancel());case 19:return e.finish(16);case 20:case"end":return e.stop()}}),e,null,[[4,,16,20]])})));return function(t){return e.apply(this,arguments)}}(),mt=function(e,t,r,n){var o,i=vt(e,t),a=0,u=function(e){o||(o=!0,n&&n(e))};return new ReadableStream({pull:function(e){return p(s().mark((function t(){var n,o,c,f,l;return s().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.prev=0,t.next=3,i.next();case 3:if(n=t.sent,o=n.done,c=n.value,!o){t.next=10;break}return u(),e.close(),t.abrupt("return");case 10:f=c.byteLength,r&&(l=a+=f,r(l)),e.enqueue(new Uint8Array(c)),t.next=19;break;case 15:throw t.prev=15,t.t0=t.catch(0),u(t.t0),t.t0;case 19:case"end":return t.stop()}}),t,null,[[0,15]])})))()},cancel:function(e){return u(e),i.return()}},{highWaterMark:2})},bt="function"==typeof fetch&&"function"==typeof Request&&"function"==typeof Response,gt=bt&&"function"==typeof ReadableStream,wt=bt&&("function"==typeof TextEncoder?(ct=new TextEncoder,function(e){return ct.encode(e)}):function(){var e=p(s().mark((function e(t){return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.t0=Uint8Array,e.next=3,new Response(t).arrayBuffer();case 3:return e.t1=e.sent,e.abrupt("return",new e.t0(e.t1));case 5:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}()),Et=function(e){try{for(var t=arguments.length,r=new Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return!!e.apply(void 0,r)}catch(e){return!1}},Ot=gt&&Et((function(){var e=!1,t=new Request(De.origin,{body:new ReadableStream,method:"POST",get duplex(){return e=!0,"half"}}).headers.has("Content-Type");return e&&!t})),St=gt&&Et((function(){return ye.isReadableStream(new Response("").body)})),xt={stream:St&&function(e){return e.body}};bt&&(ft=new Response,["text","arrayBuffer","blob","formData","stream"].forEach((function(e){!xt[e]&&(xt[e]=ye.isFunction(ft[e])?function(t){return t[e]()}:function(t,r){throw new me("Response type '".concat(e,"' is not supported"),me.ERR_NOT_SUPPORT,r)})})));var Rt=function(){var e=p(s().mark((function e(t){var r;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(null!=t){e.next=2;break}return e.abrupt("return",0);case 2:if(!ye.isBlob(t)){e.next=4;break}return e.abrupt("return",t.size);case 4:if(!ye.isSpecCompliantForm(t)){e.next=9;break}return r=new Request(De.origin,{method:"POST",body:t}),e.next=8,r.arrayBuffer();case 8:case 15:return e.abrupt("return",e.sent.byteLength);case 9:if(!ye.isArrayBufferView(t)&&!ye.isArrayBuffer(t)){e.next=11;break}return e.abrupt("return",t.byteLength);case 11:if(ye.isURLSearchParams(t)&&(t+=""),!ye.isString(t)){e.next=16;break}return e.next=15,wt(t);case 16:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}(),Tt=function(){var e=p(s().mark((function e(t,r){var n;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return n=ye.toFiniteNumber(t.getContentLength()),e.abrupt("return",null==n?Rt(r):n);case 2:case"end":return e.stop()}}),e)})));return function(t,r){return e.apply(this,arguments)}}(),kt=bt&&function(){var e=p(s().mark((function e(t){var r,n,o,i,a,c,f,l,h,p,d,v,y,m,g,w,E,O,S,x,R,T,k,A,j,P,L,N,_,C,F,U,B,D;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(r=lt(t),n=r.url,o=r.method,i=r.data,a=r.signal,c=r.cancelToken,f=r.timeout,l=r.onDownloadProgress,h=r.onUploadProgress,p=r.responseType,d=r.headers,v=r.withCredentials,y=void 0===v?"same-origin":v,m=r.fetchOptions,p=p?(p+"").toLowerCase():"text",g=pt([a,c&&c.toAbortSignal()],f),E=g&&g.unsubscribe&&function(){g.unsubscribe()},e.prev=4,e.t0=h&&Ot&&"get"!==o&&"head"!==o,!e.t0){e.next=11;break}return e.next=9,Tt(d,i);case 9:e.t1=O=e.sent,e.t0=0!==e.t1;case 11:if(!e.t0){e.next=15;break}S=new Request(n,{method:"POST",body:i,duplex:"half"}),ye.isFormData(i)&&(x=S.headers.get("content-type"))&&d.setContentType(x),S.body&&(R=rt(O,tt(nt(h))),T=b(R,2),k=T[0],A=T[1],i=mt(S.body,65536,k,A));case 15:return ye.isString(y)||(y=y?"include":"omit"),j="credentials"in Request.prototype,w=new Request(n,u(u({},m),{},{signal:g,method:o.toUpperCase(),headers:d.normalize().toJSON(),body:i,duplex:"half",credentials:j?y:void 0})),e.next=20,fetch(w);case 20:return P=e.sent,L=St&&("stream"===p||"response"===p),St&&(l||L&&E)&&(N={},["status","statusText","headers"].forEach((function(e){N[e]=P[e]})),_=ye.toFiniteNumber(P.headers.get("content-length")),C=l&&rt(_,tt(nt(l),!0))||[],F=b(C,2),U=F[0],B=F[1],P=new Response(mt(P.body,65536,U,(function(){B&&B(),E&&E()})),N)),p=p||"text",e.next=26,xt[ye.findKey(xt,p)||"text"](P,t);case 26:return D=e.sent,!L&&E&&E(),e.next=30,new Promise((function(e,r){Qe(e,r,{data:D,headers:Ve.from(P.headers),status:P.status,statusText:P.statusText,config:t,request:w})}));case 30:return e.abrupt("return",e.sent);case 33:if(e.prev=33,e.t2=e.catch(4),E&&E(),!e.t2||"TypeError"!==e.t2.name||!/fetch/i.test(e.t2.message)){e.next=38;break}throw Object.assign(new me("Network Error",me.ERR_NETWORK,t,w),{cause:e.t2.cause||e.t2});case 38:throw me.from(e.t2,e.t2&&e.t2.code,t,w);case 39:case"end":return e.stop()}}),e,null,[[4,33]])})));return function(t){return e.apply(this,arguments)}}(),At={http:null,xhr:ht,fetch:kt};ye.forEach(At,(function(e,t){if(e){try{Object.defineProperty(e,"name",{value:t})}catch(e){}Object.defineProperty(e,"adapterName",{value:t})}}));var jt=function(e){return"- ".concat(e)},Pt=function(e){return ye.isFunction(e)||null===e||!1===e},Lt=function(e){for(var t,r,n=(e=ye.isArray(e)?e:[e]).length,o={},i=0;i<n;i++){var a=void 0;if(r=t=e[i],!Pt(t)&&void 0===(r=At[(a=String(t)).toLowerCase()]))throw new me("Unknown adapter '".concat(a,"'"));if(r)break;o[a||"#"+i]=r}if(!r){var u=Object.entries(o).map((function(e){var t=b(e,2),r=t[0],n=t[1];return"adapter ".concat(r," ")+(!1===n?"is not supported by the environment":"is not available in the build")}));throw new me("There is no suitable adapter to dispatch the request "+(n?u.length>1?"since :\n"+u.map(jt).join("\n"):" "+jt(u[0]):"as no adapter specified"),"ERR_NOT_SUPPORT")}return r};function Nt(e){if(e.cancelToken&&e.cancelToken.throwIfRequested(),e.signal&&e.signal.aborted)throw new Ye(null,e)}function _t(e){return Nt(e),e.headers=Ve.from(e.headers),e.data=Xe.call(e,e.transformRequest),-1!==["post","put","patch"].indexOf(e.method)&&e.headers.setContentType("application/x-www-form-urlencoded",!1),Lt(e.adapter||Me.adapter)(e).then((function(t){return Nt(e),t.data=Xe.call(e,e.transformResponse,t),t.headers=Ve.from(t.headers),t}),(function(t){return $e(t)||(Nt(e),t&&t.response&&(t.response.data=Xe.call(e,e.transformResponse,t.response),t.response.headers=Ve.from(t.response.headers))),Promise.reject(t)}))}var Ct="1.7.7",Ft={};["object","boolean","number","function","string","symbol"].forEach((function(e,t){Ft[e]=function(r){return f(r)===e||"a"+(t<1?"n ":" ")+e}}));var Ut={};Ft.transitional=function(e,t,r){function n(e,t){return"[Axios v1.7.7] Transitional option '"+e+"'"+t+(r?". "+r:"")}return function(r,o,i){if(!1===e)throw new me(n(o," has been removed"+(t?" in "+t:"")),me.ERR_DEPRECATED);return t&&!Ut[o]&&(Ut[o]=!0,console.warn(n(o," has been deprecated since v"+t+" and will be removed in the near future"))),!e||e(r,o,i)}};var Bt={assertOptions:function(e,t,r){if("object"!==f(e))throw new me("options must be an object",me.ERR_BAD_OPTION_VALUE);for(var n=Object.keys(e),o=n.length;o-- >0;){var i=n[o],a=t[i];if(a){var u=e[i],s=void 0===u||a(u,i,e);if(!0!==s)throw new me("option "+i+" must be "+s,me.ERR_BAD_OPTION_VALUE)}else if(!0!==r)throw new me("Unknown option "+i,me.ERR_BAD_OPTION)}},validators:Ft},Dt=Bt.validators,It=function(){function e(t){d(this,e),this.defaults=t,this.interceptors={request:new Pe,response:new Pe}}var t;return y(e,[{key:"request",value:(t=p(s().mark((function e(t,r){var n,o;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,this._request(t,r);case 3:return e.abrupt("return",e.sent);case 6:if(e.prev=6,e.t0=e.catch(0),e.t0 instanceof Error){Error.captureStackTrace?Error.captureStackTrace(n={}):n=new Error,o=n.stack?n.stack.replace(/^.+\n/,""):"";try{e.t0.stack?o&&!String(e.t0.stack).endsWith(o.replace(/^.+\n.+\n/,""))&&(e.t0.stack+="\n"+o):e.t0.stack=o}catch(e){}}throw e.t0;case 10:case"end":return e.stop()}}),e,this,[[0,6]])}))),function(e,r){return t.apply(this,arguments)})},{key:"_request",value:function(e,t){"string"==typeof e?(t=t||{}).url=e:t=e||{};var r=t=st(this.defaults,t),n=r.transitional,o=r.paramsSerializer,i=r.headers;void 0!==n&&Bt.assertOptions(n,{silentJSONParsing:Dt.transitional(Dt.boolean),forcedJSONParsing:Dt.transitional(Dt.boolean),clarifyTimeoutError:Dt.transitional(Dt.boolean)},!1),null!=o&&(ye.isFunction(o)?t.paramsSerializer={serialize:o}:Bt.assertOptions(o,{encode:Dt.function,serialize:Dt.function},!0)),t.method=(t.method||this.defaults.method||"get").toLowerCase();var a=i&&ye.merge(i.common,i[t.method]);i&&ye.forEach(["delete","get","head","post","put","patch","common"],(function(e){delete i[e]})),t.headers=Ve.concat(a,i);var u=[],s=!0;this.interceptors.request.forEach((function(e){"function"==typeof e.runWhen&&!1===e.runWhen(t)||(s=s&&e.synchronous,u.unshift(e.fulfilled,e.rejected))}));var c,f=[];this.interceptors.response.forEach((function(e){f.push(e.fulfilled,e.rejected)}));var l,h=0;if(!s){var p=[_t.bind(this),void 0];for(p.unshift.apply(p,u),p.push.apply(p,f),l=p.length,c=Promise.resolve(t);h<l;)c=c.then(p[h++],p[h++]);return c}l=u.length;var d=t;for(h=0;h<l;){var v=u[h++],y=u[h++];try{d=v(d)}catch(e){y.call(this,e);break}}try{c=_t.call(this,d)}catch(e){return Promise.reject(e)}for(h=0,l=f.length;h<l;)c=c.then(f[h++],f[h++]);return c}},{key:"getUri",value:function(e){return je(at((e=st(this.defaults,e)).baseURL,e.url),e.params,e.paramsSerializer)}}]),e}();ye.forEach(["delete","get","head","options"],(function(e){It.prototype[e]=function(t,r){return this.request(st(r||{},{method:e,url:t,data:(r||{}).data}))}})),ye.forEach(["post","put","patch"],(function(e){function t(t){return function(r,n,o){return this.request(st(o||{},{method:e,headers:t?{"Content-Type":"multipart/form-data"}:{},url:r,data:n}))}}It.prototype[e]=t(),It.prototype[e+"Form"]=t(!0)}));var qt=It,Mt=function(){function e(t){if(d(this,e),"function"!=typeof t)throw new TypeError("executor must be a function.");var r;this.promise=new Promise((function(e){r=e}));var n=this;this.promise.then((function(e){if(n._listeners){for(var t=n._listeners.length;t-- >0;)n._listeners[t](e);n._listeners=null}})),this.promise.then=function(e){var t,r=new Promise((function(e){n.subscribe(e),t=e})).then(e);return r.cancel=function(){n.unsubscribe(t)},r},t((function(e,t,o){n.reason||(n.reason=new Ye(e,t,o),r(n.reason))}))}return y(e,[{key:"throwIfRequested",value:function(){if(this.reason)throw this.reason}},{key:"subscribe",value:function(e){this.reason?e(this.reason):this._listeners?this._listeners.push(e):this._listeners=[e]}},{key:"unsubscribe",value:function(e){if(this._listeners){var t=this._listeners.indexOf(e);-1!==t&&this._listeners.splice(t,1)}}},{key:"toAbortSignal",value:function(){var e=this,t=new AbortController,r=function(e){t.abort(e)};return this.subscribe(r),t.signal.unsubscribe=function(){return e.unsubscribe(r)},t.signal}}],[{key:"source",value:function(){var t;return{token:new e((function(e){t=e})),cancel:t}}}]),e}(),zt=Mt;var Ht={Continue:100,SwitchingProtocols:101,Processing:102,EarlyHints:103,Ok:200,Created:201,Accepted:202,NonAuthoritativeInformation:203,NoContent:204,ResetContent:205,PartialContent:206,MultiStatus:207,AlreadyReported:208,ImUsed:226,MultipleChoices:300,MovedPermanently:301,Found:302,SeeOther:303,NotModified:304,UseProxy:305,Unused:306,TemporaryRedirect:307,PermanentRedirect:308,BadRequest:400,Unauthorized:401,PaymentRequired:402,Forbidden:403,NotFound:404,MethodNotAllowed:405,NotAcceptable:406,ProxyAuthenticationRequired:407,RequestTimeout:408,Conflict:409,Gone:410,LengthRequired:411,PreconditionFailed:412,PayloadTooLarge:413,UriTooLong:414,UnsupportedMediaType:415,RangeNotSatisfiable:416,ExpectationFailed:417,ImATeapot:418,MisdirectedRequest:421,UnprocessableEntity:422,Locked:423,FailedDependency:424,TooEarly:425,UpgradeRequired:426,PreconditionRequired:428,TooManyRequests:429,RequestHeaderFieldsTooLarge:431,UnavailableForLegalReasons:451,InternalServerError:500,NotImplemented:501,BadGateway:502,ServiceUnavailable:503,GatewayTimeout:504,HttpVersionNotSupported:505,VariantAlsoNegotiates:506,InsufficientStorage:507,LoopDetected:508,NotExtended:510,NetworkAuthenticationRequired:511};Object.entries(Ht).forEach((function(e){var t=b(e,2),r=t[0],n=t[1];Ht[n]=r}));var Jt=Ht;var Wt=function e(t){var r=new qt(t),n=R(qt.prototype.request,r);return ye.extend(n,qt.prototype,r,{allOwnKeys:!0}),ye.extend(n,r,null,{allOwnKeys:!0}),n.create=function(r){return e(st(t,r))},n}(Me);return Wt.Axios=qt,Wt.CanceledError=Ye,Wt.CancelToken=zt,Wt.isCancel=$e,Wt.VERSION=Ct,Wt.toFormData=xe,Wt.AxiosError=me,Wt.Cancel=Wt.CanceledError,Wt.all=function(e){return Promise.all(e)},Wt.spread=function(e){return function(t){return e.apply(null,t)}},Wt.isAxiosError=function(e){return ye.isObject(e)&&!0===e.isAxiosError},Wt.mergeConfig=st,Wt.AxiosHeaders=Ve,Wt.formToJSON=function(e){return Ie(ye.isHTMLForm(e)?new FormData(e):e)},Wt.getAdapter=Lt,Wt.HttpStatusCode=Jt,Wt.default=Wt,Wt}));
-//# sourceMappingURL=axios.min.js.map

-import request from './axios.js'
+import { defHttp } from '@/utils/external/http/axios'
 
 const API = {
-  URL: '3d_component/'
+  URL: '/3d_component'
 }
 
-export function saveOrUpdateThreeJsModel(params = {}) {
-  return request({
-    url: API['URL'] + params['id'],
-    method: 'POST',
+/**
+ * @description: 3D模型 保存 api
+ */
+export function saveOrUpdateThreeJsModel(params) {
+  return defHttp.post({
+    url: `${API['URL']}?id=${params['id']}&imageUrl=${params['imageUrl']}`,
     data: params['data']
   })
 }
 
+/**
+ * @description: 3D模型 获取 api
+ */
 export function getThreeJsModel(id) {
-  return request({
-    url: API['URL'] + id,
-    method: 'get',
+  return defHttp.get({
+    url: API['URL'] + '/' + id
   })
 }
-

-import axios from 'axios'
-import { BASE_URL } from './config.js'
-import { getJwtToken } from '@/utils/external/auth'
-
-const service = axios.create({
-  baseURL: BASE_URL,
-  timeout: 5000
-})
-
-service.interceptors.request.use(
-  config => {
-    const token = getJwtToken()
-    if (token) {
-      config.headers['x-authorization'] = `Bearer ${token}`
-    }
-    return config
-  },
-  error => {
-    return Promise.reject(error)
-  }
-)
-
-service.interceptors.response.use(
-  response => {
-    const { status, data } = response
-    if (status === 200) {
-      const { code } = data
-      switch (code) {
-        case 1003:
-          return Promise.reject(data)
-        default:
-          return data
-      }
-    }
-  },
-  error => {
-    if (error.response) {
-      const { status, data } = error.response
-      if (status === 2001) {
-      }
-    }
-    return Promise.reject(error)
-  }
-)
-
-export default service

-const { host, protocol } = location
-
-let threeFilePath = `${protocol}//${host}`
-
-const VITE_GLOB_API_URL = import.meta.env.VITE_GLOB_API_URL
-
-const VITE_GLOB_API_URL_PREFIX = import.meta.env.VITE_GLOB_API_URL_PREFIX
-
-export const BASE_URL = `${threeFilePath}${VITE_GLOB_API_URL}${VITE_GLOB_API_URL_PREFIX}`

-import * as THREE from 'three';
+import * as THREE from 'three'
 
-import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js';
-import { RGBELoader } from 'three/addons/loaders/RGBELoader.js';
-import { TGALoader } from 'three/addons/loaders/TGALoader.js';
-import { FullScreenQuad } from 'three/addons/postprocessing/Pass.js';
+import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js'
+import { RGBELoader } from 'three/addons/loaders/RGBELoader.js'
+import { TGALoader } from 'three/addons/loaders/TGALoader.js'
+import { FullScreenQuad } from 'three/addons/postprocessing/Pass.js'
 
-import { UISpan, UIDiv, UIRow, UIButton, UICheckbox, UIText, UINumber } from './ui.js';
-import { MoveObjectCommand } from '../commands/MoveObjectCommand.js';
+import { UISpan, UIDiv, UIRow, UIButton, UICheckbox, UIText, UINumber } from './ui.js'
+import { MoveObjectCommand } from '../commands/MoveObjectCommand.js'
 
-const cache = new Map();
+const cache = new Map()
 
 class UITexture extends UISpan {
-
-	constructor( editor ) {
-
-		super();
-
-		const scope = this;
-
-		const form = document.createElement( 'form' );
-
-		const input = document.createElement( 'input' );
-		input.type = 'file';
-		input.addEventListener( 'change', function ( event ) {
-
-			loadFile( event.target.files[ 0 ] );
-
-		} );
-		form.appendChild( input );
-
-		const canvas = document.createElement( 'canvas' );
-		canvas.width = 32;
-		canvas.height = 16;
-		canvas.style.cursor = 'pointer';
-		canvas.style.marginRight = '5px';
-		canvas.style.border = '1px solid #888';
-		canvas.addEventListener( 'click', function () {
-
-			input.click();
-
-		} );
-		canvas.addEventListener( 'drop', function ( event ) {
-
-			event.preventDefault();
-			event.stopPropagation();
-			loadFile( event.dataTransfer.files[ 0 ] );
-
-		} );
-		this.dom.appendChild( canvas );
-
-		function loadFile( file ) {
-
-			const extension = file.name.split( '.' ).pop().toLowerCase();
-			const reader = new FileReader();
-
-			const hash = `${file.lastModified}_${file.size}_${file.name}`;
-
-			if ( cache.has( hash ) ) {
-
-				const texture = cache.get( hash );
-
-				scope.setValue( texture );
-
-				if ( scope.onChangeCallback ) scope.onChangeCallback( texture );
-
-			} else if ( extension === 'hdr' || extension === 'pic' ) {
-
-				reader.addEventListener( 'load', function ( event ) {
-
-					// assuming RGBE/Radiance HDR image format
-
-					const loader = new RGBELoader();
-					loader.load( event.target.result, function ( hdrTexture ) {
-
-						hdrTexture.sourceFile = file.name;
-
-						cache.set( hash, hdrTexture );
-
-						scope.setValue( hdrTexture );
-
-						if ( scope.onChangeCallback ) scope.onChangeCallback( hdrTexture );
-
-					} );
-
-				} );
-
-				reader.readAsDataURL( file );
-
-			} else if ( extension === 'tga' ) {
-
-				reader.addEventListener( 'load', function ( event ) {
-
-					const loader = new TGALoader();
-					loader.load( event.target.result, function ( texture ) {
-
-						texture.colorSpace = THREE.SRGBColorSpace;
-						texture.sourceFile = file.name;
-
-						cache.set( hash, texture );
-
-						scope.setValue( texture );
-
-						if ( scope.onChangeCallback ) scope.onChangeCallback( texture );
-
-
-					} );
-
-				}, false );
-
-				reader.readAsDataURL( file );
-
-			} else if ( extension === 'ktx2' ) {
-
-				reader.addEventListener( 'load', function ( event ) {
-
-					const arrayBuffer = event.target.result;
-					const blobURL = URL.createObjectURL( new Blob( [ arrayBuffer ] ) );
-					const ktx2Loader = new KTX2Loader();
-					ktx2Loader.setTranscoderPath( '../../examples/jsm/libs/basis/' );
-					editor.signals.rendererDetectKTX2Support.dispatch( ktx2Loader );
-
-					ktx2Loader.load( blobURL, function ( texture ) {
-
-						texture.colorSpace = THREE.SRGBColorSpace;
-						texture.sourceFile = file.name;
-						texture.needsUpdate = true;
-
-						cache.set( hash, texture );
-
-						scope.setValue( texture );
-
-						if ( scope.onChangeCallback ) scope.onChangeCallback( texture );
-						ktx2Loader.dispose();
-
-					} );
-
-				} );
-
-				reader.readAsArrayBuffer( file );
-
-			} else if ( file.type.match( 'image.*' ) ) {
-
-				reader.addEventListener( 'load', function ( event ) {
-
-					const image = document.createElement( 'img' );
-					image.addEventListener( 'load', function () {
-
-						const texture = new THREE.Texture( this );
-						texture.sourceFile = file.name;
-						texture.needsUpdate = true;
-
-						cache.set( hash, texture );
-
-						scope.setValue( texture );
-
-						if ( scope.onChangeCallback ) scope.onChangeCallback( texture );
-
-					}, false );
-
-					image.src = event.target.result;
-
-				}, false );
-
-				reader.readAsDataURL( file );
-
-			}
-
-			form.reset();
-
-		}
-
-		this.texture = null;
-		this.onChangeCallback = null;
-
-	}
-
-	getValue() {
-
-		return this.texture;
-
-	}
-
-	setValue( texture ) {
-
-		const canvas = this.dom.children[ 0 ];
-		const context = canvas.getContext( '2d' );
-
-		// Seems like context can be null if the canvas is not visible
-		if ( context ) {
-
-			// Always clear the context before set new texture, because new texture may has transparency
-			context.clearRect( 0, 0, canvas.width, canvas.height );
-
-		}
-
-		if ( texture !== null ) {
-
-			const image = texture.image;
-
-			if ( image !== undefined && image !== null && image.width > 0 ) {
-
-				canvas.title = texture.sourceFile;
-				const scale = canvas.width / image.width;
-
-				if ( texture.isDataTexture || texture.isCompressedTexture ) {
-
-					const canvas2 = renderToCanvas( texture );
-					context.drawImage( canvas2, 0, 0, image.width * scale, image.height * scale );
-
-				} else {
-
-					context.drawImage( image, 0, 0, image.width * scale, image.height * scale );
-
-				}
-
-			} else {
-
-				canvas.title = texture.sourceFile + ' (error)';
-
-			}
-
-		} else {
-
-			canvas.title = 'empty';
-
-		}
-
-		this.texture = texture;
-
-	}
-
-	setColorSpace( colorSpace ) {
-
-		const texture = this.getValue();
-
-		if ( texture !== null ) {
-
-			texture.colorSpace = colorSpace;
-
-		}
-
-		return this;
-
-	}
-
-	onChange( callback ) {
-
-		this.onChangeCallback = callback;
-
-		return this;
-
-	}
-
+  constructor(editor) {
+    super()
+
+    const scope = this
+
+    const form = document.createElement('form')
+
+    const input = document.createElement('input')
+    input.type = 'file'
+    input.addEventListener('change', function (event) {
+      loadFile(event.target.files[0])
+    })
+    form.appendChild(input)
+
+    const canvas = document.createElement('canvas')
+    canvas.width = 32
+    canvas.height = 16
+    canvas.style.cursor = 'pointer'
+    canvas.style.marginRight = '5px'
+    canvas.style.border = '1px solid #888'
+    canvas.addEventListener('click', function () {
+      input.click()
+    })
+    canvas.addEventListener('drop', function (event) {
+      event.preventDefault()
+      event.stopPropagation()
+      loadFile(event.dataTransfer.files[0])
+    })
+    this.dom.appendChild(canvas)
+
+    function loadFile(file) {
+      const extension = file.name.split('.').pop().toLowerCase()
+      const reader = new FileReader()
+
+      const hash = `${file.lastModified}_${file.size}_${file.name}`
+
+      if (cache.has(hash)) {
+        const texture = cache.get(hash)
+
+        scope.setValue(texture)
+
+        if (scope.onChangeCallback) scope.onChangeCallback(texture)
+      } else if (extension === 'hdr' || extension === 'pic') {
+        reader.addEventListener('load', function (event) {
+          // assuming RGBE/Radiance HDR image format
+
+          const loader = new RGBELoader()
+          loader.load(event.target.result, function (hdrTexture) {
+            hdrTexture.sourceFile = file.name
+
+            cache.set(hash, hdrTexture)
+
+            scope.setValue(hdrTexture)
+
+            if (scope.onChangeCallback) scope.onChangeCallback(hdrTexture)
+          })
+        })
+
+        reader.readAsDataURL(file)
+      } else if (extension === 'tga') {
+        reader.addEventListener(
+          'load',
+          function (event) {
+            const loader = new TGALoader()
+            loader.load(event.target.result, function (texture) {
+              texture.colorSpace = THREE.SRGBColorSpace
+              texture.sourceFile = file.name
+
+              cache.set(hash, texture)
+
+              scope.setValue(texture)
+
+              if (scope.onChangeCallback) scope.onChangeCallback(texture)
+            })
+          },
+          false
+        )
+
+        reader.readAsDataURL(file)
+      } else if (extension === 'ktx2') {
+        reader.addEventListener('load', function (event) {
+          const arrayBuffer = event.target.result
+          const blobURL = URL.createObjectURL(new Blob([arrayBuffer]))
+          const ktx2Loader = new KTX2Loader()
+          ktx2Loader.setTranscoderPath('../../examples/jsm/libs/basis/')
+          editor.signals.rendererDetectKTX2Support.dispatch(ktx2Loader)
+
+          ktx2Loader.load(blobURL, function (texture) {
+            texture.colorSpace = THREE.SRGBColorSpace
+            texture.sourceFile = file.name
+            texture.needsUpdate = true
+
+            cache.set(hash, texture)
+
+            scope.setValue(texture)
+
+            if (scope.onChangeCallback) scope.onChangeCallback(texture)
+            ktx2Loader.dispose()
+          })
+        })
+
+        reader.readAsArrayBuffer(file)
+      } else if (file.type.match('image.*')) {
+        reader.addEventListener(
+          'load',
+          function (event) {
+            const image = document.createElement('img')
+            image.addEventListener(
+              'load',
+              function () {
+                const texture = new THREE.Texture(this)
+                texture.sourceFile = file.name
+                texture.needsUpdate = true
+
+                cache.set(hash, texture)
+
+                scope.setValue(texture)
+
+                if (scope.onChangeCallback) scope.onChangeCallback(texture)
+              },
+              false
+            )
+
+            image.src = event.target.result
+          },
+          false
+        )
+
+        reader.readAsDataURL(file)
+      }
+
+      form.reset()
+    }
+
+    this.texture = null
+    this.onChangeCallback = null
+  }
+
+  getValue() {
+    return this.texture
+  }
+
+  setValue(texture) {
+    const canvas = this.dom.children[0]
+    const context = canvas.getContext('2d')
+
+    // Seems like context can be null if the canvas is not visible
+    if (context) {
+      // Always clear the context before set new texture, because new texture may has transparency
+      context.clearRect(0, 0, canvas.width, canvas.height)
+    }
+
+    if (texture !== null) {
+      const image = texture.image
+
+      if (image !== undefined && image !== null && image.width > 0) {
+        canvas.title = texture.sourceFile
+        const scale = canvas.width / image.width
+
+        if (texture.isDataTexture || texture.isCompressedTexture) {
+          const canvas2 = renderToCanvas(texture)
+          context.drawImage(canvas2, 0, 0, image.width * scale, image.height * scale)
+        } else {
+          context.drawImage(image, 0, 0, image.width * scale, image.height * scale)
+        }
+      } else {
+        canvas.title = texture.sourceFile + ' (error)'
+      }
+    } else {
+      canvas.title = 'empty'
+    }
+
+    this.texture = texture
+  }
+
+  setColorSpace(colorSpace) {
+    const texture = this.getValue()
+
+    if (texture !== null) {
+      texture.colorSpace = colorSpace
+    }
+
+    return this
+  }
+
+  onChange(callback) {
+    this.onChangeCallback = callback
+
+    return this
+  }
 }
 
 class UIOutliner extends UIDiv {
+  constructor(editor) {
+    super()
 
-	constructor( editor ) {
-
-		super();
-
-		this.dom.className = 'Outliner';
-		this.dom.tabIndex = 0;	// keyup event is ignored without setting tabIndex
-
-		const scope = this;
-
-		// hack
-		this.scene = editor.scene;
-
-		// Prevent native scroll behavior
-		this.dom.addEventListener( 'keydown', function ( event ) {
-
-			switch ( event.code ) {
-
-				case 'ArrowUp':
-				case 'ArrowDown':
-					event.preventDefault();
-					event.stopPropagation();
-					break;
-
-			}
-
-		} );
-
-		// Keybindings to support arrow navigation
-		this.dom.addEventListener( 'keyup', function ( event ) {
-
-			switch ( event.code ) {
-
-				case 'ArrowUp':
-					scope.selectIndex( scope.selectedIndex - 1 );
-					break;
-				case 'ArrowDown':
-					scope.selectIndex( scope.selectedIndex + 1 );
-					break;
-
-			}
-
-		} );
-
-		this.editor = editor;
-
-		this.options = [];
-		this.selectedIndex = - 1;
-		this.selectedValue = null;
-
-	}
-
-	selectIndex( index ) {
-
-		if ( index >= 0 && index < this.options.length ) {
-
-			this.setValue( this.options[ index ].value );
-
-			const changeEvent = new Event( 'change', { bubbles: true, cancelable: true } );
-			this.dom.dispatchEvent( changeEvent );
+    this.dom.className = 'Outliner'
+    this.dom.tabIndex = 0 // keyup event is ignored without setting tabIndex
 
-		}
+    const scope = this
 
-	}
+    // hack
+    this.scene = editor.scene
 
-	setOptions( options ) {
+    // Prevent native scroll behavior
+    this.dom.addEventListener('keydown', function (event) {
+      switch (event.code) {
+        case 'ArrowUp':
+        case 'ArrowDown':
+          event.preventDefault()
+          event.stopPropagation()
+          break
+      }
+    })
 
-		const scope = this;
+    // Keybindings to support arrow navigation
+    this.dom.addEventListener('keyup', function (event) {
+      switch (event.code) {
+        case 'ArrowUp':
+          scope.selectIndex(scope.selectedIndex - 1)
+          break
+        case 'ArrowDown':
+          scope.selectIndex(scope.selectedIndex + 1)
+          break
+      }
+    })
 
-		while ( scope.dom.children.length > 0 ) {
+    this.editor = editor
+
+    this.options = []
+    this.selectedIndex = -1
+    this.selectedValue = null
+  }
 
-			scope.dom.removeChild( scope.dom.firstChild );
+  selectIndex(index) {
+    if (index >= 0 && index < this.options.length) {
+      this.setValue(this.options[index].value)
 
-		}
+      const changeEvent = new Event('change', { bubbles: true, cancelable: true })
+      this.dom.dispatchEvent(changeEvent)
+    }
+  }
 
-		function onClick() {
+  setOptions(options) {
+    const scope = this
 
-			scope.setValue( this.value );
+    while (scope.dom.children.length > 0) {
+      scope.dom.removeChild(scope.dom.firstChild)
+    }
 
-			const changeEvent = new Event( 'change', { bubbles: true, cancelable: true } );
-			scope.dom.dispatchEvent( changeEvent );
+    function onClick() {
+      scope.setValue(this.value)
 
-		}
+      const changeEvent = new Event('change', { bubbles: true, cancelable: true })
+      scope.dom.dispatchEvent(changeEvent)
+    }
 
-		// Drag
+    // Drag
 
-		let currentDrag;
+    let currentDrag
 
-		function onDrag() {
+    function onDrag() {
+      currentDrag = this
+    }
 
-			currentDrag = this;
+    function onDragStart(event) {
+      event.dataTransfer.setData('text', 'foo')
+    }
 
-		}
+    function onDragOver(event) {
+      if (this === currentDrag) return
 
-		function onDragStart( event ) {
+      const area = event.offsetY / this.clientHeight
 
-			event.dataTransfer.setData( 'text', 'foo' );
+      if (area < 0.25) {
+        this.className = 'option dragTop'
+      } else if (area > 0.75) {
+        this.className = 'option dragBottom'
+      } else {
+        this.className = 'option drag'
+      }
+    }
 
-		}
+    function onDragLeave() {
+      if (this === currentDrag) return
 
-		function onDragOver( event ) {
+      this.className = 'option'
+    }
 
-			if ( this === currentDrag ) return;
+    function onDrop(event) {
+      if (this === currentDrag || currentDrag === undefined) return
 
-			const area = event.offsetY / this.clientHeight;
+      this.className = 'option'
 
-			if ( area < 0.25 ) {
+      const scene = scope.scene
+      const object = scene.getObjectById(currentDrag.value)
 
-				this.className = 'option dragTop';
+      const area = event.offsetY / this.clientHeight
 
-			} else if ( area > 0.75 ) {
+      if (area < 0.25) {
+        const nextObject = scene.getObjectById(this.value)
+        moveObject(object, nextObject.parent, nextObject)
+      } else if (area > 0.75) {
+        let nextObject, parent
 
-				this.className = 'option dragBottom';
+        if (this.nextSibling !== null) {
+          nextObject = scene.getObjectById(this.nextSibling.value)
+          parent = nextObject.parent
+        } else {
+          // end of list (no next object)
 
-			} else {
+          nextObject = null
+          parent = scene.getObjectById(this.value).parent
+        }
 
-				this.className = 'option drag';
+        moveObject(object, parent, nextObject)
+      } else {
+        const parentObject = scene.getObjectById(this.value)
+        moveObject(object, parentObject)
+      }
+    }
 
-			}
+    function moveObject(object, newParent, nextObject) {
+      if (nextObject === null) nextObject = undefined
 
-		}
+      let newParentIsChild = false
 
-		function onDragLeave() {
+      object.traverse(function (child) {
+        if (child === newParent) newParentIsChild = true
+      })
 
-			if ( this === currentDrag ) return;
+      if (newParentIsChild) return
 
-			this.className = 'option';
+      const editor = scope.editor
+      editor.execute(new MoveObjectCommand(editor, object, newParent, nextObject))
 
-		}
+      const changeEvent = new Event('change', { bubbles: true, cancelable: true })
+      scope.dom.dispatchEvent(changeEvent)
+    }
 
-		function onDrop( event ) {
+    //
 
-			if ( this === currentDrag || currentDrag === undefined ) return;
+    scope.options = []
 
-			this.className = 'option';
+    for (let i = 0; i < options.length; i++) {
+      const div = options[i]
+      div.className = 'option'
+      scope.dom.appendChild(div)
 
-			const scene = scope.scene;
-			const object = scene.getObjectById( currentDrag.value );
+      scope.options.push(div)
 
-			const area = event.offsetY / this.clientHeight;
+      div.addEventListener('click', onClick)
 
-			if ( area < 0.25 ) {
+      if (div.draggable === true) {
+        div.addEventListener('drag', onDrag)
+        div.addEventListener('dragstart', onDragStart) // Firefox needs this
 
-				const nextObject = scene.getObjectById( this.value );
-				moveObject( object, nextObject.parent, nextObject );
+        div.addEventListener('dragover', onDragOver)
+        div.addEventListener('dragleave', onDragLeave)
+        div.addEventListener('drop', onDrop)
+      }
+    }
 
-			} else if ( area > 0.75 ) {
+    return scope
+  }
 
-				let nextObject, parent;
+  getValue() {
+    return this.selectedValue
+  }
 
-				if ( this.nextSibling !== null ) {
+  setValue(value) {
+    for (let i = 0; i < this.options.length; i++) {
+      const element = this.options[i]
 
-					nextObject = scene.getObjectById( this.nextSibling.value );
-					parent = nextObject.parent;
+      if (element.value === value) {
+        element.classList.add('active')
 
-				} else {
+        // scroll into view
 
-					// end of list (no next object)
+        const y = element.offsetTop - this.dom.offsetTop
+        const bottomY = y + element.offsetHeight
+        const minScroll = bottomY - this.dom.offsetHeight
 
-					nextObject = null;
-					parent = scene.getObjectById( this.value ).parent;
+        if (this.dom.scrollTop > y) {
+          this.dom.scrollTop = y
+        } else if (this.dom.scrollTop < minScroll) {
+          this.dom.scrollTop = minScroll
+        }
 
-				}
+        this.selectedIndex = i
+      } else {
+        element.classList.remove('active')
+      }
+    }
 
-				moveObject( object, parent, nextObject );
-
-			} else {
-
-				const parentObject = scene.getObjectById( this.value );
-				moveObject( object, parentObject );
-
-			}
-
-		}
-
-		function moveObject( object, newParent, nextObject ) {
-
-			if ( nextObject === null ) nextObject = undefined;
-
-			let newParentIsChild = false;
-
-			object.traverse( function ( child ) {
-
-				if ( child === newParent ) newParentIsChild = true;
-
-			} );
-
-			if ( newParentIsChild ) return;
-
-			const editor = scope.editor;
-			editor.execute( new MoveObjectCommand( editor, object, newParent, nextObject ) );
-
-			const changeEvent = new Event( 'change', { bubbles: true, cancelable: true } );
-			scope.dom.dispatchEvent( changeEvent );
-
-		}
-
-		//
-
-		scope.options = [];
-
-		for ( let i = 0; i < options.length; i ++ ) {
-
-			const div = options[ i ];
-			div.className = 'option';
-			scope.dom.appendChild( div );
-
-			scope.options.push( div );
-
-			div.addEventListener( 'click', onClick );
-
-			if ( div.draggable === true ) {
-
-				div.addEventListener( 'drag', onDrag );
-				div.addEventListener( 'dragstart', onDragStart ); // Firefox needs this
-
-				div.addEventListener( 'dragover', onDragOver );
-				div.addEventListener( 'dragleave', onDragLeave );
-				div.addEventListener( 'drop', onDrop );
-
-			}
-
-
-		}
-
-		return scope;
-
-	}
-
-	getValue() {
-
-		return this.selectedValue;
-
-	}
-
-	setValue( value ) {
-
-		for ( let i = 0; i < this.options.length; i ++ ) {
-
-			const element = this.options[ i ];
-
-			if ( element.value === value ) {
-
-				element.classList.add( 'active' );
-
-				// scroll into view
-
-				const y = element.offsetTop - this.dom.offsetTop;
-				const bottomY = y + element.offsetHeight;
-				const minScroll = bottomY - this.dom.offsetHeight;
-
-				if ( this.dom.scrollTop > y ) {
-
-					this.dom.scrollTop = y;
-
-				} else if ( this.dom.scrollTop < minScroll ) {
-
-					this.dom.scrollTop = minScroll;
-
-				}
-
-				this.selectedIndex = i;
-
-			} else {
-
-				element.classList.remove( 'active' );
-
-			}
-
-		}
-
-		this.selectedValue = value;
-
-		return this;
-
-	}
+    this.selectedValue = value
 
+    return this
+  }
 }
 
 class UIPoints extends UISpan {
+  constructor() {
+    super()
 
-	constructor() {
-
-		super();
-
-		this.dom.style.display = 'inline-block';
-
-		this.pointsList = new UIDiv();
-		this.add( this.pointsList );
-
-		this.pointsUI = [];
-		this.lastPointIdx = 0;
-		this.onChangeCallback = null;
-
-		this.update = () => { // bind lexical this
-
-			if ( this.onChangeCallback !== null ) {
-
-				this.onChangeCallback();
-
-			}
-
-		};
-
-	}
-
-	onChange( callback ) {
-
-		this.onChangeCallback = callback;
+    this.dom.style.display = 'inline-block'
 
-		return this;
+    this.pointsList = new UIDiv()
+    this.add(this.pointsList)
 
-	}
+    this.pointsUI = []
+    this.lastPointIdx = 0
+    this.onChangeCallback = null
 
-	clear() {
+    this.update = () => {
+      // bind lexical this
 
-		for ( let i = this.pointsUI.length - 1; i >= 0; -- i ) {
+      if (this.onChangeCallback !== null) {
+        this.onChangeCallback()
+      }
+    }
+  }
 
-			this.deletePointRow( i, false );
+  onChange(callback) {
+    this.onChangeCallback = callback
 
-		}
+    return this
+  }
 
-		this.lastPointIdx = 0;
+  clear() {
+    for (let i = this.pointsUI.length - 1; i >= 0; --i) {
+      this.deletePointRow(i, false)
+    }
 
-	}
+    this.lastPointIdx = 0
+  }
 
-	deletePointRow( idx, needsUpdate = true ) {
+  deletePointRow(idx, needsUpdate = true) {
+    if (!this.pointsUI[idx]) return
 
-		if ( ! this.pointsUI[ idx ] ) return;
+    this.pointsList.remove(this.pointsUI[idx].row)
 
-		this.pointsList.remove( this.pointsUI[ idx ].row );
+    this.pointsUI.splice(idx, 1)
 
-		this.pointsUI.splice( idx, 1 );
-
-		if ( needsUpdate === true ) {
-
-			this.update();
-
-		}
-
-		this.lastPointIdx --;
-
-	}
+    if (needsUpdate === true) {
+      this.update()
+    }
 
+    this.lastPointIdx--
+  }
 }
 
 class UIPoints2 extends UIPoints {
+  constructor() {
+    super()
 
-	constructor() {
-
-		super();
-
-		const row = new UIRow();
-		this.add( row );
-
-		const addPointButton = new UIButton( '+' );
-		addPointButton.onClick( () => {
-
-			if ( this.pointsUI.length === 0 ) {
-
-				this.pointsList.add( this.createPointRow( 0, 0 ) );
-
-			} else {
-
-				const point = this.pointsUI[ this.pointsUI.length - 1 ];
-
-				this.pointsList.add( this.createPointRow( point.x.getValue(), point.y.getValue() ) );
-
-			}
-
-			this.update();
-
-		} );
-		row.add( addPointButton );
+    const row = new UIRow()
+    this.add(row)
 
-	}
+    const addPointButton = new UIButton('+')
+    addPointButton.onClick(() => {
+      if (this.pointsUI.length === 0) {
+        this.pointsList.add(this.createPointRow(0, 0))
+      } else {
+        const point = this.pointsUI[this.pointsUI.length - 1]
 
-	getValue() {
+        this.pointsList.add(this.createPointRow(point.x.getValue(), point.y.getValue()))
+      }
 
-		const points = [];
+      this.update()
+    })
+    row.add(addPointButton)
+  }
 
-		let count = 0;
+  getValue() {
+    const points = []
 
-		for ( let i = 0; i < this.pointsUI.length; i ++ ) {
+    let count = 0
 
-			const pointUI = this.pointsUI[ i ];
+    for (let i = 0; i < this.pointsUI.length; i++) {
+      const pointUI = this.pointsUI[i]
 
-			if ( ! pointUI ) continue;
+      if (!pointUI) continue
 
-			points.push( new THREE.Vector2( pointUI.x.getValue(), pointUI.y.getValue() ) );
-			++ count;
-			pointUI.lbl.setValue( count );
+      points.push(new THREE.Vector2(pointUI.x.getValue(), pointUI.y.getValue()))
+      ++count
+      pointUI.lbl.setValue(count)
+    }
 
-		}
+    return points
+  }
 
-		return points;
+  setValue(points, needsUpdate = true) {
+    this.clear()
 
-	}
+    for (let i = 0; i < points.length; i++) {
+      const point = points[i]
+      this.pointsList.add(this.createPointRow(point.x, point.y))
+    }
 
-	setValue( points, needsUpdate = true ) {
+    if (needsUpdate === true) this.update()
 
-		this.clear();
+    return this
+  }
 
-		for ( let i = 0; i < points.length; i ++ ) {
+  createPointRow(x, y) {
+    const pointRow = new UIDiv()
+    const lbl = new UIText(this.lastPointIdx + 1).setWidth('20px')
+    const txtX = new UINumber(x).setWidth('30px').onChange(this.update)
+    const txtY = new UINumber(y).setWidth('30px').onChange(this.update)
 
-			const point = points[ i ];
-			this.pointsList.add( this.createPointRow( point.x, point.y ) );
+    const scope = this
+    const btn = new UIButton('-').onClick(function () {
+      if (scope.isEditing) return
 
-		}
+      const idx = scope.pointsList.getIndexOfChild(pointRow)
+      scope.deletePointRow(idx)
+    })
 
-		if ( needsUpdate === true ) this.update();
-
-		return this;
-
-	}
-
-	createPointRow( x, y ) {
-
-		const pointRow = new UIDiv();
-		const lbl = new UIText( this.lastPointIdx + 1 ).setWidth( '20px' );
-		const txtX = new UINumber( x ).setWidth( '30px' ).onChange( this.update );
-		const txtY = new UINumber( y ).setWidth( '30px' ).onChange( this.update );
-
-		const scope = this;
-		const btn = new UIButton( '-' ).onClick( function () {
-
-			if ( scope.isEditing ) return;
-
-			const idx = scope.pointsList.getIndexOfChild( pointRow );
-			scope.deletePointRow( idx );
-
-		} );
-
-		this.pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY } );
-		++ this.lastPointIdx;
-		pointRow.add( lbl, txtX, txtY, btn );
-
-		return pointRow;
-
-	}
+    this.pointsUI.push({ row: pointRow, lbl: lbl, x: txtX, y: txtY })
+    ++this.lastPointIdx
+    pointRow.add(lbl, txtX, txtY, btn)
 
+    return pointRow
+  }
 }
 
 class UIPoints3 extends UIPoints {
+  constructor() {
+    super()
 
-	constructor() {
-
-		super();
-
-		const row = new UIRow();
-		this.add( row );
-
-		const addPointButton = new UIButton( '+' );
-		addPointButton.onClick( () => {
-
-			if ( this.pointsUI.length === 0 ) {
-
-				this.pointsList.add( this.createPointRow( 0, 0, 0 ) );
+    const row = new UIRow()
+    this.add(row)
 
-			} else {
+    const addPointButton = new UIButton('+')
+    addPointButton.onClick(() => {
+      if (this.pointsUI.length === 0) {
+        this.pointsList.add(this.createPointRow(0, 0, 0))
+      } else {
+        const point = this.pointsUI[this.pointsUI.length - 1]
 
-				const point = this.pointsUI[ this.pointsUI.length - 1 ];
+        this.pointsList.add(this.createPointRow(point.x.getValue(), point.y.getValue(), point.z.getValue()))
+      }
 
-				this.pointsList.add( this.createPointRow( point.x.getValue(), point.y.getValue(), point.z.getValue() ) );
+      this.update()
+    })
+    row.add(addPointButton)
+  }
 
-			}
+  getValue() {
+    const points = []
+    let count = 0
 
-			this.update();
+    for (let i = 0; i < this.pointsUI.length; i++) {
+      const pointUI = this.pointsUI[i]
 
-		} );
-		row.add( addPointButton );
+      if (!pointUI) continue
 
-	}
+      points.push(new THREE.Vector3(pointUI.x.getValue(), pointUI.y.getValue(), pointUI.z.getValue()))
+      ++count
+      pointUI.lbl.setValue(count)
+    }
 
-	getValue() {
+    return points
+  }
 
-		const points = [];
-		let count = 0;
+  setValue(points, needsUpdate = true) {
+    this.clear()
 
-		for ( let i = 0; i < this.pointsUI.length; i ++ ) {
+    for (let i = 0; i < points.length; i++) {
+      const point = points[i]
+      this.pointsList.add(this.createPointRow(point.x, point.y, point.z))
+    }
 
-			const pointUI = this.pointsUI[ i ];
+    if (needsUpdate === true) this.update()
 
-			if ( ! pointUI ) continue;
+    return this
+  }
 
-			points.push( new THREE.Vector3( pointUI.x.getValue(), pointUI.y.getValue(), pointUI.z.getValue() ) );
-			++ count;
-			pointUI.lbl.setValue( count );
+  createPointRow(x, y, z) {
+    const pointRow = new UIDiv()
+    const lbl = new UIText(this.lastPointIdx + 1).setWidth('20px')
+    const txtX = new UINumber(x).setWidth('30px').onChange(this.update)
+    const txtY = new UINumber(y).setWidth('30px').onChange(this.update)
+    const txtZ = new UINumber(z).setWidth('30px').onChange(this.update)
 
-		}
+    const scope = this
+    const btn = new UIButton('-').onClick(function () {
+      if (scope.isEditing) return
 
-		return points;
+      const idx = scope.pointsList.getIndexOfChild(pointRow)
+      scope.deletePointRow(idx)
+    })
 
-	}
-
-	setValue( points, needsUpdate = true ) {
-
-		this.clear();
-
-		for ( let i = 0; i < points.length; i ++ ) {
-
-			const point = points[ i ];
-			this.pointsList.add( this.createPointRow( point.x, point.y, point.z ) );
-
-		}
-
-		if ( needsUpdate === true ) this.update();
-
-		return this;
-
-	}
-
-	createPointRow( x, y, z ) {
-
-		const pointRow = new UIDiv();
-		const lbl = new UIText( this.lastPointIdx + 1 ).setWidth( '20px' );
-		const txtX = new UINumber( x ).setWidth( '30px' ).onChange( this.update );
-		const txtY = new UINumber( y ).setWidth( '30px' ).onChange( this.update );
-		const txtZ = new UINumber( z ).setWidth( '30px' ).onChange( this.update );
-
-		const scope = this;
-		const btn = new UIButton( '-' ).onClick( function () {
-
-			if ( scope.isEditing ) return;
-
-			const idx = scope.pointsList.getIndexOfChild( pointRow );
-			scope.deletePointRow( idx );
-
-		} );
-
-		this.pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY, z: txtZ } );
-		++ this.lastPointIdx;
-		pointRow.add( lbl, txtX, txtY, txtZ, btn );
-
-		return pointRow;
-
-	}
+    this.pointsUI.push({ row: pointRow, lbl: lbl, x: txtX, y: txtY, z: txtZ })
+    ++this.lastPointIdx
+    pointRow.add(lbl, txtX, txtY, txtZ, btn)
 
+    return pointRow
+  }
 }
 
 class UIBoolean extends UISpan {
+  constructor(boolean, text) {
+    super()
 
-	constructor( boolean, text ) {
-
-		super();
-
-		this.setMarginRight( '4px' );
-
-		this.checkbox = new UICheckbox( boolean );
-		this.text = new UIText( text ).setMarginLeft( '3px' );
-
-		this.add( this.checkbox );
-		this.add( this.text );
-
-	}
-
-	getValue() {
-
-		return this.checkbox.getValue();
+    this.setMarginRight('4px')
 
-	}
+    this.checkbox = new UICheckbox(boolean)
+    this.text = new UIText(text).setMarginLeft('3px')
 
-	setValue( value ) {
+    this.add(this.checkbox)
+    this.add(this.text)
+  }
 
-		return this.checkbox.setValue( value );
-
-	}
+  getValue() {
+    return this.checkbox.getValue()
+  }
 
+  setValue(value) {
+    return this.checkbox.setValue(value)
+  }
 }
 
-let renderer, fsQuad;
-
-function renderToCanvas( texture ) {
-
-	if ( renderer === undefined ) {
-
-		renderer = new THREE.WebGLRenderer();
-
-	}
-
-	if ( fsQuad === undefined ) {
-
-		fsQuad = new FullScreenQuad( new THREE.MeshBasicMaterial() );
+let renderer, fsQuad
 
-	}
+function renderToCanvas(texture) {
+  if (renderer === undefined) {
+    renderer = new THREE.WebGLRenderer({ preserveDrawingBuffer: true })
+  }
 
-	const image = texture.image;
+  if (fsQuad === undefined) {
+    fsQuad = new FullScreenQuad(new THREE.MeshBasicMaterial())
+  }
 
-	renderer.setSize( image.width, image.height, false );
+  const image = texture.image
 
-	fsQuad.material.map = texture;
-	fsQuad.render( renderer );
+  renderer.setSize(image.width, image.height, false)
 
-	return renderer.domElement;
+  fsQuad.material.map = texture
+  fsQuad.render(renderer)
 
+  return renderer.domElement
 }
 
-export { UITexture, UIOutliner, UIPoints, UIPoints2, UIPoints3, UIBoolean };
+export { UITexture, UIOutliner, UIPoints, UIPoints2, UIPoints3, UIBoolean }

+/**
+ * * base64转file
+ * @param url
+ * @param fileName
+ * @returns
+ */
+export const base64toFile = (url, fileName) => {
+  const dataArr = url.split(',')
+  const mime = dataArr[0].match(/:(.*?);/)[1]
+  const bstr = atob(dataArr[1])
+  let n = bstr.length
+  const u8arr = new Uint8Array(n)
+  while (n--) {
+    u8arr[n] = bstr.charCodeAt(n)
+  }
+  return new File([u8arr], fileName, { type: mime })
+}

@@ -48,6 +48,7 @@ export type ConfigType = {
   // 3D模型数据
   threeModelContent?: any
   threeModelFilePath?: string
+  threeModelImageUrl?: string
 }
 
 // 数据请求

@@ -68,7 +68,8 @@ import {
   EyeOffOutline as EyeOffOutlineIcon,
   Albums as AlbumsIcon,
   Analytics as AnalyticsIcon,
-  AirplaneOutline as AirPlaneOutlineIcon
+  AirplaneOutline as AirPlaneOutlineIcon,
+  Reload as ReloadSearch
 } from '@vicons/ionicons5'
 
 import {
@@ -105,6 +106,7 @@ import {
 } from '@vicons/carbon'
 
 const ionicons5 = {
+  ReloadSearch,
   // 新增
   AddIcon,
   // 帮助（问号）

@@ -27,6 +27,9 @@
         </div>
         <div class="list-center go-flex-center go-transition" draggable="true">
           <Icon v-if="item.icon" class="list-img" :icon="item.icon" color="#999" width="48" />
+          <div class="list-img" v-else-if="item.threeModelImageUrl">
+            <n-image height="100" width="140" object-fit="fill" preview-disabled :src="item.threeModelImageUrl"></n-image>
+          </div>
           <chart-glob-image v-else class="list-img" :chartConfig="item" />
         </div>
         <div class="list-bottom">

@@ -75,7 +75,6 @@ const selectValue = ref<string>('all')
 
 const threeJsModels = ref<Recordable[]>([])
 
-
 // 设置初始列表
 const setSelectOptions = (categorys: any) => {
   for (const val in categorys) {
@@ -128,18 +127,19 @@ watch(
             chartFrame: 'static',
             chartKey: 'ExternalVCLoader',
             conKey: 'ExternalVCCLoader',
-            image: 'threeModelDefault.svg',
+            image: modelItem.imageUrl ? modelItem.imageUrl : 'threeModelDefault.svg',
             key: 'Loader',
             package: 'Decorates',
             title: modelItem.name ?? modelItem.id,
             redirectComponent: 'Decorates/Three/Loader',
             isThreeModel: true,
             threeModelContent: modelItem.content,
-            threeModelFilePath: `${threeFilePath}${VITE_GLOB_API_URL}${VITE_GLOB_API_URL_PREFIX}/3d_component/json/${modelItem.id}/scene.json`
+            threeModelFilePath: `${threeFilePath}${VITE_GLOB_API_URL}${VITE_GLOB_API_URL_PREFIX}/3d_component/json/${modelItem.id}/scene.json`,
+            threeModelImageUrl: modelItem.imageUrl
           }
         })
     }
-    const mergeList = [...newData.list,...threeJsModels.value] as ConfigType[]
+    const mergeList = [...newData.list, ...threeJsModels.value] as ConfigType[]
     mergeList.forEach((e: ConfigType) => {
       const value: ConfigType[] = (packages.categorys as Recordable)[e.category]
       packages.categorys[e.category] = value && value.length ? [...value, e] : [e]

@@ -54,7 +54,8 @@ const imageInfo = ref('')
 
 // 获取图片
 const fetchImageUrl = async () => {
-  imageInfo.value = await fetchImages(props.componentData.chartConfig)
+  const threeModelImageUrl = props.componentData.chartConfig?.threeModelImageUrl
+  imageInfo.value = threeModelImageUrl ? threeModelImageUrl : await fetchImages(props.componentData.chartConfig)
 }
 fetchImageUrl()
 

@@ -181,7 +181,6 @@ export const useSyncRemote = () => {
 
   //thumbnailSyncUpdate 缩略图保存
   const thumbnailSyncUpdate = throttle(async (updateImg = true) => {
-    console.log(projectInfoStore.getProjectInfo, 'projectInfoStore.getProjectInfo')
     const { state, organizationId, dataViewName, thumbnail } = projectInfoStore.getProjectInfo
     if (updateImg) {
       // 获取缩略图片

 <template>
   <div v-if="cardData" class="go-items-list-card">
-    <n-card hoverable size="small">
+    <n-card :hoverable="false" size="small">
       <div class="list-content">
-        <!-- 顶部按钮 -->
-        <div class="list-content-top">
-          <mac-os-control-btn
-            class="top-btn"
-            :hidden="['remove']"
-            @close="deleteHandle"
-            @resize="handleLoadThreeModel"
-          ></mac-os-control-btn>
-        </div>
-        <!-- 中间 -->
         <div class="list-content-img">
-          <LoadThreeModelImage v-if="showThreeModel" :threeModelPath="cardData.threeModelFilePath" />
           <n-image
-            object-fit="contain"
+            object-fit="fill"
             height="180"
+            width="350"
             preview-disabled
-            v-else
-            :src="requireUrl('ThreeModelDefault.svg')"
+            :src="requestImag(cardData.imageUrl)"
+            :alt="cardData.name"
             :fallback-src="requireErrorImg()"
           ></n-image>
         </div>
       </div>
       <template #action>
         <div class="go-flex-items-center list-footer" justify="space-between">
-          <n-text @click="handleFocus">
-            <n-button v-show="!focus" secondary size="tiny">
-              <span class="title">
-                {{ cardData.name || cardData.id }}
-              </span>
-            </n-button>
-          </n-text>
-          <n-input
-            v-show="focus"
-            ref="inputInstRef"
-            size="small"
-            type="text"
-            maxlength="16"
-            show-count
-            v-model:value.trim="title"
-            @keyup.enter="handleBlur"
-            @blur="handleBlur"
-          ></n-input>
+          <div style="display: flex; flex-direction: column; align-items: start">
+            <n-text @click="handleFocus">
+              <n-button v-show="!focus" secondary size="tiny">
+                <span class="title">
+                  {{ cardData.name || cardData.id }}
+                </span>
+              </n-button>
+            </n-text>
+            <n-input
+              v-show="focus"
+              ref="inputInstRef"
+              size="small"
+              type="text"
+              maxlength="16"
+              show-count
+              v-model:value.trim="title"
+              @keyup.enter="handleBlur"
+              @blur="handleBlur"
+            ></n-input>
+            <n-text style="font-size: 12px; margin-left: 6px">{{ cardData.createTime }}</n-text>
+          </div>
           <!-- 工具 -->
           <div class="go-flex-items-center list-footer-ri">
             <n-space>
@@ -97,10 +90,8 @@
 import { reactive, ref, PropType, nextTick } from 'vue'
 import { renderIcon, renderLang, requireErrorImg } from '@/utils'
 import { icon } from '@/plugins'
-import { MacOsControlBtn } from '@/components/Tips/MacOsControlBtn'
 import { ChartType } from '../..'
 import { updateThreeJsModel } from '@/api/external/contentSave/content'
-import LoadThreeModelImage from '../LoadThreeModelImage.vue'
 
 const { EllipsisHorizontalCircleSharpIcon, TrashIcon, HammerIcon, SendIcon } = icon.ionicons5
 
@@ -110,21 +101,17 @@ const props = defineProps({
   cardData: Object as PropType<ChartType>
 })
 
+// 处理url获取
+const requireUrl = (name: string) => {
+  return new URL(`../../../../../assets/images/${name}`, import.meta.url).href
+}
+
 const focus = ref<boolean>(false)
 
 const inputInstRef = ref(null)
 
 const title = ref<string>('')
 
-const showThreeModel = ref(false)
-
-const handleLoadThreeModel = () => (showThreeModel.value = true)
-
-// 处理url获取
-const requireUrl = (name: string) => {
-  return new URL(`../../../../../assets/images/${name}`, import.meta.url).href
-}
-
 const fnBtnList = reactive([
   {
     label: renderLang('global.r_edit'),
@@ -180,11 +167,6 @@ const releaseHandle = () => {
   emit('release', props.cardData)
 }
 
-// // 放大处理
-// const resizeHandle = () => {
-//   emit('resize', props.cardData)
-// }
-
 const handleFocus = () => {
   focus.value = true
   nextTick(() => {
@@ -202,6 +184,10 @@ const handleBlur = async () => {
   emit('inputUpdateCard')
   window['$message'].success(window['$t']('common.operationSuccessText'))
 }
+
+const requestImag = (imageUrl: string | undefined) => {
+  return !imageUrl ? requireUrl('ThreeModelDefault.svg') : imageUrl
+}
 </script>
 
 <style lang="scss" scoped>
@@ -215,12 +201,10 @@ $contentHeight: 180px;
     @include hover-border-color('hover-border-color');
   }
   .list-content {
-    margin-top: 20px;
-    margin-bottom: 5px;
     cursor: pointer;
     border-radius: $--border-radius-base;
-    @include background-image('background-point');
-    @extend .go-point-bg;
+    // @include background-image('background-point');
+    // @extend .go-point-bg;
     &-top {
       position: absolute;
       top: 10px;

@@ -6,14 +6,14 @@ import { getThreeJsModelList, putThreeJsModelRelease, threeJsDeleteApi } from '@
 import { PaginationResult } from '/#/external/axios'
 
 // 数据初始化
-export const useDataListInit = () => {
+export const useDataListInit = (formValue: { name: string; state: string | null }) => {
   const loading = ref(true)
 
   const pagination = reactive({
     // 当前页数
     page: 1,
     // 每页值
-    pageSize: 12,
+    pageSize: 8,
     // 总数
     count: 10
   })
@@ -23,9 +23,17 @@ export const useDataListInit = () => {
   // 数据请求
   const fetchList = async () => {
     loading.value = true
+    const searchParams: Recordable = {}
+    if (Reflect.get(formValue, 'name')) {
+      searchParams['name'] = formValue.name
+    }
+    if (Reflect.get(formValue, 'state')) {
+      searchParams['state'] = formValue.state === 'yes' ? 1 : 0
+    }
     const res = await getThreeJsModelList({
       page: pagination.page,
-      pageSize: pagination.pageSize
+      pageSize: pagination.pageSize,
+      ...searchParams
     })
     if (res) {
       const { host, protocol } = location
@@ -47,6 +55,8 @@ export const useDataListInit = () => {
 
   const inputUpdateHandle = () => fetchList()
 
+  const handleSearchClick = () => fetchList()
+
   // 修改页数
   const changePage = (_page: number) => {
     pagination.page = _page
@@ -106,6 +116,7 @@ export const useDataListInit = () => {
     changePage,
     deleteHandle,
     releaseHandle,
-    inputUpdateHandle
+    inputUpdateHandle,
+    handleSearchClick
   }
 }

 <template>
   <div class="go-items-list">
+    <!-- 搜索区域 -->
+    <n-form ref="formRef" label-placement="left" label-width="auto" :model="formValue" :size="formSize">
+      <n-grid :cols="24" :x-gap="24">
+        <n-grid-item :span="6" label="Input" path="name">
+          <n-form-item label="名称" path="name">
+            <n-input v-model:value="formValue.name" placeholder="输入名称" />
+          </n-form-item>
+        </n-grid-item>
+        <n-grid-item :span="6" label="Select" path="state">
+          <n-form-item label="状态" path="state">
+            <n-select v-model:value="formValue.state" placeholder="选择状态" :options="statusOptions" />
+          </n-form-item>
+        </n-grid-item>
+        <n-grid-item :span="8">
+          <n-button type="primary" @click="handleSearchClick">
+            <template #icon>
+              <n-icon>
+                <SearchIcon />
+              </n-icon>
+            </template>
+            查询
+          </n-button>
+          <n-button style="margin-left: 20px" @click="handleResetClick">
+            <template #icon>
+              <n-icon>
+                <ReloadSearch />
+              </n-icon>
+            </template>
+            重置
+          </n-button>
+        </n-grid-item>
+      </n-grid>
+    </n-form>
     <div v-show="loading">
       <go-loading></go-loading>
     </div>
     <div v-show="!loading">
-      <n-grid :x-gap="20" :y-gap="20" cols="2 s:2 m:3 l:4 xl:4 xxl:4" responsive="screen">
+      <div style="display: flex; flex-direction: row-reverse">
+        <n-space>
+          <n-button type="primary" @click="handleOpenThreeEditor"> 新增 </n-button>
+          <!-- <n-button disabled> 批量操作 </n-button>  -->
+        </n-space>
+      </div>
+      <n-grid style="margin-top: 16px" :x-gap="20" :y-gap="20" cols="2 s:2 m:3 l:4 xl:4 xxl:4" responsive="screen">
         <n-grid-item v-for="(item, index) in list" :key="item.id">
           <div style="display: none">{{ index }}</div>
           <project-items-card
@@ -23,11 +62,13 @@
         :page="pagination.page"
         :page-size="pagination.pageSize"
         :item-count="pagination.count"
-        :page-sizes="[12, 24, 36, 48]"
+        :page-sizes="[8, 16, 24, 32]"
         @update:page="changePage"
         @update:page-size="changeSize"
         show-size-picker
-      />
+      >
+        <template #prefix> 共 {{ pagination.count }} 条 </template>
+      </n-pagination>
     </div>
   </div>
   <project-items-modal-card
@@ -44,10 +85,58 @@ import { ProjectItemsCard } from '../ProjectItemsCard/index'
 import { ProjectItemsModalCard } from '../ProjectItemsModalCard/index'
 import { useModalDataInit } from './hooks/useModal.hook'
 import { useDataListInit } from './hooks/useData.hook'
+import { ref } from 'vue'
+import type { FormInst } from 'naive-ui'
+import { icon } from '@/plugins'
+import { getUUID } from '@/utils/utils'
+
+const { SearchIcon, ReloadSearch } = icon.ionicons5
 
 const { modalData, modalShow, closeModal, resizeHandle, editHandle } = useModalDataInit()
 
-const { loading, pagination, list, changeSize, changePage, deleteHandle, releaseHandle, inputUpdateHandle } = useDataListInit()
+const formRef = ref<FormInst | null>(null)
+
+const formSize = ref('medium')
+
+const formValue = ref({
+  name: '',
+  state: null
+})
+
+const statusOptions = ref([
+  {
+    label: '已发布',
+    value: 'yes'
+  },
+  {
+    label: '未发布',
+    value: 'no'
+  }
+])
+
+const {
+  loading,
+  pagination,
+  list,
+  changeSize,
+  changePage,
+  deleteHandle,
+  releaseHandle,
+  inputUpdateHandle,
+  handleSearchClick
+} = useDataListInit(formValue.value)
+
+const handleResetClick = () => {
+  formValue.value.name = ''
+  formValue.value.state = null
+  handleSearchClick()
+}
+
+const handleOpenThreeEditor = () => {
+  const { host, protocol, pathname } = location
+  const randomId = getUUID(32)
+  window.open(`${protocol}//${host}${pathname}editor/?three_file_uuid=${randomId}&action_type=create`)
+}
 </script>
 
 <style lang="scss" scoped>
@@ -55,16 +144,15 @@ $contentHeight: 250px;
 @include go('items-list') {
   display: flex;
   flex-direction: column;
-  justify-content: space-between;
   min-height: calc(100vh - #{$--header-height} * 2 - 2px);
   .list-content {
     position: relative;
     height: $contentHeight;
   }
   .list-pagination {
-    display: flex;
-    justify-content: flex-end;
-    margin-top: 20px;
+    position: fixed;
+    bottom: 30px;
+    right: 30px;
   }
 }
 </style>

@@ -8,6 +8,7 @@ export type ChartType = {
   state?: number
   name?: string
   threeModelFilePath?: string
+  imageUrl?: string | undefined
 }
 
 export type ChartList = ChartType[]

@@ -13,44 +13,29 @@
   >
     <div class="go-project-sider-flex">
       <aside>
-        <n-space vertical class="go-project-sider-top">
-          <project-layout-create :collapsed="collapsed"></project-layout-create>
-        </n-space>
         <n-menu
-          :value="menuValue"
           :options="menuOptions"
           :collapsed-width="getAsideCollapsedWidth"
           :collapsed-icon-size="22"
-          :default-expanded-keys="defaultExpandedKeys"
-       ></n-menu>
+          default-value="three-project"
+        ></n-menu>
       </aside>
-      <!-- 底部提示 -->
-      <!-- <div class="sider-bottom">
-        <project-layout-aside-footer :collapsed="collapsed"></project-layout-aside-footer>
-      </div> -->
     </div>
   </n-layout-sider>
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted, onUnmounted, toRefs } from 'vue'
-import { ProjectLayoutCreate } from '../ProjectLayoutCreate/index'
-import { ProjectLayoutAsideFooter } from '../ProjectLayoutAsideFooter/index'
+import { ref, onMounted, onUnmounted, toRefs } from 'vue'
 import { asideWidth } from '@/settings/designSetting'
-import { useRoute } from 'vue-router'
 import { useSettingStore } from '@/store/modules/settingStore/settingStore'
-import { menuOptionsInit, expandedKeys } from './menu'
+import { menuOptionsInit } from './menu'
 
 const collapsed = ref<boolean>(false)
-const { getAsideCollapsedWidth } = toRefs(useSettingStore())
 
-const route = useRoute()
-const menuValue = computed(() => route.name)
+const { getAsideCollapsedWidth } = toRefs(useSettingStore())
 
 const menuOptions = menuOptionsInit()
 
-const defaultExpandedKeys = expandedKeys()
-
 const watchWidth = () => {
   const Width = document.body.clientWidth
   if (Width <= 950) {
@@ -62,7 +47,7 @@ onMounted(() => {
   window.addEventListener('resize', watchWidth)
 })
 
-onUnmounted(()=> {
+onUnmounted(() => {
   window.removeEventListener('resize', watchWidth)
 })
 </script>

 import { reactive, h } from 'vue'
 import { renderIcon } from '@/utils'
-import { RouterLink } from 'vue-router'
-import { PageEnum } from '@/enums/pageEnum'
 import { MenuOption, MenuGroupOption } from 'naive-ui'
 import { icon } from '@/plugins'
 
-const { TvOutlineIcon } = icon.ionicons5
 const { DevicesIcon } = icon.carbon
+
 export const renderMenuLabel = (option: MenuOption | MenuGroupOption) => {
   return option.label
 }
 
-export const expandedKeys = () => ['three-project']
+export const expandedKeys = () => 'three-project'
 
 export const menuOptionsInit = () => {
   const t = window['$t']
-
   return reactive([
     {
-      key: 'divider-1',
-      type: 'divider'
-    },
-    {
-      label: () => h('span', null, { default: () => t('project.project') }),
+      label: () => h('span', null, { default: () => t('project.three_project') }),
       key: 'three-project',
-      icon: renderIcon(DevicesIcon),
-      children: [
-        {
-          type: 'group',
-          label: () => h('span', null, { default: () => t('project.three_project') }),
-          key: 'my-three-project',
-          children: [
-            {
-              label: () =>
-                h(
-                  RouterLink,
-                  {
-                    to: {
-                      name: PageEnum.THREE_HOME_ITEMS_NAME
-                    }
-                  },
-                  { default: () => t('project.all_project') }
-                ),
-              key: PageEnum.THREE_HOME_ITEMS_NAME,
-              icon: renderIcon(TvOutlineIcon)
-            }
-          ]
-        }
-      ]
+      icon: renderIcon(DevicesIcon)
     }
   ])
 }