feat: update

src/api/floder.ts

@@ -1,14 +1,14 @@
 import { params } from '@/env'
 import { FLODER_LIST } from './constant'
-import { addUnsetResErrorURLS,axios } from './instance'
-import {namespace} from '@/env'
+import { addUnsetResErrorURLS, axios } from './instance'
+import { namespace } from '@/env'
 
 export interface Floder {
-  filesId:	number,
-  caseId:	string,
+  filesId: number,
+  caseId: string,
   filesTypeId: number,
-  filesTitle:	string,
-  filesUrl:	string,
+  filesTitle: string,
+  filesUrl: string,
 }
 
 export type Floders = Floder[]
@@ -20,28 +20,31 @@ export const fetchFloders = async () => {
   // debugger
   const otherFloders = [{
     filesId: 88,
-    filesTypeId: 100,
+    filesTypeId: 3,
     filesTitle: '勘验笔录',
     ex: `${namespace}/caseInquest/info`,
     bex: `${namespace}/caseInquest/downDocx`
   }, {
     filesId: 89,
-    filesTypeId: 100,
+    filesTypeId: 4,
     filesTitle: '提取清单',
     ex: `${namespace}/caseExtractDetail/info`,
     bex: `${namespace}/caseExtractDetail/downDocx`
-  }, ]
-  const res = await axios.get(`${namespace}/caseImg/getFfmpegImage`, {params: {caseId: params.caseId}})
+  },]
+  const res = await axios.get(`${namespace}/caseImg/getFfmpegImage`, { params: { caseId: params.caseId } })
+
   if (res.data.data.length) {
-    res.data.data.forEach((item:any, ndx: any) => {
+
+    res.data.data.forEach((item: any, ndx: any) => {
       floders.push({
         filesId: 100 + ndx,
-        filesTypeId: -1,
+        filesTypeId: 2,
         filesTitle: '照片制卷图',
         caseId: params.caseId.toString(),
         filesUrl: item.imgUrl
       })
     })
+
   }
   await Promise.all(otherFloders.map(async of => {
     const kybl = await axios.get(of.ex, { params: { caseId: params.caseId } })
@@ -55,5 +58,6 @@ export const fetchFloders = async () => {
       })
     }
   }))
+  console.log('last-floders', floders)
   return floders
 }

src/views/folder/index.vue

@@ -1,11 +1,5 @@
 <template>
   <LeftPano>
-    <div class="types">
-      <h2 @click="showInfo = true">
-        案件概要
-        <ui-icon :type="`pull-${showInfo ? 'up' : 'down'}`" class="icon" ctrl />
-      </h2>
-    </div>
     <template v-for="item in floderRoots" :key="item.id">
       <FloderView :root="item" @preview="(v) => preview(v)" />
     </template>
@@ -17,7 +11,6 @@
     v-if="~currentNdx"
     @close="currentNdx = -1"
   />
-  <Fire v-model:open="showInfo" />
 </template>
 
 <script lang="ts" setup>
@@ -27,13 +20,11 @@ import { getUrlType, MetaType, saveAs } from "@/utils";
 import { Preview, MediaItem } from "@/components/static-preview/index.vue";
 import { floderRoots, getFlatFloders } from "@/store";
 import FloderView from "./floder-view.vue";
-import Fire from "./fire/index.vue";
 
 import type { Floder, FloderRoot } from "@/store";
 import { useViewStack } from "@/hook";
 import { showRightPanoStack } from "@/env";
 
-const showInfo = ref(false);
 const currentNdx = ref(-1);
 const currentItems = ref<MediaItem[]>([]);
 const preview = async ([floder, root]: [Floder, FloderRoot]) => {

src/views/folder/modal-floder-view.vue

@@ -2,37 +2,25 @@
   <ui-group v-if="floders.length">
     <ui-group-option>
       <span @click="canAll && (showAll = !showAll)" :class="{ ['fun-ctrl']: canAll }">
+        {{ root.title }}
         <template v-if="canAll">
           <UpOutlined v-if="showAll" />
           <DownOutlined v-else />
         </template>
-        {{ root.title }}
       </span>
     </ui-group-option>
     <ui-group-option>
       <div class="items">
-        <div
-          class="img-item"
-          v-for="(_, i) in showLen"
-          :key="floders[i].filesId"
-          :style="{ '--rawLen': samLen }"
-        >
+        <div class="img-item" v-for="(_, i) in showLen" :key="floders[i].filesId">
           <div class="img-item-content">
-            <div>
-              <Sign
-                focus
-                :media="{ url: floders[i].filesUrl }"
-                @click="clickHandler(floders[i])"
-              />
-            </div>
-            <!-- <img :src="floders[i].filesUrl"  /> -->
+            <img :src="floders[i].filesUrl" @click="clickHandler(floders[i])" />
           </div>
         </div>
       </div>
     </ui-group-option>
   </ui-group>
 
-  <Tabs v-if="!emptyTabs" v-model:activeKey="activeTab" class="f-tabs">
+  <Tabs v-if="!emptyTabs" v-model:activeKey="activeTab">
     <template v-for="children in root.children">
       <TabPane
         :tab="children.title"
@@ -43,7 +31,8 @@
       </TabPane>
     </template>
   </Tabs>
-  <template v-for="c in children" :key="c.id" v-else>
+
+  <template v-for="c in children" :key="c.id">
     <ModalFloderView
       :root="c"
       v-if="isLastLevel(c)"
@@ -56,7 +45,6 @@ import { Floder, FloderRoot, getFlatFloders } from "@/store";
 import { computed, ref } from "vue";
 import { TabPane, Tabs } from "ant-design-vue";
 import { DownOutlined, UpOutlined } from "@ant-design/icons-vue";
-import Sign from "@/components/static-preview/sign.vue";
 
 const props = defineProps<{ root: FloderRoot }>();
 const emit = defineEmits<{ (e: "preview", v: [Floder, FloderRoot]): void }>();
@@ -90,7 +78,7 @@ const children = computed(() => {
 });
 const len = computed(() => floders.value.length);
 const showAll = ref(false);
-const samLen = 6;
+const samLen = 3;
 const showLen = computed(() => (showAll.value ? len.value : Math.min(samLen, len.value)));
 const canAll = computed(() => len.value > samLen);
 </script>
@@ -101,14 +89,13 @@ const canAll = computed(() => len.value > samLen);
   flex-wrap: wrap;
 }
 .img-item {
-  width: calc(100% / var(--rawLen));
-  padding-right: 5px;
+  width: 33.33%;
+  padding: 5px;
   .img-item-content {
     padding-top: 56.25%;
     position: relative;
     cursor: pointer;
-
-    > div {
+    img {
       position: absolute;
       width: 100%;
       height: 100%;
@@ -125,12 +112,3 @@ const canAll = computed(() => len.value > samLen);
   --swiper-navigation-size: 30px;
 }
 </style>
-
-<style>
-.f-tabs.ant-tabs-top > .ant-tabs-nav {
-  margin-bottom: 30px;
-}
-.f-tabs.ant-tabs-top > .ant-tabs-nav::before {
-  display: none !important;
-}
-</style>