身份证信息录入页面

card,wxml

<view class="cardImg" id="ImgDiv1">
<h5 class="title-h1">上传身份证正面人脸照</h5>
<image wx:if='{{image1}}' class="img1" src="{{image1}}" id="Img1"></image>
  <input class="ui-btn1" type="button" bindtap="popSelect1" onclick="upfileImg(1)" id="Img1" value="本人身份证正面上传 " />
</view>
<view class="cardImg" id="ImgDiv2">
<h5 class="title-h1">上传身份证反面国徽照</h5>
<image wx:if='{{image2}}' class="img1" src="{{image2}}" id="Img2"></image>
  <input class="ui-btn1" type="button" bindtap="popSelect2" onclick="upfileImg(2)" id="Img2" value="本人身份证背面上传 " />
</view>
<view class="cardImg" id="ImgDiv3">
<h5 class="title-h1">上传本人相片</h5>
<image wx:if='{{image3}}' class="img2" id="Img3" src="{{image3}}" ></image>
  <input class="ui-btn1" type="button" bindtap="popSelect3" onclick="upfileImg(3)" id="Img2" value="本人头像拍照上传" />
</view>


<view class="cardBox-bd idCard-box">
  <span class="cardBox-kd1">姓名</span>
  <input class="weui-input" name="cname" placeholder="联系人的名字" bindinput="nameInput" />
</view>
<view class="cardBox-bd idCard-box">
  <span class="cardBox-kd1">联系电话</span>
  <input class="weui-input" name="cphone" placeholder="联系人的电话" bindinput="phoneInput" />
</view>
<view class="cardBox-bd idCard-box">
  <span class="cardBox-kd1">关系</span>

  <picker bindchange="bindPickerChange" value="{{dataList[index].cvalue}}" range="{{dataList}}" range-key="{{'ckey'}}">
    <view class="picker">
      <input class='selectInp' bindinput="contentInput" placeholder='请选择关系' name="relations" disabled='false' value='{{dataList[index].ckey}}'/>
    </view>
  </picker>
  
</view>
<view style="text-align: center;">
  <a id="submitBtn" class="ui-btn" style="left:100px;" bindtap="save"> 确 定 </a>
</view>

card.js

