<!--pages/shopmanage/shoppwd.wxml--> <view class="container"> <view class="classname"> <view class="tips">*新开通的商家初始密码为888888,账号名为您当前微信昵称,如果昵称包含表情请修改为不包含再登陆本平台即可视为改名成功,为了您的账号安全,请尽快修改登陆密码</view> <form bindsubmit="editpwd"> <view class="xing">新密码 <input placeholder-class='placeholder' placeholder='请输入新密码' class="in" name='pwd' value="" /> </view> <view class="xing">确认密码 <input placeholder-class='placeholder' placeholder='请确认密码' class="in" name='repwd' value="" /> </view> <button type="" form-type="submit" hover-class='button-hover' class='su'>保存</button> </form> </view> </view> |
/* pages/shopmanage/shoppwd.wxss */ .tit { height: 300rpx; width: 100%; } .container { padding: 0px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; box-sizing: border-box; font-family: '微软雅黑'; } .classname { background: #f4f4f4; width: 100%; text-align: center; padding-bottom: 150rpx; } .jj { font-size: 24rpx; padding-top: 20rpx; font-family: "微软雅黑", "黑体"; margin: 0 auto; color: #ccc; padding-bottom: 20rpx; } .xing { font-family: "微软雅黑", "黑体"; height: 54rpx; width: 579rpx; border-radius: 10rpx; background: #fff; margin: 0 auto; text-align: left; line-height: 54rpx; font-size: 28rpx; padding: 10rpx; margin-top: 38rpx; padding-left: 30rpx; } .xi { font-family: "微软雅黑", "黑体"; height: 200rpx; width: 579rpx; border-radius: 10rpx; background: #fff; margin: 0 auto; text-align: left; line-height: 54rpx; font-size: 28rpx; padding: 10rpx; margin-top: 38rpx; padding-left: 30rpx; } .placeholder { color: #ccc; font-size: 26rpx; } .in { float: right; width: 75%; padding-top: 0rpx; font-size: 28rpx; color: #000; } .i { float: right; width: 72%; height: 100%; padding-top: 12rpx; font-size: 28rpx; color: #000; } textarea { height: 100px; } .t { font-family: "微软雅黑", "黑体"; width: 20%; height: 60rpx; /*background: #fff;*/ margin-left: 57rpx; padding: 5rpx; line-height: 60rpx; margin-top: 40rpx; font-size: 28rpx; display: inline-block; border: 1px solid #ccc; float: left; } .su { width: 84%; color: #fff; height: 69rpx; line-height: 69rpx; font-size: 30rpx; font-family: "微软雅黑", "黑体"; top: 103rpx; background: red; } button[type="primary"] { color: #000; background-color: #fff; } .shuoming{ height: 50rpx; font-size: 30rpx; } .label-1, .label-2{ margin-bottom: 15px; } .label-1__text, .label-2__text { display: inline-block; vertical-align: middle; } .label-1__icon { position: relative; margin-right: 10px; display: inline-block; vertical-align: middle; width: 18px; height: 18px; background: #fcfff4; border: 1px solid #ccc } .label-1__icon-checked { position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; background: #d9002f; } .tips{ text-align:center; color:red; font-size:35rpx; padding:0 60rpx; } |
// pages/shopmanage/shoppwd.js var app = getApp(); Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, editpwd:function (e){ var that=this; var fdata=e.detail.value; if(fdata.pwd==fdata.repwd){ wx.request({ url: app.d.ceshiUrl + '/Api/Shangchang/editshoppwd', method: 'post', data: { uid: app.globalData.userInfo.id, pwd: fdata.pwd }, header: { 'Content-Type': 'application/x-www-form-urlencoded' }, success: function (res) { //--init data var status = res.data.status; if (status == 1) { wx.showToast({ title: '修改成功', }) setTimeout(function(){ wx.navigateBack() },2500) } else { wx.showToast({ title: res.data.err, }) } }, fail: function () { // fail wx.showToast({ title: '网络异常!', duration: 30000 }); } }) }else{ wx.showToast({ title: '密码不一致!', }) } }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } }) |
模板简介:该模板名称为【微信小程序红色风格修改商家登录密码页面样式设计制作开发教程】,大小是,文档格式为.,推荐使用打开,作品中的图片,文字等数据均可修改,图片请在作品中选中图片替换即可,文字修改直接点击文字修改即可,您也可以新增或修改作品中的内容,该模板来自用户分享,如有侵权行为请联系网站客服处理。欢迎来懒人模板【小程序教程】栏目查找您需要的精美模板。