From d05f9ab130f703ea41a9a1b378456cf7b381a8e8 Mon Sep 17 00:00:00 2001
From: ko1234 <ko.ko@mjmtech.com.tw>
Date: Fri, 6 Dec 2024 17:18:18 +0800
Subject: [PATCH] =?UTF-8?q?forge=E5=AE=9A=E4=BD=8D=E4=BF=AE=E6=94=B9=20|?=
 =?UTF-8?q?=20=E9=81=8B=E7=B6=AD=E5=A4=A7=E9=A1=9E=E5=B0=8F=E9=A1=9E?=
 =?UTF-8?q?=E6=90=9C=E5=B0=8B=E3=80=81=E5=BB=A0=E5=95=86=E9=9D=9E=E5=BF=85?=
 =?UTF-8?q?=E5=A1=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apis/asset/index.js                       |  4 +--
 src/components/forge/Forge.vue                | 34 +++++++++++++++++--
 src/components/forge/ForgeForSystem.vue       | 16 ++++++++-
 src/hooks/forge/useForgeSprite.js             | 30 ++++++++++------
 .../components/AssetSubList.vue               |  4 +--
 .../components/OperationActionButton.vue      | 14 ++------
 .../operation/components/OperationSearch.vue  | 23 ++-----------
 .../components/OperationSearchSubSys.vue      | 31 +++++++++++------
 .../components/OperationTableModal.vue        | 17 ++++------
 9 files changed, 102 insertions(+), 71 deletions(-)

diff --git a/src/apis/asset/index.js b/src/apis/asset/index.js
index 91a9098..d50854b 100644
--- a/src/apis/asset/index.js
+++ b/src/apis/asset/index.js
@@ -17,8 +17,8 @@ import instance from "@/util/request";
 import apihandler from "@/util/apihandler";
 import { object } from "yup";
 
