feat:

src/views/tables/author/author-two.vue

@@ -2,10 +2,22 @@
 <template>
   <div class="author">
     <div class="content">
+      <div class="check-item" @click="checkOptions(checkData1, index)" v-for="(i, index) in checkData1.options">
+        <div class="item">
+          <ui-icon :type="checkData1.check == i.id ? 'rb_y' : 'rb_n'"></ui-icon>
+          <span>{{ i.title }}</span>
+          <div v-if="i.id == 1 || i.id == 4" class="input-box" style="flex: 1">
+            <input type="text" />
+          </div>
+        </div>
+      </div>
       <div class="check-item" @click="checkOptions(checkData, index)" v-for="(i, index) in checkData.options">
-        <div style="display: inline-block">
+        <div class="item">
           <ui-icon :type="checkData.check == i.id ? 'rb_y' : 'rb_n'"></ui-icon>
           <span>{{ i.title }}</span>
+          <div v-if="i.id == 1 || i.id == 4" class="input-box" style="flex: 1">
+            <input type="text" />
+          </div>
         </div>
       </div>
 
@@ -26,13 +38,18 @@ import { reactive, ref, toRefs, onBeforeMount, onMounted } from 'vue';
 const checkOptions = (item, index) => {
   item.check = item.options[index].id;
 };
-const checkData = ref({
+const checkData1 = ref({
   check: 0,
   options: [
     {
       id: 1,
       title: '...',
     },
+  ],
+});
+const checkData = ref({
+  check: 0,
+  options: [
     {
       id: 2,
       title: '一般代理。即代理为参与诉讼、调解，提供法律帮助。',
@@ -83,9 +100,13 @@ div[contenteditable] {
     }
     .check-item {
       margin-bottom: 30px;
-
-      span {
-        line-height: 30px;
+      .item {
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+        span {
+          line-height: 30px;
+        }
       }
     }
   }

src/views/tables/explorate-one.vue

@@ -781,6 +781,7 @@ div {
                 > div {
                   flex: 1;
                   height: 30px;
+                  line-height: 30px;
                   outline: none;
                   display: flex;
                   align-items: center;

src/views/tables/index.vue

@@ -7,7 +7,7 @@
       </Header>
     </template>
 
-    <div class="mySwiper">
+    <div class="mySwiper" v-if="loaded">
       <div class="swiper-wrapper">
         <div class="swiper-slide" v-for="(i, index) in eleList">
           <div class="warpper" :class="{ downMode }" :id="`layoutRef${index}`">
@@ -20,7 +20,7 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, ref, toRefs, onBeforeMount, onMounted, nextTick, onActivated } from 'vue';
+import { reactive, ref, toRefs, onBeforeMount, onMounted, nextTick, onActivated, onDeactivated } from 'vue';
 import { router } from '@/router';
 import Swiper from 'swiper';
 import 'swiper/swiper.min.css';
@@ -64,7 +64,7 @@ const getLayoutImage = async () => {
     Message.success({ msg: '已保存至相册', time: 2000 });
 
     const blob = await new Promise<Blob>((resolve) => canvas.toBlob(resolve, 'image/jpeg', 0.95));
-    await downloadImage(blob, '12312.jpg');
+    await downloadImage(blob, `tables_${index}.jpg`);
   });
   downMode.value = false;
 
@@ -94,35 +94,29 @@ const initTables = () => {
   }
 };
 const mySwiper = ref(null);
+const loaded = ref(false);
 onActivated(() => {
   initTables();
+  loaded.value = true;
   mySwiper.value = null;
   nextTick(() => {
-    mySwiper.value = new Swiper('.mySwiper', {
-      on: {
-        init: function (swiper) {
-          console.error(swiper)
-          swiper.slideTo(0);
-
-          // for (let i = 0; i < imageList.value.length; i++) {
-          //     vmZoom.value[i] = document.getElementById(`vmRef_${i}`)
-          //     zoomElement(vmZoom.value[i])
-          // }
-        },
-        transitionStart: function (swiper) {
-          // alert(swiper.previousIndex)
-          // console.log(vmZoom.value[swiper.previousIndex].style.transform)
-          // let scale = getTransform(vmZoom.value[swiper.previousIndex])
-        },
-
-        touchStart: function (swiper, event) {
-          // console.log(swiper.previousIndex)
+    if (loaded.value) {
+      mySwiper.value = new Swiper('.mySwiper', {
+        on: {
+          init: function (swiper) {
+            console.error(swiper);
+          },
+          transitionStart: function (swiper) {},
+          touchStart: function (swiper, event) {},
         },
-      },
-    });
+      });
+    }
   });
 });
 onMounted(() => {});
+onDeactivated(() => {
+  loaded.value = false;
+});
 </script>
 <style lang="scss" scoped>
 .mySwiper {