1程序首页
2.页面代码
<view>
<view>人脸采集与识别</view>
<view class='title'>学生信息（包括人像）采集，刷脸登录</view>
<view class='cont'>
<button type="primary" class='zhu' bindtap='zhuce'>学生注册</button>
<button type="warn" class='zhu' bindtap='recognition'>人脸识别</button>
<button class='zhu' bindtap='tabulation'>学生列表</button>
</view>
</view>
3.点击进去显示
<view class="weui-cells__title text">录入学生信息</view> <form bindsubmit="formSubmit"> <view class="weui-cells weui-cells_after-title"> <view class="weui-cell weui-cell_input"> <view class="weui-cell__hd"> <view class="weui-label">学号</view> </view> <view class="weui-cell__bd"> <input class="weui-input" placeholder="请输入学号" value='1635050925' name="no" /> </view> </view> <view class="weui-cell weui-cell_input weui-cell_vcode"> <view class="weui-cell__hd"> <view class="weui-label">姓名</view> </view> <view class="weui-cell__bd"> <input class="weui-input" placeholder="请输入姓名" value='徐冰冰' name="name" /> </view> </view> <view class="weui-cell weui-cell_input"> <view class="weui-label">性别</view> <input class="weui-input" name='sex' value='{{sex}}'/> <view class='weui-cell_ft'> <switch checked bindchange='switch1Change'></switch> </view> </view> <view class="weui-cell weui-cell_input weui-cell_vcode"> <view class="weui-cell__hd"> <view class="weui-label">年龄</view> </view> <view class="weui-cell__bd"> <input class="weui-input" placeholder="请输入年龄" value='20' name="age" /> </view> </view> </view> <view class="weui-btn-area"> <button class="weui-btn" type="primary" bindtap="showTopTips" formType="submit">注册</button> <button class="weui-btn" type="default" bindtap='cancel'>返回上级</button> </view> </form>// pages/add/add.js //获取应用实例 const app = getApp() Page({ data: { sex: '女', }, cancel: function () { wx.redirectTo({ url: '../face/face', }) }, switch1Change: function (e) { if (e.detail.value) { this.setData({ sex: '男' }) } else { this.setData({ sex: '女' }) } }, formSubmit: function (e) { // console.log(e); wx.request({ url: 'http://xubingbing.top/mini-prgram-php/server/index.php/home/index/add', data: e.detail.value, method: 'POST', header: { 'content-type': 'application/x-www-form-urlencoded' }, success: (res) => { console.log(res.data); if (res.error) { wx.showToast({ title: res.data.msg, icon: 'none', duration: 2000 }) } else { wx.showToast({ title: '添加成功', icon: 'success', duration: 2000 }) setTimeout(function () { wx.navigateTo({ url: '../headimg/headimg?id=' + res.data.id , }) }, 2000) } } }) } }) 4后台代码是
//添加学生信息 public function add($no,$name,$sex,$age){ if (empty($no) ||empty($name)) { return $this->ajaxReturn(array('error'=>true,'msg'=>'学号或姓名必填')); exit; } $data['no']= $no; $data['name']=$name; $data['sex']=$sex; $data['age']=$age; $stu=M('student'); if ($stu->where("no='{$no}'")->find()) { return $this->ajaxReturn(array('error'=>true,'msg'=>'学号重复')); }else{ $id=$stu->add($data); if ($id) { return $this->ajaxReturn(array('error'=>false,'id'=>$id)); }else{ return $this->ajaxReturn(array('error'=>true,'msg'=>"添加失败")); } } }
5.跳转到添加图片页面
6.点击加号添加图片（通过ID号来获取）
<view class="page" xmlns:wx="http://www.w3.org/1999/xhtml"> <view class="weui-cells__title text">图像采集</view> <view class="weui-cells__title text">{{options.name}} {{options.no}}</view> <form bindsubmit="formSubmit"> <view class="page__bd"> <view class="weui-cells"> <view class="weui-cell"> <view class="weui-cell__bd"> <view class="weui-uploader"> <view class="weui-uploader__hd"> <view class="weui-uploader__title">图片上传</view> <view class="weui-uploader__info">{{files.length}}/1</view> </view> <view class="weui-uploader__bd"> <view class="weui-uploader__files" id="uploaderFiles"> <block wx:for="{{files}}" wx:key="*this"> <view class="weui-uploader__file" bindtap="previewImage" id="{{item}}"> <image class="weui-uploader__img" src="{{item}}" mode="aspectFill"/> </view> </block> </view> <view class="weui-uploader__input-box"> <view class="weui-uploader__input" bindtap="chooseImage"></view> </view> </view> </view> </view> </view> </view> </view> <view class="weui-btn-area"> <button class="weui-btn" type="primary" form-type="submit">确认</button> <button class="weui-btn" type="default" bindtap='cancel'>取消</button> </view> </form> </view>const app = getApp() function upload(that, id) { if (that.data.files.length == 0) { return; } wx.uploadFile({ url: 'http://xubingbing.top/mini-prgram-php/server/index.php/home/index/upload', //仅为示例，非真实的接口地址 filePath: that.data.files[0], name: 'file', formData: { 'id': id }, success: function (res) { var data = res.data // var json = JSON.parse(data) console.log(data) wx.showToast({ title: data, icon:'success', duration:2000 }) setTimeout(function () { wx.navigateTo({ url: '../index/index', }) }, 2000) } }) } Page({ chooseImage: function (e) { var that = this; wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 success: function (res) { console.log(res) // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片 that.setData({ files: res.tempFilePaths, }); } }) }, //预览照片 previewImage: function () { var current = e.target.dataset.src wx.previewImage({ current: current, urls: this.data.imageList }) }, cancel:function(){ wx.redirectTo({ url: '../index/index', }) }, /** * 页面的初始数据 */ data: { files: [], options:null, id:null, }, formSubmit:function(e){ upload(this,this.data.id); }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { console.log(options); this.setData({options:options}) this.setData({ id: options.id }) }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } })
文章来源: 微信小程序--人脸检测 （添加信息）