Commit bbddab16 by 梁建民

上传图片

parent d3721394
...@@ -337,7 +337,7 @@ Page({ ...@@ -337,7 +337,7 @@ Page({
upload: function (e) { upload: function (e) {
var that = this; var that = this;
wx.chooseImage({ wx.chooseImage({
count:5, count: 6 - that.data.uploaderNum, // 默认3
sizeType: ['compressed'], sizeType: ['compressed'],
sourceType: ['album', 'camera'], sourceType: ['album', 'camera'],
success: function (res) { success: function (res) {
...@@ -345,7 +345,7 @@ Page({ ...@@ -345,7 +345,7 @@ Page({
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片 // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
let tempFilePaths = res.tempFilePaths; let tempFilePaths = res.tempFilePaths;
let uploaderList = that.data.uploaderList.concat(tempFilePaths); let uploaderList = that.data.uploaderList.concat(tempFilePaths);
if (uploaderList.length == 5) { if (uploaderList.length == 6) {
that.setData({ that.setData({
showUpload: false showUpload: false
}) })
......
...@@ -90,12 +90,29 @@ ...@@ -90,12 +90,29 @@
margin-top: 60rpx; margin-top: 60rpx;
margin-bottom: 60rpx; margin-bottom: 60rpx;
.ic {
position: absolute;
right: -15rpx;
top: -12rpx;
font-size: 30rpx;
color: #fff;
width: 44rpx;
height: 44rpx;
background: #EA1717;
border-radius: 50%;
text-align: center;
line-height: 44rpx;
z-index: 99;
}
.add { .add {
width: 220rpx; width: 220rpx;
height: 220rpx; height: 220rpx;
background: #F0F6FA; background: #F0F6FA;
.iconiconxiantiaoshouji15 { .iconiconxiantiaoshouji15 {
width: 44rpx;
height: 44rpx;
font-size: 80rpx; font-size: 80rpx;
color: #ADB6BF; color: #ADB6BF;
} }
...@@ -177,7 +194,7 @@ ...@@ -177,7 +194,7 @@
height: 165rpx; height: 165rpx;
} }
.ui_uploader { .ui_uploader {
float: left; float: left;
position: relative; position: relative;
margin-right: 25rpx; margin-right: 25rpx;
...@@ -218,6 +235,8 @@ ...@@ -218,6 +235,8 @@
top: -20rpx; top: -20rpx;
background: #fff; background: #fff;
border-radius: 50%; border-radius: 50%;
width: 44rpx;
height: 44rpx;
} }
.ui_uploader_item image { .ui_uploader_item image {
......
...@@ -53,17 +53,15 @@ ...@@ -53,17 +53,15 @@
<!-- 根据已选择的图片临时路径数组展示图片 --> <!-- 根据已选择的图片临时路径数组展示图片 -->
<view class='ui_uploader_item' wx:for="{{uploaderList}}" wx:key="{{index}}"> <view class='ui_uploader_item' wx:for="{{uploaderList}}" wx:key="{{index}}">
<!-- 删除 --> <!-- 删除 -->
<icon class='ui_uploader_item_icon' bindtap='clearImg' data-index="{{index}}" type="clear" size="20" color="red" /> <view class="ic">
<text class='icon iconfont iconiconxiantiaoshouji7' bindtap='clearImg' data-index="{{index}}" type="clear"></text>
</view>
<!-- 图片 --> <!-- 图片 -->
<image bindtap='showImg' data-index="{{index}}" src='{{item}}'></image> <image bindtap='showImg' data-index="{{index}}" src='{{item}}'></image>
</view> </view>
<!-- 上传按钮+框 --> <!-- 上传按钮+框 -->
<view class='ui_uploader' bindtap='upload' wx:if="{{showUpload}}"></view> <view class='ui_uploader' bindtap='upload' wx:if="{{showUpload}}"></view>
</view> </view>
<!-- <view class="add column rowCenter verCenter" bindtap="uploadImg">
<text class="icon iconfont iconiconxiantiaoshouji15"></text>
<text class="t1">上传资料</text>
</view> -->
</block> </block>
<block wx:else> <block wx:else>
<view class="view column rowCenter verCenter"> <view class="view column rowCenter verCenter">
......
.certification .flex-a{flex:1}.certification .flex-b{flex:2}.certification .prompt{padding:0 24rpx;height:68rpx;background:#FFF6E6}.certification .prompt .iconiconxiantiaoshouji12{font-size:30rpx;color:#EAAD37}.certification .prompt .t1{font-size:24rpx;color:#EAA217;margin-left:12rpx}.certification .prompt .iconiconxiantiaoshouji13{font-size:30rpx;color:#D8DFE6}.certification .hr{height:10rpx;background:#F5F9FC}.certification .item{padding:0 24rpx 0 0;margin-left:24rpx;height:100rpx}.certification .item .radio-group .radio-wrap{font-size:28rpx;color:#515559;font-weight:400}.certification .item .t1{font-size:28rpx;color:#515559;font-weight:400}.certification .item .t2{font-size:28rpx;color:#8A9299;font-weight:400}.certification .item .inp{width:492r px;height:100rpx}.certification .item .radio-wrap:first-child{margin-right:50rpx}.certification .item .radio-wrap:first-child .radio-text{font-size:28rpx;font-weight:400;color:#515559}.certification .item .iconChevron{font-size:27rpx;color:#ADB6BF;margin-left:12rpx}.certification .item.bor{border-bottom:1px solid #F5F9FC}.certification .upload-box{margin-top:60rpx;margin-bottom:60rpx}.certification .upload-box .add{width:220rpx;height:220rpx;background:#F0F6FA}.certification .upload-box .add .iconiconxiantiaoshouji15{font-size:80rpx;color:#ADB6BF}.certification .upload-box .add .t1{margin-top:19rpx;font-size:24rpx;color:#8A9299}.certification .upload-box .view{position:relative;width:220rpx;height:220rpx}.certification .upload-box .view .img{width:220rpx;height:220rpx}.certification .upload-box .view .iconiconxiantiaoshouji7{position:absolute;right:-15rpx;top:-12rpx;font-size:30rpx;color:#fff;width:44rpx;height:44rpx;background:#EA1717;border-radius:50%;text-align:center;line-height:44rpx;z-index:99}.certification .upload-box .txt{margin-top:24rpx;font-size:24rpx;color:#8A9299;width:80%}.certification .btn{margin:0 55rpx;height:98rpx;background:#0d84d1 !important;box-shadow:0 6rpx 10rpx 0 rgba(97,160,242,0.3) !important;border-radius:8rpx;font-size:32rpx;color:#FFFFFF !important;text-align:center;line-height:89rpx}.ui_uploader_cell{margin-top:30rpx;background:#fff;width:100%;padding:40rpx;box-sizing:border-box}.ui_uploader_cell:after{clear:both;content:'';display:table}.ui_uploader_item{float:left;position:relative;margin-right:30rpx;margin-bottom:30rpx;width:165rpx;height:165rpx}.ui_uploader{float:left;position:relative;margin-right:25rpx;margin-bottom:25rpx;width:165rpx;height:165rpx;border:2rpx solid #d9d9d9;box-sizing:border-box}.ui_uploader:before{content:" ";position:absolute;width:4rpx;height:79rpx;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background-color:#d9d9d9}.ui_uploader:after{content:" ";position:absolute;height:4rpx;width:79rpx;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background-color:#d9d9d9}.ui_uploader_item_icon{position:absolute;right:-20rpx;top:-20rpx;background:#fff;border-radius:50%}.ui_uploader_item image{width:100%;height:100%} .certification .flex-a{flex:1}.certification .flex-b{flex:2}.certification .prompt{padding:0 24rpx;height:68rpx;background:#FFF6E6}.certification .prompt .iconiconxiantiaoshouji12{font-size:30rpx;color:#EAAD37}.certification .prompt .t1{font-size:24rpx;color:#EAA217;margin-left:12rpx}.certification .prompt .iconiconxiantiaoshouji13{font-size:30rpx;color:#D8DFE6}.certification .hr{height:10rpx;background:#F5F9FC}.certification .item{padding:0 24rpx 0 0;margin-left:24rpx;height:100rpx}.certification .item .radio-group .radio-wrap{font-size:28rpx;color:#515559;font-weight:400}.certification .item .t1{font-size:28rpx;color:#515559;font-weight:400}.certification .item .t2{font-size:28rpx;color:#8A9299;font-weight:400}.certification .item .inp{width:492r px;height:100rpx}.certification .item .radio-wrap:first-child{margin-right:50rpx}.certification .item .radio-wrap:first-child .radio-text{font-size:28rpx;font-weight:400;color:#515559}.certification .item .iconChevron{font-size:27rpx;color:#ADB6BF;margin-left:12rpx}.certification .item.bor{border-bottom:1px solid #F5F9FC}.certification .upload-box{margin-top:60rpx;margin-bottom:60rpx}.certification .upload-box .ic{position:absolute;right:-15rpx;top:-12rpx;font-size:30rpx;color:#fff;width:44rpx;height:44rpx;background:#EA1717;border-radius:50%;text-align:center;line-height:44rpx;z-index:99}.certification .upload-box .add{width:220rpx;height:220rpx;background:#F0F6FA}.certification .upload-box .add .iconiconxiantiaoshouji15{width:44rpx;height:44rpx;font-size:80rpx;color:#ADB6BF}.certification .upload-box .add .t1{margin-top:19rpx;font-size:24rpx;color:#8A9299}.certification .upload-box .view{position:relative;width:220rpx;height:220rpx}.certification .upload-box .view .img{width:220rpx;height:220rpx}.certification .upload-box .view .iconiconxiantiaoshouji7{position:absolute;right:-15rpx;top:-12rpx;font-size:30rpx;color:#fff;width:44rpx;height:44rpx;background:#EA1717;border-radius:50%;text-align:center;line-height:44rpx;z-index:99}.certification .upload-box .txt{margin-top:24rpx;font-size:24rpx;color:#8A9299;width:80%}.certification .btn{margin:0 55rpx;height:98rpx;background:#0d84d1 !important;box-shadow:0 6rpx 10rpx 0 rgba(97,160,242,0.3) !important;border-radius:8rpx;font-size:32rpx;color:#FFFFFF !important;text-align:center;line-height:89rpx}.ui_uploader_cell{margin-top:30rpx;background:#fff;width:100%;padding:40rpx;box-sizing:border-box}.ui_uploader_cell:after{clear:both;content:'';display:table}.ui_uploader_item{float:left;position:relative;margin-right:30rpx;margin-bottom:30rpx;width:165rpx;height:165rpx}.ui_uploader{float:left;position:relative;margin-right:25rpx;margin-bottom:25rpx;width:165rpx;height:165rpx;border:2rpx solid #d9d9d9;box-sizing:border-box}.ui_uploader:before{content:" ";position:absolute;width:4rpx;height:79rpx;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background-color:#d9d9d9}.ui_uploader:after{content:" ";position:absolute;height:4rpx;width:79rpx;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background-color:#d9d9d9}.ui_uploader_item_icon{position:absolute;right:-20rpx;top:-20rpx;background:#fff;border-radius:50%;width:44rpx;height:44rpx}.ui_uploader_item image{width:100%;height:100%}
\ No newline at end of file \ No newline at end of file
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 sign in to comment