美文网首页
小程序上传图片

小程序上传图片

作者: Stonesy | 来源:发表于2020-05-28 00:45 被阅读0次
    <!--图片-->
    <view class="cu_form_img" wx:if="{{info.q_styles=='服务中'||info.q_styles=='已完成'||info.q_styles=='验收中'}}">
            <view class="title">服务后现场存档</view>
            <view class="input df">
                <view style="margin-right:30rpx;">
                    <!-- <view bindtap="uploadImg1" class="uploadImg_box df"> -->
                    <view bindtap="chooseImage" data-num="2" class="uploadImg_box df">
                        <image class="camera" src="/hyb_o2o/resource/images/camera.png" wx:if="{{!src1}}"></image>
                        <image class="logo" mode="aspectFill" src="{{src1}}" wx:if="{{src1}}"></image>
                        <image catchtap="delPic" class="del_icon" src="/hyb_o2o/resource/images/del.png" wx:if="{{src1}}"></image>
                        <input hidden="true" name="end_video" value="{{src1}}"></input>
                    </view>
                </view>
            </view>
        </view>
    <!--图片-->
    <!--视频-->
    <!-- <view class="progress_box" wx:if="{{info.q_styles=='服务中'||info.q_styles=='已完成'||info.q_styles=='验收中'}}">
            <text>服务后现场存档</text>
            
            <view class="video_box">
                <view class="videoList" wx:for="{{end_video}}">
                    <video bindplay="end_player" class="video" data-idx="{{index}}" id="myvideoTwo" src="{{item}}"></video>
                    <image bindtap="removeImageTwo" class="close" data-idx="{{index}}" src="/hyb_o2o/resource/images/del.png" wx:if="{{type!='yh'&&info.q_styles=='服务中'}}"></image>
                </view>
                <view bindtap="chooseImage" class="add_video" data-num="2" style="{{end_video.length<=2?'':'display: none;'}}" wx:if="{{type!='yh'&&info.q_styles=='服务中'}}">
                    <image src="/hyb_o2o/resource/images/video_image.png"></image>
                </view>
            </view>
        </view> -->
    <!--视频-->
    
    chooseImage: function(a) {
            var t = a.currentTarget.dataset.num, e = this;
            wx.showActionSheet({
                itemList: [ "从相册中选择", "拍照" ],
                // itemList: [ "从相册中选择", "录像" ],
                itemColor: "#CED63A",
                success: function(a) {
                    a.cancel || (0 == a.tapIndex ? e.chooseWxImage("album", t) : 1 == a.tapIndex && e.chooseWxImage("camera", t));
                }
            });
        },
        
        chooseWxImage: function(a, t) {
            console.log(this.data.url);
            console.log(7774444);
            var t = t, e = this, o = this.data.start_video, n = this.data.end_video;
            wx.chooseImage({
            // wx.chooseVideo({
                count: 1,
                sourceType: [a],
                maxDuration: 60,
                camera: [ "front", "back" ],
                sizeType: [ "original", "compressed" ],
                success: function(a) {
                    console.log(a);
                    console.log(999999999);
                    console.log(t);
                    var i = a.tempFilePaths[0];
                    1 == t ? wx.uploadFile({
                        url: e.data.url + "app/index.php?i=" + e.data.base.uniacid + "&c=entry&a=wxapp&do=upload&m=hyb_o2o",
                        filePath: i,
                        name: "upfile",
                        formData: {
                            openid: wx.getStorageSync("openid")
                        },
                        // url: e.data.url + "app/index.php?i=" + e.data.base.uniacid + "&c=entry&a=wxapp&do=Uploadvideo&m=hyb_o2o",
                        // filePath: i,
                        // name: "upfile",
                        // formData: {
                        //     openid: wx.getStorageSync("openid")
                        // },
                        success: function(a) {
                            // o = o.concat(a.data), o = o.length <= 3 ? o : o.slice(0, 3), e.setData({//视频
                            e.setData({//图片
                                // start_video: o//视频
                                src1: a.data//图片
                            });
                        }
                    }) : wx.uploadFile({
    //图片
                        url: e.data.url + "app/index.php?i=" + e.data.base.uniacid + "&c=entry&a=wxapp&do=upload&m=hyb_o2o",
                        filePath: i,
                        name: "upfile",
                        formData: {
                            openid: wx.getStorageSync("openid")
                        },
    //图片
    //视频
                        // url: e.data.url + "app/index.php?i=" + e.data.base.uniacid + "&c=entry&a=wxapp&do=Uploadvideo&m=hyb_o2o",
                        // filePath: i,
                        // name: "upfile",
                        // formData: {
                        //     openid: wx.getStorageSync("openid")
                        // },
    //视频
                        success: function(a) {
                            // n = n.concat(a.data), n = n.length <= 3 ? n : n.slice(0, 3), e.setData({//视频
                             e.setData({//图片
                                // end_video: n//视频
                                src1: a.data//图片
                            });
                        },fail:function(t){
                            console.log('error');
                            console.log(t);
                        }
                    });
                }
            });
        },
    
    //图片
    
    .cu_form_img {
        border-top: 1rpx solid #eee;
        background-color: #fff;
        padding: 20rpx;
    }
    
    .cu_form_img .title {
        padding-bottom: 20rpx;
        font-size: 24rpx;
    }
    
    .cu_form_group .label {
        color: #e7454a;
        border: 2rpx solid #e7454a;
        font-size: 24rpx;
        padding: 0rpx 10rpx;
        margin-right: 10rpx;
    }
    
    .camera {
        width: 80rpx;
        height: 80rpx;
    }
    
    .uploadImg_box {
        position: relative;
        width: 200rpx;
        height: 200rpx;
        background: #fff;
        border: 2rpx solid #eaeaea;
        justify-content: center;
    }
    
    .uploadImg_box .del_icon {
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(30%,-30%);
        width: 30rpx;
        height: 30rpx;
    }
    //图片
    //视频
    
    .progress_box {
        width: auto;
        height: auto;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        margin-bottom: 39rpx;
    }
    
    .progress_box:nth-last-child(1) {
        margin-bottom: 0;
    }
    
    .progress_box text {
        font-size: 24rpx;
        font-weight: normal;
        color: #000;
        text-align: left;
        margin-bottom: 24rpx;
    }
    
    .video_box {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
    }
    
    .videoList {
        width: 102rpx;
        height: 102rpx;
        position: relative;
        margin-right: 24rpx;
    }
    
    .videoList .video {
        width: 102rpx;
        height: 102rpx;
        background-color: #f5f5f5;
        border-radius: 10rpx;
    }
    
    .close {
        width: 30rpx;
        height: 30rpx;
        border-radius: 50%;
        position: absolute;
        top: -15rpx;
        right: -15rpx;
    }
    
    .add_video {
        width: 102rpx;
        height: 102rpx;
        background: #f5f5f5;
        border-radius: 10rpx;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .add_video image {
        width: 50rpx;
        height: 55rpx;
    }
    
    .phone_box {
        display: flex;
        align-items: center;
        font-size: 28rpx;
    }
    
    .phone_box image {
        width: 32rpx;
        height: 32rpx;
        margin-right: 15rpx;
    }
    
    .address_box {
        display: flex;
        align-items: center;
        margin-right: 50rpx;
        font-size: 28rpx;
    }
    
    .address_box image {
        width: 32rpx;
        height: 35rpx;
        margin-left: 15rpx;
    }
    .qiang {
        border-radius: 10rpx;
        color: #fff;
        background: #ff3833;
        padding: 10rpx 20rpx;
        margin-left: 10rpx;
    }
    
    //视频
    

    相关文章

      网友评论

          本文标题:小程序上传图片

          本文链接:https://www.haomeiwen.com/subject/habnahtx.html