Skip to content

X
xinrenli-app
Commit a241d741 by honghong
Options

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

parent a7089f9b
Showing with 66 additions and 18 deletions
components/evaluate.vue
...@@ -19,8 +19,9 @@ ...@@ -19,8 +19,9 @@
<view class="rightText" v-else @click="changeAllFun(item, index)">收起</view> <view class="rightText" v-else @click="changeAllFun(item, index)">收起</view>
</view> --> </view> -->
<view class="evaluateListImg"> <view class="evaluateListImg">
<view v-for="(itm, ind) in item.imageList" :key="ind"> <view class="evaluateListImgItem" v-for="(itm, ind) in item.imageList" :key="ind"
<image class="evaluateListImgItem" :src="itm.url" mode="scaleToFill"></image> @click.stop="handlePreview(index,ind)">
<image :src="itm.url" mode="scaleToFill"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -70,6 +71,18 @@ ...@@ -70,6 +71,18 @@
} }
}) })
this.list = list 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 @@ ...@@ -134,15 +147,27 @@
.evaluateListImg { .evaluateListImg {
width: 100%; width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.evaluateListImgItem { .evaluateListImgItem {
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
float: left; background: #ffa;
margin-right: 10rpx; margin-top: 20rpx;
margin-top: 10rpx;
image {
width: 100%;
height: 100%;
} }
} }
}
.evaluateListImg:after {
content: '';
width: 210rpx;
}
} }
......
components/form.vue
...@@ -39,10 +39,7 @@ ...@@ -39,10 +39,7 @@
<input type="text" placeholder="请填写预算金额"> <input type="text" placeholder="请填写预算金额">
</view> </view>
</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> <view>
<view class="d-flex j-sb a-center form-item-height-only"> <view class="d-flex j-sb a-center form-item-height-only">
...@@ -81,6 +78,10 @@ ...@@ -81,6 +78,10 @@
</view> </view>
</u-popup> </u-popup>
</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> </view>
</template> </template>
......
components/upload/aIndex.vue
<template> <template>
<view class="index"> <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"> <view class="index-upload d-flex j-center a-center">
<image v-if="imgType === 'camera'" src="@/static/icon/camera.png" mode="widthFix"></image> <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'"> <view class="index-upload-tlo d-flex flex-wrap j-center" v-else-if="imgType === 'cross'">
...@@ -33,7 +33,7 @@ export default { ...@@ -33,7 +33,7 @@ export default {
return { return {
// imgBgUrl: apiBaseConfig.imgBgUrl, // imgBgUrl: apiBaseConfig.imgBgUrl,
// globalData: getApp().globalData, // 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' url:'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'
}, },
......
css/form.css
...@@ -29,6 +29,7 @@ ...@@ -29,6 +29,7 @@
text-align: center; text-align: center;
line-height: 80rpx; line-height: 80rpx;
margin: 30rpx auto; margin: 30rpx auto;
margin-top: 100rpx;
} }
.voice-box{ .voice-box{
width: 244rpx; width: 244rpx;
......
demand/index/index.vue
...@@ -174,7 +174,7 @@ ...@@ -174,7 +174,7 @@
&-img { &-img {
margin-top: 20rpx; margin-top: 20rpx;
margin-right: 22rpx; margin-right: 20rpx;
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
} }
......
demand/payment/index.vue
...@@ -137,6 +137,7 @@ ...@@ -137,6 +137,7 @@
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
color: #444444; color: #444444;
line-height: 36rpx;
} }
&-photo { &-photo {
......
manifest.json
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
"quickapp" : {}, "quickapp" : {},
/* 小程序特有相关 */ /* 小程序特有相关 */
"mp-weixin" : { "mp-weixin" : {
"appid" : "wxb323afcbe152514f", "appid" : "wx312fb4fecd3ee803",
"setting" : { "setting" : {
"urlCheck" : false, "urlCheck" : false,
"es6" : true, "es6" : true,
......
order/detail/detail.vue
<template> <template>
<view> <view>
<view style="padding-bottom: 100rpx;"> <view style="padding-bottom: 100rpx;">
<view class="padding-x-four d-flex flex-wrap"> <view class="padding-x-four d-flex flex-wrap j-sb flex-content">
<view v-for="item in 6"> <view v-for="item in 5">
<image class="evaluateListImgItem" <image class="evaluateListImgItem"
src="https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500" src="https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
mode="scaleToFill"></image> mode="scaleToFill"></image>
...@@ -122,11 +122,17 @@ ...@@ -122,11 +122,17 @@
margin-left: 10rpx; margin-left: 10rpx;
} }
.flex-content:after {
content: '';
width: 210rpx;
}
.evaluateListImgItem { .evaluateListImgItem {
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
margin-right: 10rpx;
margin-top: 10rpx; margin-top: 10rpx;
/* margin-right: 10rpx;
margin-top: 10rpx; */
} }
/* 内容样式 */ /* 内容样式 */
......
pages/demand/components/index.vue
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<view class="content-matter" v-for="(v,index) in 20" @click="jump" :key="index"> <view class="content-matter" v-for="(v,index) in 20" @click="jump" :key="index">
<view class="content-matter-lampwick"> <view class="content-matter-lampwick">
<view class="content-matter-lampwick-lampw"> <view class="content-matter-lampwick-lampw">
<view class=""></view> <view :class="subscript == '1' ? 'only-bg-red' : 'common-bg'" class=""></view>
<view class="">灯泡灯芯坏了</view> <view class="">灯泡灯芯坏了</view>
</view> </view>
<view class="content-matter-lampwick-wick"> <view class="content-matter-lampwick-wick">
...@@ -162,10 +162,15 @@ ...@@ -162,10 +162,15 @@
>view:nth-child(1) { >view:nth-child(1) {
width: 6rpx; width: 6rpx;
height: 36rpx; height: 36rpx;
background: #2C66FF;
border-radius: 3rpx; border-radius: 3rpx;
margin-right: 10rpx; margin-right: 10rpx;
} }
.common-bg{
background: #2C66FF;
}
.only-bg-red{
background: #FD0000;
}
>view:nth-child(2) { >view:nth-child(2) {
font-size: 28rpx; font-size: 28rpx;
......
pages/order/index.vue
...@@ -76,6 +76,7 @@ ...@@ -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' url: 'https://img2.baidu.com/it/u=955956276,3392954639&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'
}, },
] ]
}], }],
personEvalList: [{ personEvalList: [{
......
pages/release/index.vue
...@@ -67,4 +67,12 @@ ...@@ -67,4 +67,12 @@
<style scoped> <style scoped>
@import url("@/css/form.css"); @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> </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