微信小程序之问卷调查

在这里插入图片描述

登录界面

login.js

// miniprogram/pages/login/login.js
Page({
   

  data: {
   
    username: null,
    password: null,
    currentId:null,
  },
  formLogin: function(e) {
   //表单提交数据
    //判断输入是否为空
    if (e.detail.value.inputname == "" | e.detail.value.inputpass == "") {
   
      wx.showToast({
   
        icon: 'none',
        title: '请输入有效值',
      })
    } else {
   
      const db = wx.cloud.database()
      var username = e.detail.value.inputname
      var password = e.detail.value.inputpass
      db.collection('user_info').where({
   //查询用户信息数据库
        username: username,
        password: password
       
      }).get({
   
        success: res => {
   

          if (res.data.length != 0) {
   
            wx.showToast({
   
              title: '登录成功',
            })
            this.data.currentId = res.data[0]._id
            this.data.username=res.data[0].username
            wx.navigateTo({
   
              //跳转到投票界面,同时将该用户id和用户名传到index界面
              url: '/pages/home/home?currentId=' + this.data.currentId+"&username="+this.data.username
            })
           
            console.log('Login成功: ', res.data)
          } else {
   
            wx.showToast({
   
              icon: 'none',
              title: '登录失败',
            })
            console.log('Login失败: ', res)
          }
        },

        fail: err => {
   
          wx.showToast({
   
            icon: 'none',
            title: '数据库连接失败'
          })
          console.error('数据库连接失败:', err)
        }
      })
    }
    console.log("submit: ", e.detail.value)
  },

  btnRegister: function(e) {
   //点击注册界面
    wx.navigateTo({
   
      url: '/pages/register/register'
    })
  },

})

login.wxml

<view class="content">
<image class="imag"  src="cloud://cloud-awkue.636c-cloud-awkue-1300500689/questionnaire/login.png" style="height:300rpx;width:40rpx;"></image >
  <!-- <view class="header">Questionnaire Survey</view> -->
  <form bindsubmit="formLogin">
    <view class="weui-cells weui-cells_after-title">
      <view class="user_pass">
        <!-- <view class="weui-cell__hd">
          <view class="weui-label">用户名</view>
        </view> -->
        <view class="weui-cell__bd username">
          <input class="weui-input " placeholder="username" name="inputname" value="{
    {username}}" />
        </view>
      </view>
      <view class="user_pass">
        <!-- <view class="weui-cell__hd">
          <view class="weui-label">密码</view>
        </view> -->
        <view class="weui-cell__bd password">
          <input class="weui-input" placeholder="password" type="password"  name="inputpass" value="{
    {password}}" />
        </view>
      </view>
    </view>
    <view class="weui-btn-area">
      <button class="btnlogin" type="primary" form-type="submit">登录</button>
      <button class="btnregister" type="default" bindtap="btnRegister">注册</button>
    </view>
  </form>
</view>


login.wxss

/* miniprogram/pages/login/login.wxss */

.content {
   
  background-color: white;
}

.header {
   
  /* margin: 10 auto; */
  font: 2400px;
  font-family: Arial;
  font-size: 40px;
  text-align: center;
  color: rgb(24, 223, 24);
}
.radio {
   
margin-bottom: 
        14rpx;
}
.username{
   
 left: 200px;
top: 300px;
width: 300px;
height: 50px;
border-radius: 0px;
background-color
  • 8
    点赞
  • 47
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值