-export const getAssetSubList = async (variable_id) => {
-  const res = await instance.post(GET_ASSET_SUB_LIST_API, { variable_id });
+export const getAssetSubList = async (id) => {
+  const res = await instance.post(GET_ASSET_SUB_LIST_API, { id });
 
   return apihandler(res.code, res.data, {
     msg: res.msg,
diff --git a/src/components/forge/Forge.vue b/src/components/forge/Forge.vue
index 5013130..e55b62d 100644
--- a/src/components/forge/Forge.vue
+++ b/src/components/forge/Forge.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { ref, onMounted, onUnmounted } from "vue";
 
-const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL; 
+const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
 
 const forgeDom = ref(null);
 let viewer = null;
@@ -34,6 +34,20 @@ const initViewer = (container) => {
   });
 };
 
+// 設置攝影機位置
+const setCameraPosition = (position, target) => {
+  const nav = viewer.navigation;
+  // 使用 THREE.Vector3 定義位置與焦點
+  const newPosition = new THREE.Vector3(position.x, position.y, position.z);
+  const newTarget = new THREE.Vector3(target.x, target.y, target.z);
+
+  // 設定攝影機的新位置與焦點
+  nav.setView(newPosition, newTarget);
+  console.log("攝影機定位完成:");
+  console.log("新位置:", newPosition);
+  console.log("新焦點:", newTarget);
+};
+
 // 使用本地 .svf 文件加載模型
 const loadModel = (filePath) => {
   return new Promise((resolve, reject) => {
@@ -43,6 +57,21 @@ const loadModel = (filePath) => {
       (model) => {
         viewer.impl.invalidate(true);
         viewer.fitToView();
+        // 設置攝影機位置
+        setTimeout(() => {
+          setCameraPosition(
+            {
+              x: -212.33421531428007,
+              y: 299.3895400707608,
+              z: 157.48711907404862,
+            }, // 攝影機的新位置
+            {
+              x: 151.61159898775077,
+              y: -196.55136189609067,
+              z: -136.47282256290345,
+            } // 攝影機的焦點
+          );
+        }, 500);
         resolve(model);
         console.log("模型加載完成");
       },
@@ -54,7 +83,7 @@ const loadModel = (filePath) => {
 onMounted(async () => {
   console.log("Forge 加載");
   await initViewer(forgeDom.value);
-  const filePath = `${FILE_BASEURL}/upload/forge/0.svf`; 
+  const filePath = `${FILE_BASEURL}/upload/forge/0.svf`;
   loadModel(filePath);
 });
 
@@ -85,5 +114,4 @@ onUnmounted(() => {
   display: none;
   bottom: 200px;
 }
-
 </style>
diff --git a/src/components/forge/ForgeForSystem.vue b/src/components/forge/ForgeForSystem.vue
index 9181cd2..4c9bb8a 100644
--- a/src/components/forge/ForgeForSystem.vue
+++ b/src/components/forge/ForgeForSystem.vue
@@ -30,7 +30,7 @@ const props = defineProps({
 });
 const store = useHeatmapBarStore();
 
-const { updateDataVisualization, createSprites, showSubSystemObjects, forgeClickListener, clear } = useForgeSprite()
+const { updateDataVisualization, createSprites, showSubSystemObjects, forgeClickListener, clear, setCameraPosition } = useForgeSprite()
 
 const forgeDom = ref(null);
 
@@ -80,6 +80,20 @@ const loadModel = (viewer, filePath) => {
       (model) => {
         viewer.impl.invalidate(true);
         viewer.fitToView();
+        setTimeout(() => {
+          setCameraPosition(
+            {
+              x: 241.40975707867645,
+              y: -260.4481491801548,
+              z: 129.5719879121458,
+            }, // 攝影機的新位置
+            {
+              x: -183.36302786348594,
+              y: 194.05657710941966,
+              z: -149.3902249981004,
+            } // 攝影機的焦點
+          );
+        }, 500);
         updateDataVisualization(viewer)
         resolve(model);
         console.log("模型加載完成");
diff --git a/src/hooks/forge/useForgeSprite.js b/src/hooks/forge/useForgeSprite.js
index 3e8ccca..d0abad8 100644
--- a/src/hooks/forge/useForgeSprite.js
+++ b/src/hooks/forge/useForgeSprite.js
@@ -1,7 +1,7 @@
 import { watch, inject, markRaw, ref, computed, provide } from "vue";
 import useAlarmStore from "@/stores/useAlarmStore";
 import hexToRgb from "@/util/hexToRgb";
-import useSystemShowData from "@/hooks/useSystemShowData"
+import useSystemShowData from "@/hooks/useSystemShowData";
 import useForgeHeatmap from "./useForgeHeatmap";
 import useForgeFloor from "./useForgeFloor";
 
@@ -14,7 +14,19 @@ export default function useForgeSprite() {
   let lastClickedDbId = null;
 
   const { createHeatMap, updateViewExtension } = useForgeHeatmap();
-  const {  updateViewerFloor } = useForgeFloor();
+  const { updateViewerFloor } = useForgeFloor();
+
+  const setCameraPosition = (position, target) => {
+    // 使用 THREE.Vector3 定義位置與焦點
+    const newPosition = new THREE.Vector3(position.x, position.y, position.z);
+    const newTarget = new THREE.Vector3(target.x, target.y, target.z);
+
+    // 設定攝影機的新位置與焦點
+    forgeViewer.value.navigation.setView(newPosition, newTarget);
+
+    // 確保 Home 視角
+    forgeViewer.value.autocam.setCurrentViewAsHome(true); 
+  };
 
   const updateDataVisualization = async (viewer) => {
     if (!forgeViewer.value) {
@@ -26,7 +38,7 @@ export default function useForgeSprite() {
     );
     dataVizExtn.value = markRaw(dataVisualization);
     updateViewExtension(markRaw(viewer), markRaw(dataVisualization));
-    updateViewerFloor(markRaw(viewer), markRaw(dataVisualization))
+    updateViewerFloor(markRaw(viewer), markRaw(dataVisualization));
   };
 
   function onSpriteClicked(event) {
@@ -51,7 +63,7 @@ export default function useForgeSprite() {
     }
   }
 
-  const { flatSubData } = useSystemShowData()
+  const { flatSubData } = useSystemShowData();
 
   // 創建 sprites
   const createSprites = async () => {
@@ -135,7 +147,7 @@ export default function useForgeSprite() {
     );
   };
 
-  const cardfitToView = async ([forge_dbid,spriteDbId]) => {
+  const cardfitToView = async ([forge_dbid, spriteDbId]) => {
     try {
       // 相機調整
       const nav = forgeViewer.value.navigation;
@@ -149,7 +161,6 @@ export default function useForgeSprite() {
       const fov = nav.getVerticalFov();
       nav.setRequestTransition(true, camera.position, target, fov);
 
-      
       if (lastClickedDbId !== null && lastClickedDbId !== spriteDbId) {
         dataVizExtn.value.invalidateViewables([lastClickedDbId], (viewable) => {
           return {
@@ -157,7 +168,7 @@ export default function useForgeSprite() {
           };
         });
       }
-      
+
       dataVizExtn.value.invalidateViewables([spriteDbId], (viewable) => {
         return {
           scale: 2.0, // 設置為 scale 2
@@ -165,12 +176,10 @@ export default function useForgeSprite() {
       });
 
       lastClickedDbId = spriteDbId;
-  
     } catch (error) {
       console.error("Error in cardfitToView:", error);
     }
   };
-  
 
   const hideAllObjects = () => {
     const tree = forgeViewer.value.model.getInstanceTree();
@@ -201,10 +210,9 @@ export default function useForgeSprite() {
     forgeViewer.value.tearDown();
   };
 
-
-
   return {
     createSprites,
+    setCameraPosition,
     updateDataVisualization,
     showSubSystemObjects,
     forgeClickListener,
diff --git a/src/views/AssetManagement/components/AssetSubList.vue b/src/views/AssetManagement/components/AssetSubList.vue
index fb21c15..80f96a1 100644
--- a/src/views/AssetManagement/components/AssetSubList.vue
+++ b/src/views/AssetManagement/components/AssetSubList.vue
@@ -10,7 +10,7 @@ const { items, changeActiveBtn, setItems, selectedBtn } = useActiveBtn();
 
 const getSubSystems = async (id) => {
   const res = await getAssetSubList(id);
-  sub = res.data.map((d, index) => ({
+  const sub = res.data.map((d, index) => ({
     ...d,
     title: d.system_key,
     key: d.id,
@@ -34,7 +34,7 @@ watch(
   () => searchParams,
   (newValue) => {
     if(newValue.value.mainSys_id){
-      getSubSystems(newValue.value.mainSys_id);
+      getSubSystems(parseInt(newValue.value.mainSys_id));
     }
   },
   {
diff --git a/src/views/operation/components/OperationActionButton.vue b/src/views/operation/components/OperationActionButton.vue
index 21f1eef..1508e8b 100644
--- a/src/views/operation/components/OperationActionButton.vue
+++ b/src/views/operation/components/OperationActionButton.vue
@@ -63,18 +63,10 @@ watch(
 
     if (newValue.work_type === "3") {
       isSearchDisabled.value = false;
+      initSubmit(true);
     } else if (newSelected) {
-      if (newValue.search_type === "date") {
-        isSearchDisabled.value = !(
-          keys.length ===
-          newSelected?.params.length + 2
-        );
-
-        initSubmit(keys.length === newSelected?.params.length + 2);
-      } else if (newValue.search_type === "serial") {
-        isSearchDisabled.value = !(keys.length === newSelected?.params.length);
-        initSubmit(keys.length === newSelected?.params.length);
-      }
+      isSearchDisabled.value = !searchParams.value.sub_system_tag;
+      initSubmit(searchParams.value.sub_system_tag);
     }
   },
   {
diff --git a/src/views/operation/components/OperationSearch.vue b/src/views/operation/components/OperationSearch.vue
index b94375e..6c0bcd6 100644
--- a/src/views/operation/components/OperationSearch.vue
+++ b/src/views/operation/components/OperationSearch.vue
@@ -9,7 +9,6 @@ import { twMerge } from "tailwind-merge";
 import { useI18n } from "vue-i18n";
 const { t, locale } = useI18n();
 const { searchParams, changeParams } = useSearchParam();
-const { search } = inject("operation_table");
 
 const form = ref(null);
 
@@ -48,7 +47,9 @@ const setButtonItems = () => {
       title: t("operation.company_info"),
       key: "company_info",
       active: false,
-      active: searchParams.value.work_type === null,
+      active:
+        searchParams.value.work_type === null ||
+        searchParams.value.work_type === "3",
       work_type: 3,
       params: [],
     },
@@ -93,7 +94,6 @@ watch(
             searchParams.value[key] ?? null,
           ])
         );
-
         changeParams({
           ...oldSearchParams,
           work_type: newWorkType?.work_type,
@@ -103,22 +103,6 @@ watch(
     }
   }
 );
-
-watch(
-  searchParams,
-  (newValue, oldValue) => {
-    if (
-      newValue.work_type &&
-      oldValue.work_type &&
-      newValue.work_type !== oldValue.work_type
-    ) {
-      search();
-    }
-  },
-  {
-    deep: true,
-  }
-);
 </script>
 
 <template>
@@ -154,7 +138,6 @@ watch(
       <OperationSearchType :selected="selectedSearchType" />
       <OperationActionButton :selectedWorkType="selectedWorkType" />
     </div>
-   
   </form>
 </template>
 
diff --git a/src/views/operation/components/OperationSearchSubSys.vue b/src/views/operation/components/OperationSearchSubSys.vue
index bfef454..4ca981c 100644
--- a/src/views/operation/components/OperationSearchSubSys.vue
+++ b/src/views/operation/components/OperationSearchSubSys.vue
@@ -1,12 +1,12 @@
 <script setup>
 import { getAssetMainList, getAssetSubList } from "@/apis/asset";
-import { computed, onMounted, ref, watch } from "vue";
+import { computed, onMounted, ref, watch,inject } from "vue";
 import useSearchParam from "@/hooks/useSearchParam";
 import useActiveBtn from "@/hooks/useActiveBtn";
 import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 const { searchParams, changeParams } = useSearchParam();
-
+const { search } = inject("operation_table");
 // 選大類
 const {
   items: sysMainTagItems,
@@ -58,20 +58,29 @@ watch(selectedMainSysItems, (newValue) => {
     mainSys_id: newValue.key,
     sub_system_tag: null,
   });
+  getSubSystems(newValue.key);
 });
 
-// watch(selectedSysItems, (newValue) => {
-//   changeParams({
-//     ...searchParams.value,
-//     sub_system_tag: newValue.map((d) => d.key),
-//   });
-// });
+watch(selectedSysItems, (newValue) => {
+  changeParams({
+    ...searchParams.value,
+    sub_system_tag: newValue.map((d) => d.key),
+  });
+});
 
 watch(
-  () => searchParams,
+  searchParams,
   (newValue, oldValue) => {
-    if (newValue.mainSys_id && newValue.mainSys_id !== oldValue.mainSys_id) {
-      getSubSystems(newValue.value.mainSys_id);
+    if (
+      newValue.work_type &&
+      oldValue.work_type &&
+      newValue.work_type !== oldValue.work_type
+    ) {
+      changeParams({
+        ...searchParams.value,
+        sub_system_tag: sysTagItems.value.map((item) => item.key)[0],
+      });
+      search();
     }
   },
   {
diff --git a/src/views/operation/components/OperationTableModal.vue b/src/views/operation/components/OperationTableModal.vue
index 875340e..636c483 100644
--- a/src/views/operation/components/OperationTableModal.vue
+++ b/src/views/operation/components/OperationTableModal.vue
@@ -72,16 +72,13 @@ const formState = ref([
 
 let companySchema = yup.object({
   name: yup.string().required(t("button.required")),
-  contact_person: yup.string().required(t("button.required")),
-  email: yup.string().email().required(t("button.required")),
-  phone: yup
-    .string()
-    .phone("TW", t("button.phone_format"))
-    .required(t("button.required")),
-  city: yup.string().required(t("button.required")),
-  address: yup.string().required(t("button.required")),
-  tax_id_number: yup.string().required(t("button.required")),
-  remark: yup.string().required(t("button.required")),
+  contact_person: yup.string().nullable(true),
+  email: yup.string().email().nullable(true),
+  phone: yup.string().nullable(true),
+  city: yup.string().nullable(true),
+  address: yup.string().nullable(true),
+  tax_id_number: yup.string().nullable(true),
+  remark: yup.string().nullable(true),
 });
 
 let maintainSchema = yup.object({