feat(src/packages): 优化三维模型灯光选择对应灯光进行配置

@@ -5,7 +5,7 @@ import cloneDeep from 'lodash/cloneDeep'
 import { chartInitConfig } from '@/settings/designSetting'
 import { chartInitConfig } from '@/settings/designSetting'
 
 
 export const option = {
 export const option = {
-  dataset: [new URL('/src/assets/external/three/test.obj', import.meta.url).href],//三维数据源
+  dataset: [new URL('/src/assets/external/three/test.obj', import.meta.url).href], //三维数据源
   backgroundColor: '', //场景背景色
   backgroundColor: '', //场景背景色
   backgroundAlpha: 0, //场景透明度
   backgroundAlpha: 0, //场景透明度
   enableDamping: false, //是否启用阻尼
   enableDamping: false, //是否启用阻尼
@@ -18,7 +18,9 @@ export const option = {
    */
    */
   outputEncoding: 'liner',
   outputEncoding: 'liner',
   clearScene: false, //是否清空场景内容
   clearScene: false, //是否清空场景内容
-  lights: [//灯光为数组，type 为 环境光(AmbientLight) | 方向光(DirectionalLight) | 点光(PointLight) | 半球光(HemisphereLight)
+  lightInput: 1,
+  lights: [
+    //灯光为数组，type 为 环境光(AmbientLight) | 方向光(DirectionalLight) | 点光(PointLight) | 半球光(HemisphereLight)
     {
     {
       type: 'AmbientLight',
       type: 'AmbientLight',
       label: '环境光(只有颜色)',
       label: '环境光(只有颜色)',
@@ -54,38 +56,41 @@ export const option = {
     size: 1,
     size: 1,
     show: false
     show: false
   },
   },
-  position: [//模型位置
+  position: [
+    //模型位置
     {
     {
       x: 0,
       x: 0,
       y: 0,
       y: 0,
       z: 0
       z: 0
     }
     }
   ],
   ],
-  rotation: [//模型旋转
+  rotation: [
+    //模型旋转
     {
     {
       x: 0,
       x: 0,
       y: 0,
       y: 0,
       z: 0
       z: 0
     }
     }
   ],
   ],
-  showFps:false,//是否显示fps
-  labels:[ //添加图片/文字标签，暂且支持文字
+  showFps: false, //是否显示fps
+  labels: [
+    //添加图片/文字标签，暂且支持文字
     {
     {
-      image: "",
-      text: "",
+      image: '',
+      text: '',
       textStyle: {
       textStyle: {
-        fontFamily: "Arial",
+        fontFamily: 'Arial',
         fontSize: 18,
         fontSize: 18,
-        fontWeight: "normal",
+        fontWeight: 'normal',
         lineHeight: 1,
         lineHeight: 1,
-        color: "#ffffff",
+        color: '#ffffff',
         borderWidth: 8,
         borderWidth: 8,
         borderRadius: 4,
         borderRadius: 4,
-        borderColor: "rgba(0,0,0,1)",
-        backgroundColor: "rgba(0, 0, 0, 1)"
+        borderColor: 'rgba(0,0,0,1)',
+        backgroundColor: 'rgba(0, 0, 0, 1)'
       },
       },
-      position: {x:0, y:0, z:0},
-      scale:{x:1, y:1, z:0},
+      position: { x: 0, y: 0, z: 0 },
+      scale: { x: 1, y: 1, z: 0 },
       sid: null
       sid: null
     }
     }
   ]
   ]

@@ -11,15 +11,15 @@
         <n-input-number :min="0" v-model:value="optionData.borderConfig.size" size="small" />
         <n-input-number :min="0" v-model:value="optionData.borderConfig.size" size="small" />
       </setting-item>
       </setting-item>
     </setting-item-box>
     </setting-item-box>
-    <setting-item-box  name="上传文件">
+    <setting-item-box name="上传文件">
       <setting-item>
       <setting-item>
         <FileUpload
         <FileUpload
-        :max="100"
-        :fileList="optionData.dataset"
-        :threeSupportFileFormat="threeSupportFileFormat"
-        :singleFileType="singleFileTypeNotMtl"
-        @fileStaticUri="handleFileStaticUri"
-      />
+          :max="100"
+          :fileList="optionData.dataset"
+          :threeSupportFileFormat="threeSupportFileFormat"
+          :singleFileType="singleFileTypeNotMtl"
+          @fileStaticUri="handleFileStaticUri"
+        />
       </setting-item>
       </setting-item>
     </setting-item-box>
     </setting-item-box>
     <setting-item-box :alone="true">
     <setting-item-box :alone="true">
@@ -78,8 +78,13 @@
         </template>
         </template>
       </setting-item>
       </setting-item>
     </setting-item-box>
     </setting-item-box>
+    <setting-item-box name="灯光选择">
+      <setting-item name="灯光选择((0,环境光),(1,方向光),(2,点光),(3,半球光))">
+        <n-input-number :min="0" :max="3" v-model:value="optionData.lightInput" size="small" />
+      </setting-item>
+    </setting-item-box>
     <setting-item-box name="灯光配置">
     <setting-item-box name="灯光配置">
-      <setting-item v-for="(item, index) in optionData.lights" :name="item.label" :key="index">
+      <setting-item v-for="(item, index) in [optionData.lights[optionData.lightInput]]" :name="item.label" :key="index">
         <n-color-picker
         <n-color-picker
           v-if="!includeHemisphereLight.includes(item.type)"
           v-if="!includeHemisphereLight.includes(item.type)"
           size="small"
           size="small"

 <template>
 <template>
-  <div class="go-content-box" :style="{ border: !borderConfig.show ? 'none' : ''}">
+  <div class="go-content-box" :style="{ border: !borderConfig.show ? 'none' : '' }">
     <div v-if="useDetectWebGLContext()">
     <div v-if="useDetectWebGLContext()">
       <vue3dLoader
       <vue3dLoader
         ref="vue3dLoaderRef"
         ref="vue3dLoaderRef"
@@ -20,7 +20,7 @@
         @load="onLoad"
         @load="onLoad"
         :position="position"
         :position="position"
         :rotation="rotation"
         :rotation="rotation"
-        :lights="lights"
+        :lights="[lights[lightInput]]"
         :showFps="showFps"
         :showFps="showFps"
         :labels="labels"
         :labels="labels"
       />
       />
@@ -96,12 +96,13 @@ const {
   rotation,
   rotation,
   lights,
   lights,
   showFps,
   showFps,
-  labels
+  labels,
+  lightInput
 } = toRefs(props.chartConfig.option) as any
 } = toRefs(props.chartConfig.option) as any
 
 
 watch(dataset, (newData: string) => {
 watch(dataset, (newData: string) => {
   //dateset为空则清除场景
   //dateset为空则清除场景
-  if(!newData) clearScene.value=true
+  if (!newData) clearScene.value = true
 })
 })
 </script>
 </script>