图片预览

This commit is contained in:
bb_pan 2025-08-03 16:08:42 +08:00
parent 0f55cce0c4
commit 0fd90d5060
5 changed files with 42 additions and 0 deletions

View File

@ -0,0 +1,30 @@
<template>
<div>
<div class="preview-icon" v-if="imgUrl">
<uni-icons type="search" size="30" color="#fff" @click="previewImage(imgUrl)" />
</div>
</div>
</template>
<script setup>
import { defineProps } from 'vue'
const props = defineProps({
imgUrl: {
type: String,
required: true,
},
})
const previewImage = (imgUrl) => {
uni.previewImage({ urls: [imgUrl] })
}
</script>
<style lang="scss" scoped>
.preview-icon {
position: absolute;
top: 20px;
left: 25px;
}
</style>

View File

@ -176,6 +176,7 @@
<div class="image-preview" v-for="(img, index) in imgList" :key="index">
<image :src="img.url" mode="aspectFill"></image>
<view class="delete-btn" @click.stop="deleteImage(index)">×</view>
<PreviewImg :imgUrl="img.url" />
</div>
</div>
</uni-col>
@ -254,6 +255,7 @@ import { baseURL } from '@/utils/http'
//pages/materialsStation/toolsLease/components/eselect.vue
import eselect from '@/components/tree-select/eselect.vue'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
import PreviewImg from '@/components/PreviewImg/index.vue'
const taskInfo = ref({})
const maId = ref('') //
const maCode = ref('') //

View File

@ -120,6 +120,7 @@
mode=""
></image>
</div>
<PreviewImg :imgUrl="imgBeseUrl" />
</uni-forms-item>
</uni-forms>
</view>
@ -140,6 +141,7 @@ import {
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue'
import { onLoad,onShow } from '@dcloudio/uni-app'
import PreviewImg from '@/components/PreviewImg/index.vue'
const queryParams = ref({})
const rowIndex = ref(-1)
//

View File

@ -129,6 +129,7 @@
mode=""
></image>
</div>
<PreviewImg :imgUrl="partImgUrl" />
</uni-forms-item>
</uni-forms>
</view>
@ -198,6 +199,7 @@
mode=""
></image>
</div>
<PreviewImg :imgUrl="returnImgUrl" />
</uni-forms-item>
</uni-forms>
</view>
@ -247,6 +249,7 @@
<div class="image-preview" v-for="(img, index) in imgList2" :key="index">
<image :src="img.url" mode="aspectFill"></image>
<view class="delete-btn" @click.stop="deleteImage2(index)">×</view>
<PreviewImg :imgUrl="img.url" />
</div>
</div>
</uni-forms-item>
@ -270,6 +273,7 @@ import {
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue'
import { onLoad,onShow } from '@dcloudio/uni-app'
import PreviewImg from '@/components/PreviewImg/index.vue'
const queryParams = ref({})
const rowIndex = ref(-1)
const partRemark = ref('') // -

View File

@ -124,6 +124,7 @@
<div class="upload" @click="uploadImg('part')" v-else>
<image :src="partImgUrl" style="width: 160rpx;height: 160rpx;" mode=""></image>
</div>
<PreviewImg :imgUrl="partImgUrl" />
</uni-forms-item>
</uni-forms>
</view>
@ -165,6 +166,7 @@
<div class="image-preview" v-for="(img, index) in imgList2" :key="index">
<image :src="img.url" mode="aspectFill"></image>
<view class="delete-btn" @click.stop="deleteImage2(index)">×</view>
<PreviewImg :imgUrl="img.url" />
</div>
</div>
</uni-forms-item>
@ -240,6 +242,7 @@
<div class="upload" @click="uploadImg('ret')" v-else>
<image :src="returnImgUrl" style="width: 160rpx;height: 160rpx;" mode=""></image>
</div>
<PreviewImg :imgUrl="returnImgUrl" />
</uni-forms-item>
</uni-forms>
</view>
@ -258,6 +261,7 @@ import {
} from '@/services/repair/repair.js'
import treeSelect from '../tree-select/tselectTwo.vue';
import {onLoad, onShow} from '@dcloudio/uni-app'
import PreviewImg from '@/components/PreviewImg/index.vue'
// const query = defineProps() //
// const queryParams = JSON.parse(query.queryParams)
const loading = ref(false)