20261008

pages/store/components/spotModal.vue

@@ -12,23 +12,23 @@
             </view>
             <view class="mt-15" v-if="cooperateList">
                 <view class="request-header">
-                    <text class="flex-1">申请人</text>
-                    <text class="flex-1">申请时间</text>
+                    <text class="flex-1">公司名称</text>
+                    <text class="flex-1">联系人</text>
                     <text class="flex-1">联系方式</text>
-                    <text class="flex-1">操作</text>
+                    <text class="flex-1">备注</text>
+                    <text class="flex-1">附件</text>
+                    <text class="flex-1">申请时间</text>
                 </view>
                 <view class="quote" v-for="(item, index) in cooperateList" :key="index">
-                    <text class="flex-1">{{
-                            item.user.accountType === 1 ? item.user.person.personName : item.user.company.companyName
-                        }}
-                    </text>
+                    <text class="flex-1">{{ item.user.company.companyName }}</text>
+                    <text class="flex-1">{{ item.name }}</text>
+                    <text class="flex-1"> {{ item.mobile }}</text>
+                    <text class="flex-1">{{ item.remark }}</text>
+                    <view class="flex-1">
+                        <file-type v-for="(file, fileIndex) in item.files" :key="fileIndex" :item="file"
+                                   @click.native="previewFile(file)"/>
+                    </view>
                     <text class="flex-1">{{ item._add_time_str }}</text>
-                    <text class="flex-1">
-                        {{ item.user.accountType === 1 ? item.user.person.mobile : item.user.company.mobile }}
-                    </text>
-                    <text class="flex-1">
-                        <el-button type="primary" @click.native="doShowInfo(item)">查看申请详情</el-button>
-                    </text>
                 </view>
             </view>
         </el-dialog>
@@ -50,6 +50,9 @@
                 <el-button @click="showInfo = false">关闭</el-button>
             </template>
         </vk-data-dialog>
+        <el-dialog title="图片预览" :visible.sync="showImagePreview" width="80%" append-to-body>
+            <img v-if="previewImageUrl" class="preview-image" :src="previewImageUrl" alt="附件预览"/>
+        </el-dialog>
     </view>
 </template>
 
@@ -57,9 +60,11 @@
 import provinces from "@/uni_modules/vk-uview-ui/libs/address/provinces.json";
 import citys from "@/uni_modules/vk-uview-ui/libs/address/citys.json";
 import areas from "@/uni_modules/vk-uview-ui/libs/address/areas.json";
+import FileType from "../../../components/file-type/file-type.vue";
 
 export default {
     name: "spotModal",
+    components: {FileType},
     data() {
         return {
             provinceData: provinces,
@@ -77,6 +82,8 @@ export default {
             ],
             info: null,
             showInfo: false,
+            showImagePreview: false,
+            previewImageUrl: '',
         }
     },
     methods: {
@@ -118,6 +125,40 @@ export default {
         doShowInfo(info) {
             this.info = info
             this.showInfo = true
+        },
+        getFileExt(url = "") {
+            const cleanUrl = String(url).split("?")[0].split("#")[0]
+            const match = cleanUrl.match(/\.([a-z0-9]+)$/i)
+            return match ? match[1].toLowerCase() : ""
+        },
+        isImageFile(url) {
+            return ["png", "jpg", "jpeg", "gif", "webp", "bmp", "svg"].includes(this.getFileExt(url))
+        },
+        isPdfFile(url) {
+            return this.getFileExt(url) === "pdf"
+        },
+        isOfficeFile(url) {
+            return ["doc", "docx", "xls", "xlsx", "ppt", "pptx"].includes(this.getFileExt(url))
+        },
+        getOfficePreviewUrl(url) {
+            return `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(url)}`
+        },
+        previewFile(url) {
+            if (!url) return
+            if (this.isImageFile(url)) {
+                this.previewImageUrl = url
+                this.showImagePreview = true
+                return
+            }
+            if (this.isPdfFile(url)) {
+                window.open(url, "_blank")
+                return
+            }
+            if (this.isOfficeFile(url)) {
+                window.open(this.getOfficePreviewUrl(url), "_blank")
+                return
+            }
+            window.open(url, "_blank")
         }
     }
 }
@@ -152,4 +193,11 @@ export default {
         text-align: center;
     }
 }
-</style>
+
+.preview-image {
+    display: block;
+    max-width: 100%;
+    max-height: 75vh;
+    margin: 0 auto;
+}
+</style>