// ca.js
Page({
  
  /**
   * 页面的初始数据
   */
  data: {
    image1:'../image/01.jpg',
    image2: '../image/02.jpg',
    image3: '../image/user-unlogin.png',
    datalist:[],
    index: 0,
    dropDownMenuTitle: ['-----------请选择-----------'],
    cname:'',
    cphone:'',
    relations:'',
    pid:'',
    card1:'',//身份证正面图片路径
    card2:'',//身份证反面图片路径
    card3:''//头像图片路径
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onl oad: function (options) {
    this.setData({
     pid:options.pid
    })
    var that = this;
    wx.request({
      url: 'https://bw.cross.echosite.cn/shjz/people!card.do',
      data: {
      },
      method: 'POST',
      header: {
        'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
      },
      success: function (res) {
        console.log(res.data);
        console.log(res.data.obj[1].ckey);
        that.setData({
          dataList: res.data.obj
        })
      },
      fail: function (res) {
        console.log("--------fail--------");
      }

    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },
  bindPickerChange: function (e) {
    console.log('picker发送选择改变,携带值为', e.detail.value)
    this.setData({
      index: e.detail.value,
      relations:e.detail.value
    })
  },
  /**
   * 获取名字
   */
  nameInput:function(e){
    this.setData({
      cname: e.detail.value
    })
  },
  /**
   * 获取联系电话
   */
  phoneInput:function(e){
    this.setData({
      cphone: e.detail.value
    })
  },
  /**
   * 获取关系
   */
  contentInput:function(e){
    //relations
    this.setData({
      relations: e.detail.value
    })
  },
  save:function(){
    console.log(this.data.cname+this.data.cphone+this.data.relations)
    wx.request({
      url: 'https://bw.cross.echosite.cn/shjz/contact!addcontent.do',
      data: {
        cname:this.data.cname,
        cphone:this.data.cphone,
        relations:this.data.relations,
        pid:this.data.pid
      },
      method: 'Get',
      header: {
        'content-type': 'application/json;charset=utf-8'
      },
      success: function (res) {
        console.log(res.data);
        
      },
      fail: function (res) {
        console.log("--------fail--------");
      }

    })
    wx.showLoading({
      title: '图片上传中',
    })
    wx.request({
      url: 'https://bw.cross.echosite.cn/shjz/people!path.do',
      data: {
        pid:this.data.pid,
        card1: this.data.card1,
        card2: this.data.card2,
        card3: this.data.card3
      },
      method: 'POST',
      header: {
        'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
      },
      success: function (res) {
        console.log(res.data);
        
      },
      fail: function (res) {
        console.log("--------fail--------");
      }

    })
  },
  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  },
  popSelect1:function(){
    var that = this;
    wx.showActionSheet({
      itemList: [' 拍摄', '从相册选择'],
      success: function (res) {
        if (res.tapIndex == 0) {
          //  wx.navigateTo({
          //    url: '/pages/index/index'
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['camera'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              const tempFilePaths = res.tempFilePaths;
              console.log(res.tempFilePaths)
              that.setData({
                image1: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card1: data.obj
                  })
                  //do something
                }
              })
            }
          })
        } else {
          //  wx.navigateTo({
          //    url: '/pages/index/kiaa',
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['album'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              var tempFilePaths = res.tempFilePaths;
              that.setData({
                image1: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card1: data.obj
                  })
                  //do something
                }
              })
            }
          })
        }
      }
    })
  },
  popSelect2: function () {
    var that = this;
    wx.showActionSheet({
      itemList: [' 拍摄', '从相册选择'],
      success: function (res) {
        if (res.tapIndex == 0) {
          //  wx.navigateTo({
          //    url: '/pages/index/index'
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['camera'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              var tempFilePaths = res.tempFilePaths;
              that.setData({
                image2: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card2: data.obj
                  })
                  //do something
                }
              })
            }
          })
        } else {
          //  wx.navigateTo({
          //    url: '/pages/index/kiaa',
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['album'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              var tempFilePaths = res.tempFilePaths;
              that.setData({
                image2: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card2: data.obj
                  })
                  //do something
                }
              })
            }
          })
        }
      }
    })
  },
  popSelect3: function () {
    var that = this;
    wx.showActionSheet({
      itemList: [' 拍摄', '从相册选择'],
      success: function (res) {
        if (res.tapIndex == 0) {
          //  wx.navigateTo({
          //    url: '/pages/index/index'
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['camera'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              var tempFilePaths = res.tempFilePaths;
              that.setData({
                image3: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card3: data.obj
                  })
                  //do something
                }
              })
            }
          })
        } else {
          //  wx.navigateTo({
          //    url: '/pages/index/kiaa',
          //  })
          wx.chooseImage({
            count: 1,
            sizeType: ['original', 'compressed'],
            sourceType: ['album'],
            success(res) {
              // tempFilePath可以作为img标签的src属性显示图片
              var tempFilePaths = res.tempFilePaths;
              that.setData({
                image3: tempFilePaths
              })
              wx.uploadFile({
                url: 'https://bw.cross.echosite.cn/shjz/fileUpload!upload.do', //仅为示例,非真实的接口地址
                filePath: tempFilePaths[0],
                name: 'file',
                formData: {
                  'user': 'test'
                },
                success(res) {
                  var data = JSON.parse(res.data);
                  // const data = res.data
                  console.log(data.success);
                  console.log(data.obj);
                  that.setData({
                    card3: data.obj
                  })
                  //do something
                }
              })
            }
          })
        }
      }
    })
  }
})

 

上一篇:微信小程序如何上传图片


下一篇:JavaScript函数的形参