Commit a241d741 by honghong

2023-3-8修改图片细节,图片预览

parent a7089f9b
......@@ -19,8 +19,9 @@
<view class="rightText" v-else @click="changeAllFun(item, index)">收起</view>
</view> -->
<view class="evaluateListImg">
<view v-for="(itm, ind) in item.imageList" :key="ind">
<image class="evaluateListImgItem" :src="itm.url" mode="scaleToFill"></image>
<view class="evaluateListImgItem" v-for="(itm, ind) in item.imageList" :key="ind"
@click.stop="handlePreview(index,ind)">
<image :src="itm.url" mode="scaleToFill"></image>
</view>
</view>
</view>
......@@ -70,6 +71,18 @@
}
})
this.list = list
},
//图片预览
handlePreview(index, inx) {
let that = this
var photoList = that.list[index].imageList.map(item => { // item 获取到的图片地址
return item.url;
});
uni.previewImage({
current: inx,
urls: photoList,
loop: true
})
}
}
......@@ -134,15 +147,27 @@
.evaluateListImg {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.evaluateListImgItem {
width: 210rpx;
height: 210rpx;
float: left;
margin-right: 10rpx;
margin-top: 10rpx;
background: #ffa;
margin-top: 20rpx;
image {
width: 100%;
height: 100%;
}
}
}
.evaluateListImg:after {
content: '';
width: 210rpx;
}
}
......
......@@ -39,10 +39,7 @@
<input type="text" placeholder="请填写预算金额">
</view>
</view>
<view class="paddding-x-three">
<view class="form-item-name margin-y-two">备注</view>
<u--textarea v-model="remark" height="128" placeholder="备注说明"></u--textarea>
</view>
<view>
<view>
<view class="d-flex j-sb a-center form-item-height-only">
......@@ -81,6 +78,10 @@
</view>
</u-popup>
</view>
<view class="paddding-x-three">
<view class="form-item-name margin-y-two">备注</view>
<u--textarea v-model="remark" height="128" placeholder="备注说明"></u--textarea>
</view>
</view>
</view>
</template>
......
<template>
<view class="index">
<u-upload :fileList="fileList6" @afterRead="afterRead" @delete="deletePic" name="6" multiple :maxCount="1" width="210" height="210" :accept="acceptType">
<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" name="6" multiple :maxCount="1" width="210" height="210" :accept="acceptType">
<view class="index-upload d-flex j-center a-center">
<image v-if="imgType === 'camera'" src="@/static/icon/camera.png" mode="widthFix"></image>
<view class="index-upload-tlo d-flex flex-wrap j-center" v-else-if="imgType === 'cross'">
......@@ -33,7 +33,7 @@ export default {
return {
// imgBgUrl: apiBaseConfig.imgBgUrl,
// globalData: getApp().globalData,
fileList6: [
fileList: [
{
url:'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'
},
......
......@@ -29,6 +29,7 @@
text-align: center;
line-height: 80rpx;
margin: 30rpx auto;
margin-top: 100rpx;
}
.voice-box{
width: 244rpx;
......
......@@ -174,7 +174,7 @@
&-img {
margin-top: 20rpx;
margin-right: 22rpx;
margin-right: 20rpx;
width: 210rpx;
height: 210rpx;
}
......
......@@ -137,6 +137,7 @@
font-size: 24rpx;
font-weight: 400;
color: #444444;
line-height: 36rpx;
}
&-photo {
......
......@@ -50,7 +50,7 @@
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wxb323afcbe152514f",
"appid" : "wx312fb4fecd3ee803",
"setting" : {
"urlCheck" : false,
"es6" : true,
......
<template>
<view>
<view style="padding-bottom: 100rpx;">
<view class="padding-x-four d-flex flex-wrap">
<view v-for="item in 6">
<view class="padding-x-four d-flex flex-wrap j-sb flex-content">
<view v-for="item in 5">
<image class="evaluateListImgItem"
src="https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
mode="scaleToFill"></image>
......@@ -122,11 +122,17 @@
margin-left: 10rpx;
}
.flex-content:after {
content: '';
width: 210rpx;
}
.evaluateListImgItem {
width: 210rpx;
height: 210rpx;
margin-right: 10rpx;
margin-top: 10rpx;
/* margin-right: 10rpx;
margin-top: 10rpx; */
}
/* 内容样式 */
......
......@@ -3,7 +3,7 @@
<view class="content-matter" v-for="(v,index) in 20" @click="jump" :key="index">
<view class="content-matter-lampwick">
<view class="content-matter-lampwick-lampw">
<view class=""></view>
<view :class="subscript == '1' ? 'only-bg-red' : 'common-bg'" class=""></view>
<view class="">灯泡灯芯坏了</view>
</view>
<view class="content-matter-lampwick-wick">
......@@ -162,10 +162,15 @@
>view:nth-child(1) {
width: 6rpx;
height: 36rpx;
background: #2C66FF;
border-radius: 3rpx;
margin-right: 10rpx;
}
.common-bg{
background: #2C66FF;
}
.only-bg-red{
background: #FD0000;
}
>view:nth-child(2) {
font-size: 28rpx;
......
......@@ -76,6 +76,7 @@
{
url: 'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'
},
]
}],
personEvalList: [{
......
......@@ -67,4 +67,12 @@
<style scoped>
@import url("@/css/form.css");
::v-deep .u-border {
border: 0 !important;
background: #F5F5F5 !important;
}
::v-deep .u-upload__wrap__preview {
margin: 0 6rpx 10rpx 0 !important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment