用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

2016-11-28 16:15:48 天下雪原创达人 造轮子 人生巅峰 楼主 358345
点评:这个看起来还是很符合张小龙的理念的;

1.png 2.png 3.png 4.png

代码片段:
[AppleScript] 纯文本查看 复制代码
var app = getApp();
Page({
    data:{
        wechatUserInfo:{},
        scrollHeight:150,
        imageWidth:125,
        imageHeight:125,
        photoList:[],
        location:"选择我的位置",
        array: ['拼车','取快递', '带文件', '租房','健身指导', '其他'],
        index: 0,
        date:"2016-09-01",
        time:"12:01",
        curtype: "请选择",
    },
    addAndSavePhoto:function(){
        console.log("从本地选取照片");
        var that = this;
        var showFileList = that.data.photoList;
        wx.chooseImage({
          count: 9, // 最多可以选择的图片张数,默认9
          sizeType: ['original','compressed'], // original 原图,compressed 压缩图,默认二者都有
          sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有
          success: function(res){
            // 后台慢慢保存文件到本地      
            res.tempFilePaths.forEach(function(tempFilePath){
                // 调用保存到本地的API
                wx.saveFile({
                  tempFilePath: tempFilePath,
                  success: function(res){
                    console.log("保存到本地的文件路径:"+res.savedFilePath);
                    showFileList.push(res.savedFilePath);
                    // 更新页面显示
                    console.log(showFileList.length+"个展示图片");
                    that.setData({
                        photoList:showFileList
                    });
                  }
                })
            }); 
          }
        });
    },
    previewPhoto:function(event){
        console.log(event);
        var curTarget = event.target.dataset.imageSrc;
        console.log(curTarget);
        wx.navigateTo({
          url: '../previewphoto/previewphoto?imagepath='+curTarget
        })
 /*       wx.previewImage({
          current: curTarget, // 当前显示图片的链接,不填则默认为 urls 的第一张
          urls: this.data.photoList,
          success: function(res){
            // success
            console.log(res);
          }
        }) */
    },
    twoColomn:function(){
        var that = this;
        var length = 750/2;
        that.setData({
            imageWidth:length,
            imageHeight:length
        });
    },
    threeColomn:function(){
        var that = this;
        var length = 750/3;
        that.setData({
            imageWidth:length,
            imageHeight:length
        });
    },
    fourColomn:function(){
        var that = this;
        var length = 750/4;
        that.setData({
            imageWidth:length,
            imageHeight:length
        });
    },
    bindPickerChange: function(e) {
        console.log('picker发送选择改变,携带值为', e.detail.value)
        var that = this;
        var i=e.detail.value; 
        that.setData({
        index: i,
            curtype:that.data.array[i]
        });
        console.log("123")
    },
    bindDateChange:function(e){
        this.setData({
            date:e.detail.value
        })
    },

    chooseLocation:function(){
        var that = this;
        wx.chooseLocation({
            type: 'wgs84',
            success: function(res) {
                var latitudeCur = res.latitude;
                var longitudeCur = res.longitude;
                var name = res.name;
                var address = res.address;
                console.log(name);
                that.setData({
                    location:name,
                    latitude:latitudeCur,
                    longitude:longitudeCur
                })
            }
        });
    },

    onLoad:function(){
        console.log("加载照片列表");
        var that = this;
        //获取用户信息
        app.getUserInfo(function(userInfo){
            //更新数据
            that.setData({
                wechatUserInfo:userInfo
            });
            that.update();
        })
        // 获取当前窗口高度,以便设置scrollView的高度
        wx.getSystemInfo({
          success: function(res) {
            console.log(res.model);
            console.log(res.pixelRatio);
            console.log(res.windowWidth);
            console.log(res.windowHeight);
            console.log(res.version);
            that.setData({
                scrollHeight:res.windowHeight/8
            });
          }
        });
        //获取当前时间
        var timeStr =new Date;
        function formatNumber(n) {
            n = n.toString()
            return n[1] ? n : '0' + n
            }

        function formatTime(time) {
            var hour = time.getHours()
            var minute = time.getMinutes()
            var second = time.getSeconds()
           
            return [hour, minute].map(formatNumber).join(':')
            }

        function formatDate(date) {
            var year = date.getFullYear()
            var month = date.getMonth() + 1
            var day = date.getDate()

            return [year, month, day].map(formatNumber).join('-')
            }

        var dateNow=formatDate(timeStr);
        // var timeNow=formatTime(timeStr);
        that.setData({
                date:dateNow,
                // time:timeNow
            });

            
    },

    formSubmit: function(e) {
        var that = this;
        console.log('form发生了submit事件,携带数据为:', e.detail.value)
        var formData=e.detail.value;
        var reqData={};
        reqData.userId=that.data.wechatUserInfo.nickName;
        reqData.longitude=that.data.longitude;
        reqData.latitude=that.data.latitude;
        reqData.srvType=that.data.curtype;
        reqData.srvTitle=formData.title;
        reqData.srvDesc=formData.describe;
        reqData.srvCost=formData.score;
        reqData.endTime=formData.date+" 00:00:00";
        reqData.urgent=formData.isquickly;
        reqData.mobile=formData.phonenumber;
        reqData.posDes=that.data.location;
        wx.request({
            url: 'https://wechatapp.zhhhorizon.net/intl-console-web/user/postNeed', //接口地址
            data: reqData,
            method:"POST",
            header: {
                'content-type': 'application/json',
                "dataType":"json"
            },
            success: function(res) {
                if (res.data.respCode){
                    if(res.data.respCode==0){
                        wx.showModal({
                            title: '提示',
                            content: '求助信息提交成功!',
                            success: function(res) {
                                if (res.confirm) {
                                    wx.navigateTo({
                                        url:"../helpList/helpList"
                                    });
                                }
                            }
                        });
                    }
                    else if(res.data.respCode==1){
                        wx.showModal({
                            title: '提示',
                            content: '求助信息提交失败!',
                            success: function(res) {
                                if (res.confirm) {
                                    console.log('用户点击确定')
                                }
                            }
                        });
                    }
                }
                else{
                    wx.showModal({
                        title: '提示',
                        content: '求助信息提交失败!',
                        success: function(res) {
                            if (res.confirm) {
                                console.log('用户点击确定')
                            }
                        }
                    });
                }
            },
            fail: function() {
                wx.showModal({
                    title: '提示',
                    content: '提交失败!',
                    success: function(res) {
                        if (res.confirm) {
                            console.log('用户点击确定')
                        }
                    }
                });
            }
        });
    },
    onShow:function(){
        console.log("显示图片")
        // 获取本地保存的图片
        var that = this;
        wx.getSavedFileList({
          success: function(res){
            // success
            console.log(res.errMsg);
            console.log(res.fileList.length+"个本地文件");
            var filePathList=[];
            res.fileList.forEach(function(item){
                filePathList.push(item.filePath);
                // 删除本地文件
 /*               wx.removeSavedFile({
                  filePath: item.filePath,
                  complete: function(res){
                    // success
                    console.log(res);
                  }
                })   */
            });
            that.setData({
                photoList:filePathList
            });
          },
          fail:function(){
              // 失败 wx.showToast
              wx.showToast({
                  title:"获取本地图片失败!",
                  duration: 2000
              });
          }
        })
    }
})

