fix: Format Ts Error

Author: fit2cloud-chenyw

frontend/src/views/dashboard/preview/SQPreviewShow.vue

@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import icon_add_outlined from '@/assets/svg/icon_add_outlined.svg'
-import {reactive, ref, toRefs, onBeforeMount, computed} from 'vue'
-import {load_resource_prepare} from '@/views/dashboard/utils/canvasUtils'
-import {Icon} from '@/components/icon-custom'
-import ResourceTree from "@/views/dashboard/common/ResourceTree.vue";
-import SQPreview from "@/views/dashboard/preview/SQPreview.vue";
-import SQPreviewHead from "@/views/dashboard/preview/SQPreviewHead.vue";
-import EmptyBackground from "@/views/dashboard/common/EmptyBackground.vue";
-import {dashboardStoreWithOut} from "@/stores/dashboard/dashboard.ts";
+import { reactive, ref, toRefs, onBeforeMount, computed } from 'vue'
+import { load_resource_prepare } from '@/views/dashboard/utils/canvasUtils'
+import { Icon } from '@/components/icon-custom'
+import ResourceTree from '@/views/dashboard/common/ResourceTree.vue'
+import SQPreview from '@/views/dashboard/preview/SQPreview.vue'
+import SQPreviewHead from '@/views/dashboard/preview/SQPreviewHead.vue'
+import EmptyBackground from '@/views/dashboard/common/EmptyBackground.vue'
+import { dashboardStoreWithOut } from '@/stores/dashboard/dashboard.ts'
 
 const dashboardStore = dashboardStoreWithOut()
 const previewCanvasContainer = ref(null)
@@ -19,27 +19,27 @@ const state = reactive({
   canvasDataPreview: [],
   canvasStylePreview: {},
   canvasViewInfoPreview: {},
-  dashboardInfo: {},
+  dashboardInfo: {} as any,
   showOffset: {
     top: 110,
-    left: 280
-  }
+    left: 280,
+  },
 })
 
 const props = defineProps({
   showPosition: {
     required: false,
     type: String,
-    default: 'preview'
+    default: 'preview',
   },
   noClose: {
     required: false,
     type: Boolean,
-    default: false
-  }
+    default: false,
+  },
 })
 
-const {showPosition} = toRefs(props)
+const { showPosition } = toRefs(props)
 
 const resourceTreeRef = ref()
 
@@ -54,22 +54,22 @@ const mounted = computed(() => {
   return resourceTreeRef.value?.mounted
 })
 
-
 function createNew() {
   resourceTreeRef.value?.createNewObject()
 }
 
 const loadCanvasData = (params: any) => {
   dataInitState.value = false
-  load_resource_prepare({id: params.id},
-              //@ts-ignore
-      function ({dashboardInfo, canvasDataResult, canvasStyleResult, canvasViewInfoPreview}) {
-        state.canvasDataPreview = canvasDataResult
-        state.canvasStylePreview = canvasStyleResult
-        state.canvasViewInfoPreview = canvasViewInfoPreview
-        state.dashboardInfo = dashboardInfo
-        dataInitState.value = true
-      }
+  load_resource_prepare(
+    { id: params.id },
+    //@ts-ignore
+    function ({ dashboardInfo, canvasDataResult, canvasStyleResult, canvasViewInfoPreview }) {
+      state.canvasDataPreview = canvasDataResult
+      state.canvasStylePreview = canvasStyleResult
+      state.canvasViewInfoPreview = canvasViewInfoPreview
+      state.dashboardInfo = dashboardInfo
+      dataInitState.value = true
+    }
   )
 }
 const getPreviewStateInfo = () => {
@@ -93,55 +93,55 @@ onBeforeMount(() => {
 })
 const sideTreeStatus = ref(true)
 defineExpose({
-  getPreviewStateInfo
+  getPreviewStateInfo,
 })
 </script>
 
 <template>
   <div class="dv-preview dv-teleport-query">
     <el-aside
-        class="resource-area"
-        :class="{ 'close-side': !slideShow, retract: !sideTreeStatus }"
-        ref="node"
+      class="resource-area"
+      :class="{ 'close-side': !slideShow, retract: !sideTreeStatus }"
+      ref="node"
     >
       <resource-tree
-          ref="resourceTreeRef"
-          v-show="slideShow"
-          :cur-canvas-type="'dashboard'"
-          :show-position="showPosition"
-          @node-click="resourceNodeClick"
+        ref="resourceTreeRef"
+        v-show="slideShow"
+        :cur-canvas-type="'dashboard'"
+        :show-position="showPosition"
+        @node-click="resourceNodeClick"
       />
     </el-aside>
     <el-container
-        class="preview-area"
-        :class="{ 'no-data': !state.dashboardInfo }"
-        v-loading="!dataInitState"
+      class="preview-area"
+      :class="{ 'no-data': !state.dashboardInfo }"
+      v-loading="!dataInitState"
     >
       <template v-if="previewShowFlag">
-        <SQPreviewHead :dashboard-info="state.dashboardInfo" @reload="reload"/>
+        <SQPreviewHead :dashboard-info="state.dashboardInfo" @reload="reload" />
         <div ref="previewCanvasContainer" class="content" id="sq-preview-content">
           <SQPreview
-              ref="dashboardPreview"
-              v-if="state.canvasStylePreview && dataInitState"
-              :dashboard-info="state.dashboardInfo"
-              :component-data="state.canvasDataPreview"
-              :canvas-style-data="state.canvasStylePreview"
-              :canvas-view-info="state.canvasViewInfoPreview"
-              :show-position="showPosition"
-              :download-status="downloadStatus"
-              :show-linkage-button="false"
+            ref="dashboardPreview"
+            v-if="state.canvasStylePreview && dataInitState"
+            :dashboard-info="state.dashboardInfo"
+            :component-data="state.canvasDataPreview"
+            :canvas-style-data="state.canvasStylePreview"
+            :canvas-view-info="state.canvasViewInfoPreview"
+            :show-position="showPosition"
+            :download-status="downloadStatus"
+            :show-linkage-button="false"
           ></SQPreview>
         </div>
       </template>
       <template v-else-if="hasTreeData && mounted">
-        <EmptyBackground :description="'Please Select Resource'" img-type="select"/>
+        <EmptyBackground :description="'Please Select Resource'" img-type="select" />
       </template>
       <template v-else-if="mounted">
         <EmptyBackground :description="'No Resource'" img-type="none">
           <el-button v-if="rootManage" @click="createNew" type="primary">
             <template #icon>
               <Icon name="icon_add_outlined">
-                <icon_add_outlined class="svg-icon"/>
+                <icon_add_outlined class="svg-icon" />
               </Icon>
             </template>
             Create Dashboard