123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211 |
- <template>
- <view class="content">
- <form @submit="onSubmit">
- <view class="hg24"></view>
- <view class="box-pack-between item bgf flex-y-center">
- <text>手机号</text>
- <view class="tr">
- <input placeholder-class="placeholder-class" disabled name="tel" @input="phoneInput" type="number" :value="phoneData"
- placeholder="请输入手机号" maxlength="11" />
- </view>
- </view>
- <block>
- <view class="box-pack-between item bgf flex-y-center">
- <text>验证码</text>
- <view class="tr flex-y-center">
- <input placeholder-class="placeholder-class" name="code" type="number" placeholder="请输入短信验证码" />
- <view class="method-line"></view>
- <text class="get-code" v-if="sendNum==1">{{sendMg}}</text>
- <text class="get-code" v-else @click="getVerCode">{{sendMg}}</text>
- </view>
- </view>
- </block>
- <view class="hg24"></view>
- <view class="box-pack-between item bgf flex-y-center">
- <text>设置新密码</text>
- <view class="tr">
- <input placeholder-class="placeholder-class" type="text" name="pass" value="" placeholder="6到16位的数字或字母"
- maxlength="16" />
- </view>
- </view>
- <view class="box-pack-between item bgf flex-y-center">
- <text>确认新密码</text>
- <view class="tr">
- <input placeholder-class="placeholder-class" type="text" name="repass" value="" placeholder="请再次输入新密码" maxlength="16" />
- </view>
- </view>
- <view class="bottom-bar">
- <button class="login-btn flex-center" formType="submit">确定</button>
- </view>
- </form>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- phoneData: "", //电话
- verCode: "", //验证码
- sendMg: '获取验证码',
- time: 60,
- sendNum: 0,
- is_code: null,
- }
- },
- components: {
- },
- onLoad(e) {
- this.phoneData=e.tel;
- },
- onShareAppMessage(e) {
- },
- methods: {
- phoneInput(e) {
- this.phoneData = e.detail.value;
- },
- //获取验证码
- getVerCode() {
- if (this.phoneData.length != 11) {
- uni.showToast({
- icon: 'none',
- position: 'bottom',
- title: '手机号不正确'
- });
- return false;
- }
- this.request({
- url: "user/sendcode",
- data: {
- tel: this.phoneData,
- },
- }).then(res => {
- console.log(res, "res")
- if (res.code === '200') {
- let tim = setInterval(() => {
- this.time = parseInt(this.time) - 1;
- this.sendMg = "剩余" + this.time + "S";
- this.sendNum = 1;
- if (this.time <= 0) {
- this.sendMg = "获取验证码";
- this.sendNum = 0;
- clearInterval(tim);
- this.time = 10;
- }
- }, 1000);
- }
- }).catch((res) => {
- uni.showToast({
- title: res.message,
- icon: 'none',
- duration: 2000
- })
- });
- },
- onSubmit(e) {
- let data = e.detail.value;
- data.token=uni.getStorageSync("token");
- data.type=1;
- this.request({
- url: "user/edit_pass",
- data,
- }).then(res => {
- console.log(res, "res")
- if (res.code === '200') {
- uni.showToast({
- title: "设置成功",
- icon: 'none',
- duration: 2000
- })
- setTimeout(() => {
- uni.navigateBack({
- delta: 1
- })
- }, 1500)
- }
- }).catch((res) => {
- uni.showToast({
- title: res.message,
- icon: 'none',
- duration: 2000
- })
- });
- },
-
-
- }
- }
- </script>
- <style lang="scss">
- .hg24 {
- height: 24rpx;
- }
- .item {
- width: 100%;
- height: 100rpx;
- background: rgba(255, 255, 255, 1);
- font-size: 16px;
- font-weight: 400;
- color: rgba(51, 51, 51, 1);
- padding: 0 30rpx;
- }
- .get-code {
- font-size: 14px;
- font-family: Source Han Sans CN;
- font-weight: 400;
- color: #3387FF;
- opacity: 1;
- }
- .login-btn {
- width: 630rpx;
- height: 90rpx;
- background: linear-gradient(132deg, #3387FF 0%, #3387FF 100%);
- box-shadow: 0px 2rpx 12rpx #3387FF;
- opacity: 1;
- border-radius: 45rpx;
- margin: 0 auto;
- color: #FFFFFF;
- font-size: 30rpx;
- font-family: Source Han Sans CN;
- font-weight: 500;
- opacity: 1;
- }
- .bottom-bar {
- position: fixed;
- bottom: 30px;
- left: 0;
- width: 100%;
- z-index: 1000;
- }
- .tr{
- text-align: right;
- }/* 分割线 */
- .method-line {
- width: 2rpx;
- height: 20rpx;
- background: rgba(159, 159, 159, 1);
- opacity: 1;
- border-radius: 1rpx;
- margin: 0 40rpx;
- }
- </style>
|