[HTML] 纯文本查看 复制代码
<view class="publish-container"> 

<form catchsubmit="formSubmit" >
    <view class="publish-section">
        <input name="title" class="publish-title" placeholder="标题" />
        <textarea  name="describe" class="publish-describe" placeholder="描述您的求助,清晰的描述有助于更快的获得帮助" /> 
        <!--<scroll-view scroll-y="true" class="show-area" style="height:{{scrollHeight}}px;">
            <image bindtap="addAndSavePhoto" style="width:{{imageWidth}}rpx;height:{{imageHeight}}rpx;" mode="aspectFill" class="plus-image" src="../../images/plus.png" />
            <view class="photo-list" wx:for="{{photoList}}" wx:key="*this" wx:for-item="imageSrc">
                <image bindtap="previewPhoto" data-image-src="{{imageSrc}}" style="width:{{imageWidth}}rpx;height:{{imageHeight}}rpx;" mode="aspectFill" src="{{imageSrc}}"/>
            </view>  
        </scroll-view>-->
        <view class="publish-location">
            <image class="publish-location-img" mode="aspectFill" src="../../images/location.png" />
            <button name="location" class="publish-location-title" bindtap="chooseLocation">{{location}}</button>
        </view>
    </view>

    <view class="publish-section">
    <view class="publish-section-item-first">
        <label class="publish-score-title" >奖赏积分</label>
        <input name="score" class="publish-score" placeholder="高赏分更容易获得帮助" />
    </view>

    <view class="publish-section-item-first">
        <label class="publish-type-title" >求助类型</label>
        <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}" >
                <view name="helptype" class="picker">
                        {{curtype}}
                </view>
            <image class="publish-type-arrow" mode="aspectFill" src="../../images/arrow1.png" />

        </picker>

    </view>

    <view class="publish-section-item">
        <label class="publish-type-title" >加急</label>
        <switch class="publish-switch" name="isquickly"/>
    </view>

    </view>

    <view class="publish-section">
    <label class="publish-type-title" >有效期至</label>
    <picker name="date" mode="date" value="{{date}}" start="2016-09-01" end="2018-09-01" bindchange="bindDateChange">
            <view class="picker">
                {{date}}
            </view>
    <image class="publish-type-arrow" mode="aspectFill" src="../../images/arrow1.png" />

        </picker>
    </view>

    <view class="publish-section-last">
    <label class="publish-score-title" >联系方式</label>
    <input name="phonenumber" class="publish-score" placeholder="请填写您的电话" />
    </view>

    <view class="publish-button-container">    
    <button class="publish-button" formType="submit">现在发布</button>
    </view>

 </form>
</view>


项目地址及下载:
https://github.com/zhhgit/Lezhu
Lezhu-master.zip (184.96 KB, 下载次数: 712)
有问题请在本站内搜索相应关键词,假如无法解决请在综合交流区内发帖咨询,发帖时请提供详细的问题描述、相关图片及代码。
6666666666666666666
不错的资源,学习了。
2016-11-29 10:37:52 舒茉莉 架构狮
5#
程序学习 地理位置
2016-11-30 12:01:55 asdf 攻城狮
6#
666666666666
多谢分享!
6666666666
2016-11-30 15:05:34 南小磊 攻城狮
9#
aaaaaaaaaa
看看 学习
9999999999999999999999
2016-12-1 15:01:50 Mmyton 攻城狮
13#
试一下
guolai kankank
6666,谢谢楼主
123下一页
发新帖
您需要登录后才可以回帖 登录 | 立即注册