53 lines
1.2 KiB
Vue
53 lines
1.2 KiB
Vue
|
<template>
|
||
|
|
<up-row customStyle="flex-wrap: wrap">
|
||
|
|
<up-col span="6" v-for="(item, index) in list" :key="index">
|
||
|
|
<view class="grid-item">
|
||
|
|
<up-image
|
||
|
|
:src="item.url"
|
||
|
|
:mode="'widthFix'"
|
||
|
|
:width="'100%'"
|
||
|
|
@click="showImage(index)"
|
||
|
|
></up-image>
|
||
|
|
</view>
|
||
|
|
</up-col>
|
||
|
|
</up-row>
|
||
|
|
|
||
|
|
<view v-if="list.length === 0" style="justify-content: center">
|
||
|
|
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
|
||
|
|
</u-empty>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { PictureApi } from "@/services";
|
||
|
|
const props = defineProps<{
|
||
|
|
params: Object;
|
||
|
|
}>();
|
||
|
|
let list: any = ref([]);
|
||
|
|
const showImage = (index: number) => {
|
||
|
|
uni.previewImage({
|
||
|
|
urls: list.value.map((item: any) => item.url), // 图片列表
|
||
|
|
current: index, // 当前显示图片的索引
|
||
|
|
indicator: "default", // 图片指示器样式，默认为圆点
|
||
|
|
loop: true,
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
if (props.params) {
|
||
|
|
PictureApi.getAnnex(props.params as any).then((res) => {
|
||
|
|
if (res.code === 200) {
|
||
|
|
console.log(props.params);
|
||
|
|
list.value = res.data;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.grid-item {
|
||
|
|
position: relative;
|
||
|
|
image {
|
||
|
|
width: 100% !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|