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`; // }, // // } // };