reactor:随手拍大屏;

src/views/snapshot/right-bottom.vue

@@ -7,37 +7,23 @@
       </div>
     </div>
     <div class="right-bottom-content">
-      <div class="table-header">
-        <div class="table-header-item">工单编码</div>
-        <div class="table-header-item">当前节点</div>
-        <div class="table-header-item">行业类型</div>
-        <div class="table-header-item">区域</div>
-        <div class="table-header-item">热点类型</div>
-      </div>
-      <div class="scroll" v-loading="loading">
-        <vue3-seamless-scroll
-          :list="list"
-          hover
-          :singleHeight="100"
-          v-if="list.length"
-        >
-          <div class="item" v-for="(item, index) in list" :key="index">
-            <TextTooltip :content="item.no"></TextTooltip>
-            <TextTooltip :content="item.title"></TextTooltip>
-            <TextTooltip :content="item.acceptType"></TextTooltip>
-            <TextTooltip :content="item.county"></TextTooltip>
-            <TextTooltip :content="item.hotspotName"></TextTooltip>
-          </div>
-        </vue3-seamless-scroll>
+      <div style="height: 410px">
+        <scroll-board
+          ref="scrollBoard"
+          :config="config"
+          v-loading="loading"
+          v-if="config.data.length"
+        />
         <empty v-else />
       </div>
     </div>
   </div>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, watch, defineAsyncComponent } from "vue";
+import { ref, onMounted, watch, defineAsyncComponent, reactive } from "vue";
 import { orderView } from "api/home";
 import { Vue3SeamlessScroll } from "vue3-seamless-scroll";
+import { ScrollBoard } from "@kjgl77/datav-vue3";
 
 const TextTooltip = defineAsyncComponent(
   () => import("@/components/TextTooltip/index.vue")
@@ -67,12 +53,21 @@ watch(
   }
 );
 
+const config = reactive({
+  header: ["工单编码", "当前节点", "行业类型", "区域", "热点类型"],
+  data: [],
+  headerBGC: "#213B49",
+  align: ["center", "center", "center", "center", "center"],
+  rowNum: 10,
+});
+
 const loading = ref(false);
 const list = ref([]);
 const getData = async () => {
   loading.value = true;
   try {
     const { result } = await orderView();
+    console.log(result);
     list.value = result;
     loading.value = false;
   } catch (e) {