feat： demo

src/router/constant.ts

@@ -18,6 +18,7 @@ export const readyRouteName = {
   gena4: 'gena4',
   explorate: 'explorate',
   extract: 'extract',
+  demo: 'demo',
 } as const;
 
 export const writeRouteName = {
@@ -55,6 +56,7 @@ export const readyRouteMeta: RouteMetaRaw = {
   [readyRouteName.ask]: { title: '询问笔录' },
   [readyRouteName.explorate]: { title: '道路交通事故现场勘查笔录' },
   [readyRouteName.extract]: { title: '当事人血样（尿样）提取登记表' },
+  [readyRouteName.demo]: { title: '表格' },
 };
 
 export const writeRouteMeta: RouteMetaRaw<typeof modeFlags.LOGIN> = {

src/router/info.ts

@@ -92,6 +92,12 @@ export const writeRoutesRaw: RoutesRaw<typeof modeFlags.LOGIN> = [
     meta: readyRouteMeta.extract,
     component: () => import("@/views/tables/extract.vue"),
   },
+  {
+    path: "/demo/:id",
+    name: readyRouteName.demo,
+    meta: readyRouteMeta.demo,
+    component: () => import("@/views/tables/demo.vue"),
+  },
 ];
 
 export type RoutesRef<T extends ModeFlag = any> = ComputedRef<{

src/views/scene/index.vue

@@ -14,7 +14,7 @@
         <div class="info-top-left" :class="{ full: viewStatus }">
           <Container @loaded="loaded = true" />
           <template v-if="loaded && !trackMode">
-            <Menus v-if="viewStatus"  @enter-child="childPage = true" @leave-child="childPage = false" />
+            <Menus v-if="viewStatus" @enter-child="childPage = true" @leave-child="childPage = false" />
             <BasePoints v-if="currentView" />
             <FixPoints />
             <Measures />
@@ -50,7 +50,7 @@
         </div>
       </div>
       <div class="info-bottom" :class="{ full: viewStatus }">
-        <div v-for="(i, index) in list">
+        <div v-for="(i, index) in list" @click="goItem(i)">
           <ui-icon :type="i.icon"></ui-icon>
           <span> {{ i.name }}</span>
         </div>
@@ -110,6 +110,12 @@ const viewStatus = ref(false);
 const onScale = () => {
   viewStatus.value = !viewStatus.value;
 };
+const goItem = (item) => {
+  if (item.id == 8) {
+    return;
+  }
+  router.push(`/demo/${item.id}`);
+};
 const list = ref([
   {
     id: 1,

src/views/tables/demo.vue

@@ -0,0 +1,58 @@
+<!--  -->
+<template>
+  <MainPanel>
+    <template v-slot:header>
+      <Header :title="info.title" type="return">
+        <!-- <ui-button type="primary" width="96px"> 完成 </ui-button> -->
+      </Header>
+    </template>
+
+    <div class="explorate">
+      <img :src="info.img" />
+    </div>
+  </MainPanel>
+</template>
+
+<script setup lang="ts">
+import { reactive, ref, toRefs, onBeforeMount, onMounted, nextTick, onActivated } from 'vue';
+import html2canvas from 'html2canvas';
+import { downloadImage, uploadImage } from '@/store/sync';
+import Message from '@/components/base/components/message/message.vue';
+import Header from '@/components/photos/header.vue';
+import MainPanel from '@/components/main-panel/index.vue';
+import { router } from '@/router';
+import img_1 from '@/assets/images/demo/1.png';
+import img_2 from '@/assets/images/demo/2.png';
+import img_3 from '@/assets/images/demo/3.png';
+import img_4 from '@/assets/images/demo/4.png';
+import img_5 from '@/assets/images/demo/5.png';
+import img_6 from '@/assets/images/demo/6.png';
+import img_7 from '@/assets/images/demo/7.png';
+const list = ref([
+  { title: '道路交通事故现场勘查笔录', img: img_1 },
+  { title: '询问笔录', img: img_2 },
+  { title: '讯问笔录', img: img_3 },
+  { title: '道路交通事故认定书', img: img_4 },
+  { title: '当事人血样登记表', img: img_5 },
+  { title: '道路交通事故现场遗留物品清单', img: img_6 },
+  { title: '授权委托书', img: img_7 },
+]);
+let index = Number(router.currentRoute.value.params.id);
+const info = ref(list.value[index - 1]);
+onMounted(() => {});
+onActivated(() => {
+  index = Number(router.currentRoute.value.params.id);
+  info.value = list.value[index - 1];
+});
+</script>
+<style lang="scss" scoped>
+.explorate {
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
+  img {
+    width: 100%;
+    height: auto;
+  }
+}
+</style>