修改bug

src/view/case/photos/canvas-photo-editor.js

@@ -1,9 +1,11 @@
 import { throttle, debounce, getFileNameFromUrl } from "@/util";
 import { ElMessage, ElMessageBox, ElLoading } from "element-plus";
+import { confirm } from "@/helper/message";
 import { jsPDF } from 'jspdf'
 import html2canvas from "html2canvas";
 import JSZip from 'jszip'
 import { saveAs } from 'file-saver'
+import { casePhotodel } from "@/store/case";
 /**
  * Canvas 照片排版编辑器类（拖拽不重绘 + 纯坐标移动版）
  * 核心：1. 拖拽仅改坐标，松开再重绘 2. 纯Canvas坐标移动 3. 无transform
@@ -228,8 +230,9 @@ export class CanvasPhotoEditor {
     const pageIndex = this.getPageIndexByClick(e)
     console.log('getPageIndexByClick', pageIndex, this.pages[pageIndex])
 
-    if(pageIndex > -1 && this.setImgTitle.titleIndex>-1 && this.pages[pageIndex].list && this.pages[pageIndex].list[this.setImgTitle.titleIndex]){//点击标题进行修改标题名称
+    if(!this.show && pageIndex > -1 && this.setImgTitle.titleIndex>-1 && this.pages[pageIndex].list && this.pages[pageIndex].list[this.setImgTitle.titleIndex]){//点击标题进行修改标题名称
       let item = this.pages[pageIndex].item[this.setImgTitle.titleIndex]
+      if(!item.id) return
       return ElMessageBox.prompt("", "修改名称", {
         confirmButtonText: "确定",
         customClass: "promptClass",
@@ -936,8 +939,8 @@ export class CanvasPhotoEditor {
       ctx.textAlign = 'right'
       ctx.fillText(
         `第 ${pageIndex + 1} 页`,
-        pageX + this.pageWidth - 20,
-        this.pageHeight - 20
+        pageX + this.pageWidth - (20*this.scale),
+        this.pageHeight - (20*this.scale)
       )
 
       // 绘制图片（重构核心：调用独立方法）
@@ -976,7 +979,7 @@ export class CanvasPhotoEditor {
           ...imgItem,
           ...pagePhotos.item[itemIndex],
         }
-        console.log('this.s', imgItem)
+        console.log('this.s', imgItem, photoId, this.photos)
         this.renderSinglePhoto(ctx, pageX, itemY, layout, pagePhotos.item[itemIndex])
       })
     })
@@ -1107,23 +1110,61 @@ export class CanvasPhotoEditor {
       // coordinate: this.getCoordinate(pageX, layout), //坐标信息
     }
     this._pages = this._pages.map(ele =>({...ele, layoutMode: this.layoutMode, }))//coordinate: this.getCoordinate(pageX, layout)
-
-    let list = []
-    const newArr = [...newList, ...selectedPhotos]
-    console.log(newArr, selectedPhotos, 'newArr', this.pages)
-    newArr.forEach((photoId, photoIndex) => {
-      list.push(photoId)
-      if(list.length == layout.count){
-          newPages.push({...currentPage, list: list, })
-          list = []
-      }else if(photoIndex == newArr.length -1){//最后一条直接写入
-          newPages.push({...currentPage, list: list, })
+    if(selectedPhotos.length == 0){
+      let list = []
+      const newArr = [...newList, ...selectedPhotos]
+      newArr.forEach((photoId, photoIndex) => {
+        list.push(photoId)
+        console.log('newArr', list,layout, photoId)
+        if(photoIndex+1>this.pages.length && !photoId){
+          return
+        }
+        if(list.length == layout.count){
+            newPages.push({...currentPage, list: list, })
+            list = []
+        }else if(photoIndex == newArr.length -1){//最后一条直接写入
+            newPages.push({...currentPage, list: list, })
+        }
+      })
+    }else{
+      //先填充为空的位置
+      let countId = 0
+      newPages = [...this.pages]//遍历旧数据
+      newPages.map(ele => {
+        let itemList = this.padArrayLength(ele.list, ele.layoutMode == 'double'?2:1)
+        let eleItem = this.padArrayLength(ele.item, ele.layoutMode == 'double'?2:1)
+        if(countId >= selectedPhotos.length) return
+        itemList.map((element,index) => {
+          if(!element){
+            itemList.push(selectedPhotos[countId])
+            eleItem[index] = this.photos.find(p => p.id === selectedPhotos[countId])
+            countId++
+          }
+        })
+        ele.list = itemList
+        ele.item = eleItem
+      })
+      if (countId < selectedPhotos.length) {//剩余的直接填充到最后
+        const newArr = selectedPhotos.slice(countId)
+        let list = []
+        newArr.forEach((photoId, photoIndex) => {
+          list.push(photoId)
+          if(list.length == layout.count){
+              newPages.push({...currentPage, list: list, })
+              list = []
+          }else if(photoIndex == newArr.length -1){//最后一条直接写入
+              newPages.push({...currentPage, list: list, })
+              list = []
+          }
+        })
       }
-    })
+    }
+        console.log('newArr', newPages)
     if(newPages.length > 0 && newPages.length < this._pages.length){//需要补位
       newPages = newPages.concat(Array(this._pages.length - newPages.length).fill({...currentPage, list: layout.count == 2 ? [null, null] : [null]}));
     }
-    this.pages = newPages.length > 0 ? newPages : this._pages
+    this.pages = newPages
+    // newPages.length || selectedPhotos.length ? newPages : this._pages
     this.resetPosition()
     return this.pages
   }
@@ -1162,7 +1203,7 @@ export class CanvasPhotoEditor {
     const PageIndex = this.selectedPageIndex;
     let list = newPages[PageIndex] && newPages[PageIndex].list?.filter(i => i) || []
     newPages[PageIndex].layoutMode = direction
-
+    debugger
     if (list.length == 2 && direction != 'double') {//两页改成一页
       newPageItem = {
         coordinate: [newPages[PageIndex].coordinate[1]],
@@ -1175,7 +1216,7 @@ export class CanvasPhotoEditor {
       newPages[PageIndex].item.length = 1
       newPages.splice(PageIndex+1, 0, newPageItem)
     }
-    if(direction == 'double'){
+    if(direction == 'double' && list.length != 2){
       let newPageList = {
         list: [],
         item: []
@@ -1219,12 +1260,12 @@ export class CanvasPhotoEditor {
     // this.resetPosition()
     return this.pages
   }
-  deleteSelectedPage() {
+  async deleteSelectedPage(backFun) {
     console.log(this.selectedPageItem, 'selectedPageItem', this.pages)
-    if (this.selectedPageItem.index == -1 &&( this.selectedPageIndex === -1 || this.pages.length <= 1)) return this.pages
+    if (this.selectedPageItem.index == -1 &&( this.selectedPageIndex === -1 || this.pages.length <= 1)) return backFun()
     const newPages = [...this.pages]
     if(this.selectedPageItem.index == -1){//删除整页
-      newPages.splice(this.selectedPageIndex, 1)
+          newPages.splice(this.selectedPageIndex, 1)
     }else{//删除单个图片
       newPages.forEach((ele, index) => {
         if(index == this.selectedPageIndex){
@@ -1237,7 +1278,7 @@ export class CanvasPhotoEditor {
     this.pages = newPages
     this.selectedPageIndex = Math.min(this.selectedPageIndex, this.pages.length - 1)
     if(this.selectedPageItem.index == -1){
-      this.resetPosition()
+      // this.resetPosition()
     }
     return this.pages
   }
@@ -1777,7 +1818,7 @@ async exportPagesAsImages(paperType = "a4", name, fileType = 'pdf') {
     }
 
     // 下载
-    const filename = name || "排版图片";
+    const filename = name || "照片卷";
     const blob = await zip.generateAsync({ type: "blob" });
     saveAs(blob, `${filename}.zip`);
     ElMessage.success("导出成功！");

src/view/case/photos/index.vue

@@ -31,18 +31,21 @@
           class="iconfont icon-backout"
           :class="{ disable: currentIndex < 1 }"
           @click="undo(true)"
+          title="撤销"
           style="margin-right: 24px"
         ></i>
         <i
           class="iconfont icon-redo"
           @click="undo(false)"
           :class="{ disable: historylength == currentIndex + 1 }"
+          title="恢复"
           style="margin-right: 24px"
         ></i>
 
         <i
           class="iconfont icon-screen_f"
           @click="toggleFullScreen"
+          title="适应视图"
           style="margin-right: 5px"
         ></i>
         <span>
@@ -50,6 +53,7 @@
             <span :class="{ disable: indexing }">
               <i
                 class="iconfont icon-new"
+                title="加页"
                 @click="() => insertBlankPage()"
                 v-if="pages.length == 1 || selectedPageIndex === -1"
                 style="margin-right: 24px"
@@ -75,7 +79,7 @@
                 </template>
               </el-dropdown>
             <el-dropdown trigger="click" @command="handleLayoutChange">
-              <i class="iconfont icon-layout"></i>
+              <i class="iconfont icon-layout" title="模板"></i>
               <template #dropdown>
                 <el-dropdown-menu>
                   <el-dropdown-item command="double">
@@ -96,6 +100,7 @@
             >
             <i
               class="iconfont icon-indexes"
+              title="标引"
               @click="changeIndexing"
               style="padding: 5px; margin-right: 24px"
               :class="{
@@ -106,6 +111,7 @@
             <i
               class="iconfont icon-delete"
               style="margin-right: 0"
+              title="删除"
               @click="deleteSelectedPage"
               :class="{
                 disable:
@@ -117,6 +123,7 @@
           </div>
           <i
             @click="exportToPDF"
+            title="导出"
             class="iconfont icon-download"
             style="margin-right: 24px"
           ></i>
@@ -223,6 +230,7 @@ import {
   getAllPhotoList,
   casePhotoUpdate,
   getCasePhotoRollList,
+  casePhotodel,
 } from "@/store/case";
 let oldCanvas = null;
 const caseId = computed(() => router.currentRoute.value?.params?.caseId);
@@ -311,6 +319,7 @@ const getImgList = async () => {
   let content = item && item.content && JSON.parse(item?.content);
   // editor.value.drawAllPages(photos.value);
   if (content) {
+    editor.value._layoutMode = content.pages.some(ele =>ele.layoutMode == 'double') ? "double" : "single";
     pages.value = content.pages;
     editor.value.pages = pages.value;
     editor.value.indexingLineList = content.indexingLineList || [];
@@ -345,6 +354,21 @@ const handleSee = async () => {
     });
   }
 };
+const del2 = async () => {
+  const { id } = router.currentRoute.value.query;
+  ElMessageBox.confirm("当前段落为最后一页，是否删除当前段落？", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  }).then(async () => {
+    await casePhotodel({ caseId: caseId.value, id });
+    ElMessage({
+      type: "success",
+      message: "删除成功",
+    });
+    backPageHandler();
+  });
+};
 // --- 初始化 ---
 onMounted(async () => {
   const { id } = router.currentRoute.value.query;
@@ -477,7 +501,7 @@ const handleLayoutChange = async (value) => {
     );
     if (selectedPageIndex.value == -1 || isActiveItem) {
       //未选中页面
-      editor.value.layoutMode = layoutMode.value;
+      if(layoutMode.value != editor.value.layoutMode) editor.value.layoutMode = layoutMode.value;
       autoLayout();
     } else {
       //选中页面
@@ -545,7 +569,7 @@ const changeIndexing = async () => {
 const deleteSelectedPage = async () => {
   if (editor.value) {
     const check = await editor.value.checkIndexing();
-    pages.value = editor.value.deleteSelectedPage();
+    pages.value = editor.value.deleteSelectedPage(del2);
     // selectedPageIndex.value = editor.value.selectedPageIndex;
   }
 };

src/view/material/exportPhotos.vue

@@ -5,14 +5,14 @@
     label-width="90px"
     class="camera-from dispatch-file-from jm-file-upload"
   >
-    <el-form-item label="排版：" class="mandatory">
+    <el-form-item label="排版：">
       <el-radio-group v-model="exportInfo.paperType">
         <el-radio value="four">4联卡纸</el-radio>
         <el-radio value="a4">A4纸</el-radio>
         <el-radio value="a3">A3纸</el-radio>
       </el-radio-group>
     </el-form-item>
-    <el-form-item label="格式：" class="mandatory">
+    <el-form-item label="格式：">
       <el-radio-group v-model="exportInfo.fileType">
         <el-radio value="pdf">pdf</el-radio>
         <el-radio value="jpg">jpg</el-radio>

src/view/material/sceneImg.vue

@@ -1,22 +1,24 @@
 <template>
   <div class="scene abstract sceneImg">
-    
     <el-dialog v-model="casePhotoItem.show" title="重命名" width="500">
       <el-form :model="casePhotoItem">
         <el-form-item :label-width="0">
-          <el-input v-model="casePhotoItem.name" maxlength="15" show-word-limit autocomplete="off" />
+          <el-input
+            v-model="casePhotoItem.name"
+            maxlength="15"
+            show-word-limit
+            autocomplete="off"
+          />
         </el-form-item>
       </el-form>
       <template #footer>
-        <div class="dialog-footer text-center" >
+        <div class="dialog-footer text-center">
           <el-button @click="casePhotoItem.show = false">取消</el-button>
-          <el-button type="primary" @click="handleConfirm">
-            确定
-          </el-button>
+          <el-button type="primary" @click="handleConfirm"> 确定 </el-button>
         </div>
       </template>
     </el-dialog>
-          <!-- <el-button class="w-full" @click="handledrawCasePhotos">照片卷</el-button> -->
+    <!-- <el-button class="w-full" @click="handledrawCasePhotos">照片卷</el-button> -->
     <div class="demo-image__preview">
       <el-image-viewer
         hide-on-click-modal
@@ -40,11 +42,11 @@
           ref="tabsRef"
           @tab-click="handleClick"
         >
-  <!-- //new  0 现场图 1 照片卷 2 现场照片 3 勘验笔录 -->
+          <!-- //new  0 现场图 1 照片卷 2 现场照片 3 勘验笔录 -->
           <el-tab-pane
             v-for="(item, index) in list"
             :key="item.filesTypeName"
-            :label="showText?item.filesTypeName:''"
+            :label="showText ? item.filesTypeName : ''"
             :childrenList="item.childrenList"
             :class="`handleIsShow show${handleIsShow(item)}`"
             :name="item.filesTypeName"
@@ -65,7 +67,9 @@
                     "
                   >
                     <span class="el-dropdown-link">
-                      <el-icon class="el-icon--right" title="新增"><Plus /></el-icon>
+                      <el-icon class="el-icon--right" title="新增"
+                        ><Plus
+                      /></el-icon>
                     </span>
                     <template #dropdown>
                       <el-dropdown-menu>
@@ -87,7 +91,10 @@
                   :key="indexs"
                 >
                   <div class="ItemTitle">
-                    <div class="text" :title="items.filesTypeName || items.filesTitle">
+                    <div
+                      class="text"
+                      :title="items.filesTypeName || items.filesTitle"
+                    >
                       {{ items.filesTypeName || items.filesTitle }}
                     </div>
                     <div
@@ -98,7 +105,8 @@
                         childrenList.filesId == items.filesId
                       "
                     >
-                      <el-icon title="下载"
+                      <el-icon
+                        title="下载"
                         v-if="items.filesUrl"
                         @click="
                           downloadByUrl({
@@ -108,12 +116,15 @@
                         "
                         ><Download
                       /></el-icon>
-                      <el-icon title="编辑"
-                      v-if="items.oldData != 1"
+                      <el-icon
+                        title="编辑"
+                        v-if="items.oldData != 1"
                         @click="handleoverviewEdit(a.filesTypeName, items)"
                         ><Edit
                       /></el-icon>
-                      <el-icon @click="OverviewDel(items, a.filesTypeName)" title="删除"
+                      <el-icon
+                        @click="OverviewDel(items, a.filesTypeName)"
+                        title="删除"
                         ><CircleClose
                       /></el-icon>
                     </div>
@@ -122,7 +133,11 @@
               </div>
             </div>
             <div class="leftCenter" v-if="active1 == '现场照片'">
-              <div v-for="(a, b) in item.childrenList" :key="b" v-show="show?recursiveSearch(a.childrenList):true">
+              <div
+                v-for="(a, b) in item.childrenList"
+                :key="b"
+                v-show="show ? recursiveSearch(a.childrenList) : true"
+              >
                 <div class="listTitle">{{ a.filesTypeName }}</div>
                 <div
                   class="itemList"
@@ -177,7 +192,8 @@
                     class="operation"
                     v-if="childrenList.value == items.filesId"
                   >
-                    <el-icon title="下载"
+                    <el-icon
+                      title="下载"
                       @click="
                         downloadByUrl({
                           url: items.filesUrl,
@@ -186,7 +202,8 @@
                       "
                       ><Download
                     /></el-icon>
-                    <el-icon title="编辑"
+                    <el-icon
+                      title="编辑"
                       v-if="!show && items.createType != 'upload'"
                       @click="handleRecords(items.filesId)"
                       ><Edit
@@ -209,22 +226,13 @@
                   :icon="Edit"
                   @click="handledrawCasePhotos([])"
                   >制卷</el-button
-                      
                 >
-                <el-button class="newbut" @click="exportToPDF(true)" :icon="Download">下载</el-button>
-                <!-- @visible-change="handleOpen" -->
-                <!-- <el-dropdown trigger="click" @command="exportToPDF">
-                  <span class="el-dropdown-link">
-                      <el-button class="newbut" :icon="Download">下载</el-button>
-                  </span>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item command="four">4联卡纸</el-dropdown-item>
-                      <el-dropdown-item command="a4">A4纸</el-dropdown-item>
-                      <el-dropdown-item command="a3">A3纸</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown> -->
+                <el-button
+                  class="newbut"
+                  @click="exportToPDF(true)"
+                  :icon="Download"
+                  >下载</el-button
+                >
               </div>
               <div
                 class="itemList"
@@ -237,35 +245,17 @@
                   <div class="text">
                     {{ items.name }}
                   </div>
-                  <div
-                    class="operation"
-                    v-if="childrenList.value == items.id"
-                  >
-                    <el-icon title="下载" @click="exportToPDF"><Download/></el-icon>
-                  
-                <!-- <el-dropdown trigger="click" @command="exportToPDF">
-                  <span class="el-dropdown-link">
-                    <el-icon title="下载"><Download/></el-icon>
-                  </span>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item command="four">4联卡纸</el-dropdown-item>
-                      <el-dropdown-item command="a4">A4纸</el-dropdown-item>
-                      <el-dropdown-item command="a3">A3纸</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown> -->
-                  <i title="重命名" class="el-icon iconfont icon-rename" @click="handlemtk(items)"></i>
-                    <!-- <el-icon title="重命名"
-                      @click="
-                        downloadByUrl({
-                          url: items.filesUrl,
-                          fileName: items.filesTitle,
-                        })
-                      "
+                  <div class="operation" v-if="childrenList.value == items.id">
+                    <el-icon title="下载" @click="exportToPDF(false, items)"
                       ><Download
-                    /></el-icon> -->
-                    <el-icon title="编辑"
+                    /></el-icon>
+                    <i
+                      title="重命名"
+                      class="el-icon iconfont icon-rename"
+                      @click="handlemtk(items)"
+                    ></i>
+                    <el-icon
+                      title="编辑"
                       v-if="!show && items.createType != 'upload'"
                       @click="handledrawCasePhotos(items.id)"
                       ><Edit
@@ -352,8 +342,12 @@
         <div>指派/报告单位：{{ data.reportDept }}</div>
         <div>时间：{{ data.inquestTime }}</div>
         <div>勘验事由：{{ data.inquestResource }}</div>
-        <div>现场勘验时间：
-          <span v-if="data.times && data.times[0]">{{ dayjs(data.times[0]).format("YYYY-MM-DD HH:mm:ss") }} ~ {{ dayjs(data.times[1]).format("YYYY-MM-DD HH:mm:ss") }}</span>
+        <div>
+          现场勘验时间：
+          <span v-if="data.times && data.times[0]"
+            >{{ dayjs(data.times[0]).format("YYYY-MM-DD HH:mm:ss") }} ~
+            {{ dayjs(data.times[1]).format("YYYY-MM-DD HH:mm:ss") }}</span
+          >
         </div>
         <div>现场地点：{{ data.address }}</div>
         <div>现场保护情况：{{ data.protectionSituation }}</div>
@@ -383,7 +377,9 @@
             <el-checkbox :value="1" label="报案人进入" />
             <el-checkbox :value="2" label="其他" />
           </el-checkbox-group>
-          <span style="margin-left: 20px" v-if="data.changeReasonOtherValue">{{ data.changeReasonOtherValue }}</span>
+          <span style="margin-left: 20px" v-if="data.changeReasonOtherValue">{{
+            data.changeReasonOtherValue
+          }}</span>
         </div>
         <div>
           天气：
@@ -455,9 +451,7 @@
             >
               姓名: {{ info.name || "_____" }} 性别:
               {{ info.sex ? "女" : "男" }}出生日期:
-              {{
-                info.birthday && dayjs(info.birthday).format("YYYY-MM-DD")
-              }}
+              {{ info.birthday && dayjs(info.birthday).format("YYYY-MM-DD") }}
               住址: {{ info.address }}
             </div>
           </div>
@@ -494,8 +488,13 @@
       </div>
     </div>
     <div class="abstractCentenr" style="padding: 0" v-if="active1 == '照片卷'">
-      <showpages ref="showPagesRef" :photos="photos" v-if="childrenList.src" :content="childrenList.src"/>
-      <div v-else class="noView" >
+      <showpages
+        ref="showPagesRef"
+        :photos="photos"
+        v-if="childrenList.src"
+        :content="childrenList.src"
+      />
+      <div v-else class="noView">
         <div
           class="noViewTitle"
           v-if="childrenList.item && childrenList.item.filesUrl"
@@ -531,6 +530,7 @@ import {
   casePhotoUpdate,
   casePhotodel,
   getAllPhotoList,
+  getCaseInfoData,
   show,
 } from "@/store/case";
 import {
@@ -558,7 +558,7 @@ import { addCaseFile, setTypeFile, addSceneImg1, addSceneImg2 } from "./quisk";
 const caseId = computed(() => router.currentRoute.value?.params?.caseId);
 const filesTypeId = ref(0);
 const ImgsrcList = ref([]);
-const active1 = ref('现场图');
+const active1 = ref("现场图");
 const active = ref(true);
 const urlindex = ref(-1);
 
@@ -566,7 +566,7 @@ const canvas = ref(null);
 const editor = ref(null);
 
 const tabsRef = ref(null);
-const showText = ref(show.value?false:true);
+const showText = ref(show.value ? false : true);
 const settype = ref(false);
 const childrenList = ref({
   list: [],
@@ -578,11 +578,11 @@ const childrenList = ref({
   caseFilesList: [],
 });
 const casePhotoItem = ref({
-  id: '',
-  name: '',
-  content: '',
+  id: "",
+  name: "",
+  content: "",
   show: false,
-})
+});
 const showPagesRef = ref(null);
 const data = reactive({
   title: "",
@@ -645,12 +645,15 @@ const fileLists = ref([]);
 const imgfileLists = ref([]);
 const list = ref([]);
 const fileList = ref([]);
-const casePhotoList = ref([{
-      id: 0,
-      name: '现场照片',
-      caseId: 336,
-      content:'现场照片',
-    }]);
+const casePhotoList = ref([
+  {
+    id: 0,
+    name: "现场照片",
+    caseId: 336,
+    content: "现场照片",
+  },
+]);
+const caseInfo = computed(() => getCaseInfoData());
 const activeNames = ref(["1"]);
 const { size, upload, removeFile, previewFile, file, accept } = useUpload({
   maxSize: 10 * 1024 * 1024,
@@ -672,9 +675,15 @@ const handleChange = (val: string[]) => {
   console.log(val);
 };
 const getImgList = async () => {
-  let imgList = await getAllPhotoList(filesTypeId.value)
-  photos.value = imgList.map(ele => ({...ele, url: ele.filesUrl,id: ele.filesId, name: ele.filesTitle})) || [];
-}
+  let imgList = await getAllPhotoList(filesTypeId.value);
+  photos.value =
+    imgList.map((ele) => ({
+      ...ele,
+      url: ele.filesUrl,
+      id: ele.filesId,
+      name: ele.filesTitle,
+    })) || [];
+};
 getList();
 function handleActive(params) {
   console.log("handleActive", params);
@@ -686,8 +695,8 @@ const initInfo = async (inquestFileId) => {
       // console.log("Key is " + k);
       if (res.data[k]) {
         data[k] = res.data[k];
-      }else{
-        data[k] = '';
+      } else {
+        data[k] = "";
       }
     }
   }
@@ -697,7 +706,8 @@ function handleSuccess(item) {
   let uploadId = item?.data.id;
   addByMediaLiBrary({
     caseId: caseId.value,
-    filesTypeId: active1.value == '勘验笔录' ? klblId.value : childrenList.value.value,
+    filesTypeId:
+      active1.value == "勘验笔录" ? klblId.value : childrenList.value.value,
     uploadId,
   }).then((res) => {
     fileLists.value = [];
@@ -708,13 +718,13 @@ function handleSuccess(item) {
 
 function getList(refresh = false) {
   //new  0 现场图 1 照片卷 2 现场照片 3 勘验笔录
-  //old  0 现场照片 1 现场图 2 勘验笔录 
-  getCasePhotoRollList(caseId.value).then(res => {
-    casePhotoList.value = res || []
-    if(active1.value == '照片卷' && res && res.length && !refresh){
-      handlItem2(res[0])
+  //old  0 现场照片 1 现场图 2 勘验笔录
+  getCasePhotoRollList(caseId.value).then((res) => {
+    casePhotoList.value = res || [];
+    if (active1.value == "照片卷" && res && res.length && !refresh) {
+      handlItem2(res[0]);
     }
-  })
+  });
   updateByTreeFileLists(caseId.value).then((res) => {
     list.value =
       res.find((ele) => ele.filesTypeName == "三录材料")?.childrenList || [];
@@ -722,8 +732,8 @@ function getList(refresh = false) {
       (ele) => ele.filesTypeName == "勘验笔录"
     ).filesTypeId;
     let zpj = list.value.find((ele) => ele.filesTypeName == "现场照片");
-    filesTypeId.value = zpj.filesTypeId
-    getImgList()
+    filesTypeId.value = zpj.filesTypeId;
+    getImgList();
     if (show.value) {
       //展示也过滤现场照片空数据
       list.value[0].childrenList.map((ele) => {
@@ -748,7 +758,8 @@ function getList(refresh = false) {
 
     let item = list.value.find((item) => item.filesTypeName == active1.value);
     let arr2 = [];
-    if (active1.value == '现场照片' || active1.value == '现场图') {//现场图和勘验笔录
+    if (active1.value == "现场照片" || active1.value == "现场图") {
+      //现场图和勘验笔录
       item.childrenList.map((ele) => {
         if (ele.caseFilesList && ele.caseFilesList.length) {
           ele.caseFilesList.map((element) => {
@@ -759,17 +770,20 @@ function getList(refresh = false) {
         }
       });
     }
-    if (active1.value == '现场照片' && childrenList.value.parentId) {//现场照片
+    if (active1.value == "现场照片" && childrenList.value.parentId) {
+      //现场照片
       item = item.childrenList.find(
         (ele) => ele.filesTypeId == childrenList.value.parentId
       );
     }
-    if (active1.value == '现场图' && !childrenList.value.parentId) {
+    if (active1.value == "现场图" && !childrenList.value.parentId) {
       item = item.childrenList[0];
     }
     console.log("activeItem", list.value, "arr2", arr2, item);
     srcList.value =
-      active1.value == '现场照片' || active1.value == '现场图' ? arr2 : item.childrenList;
+      active1.value == "现场照片" || active1.value == "现场图"
+        ? arr2
+        : item.childrenList;
     console.log("srcList", srcList.value, item, childrenList, active1.value);
     let activeIndex =
       srcList.value.findIndex(
@@ -796,7 +810,7 @@ function getList(refresh = false) {
       activeItem.filesUrl ||
       (activeItem.caseFilesList && activeItem.caseFilesList[0]?.filesUrl);
     childrenList.value.caseFilesList =
-      active1.value == '勘验笔录' || active1.value == '现场照片'
+      active1.value == "勘验笔录" || active1.value == "现场照片"
         ? activeItem.caseFilesList
         : activeItem.childrenList;
   });
@@ -826,31 +840,31 @@ const handleClick = (a) => {
       if (!indexshow4 && tabsdom3) tabsdom3.style.display = "none";
       if (indexshow1) {
       } else if (indexshow2) {
-        active1.value = '现场照片';
-        handleClick({paneName: active1.value})
+        active1.value = "现场照片";
+        handleClick({ paneName: active1.value });
       } else if (indexshow4) {
-        active1.value = '照片卷';
-        handleClick({paneName: active1.value})
+        active1.value = "照片卷";
+        handleClick({ paneName: active1.value });
       } else {
-        active1.value = '勘验笔录';
-        handleClick({paneName: active1.value})
+        active1.value = "勘验笔录";
+        handleClick({ paneName: active1.value });
       }
-      showText.value = true
+      showText.value = true;
     }, 500);
   }
-  if (paneName == '现场照片') {
+  if (paneName == "现场照片") {
     //现场照片
     let ArrList = [];
-    childrenLists.map(ele => {
-      ArrList.push(...ele.childrenList)
-    })
+    childrenLists.map((ele) => {
+      ArrList.push(...ele.childrenList);
+    });
     let newindex = ArrList.findIndex(
       (items) => items.caseFilesList && items.caseFilesList.length
     );
-    newindex = newindex == -1?0:newindex
-    let activeItem =ArrList[newindex] || {};
+    newindex = newindex == -1 ? 0 : newindex;
+    let activeItem = ArrList[newindex] || {};
     console.log("handleClick", activeItem, childrenLists);
-    if(!activeItem) return
+    if (!activeItem) return;
     childrenList.value.value = activeItem.filesTypeId;
     childrenList.value.parentId = activeItem.parentId;
     childrenList.value.filesId = activeItem.filesId;
@@ -862,7 +876,7 @@ const handleClick = (a) => {
         ele.caseFilesList && newSrc.push(...ele.caseFilesList);
       });
     newImgsrcList = newSrc.map((ele) => ele.filesUrl);
-  } else if (paneName == '勘验笔录') {
+  } else if (paneName == "勘验笔录") {
     //笔录
     let activeItem =
       (list.value[index].caseFilesList && list.value[index].caseFilesList[0]) ||
@@ -879,11 +893,11 @@ const handleClick = (a) => {
       [];
     console.log("handleClick", newSrc, childrenLists.caseFilesList);
     newImgsrcList = newSrc.filter((ele) => isImage(ele));
-  } else if (paneName == '照片卷') {
-    childrenList.value.src =''
+  } else if (paneName == "照片卷") {
+    childrenList.value.src = "";
     //照片卷
-    let activeItem = casePhotoList.value[0] || {}
-    console.log("handleClick", childrenLists,activeItem);
+    let activeItem = casePhotoList.value[0] || {};
+    console.log("handleClick", childrenLists, activeItem);
     childrenList.value.src = activeItem.content;
     childrenList.value.item = activeItem;
     childrenList.value.filesId = activeItem.id;
@@ -899,9 +913,11 @@ const handleClick = (a) => {
       );
       return index2 != -1;
     });
-    console.log("handleClick", childrenLists, ArrList,index1,index2);
+    console.log("handleClick", childrenLists, ArrList, index1, index2);
     let activeItem =
-      list.value[index].childrenList[index1 == -1?0:index1]?.childrenList[index2 == -1?0:index2] || {};
+      list.value[index].childrenList[index1 == -1 ? 0 : index1]?.childrenList[
+        index2 == -1 ? 0 : index2
+      ] || {};
     childrenList.value.value = activeItem.filesTypeId;
     childrenList.value.parentId = activeItem.parentId;
     childrenList.value.caseFilesList = activeItem.caseFilesList || [];
@@ -932,7 +948,7 @@ const handlItem2 = (item) => {
   childrenList.value.filesId = item.id;
   childrenList.value.item = item;
   childrenList.value.src = item.content;
-}
+};
 const handleClick2 = (item) => {
   console.log("handleClick2", item);
   childrenList.value.value = item.filesTypeId;
@@ -1085,7 +1101,7 @@ const handleEdit = async (lists) => {
     lists,
     lists.map((ele) => ele.filesId)
   );
-  let item = list.value.find(ele => ele.filesTypeName == active1.value);
+  let item = list.value.find((ele) => ele.filesTypeName == active1.value);
   await setTypeFile({
     caseId: caseId.value,
     // filesId: lists.map(ele => ele.filesId),
@@ -1103,8 +1119,7 @@ async function handledrawCasePhotos(val) {
     query: {
       id: id,
       filesTypeId: filesTypeId.value,
-    }
-
+    },
   });
   console.log("handleAdd");
 }
@@ -1148,60 +1163,65 @@ const handlemtk = (item) => {
   //   });
 };
 const handleConfirm = async () => {
-      let value = casePhotoItem.value.name;
-      if(!value || value.trim() == ""){
-        return  ElMessage.error("请输入修改名称");;
-      }
-      await casePhotoUpdate({
-        ...casePhotoItem.value,
-        name: value,
-      });
-      ElMessage({
-        type: "success",
-        message: `修改成功`,
-      });
-      casePhotoItem.value.show = false;
-      await getList(true)
-}
-const exportToPDF = async (isAll) => {
-  if(isAll === true){
-    await handleOpen(true)
+  let value = casePhotoItem.value.name;
+  if (!value || value.trim() == "") {
+    return ElMessage.error("请输入修改名称");
   }
-  await exportCasePhotos({showPagesRef: showPagesRef.value})
+  await casePhotoUpdate({
+    ...casePhotoItem.value,
+    name: value,
+  });
+  ElMessage({
+    type: "success",
+    message: `修改成功`,
+  });
+  casePhotoItem.value.show = false;
+  await getList(true);
+};
+const exportToPDF = async (isAll, item) => {
+  if (isAll === true) {
+    await handleOpen(true);
+  }
+  await exportCasePhotos({
+    showPagesRef: showPagesRef.value,
+    title: (isAll ? caseInfo.value.caseTitle : item.name) + "照片卷",
+  });
   console.log("exportToPDF完毕");
-  if(isAll){
-    await handleOpen(false)
+  if (isAll) {
+    await handleOpen(false);
   }
-  // showPagesRef.value.exportToPDF(paperType, childrenList.value?.item?.name);
-}
+};
 const handleOpen = (val) => {
-  if(!val){
-    handleClick({paneName: '照片卷'})
-  }else{
+  if (!val) {
+    handleClick({ paneName: "照片卷" });
+  } else {
     console.log("handleOpen");
     let Alllist = {
       pages: [],
       indexingLineList: [],
-    }
-    casePhotoList.value.map(ele => {
+    };
+    casePhotoList.value.map((ele) => {
       let content = ele.content && JSON.parse(ele.content);
-      let { pages , indexingLineList } = content
-      let xAdd = (600 + 4)*Alllist.pages.length
-      if(xAdd){
-        indexingLineList = indexingLineList.map(element => {
-          let points = element.points.map(item => ({...item,x:item.x+xAdd}))
-          return {...element,points}
-        })
+      let { pages, indexingLineList } = content;
+      let xAdd = (600 + 4) * Alllist.pages.length;
+      if (xAdd) {
+        indexingLineList = indexingLineList.map((element) => {
+          let points = element.points.map((item) => ({
+            ...item,
+            x: item.x + xAdd,
+          }));
+          return { ...element, points };
+        });
       }
-      Alllist.pages.push(...pages)
-      Alllist.indexingLineList.push(...indexingLineList)
+      Alllist.pages.push(...pages);
+      Alllist.indexingLineList.push(...indexingLineList);
       console.log("handleOpen", content);
-    })
+    });
     childrenList.value.src = Alllist;
     childrenList.value.value = -1;
     console.log("handleOpen", Alllist);
   }
-}
+};
 </script>
 <style scoped lang="scss">
 .scene {
@@ -1230,8 +1250,8 @@ const handleOpen = (val) => {
         }
       }
       .itemList {
-        &:hover{
-          background: rgba(69,144,255,0.1);;
+        &:hover {
+          background: rgba(69, 144, 255, 0.1);
         }
         .ItemTitle {
           padding: 25px 48px;
@@ -1239,7 +1259,7 @@ const handleOpen = (val) => {
           font-size: 14px;
           color: rgba(0, 0, 0, 0.85);
           line-height: 22px;
-          .text{
+          .text {
             overflow: hidden;
             text-overflow: ellipsis;
             display: -webkit-box;
@@ -1375,12 +1395,12 @@ const handleOpen = (val) => {
       font-weight: 400;
       font-size: 16px;
       color: rgba(0, 0, 0, 0.45);
-            &:hover {
-      // font-weight: bold;
-      font-size: 16px;
-      color: #26559b;
-      line-height: 22px;
-    }
+      &:hover {
+        // font-weight: bold;
+        font-size: 16px;
+        color: #26559b;
+        line-height: 22px;
+      }
     }
     .is-active {
       // font-weight: bold;
@@ -1413,7 +1433,8 @@ const handleOpen = (val) => {
   .el-checkbox__label {
     color: rgba(0, 0, 0, 0.85) !important;
   }
-  .el-tabs__nav-next, .el-tabs__nav-prev{
+  .el-tabs__nav-next,
+  .el-tabs__nav-prev {
     top: -9px;
   }
 }