diff --git a/CHANGELOG.md b/CHANGELOG.md index e0c4043..21ace4e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -36,6 +36,7 @@ --|--|-- - | 插件接口修改 | [53c6b90](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/53c6b90) - | 解决warning | [dcb0079](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/dcb0079) + - | 删除多余的引入 | [050b12a](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/050b12a) - | 时间轴任务 | [98abdf6](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/98abdf6) - | 修复一些内容 | [3cdb1ce](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/3cdb1ce) app.vue | 修复获取token报错的问题 | [9120d54](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/9120d54) diff --git a/hooks/user/userMixin.js b/hooks/user/userMixin.js index a5b4a0c..0691e14 100644 --- a/hooks/user/userMixin.js +++ b/hooks/user/userMixin.js @@ -82,14 +82,19 @@ export default function userMixin() { ], }; const smsCode = ref(null); // 短信验证码 - const showInterval = ref(false); - const interval = ref(120); + // const showInterval = ref(false); + // const interval = ref(120); const codeTimer = ref(null); - const showPaste = ref(false); + // const showPaste = ref(false); + const dataObj = reactive({ + showInterval: false, + interval: 120, + showPaste: false + }) //有图片验证码的值 function hasvalue(form) { - if(form.smsCode || form.showPaste) return + if(form.smsCode || dataObj.showPaste) return if (!verifyPhone(form.phone)) { uni.$ui.showToast('请输入正确的手机号'); return; @@ -98,24 +103,24 @@ export default function userMixin() { uni.$ui.showToast('请输入图形验证码'); return; } - getCode(); + getCode(form); } // 获取验证码 - async function getCode() { + async function getCode(form) { try { - if (!verificationCodeId.value || !form.verificationCodeValue) { - showToast('缺少图形验证码参数'); + if (!form.verificationCodeId || !form.verificationCodeValue) { + uni.$ui.showToast('缺少图形验证码参数'); return; } const params = { phone: form.phone, - verificationCodeId: verificationCodeId.value, + verificationCodeId: form.verificationCodeId, verificationCodeValue: form.verificationCodeValue, }; const date = await store.dispatch('user/sendCode', params); getCodeInterval(); - showPaste.value = true; + dataObj.showPaste = true; } catch (err) { throw err; } @@ -123,16 +128,16 @@ export default function userMixin() { // 获取验证码倒计时 function getCodeInterval() { - showInterval.value = true; + dataObj.showInterval = true; codeTimer.value = setInterval(() => { - if (interval.value === 0) { + if (dataObj.interval === 0) { clearInterval(codeTimer.value); codeTimer.value = null; - showInterval.value = false; - interval.value = 120; + dataObj.showInterval = false; + dataObj.interval = 120; return; } - interval.value = interval.value - 1; + dataObj.interval = dataObj.interval - 1; }, 1000); } @@ -213,9 +218,10 @@ export default function userMixin() { return { rules, - showPaste, - showInterval, - interval, + // showPaste, + // showInterval, + // interval, + dataObj, hasvalue, checkRules, setCode, diff --git a/pages/user/login.vue b/pages/user/login.vue index 2f375cc..1b2541a 100644 --- a/pages/user/login.vue +++ b/pages/user/login.vue @@ -11,9 +11,9 @@ - - 粘贴 - {{ mixinInit.interval }} + + 粘贴 + {{ mixinInit.dataObj.interval }} @@ -52,13 +52,11 @@ const form = reactive({ phone: '', - verificationCodeValue: '', + verificationCodeId: '', // 图形验证码id + verificationCodeValue: '', // 图形验证码值 smsCode: '' }); const imageBase64 = ref(null); // 图形验证码图片 - const verificationCodeId = ref(null); // 图形验证码id - const data = {}; - const treeId = ref(null); getImageCode(); @@ -80,7 +78,7 @@ try { const data = await uni.$u.api.getImageCode(); imageBase64.value = data.imageBase64 || ''; - verificationCodeId.value = data.verificationCodeId || ''; + form.verificationCodeId = data.verificationCodeId || ''; uni.$ui.hideLoading(); } catch (error) { uni.$ui.hideLoading(); diff --git a/pages/user/mixin.js b/pages/user/mixin.js deleted file mode 100644 index b8420f2..0000000 --- a/pages/user/mixin.js +++ /dev/null @@ -1,266 +0,0 @@ -import { ref, computed } from 'vue'; -import { useStore } from 'vuex'; -import clipboard from "@/common/js/dc-clipboard/clipboard.js" - -export default function mixinInit { - const store = useStore(); - const user = computed(() => store.state.user.user); - const rules = ref({ - phone: [ - { - required: true, - message: '请输入手机号', - trigger: ['change','blur'], - }, - { - validator: (rule, value, callback) => { - // 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html - return this.$u.test.mobile(value); - }, - message: '手机号码不正确', - // 触发器可以同时用blur和change，二者之间用英文逗号隔开 - trigger: ['change','blur'], - } - ], - verificationCodeValue: [ - { - required: true, - message: '请输入图形验证码', - trigger: ['change','blur'], - }, - { - type: 'number', - message: '图形验证码只能为数字', - trigger: ['change','blur'], - } - ], - smsCode: [ - { - required: true, - message: '请输入验证码', - trigger: ['change','blur'], - }, - { - type: 'number', - message: '验证码只能为数字', - trigger: ['change','blur'], - } - ], - account: [ - { - required: true, - message: '请输入用户名', - trigger: ['change','blur'], - }, - { - min: 2, - max: 20, - message: '用户名长度在2到20个字符', - trigger: ['change','blur'], - }, - { - pattern: /^[a-zA-Z0-9._-]{2,20}$/, - message: '请输入2-20位字母、数字、汉字或字符"_ - ."', - trigger: ['change','blur'], - } - ], - password: [ - { - required: true, - message: '请输入密码', - trigger: ['change','blur'], - }, - { - min: 6, - max: 20, - message: '密码长度在6到20个字符', - trigger: ['change','blur'], - }, - { - // 正则不能含有两边的引号 - pattern: /^[a-zA-Z0-9._-]{6,20}$/, - message: '请输入6-20位字母、数字、汉字或字符"_ - ."', - trigger: ['change','blur'], - } - ], - }); - const errorType = ref(['message']); - const labelPosition = ref('left'); - const border = ref(false); - const smsCode = ref(''); // 短信验证码 - const showInterval = ref(false); - const interval = ref(120); - const codeTimer = ref(null); - const showPaste = ref(false); - - return { - errorType, - // getImageCode, - // hasvalue, - // getCode, - // getCodeInterval, - // checkRules, - // setCode, - // getClipboardContents, - // verifyPhone, - // verifyLoginname, - // handleWxLogin - } -} - - -// const mixin = { - // computed: mapState('user', ['user']), - - // onReady() { - // this.$refs.uForm.setRules(this.rules); - // }, - - // methods: { - // ...mapActions('user', ['sendCode']), - - // 获取图形验证码 - // async getImageCode() { - // this.$util.showLoading(); - // try { - // const data = await uni.$u.api.getImageCode(); - // const { imageBase64, verificationCodeId } = data; - // this.imageBase64 = imageBase64 || ''; - // this.verificationCodeId = verificationCodeId || ''; - // uni.hideLoading(); - // } catch (error) { - // uni.hideLoading(); - // uni.$ui.showToast(error); - // } - // }, - - // //有图片验证码的值 - // hasvalue() { - // if(this.model.smsCode || this.model.showPaste) return - // if (!this.verifyPhone(this.model.phone)) { - // uni.$ui.showToast('请输入正确的手机号'); - // return; - // } - // if (!this.model.verificationCodeValue) { - // uni.$ui.showToast('请输入图形验证码'); - // return; - // } - // this.getCode(); - // }, - - // // 获取验证码 - // async getCode() { - // try { - // const { phone, verificationCodeValue } = this.model; - // const { verificationCodeId } = this; - - // if (!verificationCodeId || !verificationCodeValue) { - // uni.$ui.showToast('缺少图形验证码参数'); - // return; - // } - // const params = { - // phone, - // verificationCodeId, - // verificationCodeValue, - // }; - // const date = await store.dispatch('user/sendCode', params); - // getCodeInterval(); - // showPaste.value = true; - // } catch (err) { - // throw err; - // } - // }, - - // // 获取验证码倒计时 - // getCodeInterval() { - // this.showInterval = true; - // this.codeTimer = setInterval(() => { - // if (this.interval === 0) { - // clearInterval(this.codeTimer); - // this.codeTimer = null; - // this.showInterval = false; - // this.interval = 120; - // return; - // } - // this.interval = this.interval - 1; - // }, 1000); - // }, - - // // 验证信息 - // checkRules() { - // // const { smsCode, phone, user } = this; - // if (!this.verifyPhone(phone.value)) { - // uni.$ui.showToast('请输入正确的手机号'); - // return false; - // } - // if (!smsCode.value) { - // uni.$ui.showToast('验证码无效'); - // return false; - // } - - // if (phone.value === user.value.phone) { - // uni.$ui.showToast('新手机号不能与旧手机号相同'); - // return; - // } - // return true; - // }, - - // // 粘贴 - // setCode() { - // // 获取粘贴板内容 - // // 小程序平台 - // //#ifdef MP-WEIXIN - // var _this = this - // uni.getClipboardData({ - // success (res) { - // _this.smsCode = res.data; - // } - // }); - // //#endif - - // // 非小程序平台 - // //#ifndef MP-WEIXIN - // this.getClipboardContents() - // //#endif - // }, - - // // 非小程序平台粘贴 - // async getClipboardContents() { - // try { - // const text = await navigator.clipboard.readText(); - // this.smsCode = text; - // } catch (err) { - // console.error('Failed to read clipboard contents: ', err); - // } - // }, - - // /** - // * 验证手机号格式 - // * @param {string} phone 手机号 - // */ - // verifyPhone(phone) { - // const phoneExg = /^1\d{10}$/; - // return phoneExg.test(phone); - // }, - - // /** - // * 验证账号/密码 格式 - // * @param {string} account 账号 - // */ - // verifyLoginname(account) { - // const accountExg = /^[a-zA-Z0-9._-]{2,20}$/; - // return accountExg.test(account); - // }, - - // // 微信登录 - // handleWxLogin() { - // const origin = 'https://test.tall.wiki/pt-mui'; // 测试 - // const appid = 'wxd1842e073e0e6d91'; - // const state = 'wx_web'; - // const href = 'https://open.weixin.qq.com/connect/qrconnect'; - // // eslint-disable-next-line - // window.location.href = - // `${href}?appid=${appid}&redirect_uri=${origin}&response_type=code&scope=snsapi_login&state=${state}#wechat_redirect`; - // }, - // // } -// }; diff --git a/store/user/actions.js b/store/user/actions.js index bb9dec8..789e60c 100644 --- a/store/user/actions.js +++ b/store/user/actions.js @@ -1,5 +1,3 @@ -import ui from '@/utils/ui.js'; - const actions = { /** * 通过userId获取token @@ -15,7 +13,23 @@ const actions = { uni.$storage.setStorageSync('user', JSON.stringify(res)); return res; } catch (error) { - ui.showToast(error.msg || '获取个人信息失败'); + uni.$ui.showToast(error.msg || '获取个人信息失败'); + throw error; + } + }, + + /** + * 发送验证码 + * @param {ant} commit + * @param {object} params 要提交的数据 + * @param {string} params.phone 手机号 + */ + sendCode({ commit }, params) { + try{ + uni.$u.api.getSmsCode(params); + uni.$ui.showToast('验证码发送成功'); + } catch (error) { + uni.$ui.showToast(error.msg || '发送失败'); throw error; } },