提交 394628f2 编写于 作者: 雪洛's avatar 雪洛

feat: init project

上级 f3627f0c
unpackage/
.hbuilderx
node_modules
.DS_Store
uni_modules_tools/copy
package-lock.json
\ No newline at end of file
unpackage/
.hbuilderx
node_modules
.DS_Store
uni_modules_tools/copy
package-lock.json
uni_modules_tools
uni_modules.config.json
\ No newline at end of file
<script>
import initApp from '@/common/appInit.js';
import openApp from '@/common/openApp.js';
import checkIsAgree from '@/pages/uni-agree/utils/uni-agree.js';
export default {
globalData: {
searchText: '',
appVersion: {},
config: {},
$i18n: {},
$t: {}
},
onLaunch: function() {
console.log('App Launch')
this.globalData.$i18n = this.$i18n
this.globalData.$t = str => this.$t(str)
initApp();
// #ifdef H5
openApp() //创建在h5端全局悬浮引导用户下载app的功能
// #endif
// #ifdef APP-PLUS
//checkIsAgree(); APP端暂时先用原生默认生成的。目前,自定义方式启动vue界面时,原生层已经请求了部分权限这并不符合国家的法规
// #endif
// #ifdef H5
// checkIsAgree(); // 默认不开启。目前全球,仅欧盟国家有网页端同意隐私权限的需要。如果需要可以自己去掉注视后生效
// #endif
// #ifdef APP-PLUS
//idfa有需要的用户在应用首次启动时自己获取存储到storage中
//https://ask.dcloud.net.cn/article/36107
/*if(~plus.storage.getItem('idfa')){
plus.device.getInfo({//需要勾选IDFA
success:function(e){
console.log('idfa = '+JSON.stringify(e.idfa));
},
fail:function(e){
console.log('getDeviceInfo failed: '+JSON.stringify(e));
}
});
}*/
// #endif
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
}
}
</script>
<style>
/*每个页面公共css */
</style>
MIT License
Copyright (c) 2021 崔红保
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "[]"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright [yyyy] [name of copyright owner]
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
# base-app
#### Description
{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**}
#### Software Architecture
Software architecture description
#### Installation
1. xxxx
2. xxxx
3. xxxx
#### Instructions
1. xxxx
2. xxxx
3. xxxx
#### Contribution
1. Fork the repository
2. Create Feat_xxx branch
3. Commit your code
4. Create Pull Request
#### Gitee Feature
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
4. The most valuable open source project [GVP](https://gitee.com/gvp)
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
此差异已折叠。
## 1.1.22(2021-11-10)
删除`common/openApp.js`中可选链操作符,解决vue3版本在hbuilderX内置浏览器不兼容的问题
## 1.1.21(2021-11-10)
新增app端列表页面使用原生list下拉刷新
## 1.1.20(2021-11-08)
修复vue3版某些情况下i18n报错的问题
## 1.1.19(2021-11-08)
配置文件`uni-starter.config.js`默认关闭i18n多语言国际化
## 1.1.18(2021-10-14)
使用2.0版`uni-share`。当显示分享窗口时,监听返回操作(如:物理返回,全面屏手机侧滑)关闭分享窗口,而不是关闭当前页面。
## 1.1.17(2021-10-12)
- 更新文档
- 修复list页面where条件中缺少&符,导致的错误
## 1.1.16(2021-10-05)
在控制台提示:开启多语言国际化,将获取i18n中配置的tabbar的值覆盖pages.json中配置的tabbar的值
## 1.1.15(2021-10-02)
新增,支持配置是否开启i18n多语言国际化。
配置文件:`uni-starter.config.js`
`
"i18n":{
"enable":true //默认启用,国际化。如果你不想使用国际化相关功能,请改为false
}
`
## 1.1.14(2021-09-30)
1. 通过微信小程序登录自动保存`sessionKey``uni-id-users`
2. 我的-设置-个人资料 点击绑定手机号码,完善账号信息支持以下三种策略:
- APP端,(如果支持)使用"通过运营商一键获取手机号码"
- 微信小程序端,支持"一键获取微信绑定的手机号"
- 其他端,通过手机验证码
## 1.1.13(2021-09-29)
修复search页面因多语言国际化导致的白屏问题
## 1.1.12(2021-09-28)
1. 改造微信登录逻辑,直接使用`uni.login`参数`"onlyAuthorize":true`实现
2. 修复,一键登录弹出层,已勾选“同意隐私政策协议”点击自定义登录按钮,报“你未同意隐私政策协议”的bug
## 1.1.11(2021-09-24)
优化邀请下载app页(`pages/ucenter/invite`)下载按钮闪烁的问题
## 1.1.10(2021-09-23)
修复获取验证码按钮的文字,在中文模式下显示为英文的问题
## 1.1.9(2021-09-16)
修复由多语言切换功能引起的隐私政策协议标题链接被重写的问题
## 1.1.8(2021-09-15)
更新数据表guestbook的schema中更新权限的配置
## 1.1.7(2021-09-14)
更新数据表opendb-news-articles的schema中的权限配置
## 1.1.6(2021-09-13)
纠正错误schema权限表达式`doc.uid``doc.user_id`
## 1.1.5(2021-09-01)
为了更直观理解路由拦截。移除路由拦截器中,默认过滤登录相关页面拦截的逻辑。确保所有白名单页面均在配置文件router.visitor中体现
## 1.1.4(2021-08-31)
修改错误的文章表`SChema`的读权限表达式
## 1.1.3(2021-08-31)
修复在微信小程序端默认语言为英文的问题
## 1.1.2(2021-08-30)
修复在微信小程序下切换语言报`locale`不存在的问题
## 1.1.1(2021-08-30)
- 解决3.2.6以下版本hbuilderx,编译的项目报`uni.setLocale`不存在的问题
## 1.1.0(2021-08-27)
- APP端支持vue3 (hbuilderx 3.2.5+)
- 支持国际化 中英文切换
- 新增留言板示例
- 修复签到的时区问题
## 1.0.48(2021-08-10)
- 修复登录成功后响应体包含`userInfo.password`的问题
- 修改了`uni-id-users`表的schema中字段username的编辑权限,防止用户通过clientDB绕过用户名不能重复的规则更新用户名的问题
## 1.0.47(2021-08-09)
- 更新文档快速体验部署流程
- 修复一键登录优先时报变量找不到的问题
## 1.0.46(2021-08-05)
清理多余文件
## 1.0.45(2021-08-05)
默认首页为nvue页面+fast
## 1.0.44(2021-08-05)
解决首页为非nvue页面时白屏的问题。
- 注意:本次在`common/appInit.js`中修改了路由拦截的逻辑,是个兼容方案;当首页为非nvue页面,路由拦截器逻辑会在加载首页时执行。接下来新版本的hx编译的uni-app项目无论首页是否为nvue都不走拦截器,保持各端逻辑一致。
## 1.0.43(2021-08-02)
1. 微信小程序端,新增:微信登录成功后,弹出是否"获取微信头像和昵称,完善个人资料"的弹框
2. APP端,新增逻辑:微信登录成功后,自动获取用户的微信昵称和头像完善用户个人资料
- 提示:因为微信的头像一旦更换,微信返回的头像url会失效。所以,以上两示例功能将url(客户端:下载到临时目录/服务端:转为Buffer)再上传到uniCloud云存储中再使用。
## 1.0.42(2021-07-29)
新增绑定手机号码页面前端校验
## 1.0.41(2021-07-27)
1. 支持vue3.0
2. 去掉App.vue全局样式,避免与非flex布局的页面样式冲突
## 1.0.40(2021-07-22)
1. 调整使用正则表达式配置强制登录功能的写法,解决在小程序端的兼容问题。
2. 新增签到功能(培养用户习惯,提升用户粘性)。支持:每日签到奖励、周期性连续7日签到,奖励翻倍。
## 1.0.39(2021-07-19)
1. 强制登录配置,新增白名单模式
2. 强制登录配置,支持正则表达式
## 1.0.38(2021-07-17)
删除多余文件
## 1.0.37(2021-07-14)
去掉配置文件:`uni-starter.config.js``h5` —> `url`结尾的`/`
## 1.0.36(2021-07-14)
剪切板中的邀请码,添加标识性前缀 `uniInvitationCode:`
## 1.0.35(2021-07-12)
1. H5端默认不开启,隐私权限协议签署页面。因为网页端没有什么隐私权限能被获取,目前全球仅欧盟有要求;如有需要请手动开启
2. 在列表页演示,如何在onShow生命周期获取设备位置,并在设备或者应用没有权限时自动引导。设置完毕自动重新获取。[更多点此查看插件介绍](https://ext.dcloud.net.cn/plugin?name=json-gps)
## 1.0.34(2021-07-08)
修复,打开登录页时携带参数,导致的快捷登录方式重复的问题
## 1.0.33(2021-07-06)
修复,点击短信验证码登录打开的页面不正确的问题
## 1.0.32(2021-07-06)
修复,仅配置一种快捷登录时的错误
## 1.0.31(2021-07-02)
优化项目文档
## 1.0.30(2021-07-01)
1. 简化宫格页面写法,方便理解如何控制不同状态角色的用户是否可见哪些元素。
2. uni-id-cf发送短信验证码api,默认注释掉:虚拟发送短信验证码的代码块。
3. uni-id-cf统一action名称为驼峰法
## 1.0.29(2021-06-29)
1. 修复在安卓10以下设备,操作登录获取不到oaid会直接导致登录失败的bug
2. 修复uniCloud版本为阿里云版时删除头像设置失败,腾讯云版删除头像后二次上传失败的问题
## 1.0.28(2021-06-28)
修复云函数uni-id-cf的resetPwdBySmsCode接口,未注册过的用户也能调用的问题
## 1.0.27(2021-06-25)
修改文档,新增h5版演示示例
## 1.0.26(2021-06-24)
升级用户头像上传的裁切功能,app端为原生裁剪其他端保持原来方式。数据表字段改用avatar_file存储file对象方便做图片的回显
## 1.0.25(2021-06-23)
预置uniCloud admin依赖的uniCloud文件,方便uniCloud admin与uni-starter配套使用时免做文件迁移
## 1.0.24(2021-06-23)
删除callFunction拦截器中多余的代码
## 1.0.23(2021-06-22)
更正调试遗留的uni-config-center/uni-id/config.json的tokenExpiresIn=1配置问题,改为默认值7200
## 1.0.22(2021-06-22)
1. 新增一键登录授权界面的其他快捷登录按钮
2. 优化uni-quick-login组件代码
3. 调整隐私政策协议框勾选逻辑:在登录页面已勾选,同步勾选。如果没勾选需要手动勾选(为符合应用市场上架要求)
4. 调整登录页隐私政策协议框位置。
5. 增强路由拦截,新增判断token是否过期。
## 1.0.21(2021-06-21)
优化:uni_modules模式使用uni-id-cf,方便uni-starter与uniCloud-admin的uni-id-cf同步更新。
## 1.0.20(2021-06-18)
1.H5端新增,强制要求用户同意隐私协议 2.兼容ios端自动设置打开下载页用户的剪切板为邀请者的inviteCode 3.成功注册用户,且请求体含邀请码inviteCode自动关联裂变关系
## 1.0.19(2021-06-17)
1.新增获取邀请码接口getUserInviteCode 2.在邀请用户下载应用页面,自动设置被邀请用户的剪切板为邀请者的code(仅支持安卓端) 3.在注册或登录并注册请求时自动添加剪切板中的请求参数 4.统一接口名称为驼峰法
## 1.0.18(2021-06-15)
修复,APP端有安装微信客户端但未显示微信登录快捷键的问题
## 1.0.17(2021-06-09)
修复,非APP端deviceInfo为空引起的登录失败问题
## 1.0.16(2021-06-08)
新增,操作注册/登录操作自动获取客户端设备:push_clientid、imei、oaid、idfa新增/更新到数据表uni-id-device新增,操作注册/登录操作自动获取客户端设备:push_clientid、imei、oaid、idfa新增/更新到数据表uni-id-device
## 1.0.15(2021-06-07)
为迎合苹果App Store的规则,登录与分享功能项显示之前自动检测是否安装了对应客户端。比如:设备未安装微信则不显示微信快捷登录和微信分享选项。为迎合苹果App Store的规则,登录与分享功能项显示之前自动检测是否安装了对应客户端。比如:设备未安装微信则不显示微信快捷登录和微信分享选项。
## 1.0.14(2021-06-07)
修改错误的表名称uni-verify为opendb-verify-codes
## 1.0.13(2021-06-04)
新增一键登录界面的第三方快捷登录按钮
## 1.0.12(2021-05-28)
修复拦截器在ios app端会报错:Unhandled promise...的问题
## 1.0.10(2021-05-27)
新增callfunction的拦截器废除this.request的写法。为callFunction添加:请求失败是否断网判断并提示、恢复网络自动重新执行、自动处理响应体:token过期自动跳转到登录页面、token自动续期
## 1.0.9(2021-05-23)
修复变量被重复定义的问题
## 1.0.8(2021-05-22)
宫格页(/pages/grid/grid),新增根据当前用户是否登录、是否为管理员的角色来决定是否显示的示范
## 1.0.7(2021-05-22)
删除多余数据
## 1.0.6(2021-05-22)
修复当username(用户名&密码)为第一优先级的登录方式时。无法切换到smsCode(短信验证码)登录方式
## 1.0.5(2021-05-20)
改用uni_modules方式处理图片选择api时无权限,引导用户快捷打开系统设置
## 1.0.4(2021-05-19)
为方便部署,添加空的manifest.json uni-config-center下的uni-id配置
## 1.0.3(2021-05-18)
重大调整,原云函数名称:user-center改名叫uni-id-cf
修复,绑定手机号码场景。因手机未插SIM导致的一键登录失败后未直接跳到获取短信验证码方式绑定
## 1.0.2(2021-05-17)
添加 uni-config-center/uniCloud/cloudfunctions/common/uni-config-center/uni-id/config.json 文件
## 1.0.1(2021-05-17)
manifest.json 在小程序平台增加了一个配置项 betterScopedSlots,启用新的作用域插槽编译,用于支持作用域插槽内使用复杂表达式。
## 1.0.0(2021-05-17)
第一版
\ No newline at end of file
import uniStarterConfig from '@/uni-starter.config.js';
import store from '@/store'
//应用初始化页
// #ifdef APP-PLUS
import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
import callCheckVersion from '@/uni_modules/uni-upgrade-center-app/utils/call-check-version';
import interceptorChooseImage from '@/uni_modules/json-interceptor-chooseImage/js_sdk/main.js';
// #endif
const db = uniCloud.database()
export default async function() {
let loginConfig = uniStarterConfig.router.login
//清除有配置但设备环境不支持的登录项
// #ifdef APP-PLUS
await new Promise((callBack) => {
plus.oauth.getServices(oauthServices => {
loginConfig = loginConfig.filter(item => {
if (["univerify", "weixin", "apple"].includes(item)) {
let index = oauthServices.findIndex(e => e.id == item)
if (index == -1) {
return false
} else {
return oauthServices[index].nativeClient
}
} else {
return true
}
})
if (loginConfig.includes('univerify')) { //一键登录 功能预登录
uni.preLogin({
provider: 'univerify',
complete: e => {
console.log(e);
}
})
}
callBack()
}, err => {
console.error('获取服务供应商失败:' + JSON.stringify(err));
})
})
// #endif
//非app移除:一键登录、苹果登录;h5移除微信登录,如果你做微信公众号登录需要将此行移除
// #ifndef APP-PLUS
loginConfig = loginConfig.filter(item => {
return ![
'univerify',
'apple',
// #ifdef H5
'weixin'
// #endif
].includes(item)
})
// #endif
uniStarterConfig.router.login = loginConfig
// uniStarterConfig挂载到getApp().globalData.config
setTimeout(() => {
getApp({
allowDefault: true
}).globalData.config = uniStarterConfig;
}, 1)
// 初始化appVersion(仅app生效)
initAppVersion();
// #ifdef APP-PLUS
// 实现,路由拦截。当应用无访问摄像头/相册权限,引导跳到设置界面
interceptorChooseImage()
// #endif
//clientDB的错误提示
function onDBError({
code, // 错误码详见https://uniapp.dcloud.net.cn/uniCloud/clientdb?id=returnvalue
message
}) {
console.log('onDBError', {
code,
message
});
// 处理错误
console.error(code, message);
if ([
'TOKEN_INVALID_INVALID_CLIENTID',
'TOKEN_INVALID',
'TOKEN_INVALID_TOKEN_EXPIRED',
'TOKEN_INVALID_WRONG_TOKEN',
'TOKEN_INVALID_ANONYMOUS_USER',
].includes(code)) {
uni.navigateTo({
url: '/pages/ucenter/login-page/index/index'
})
}
}
// 绑定clientDB错误事件
db.on('error', onDBError)
// 解绑clientDB错误事件
//db.off('error', onDBError)
db.on('refreshToken', function({
token,
tokenExpired
}) {
console.log('监听到clientDB的refreshToken', {
token,
tokenExpired
});
store.commit('user/login', {
token,
tokenExpired
})
})
const Debug = false;
//拦截器封装callFunction
let callFunctionOption;
uniCloud.addInterceptor('callFunction', {
async invoke(option) {
// #ifdef APP-PLUS
// 判断如果是执行登录(无论是哪种登录方式),就记录用户的相关设备id
if (option.name == 'uni-id-cf' &&
(option.data.action == 'register' || option.data.action.slice(0, 5) == 'login')
) {
let oaid = await new Promise((callBack, fail) => {
if (uni.getSystemInfoSync().platform == "android") {
plus.device.getOAID({
success: function(e) {
callBack(e.oaid)
// console.log('getOAID success: '+JSON.stringify(e));
},
fail: function(e) {
callBack()
console.log('getOAID failed: ' + JSON.stringify(e));
}
});
} else {
callBack()
}
})
let imei = await new Promise((callBack, fail) => {
if (uni.getSystemInfoSync().platform == "android") {
plus.device.getInfo({
success: function(e) {
callBack(e.imei)
// console.log('getOAID success: '+JSON.stringify(e));
},
fail: function(e) {
callBack()
console.log('getOAID failed: ' + JSON.stringify(e));
}
});
} else {
callBack()
}
})
let push_clientid = '',
idfa = plus.storage.getItem('idfa') || ''; //idfa有需要的用户在应用首次启动时自己获取存储到storage中
try {
push_clientid = plus.push.getClientInfo().clientid
} catch (e) {
uni.showModal({
content: '获取推送标识失败。如果你的应用不需要推送功能,请注释掉本代码块',
showCancel: false,
confirmText: "好的"
});
console.log(e)
}
let deviceInfo = {
push_clientid, // 获取匿名设备标识符
imei,
oaid,
idfa
}
console.log("重新登录/注册,获取设备id", deviceInfo);
option.data.deviceInfo = deviceInfo
// #ifndef H5
//注册可能不仅仅走register接口,还有登录并注册的接口
option.data.inviteCode = await new Promise((callBack) => {
uni.getClipboardData({
success: function(res) {
if (res.data.slice(0, 18) == 'uniInvitationCode:') {
let uniInvitationCode = res.data.slice(18, 38)
console.log('当前用户是其他用户推荐下载的,推荐者的code是:' +
uniInvitationCode);
// uni.showModal({
// content: '当前用户是其他用户推荐下载的,推荐者的code是:'+uniInvitationCode,
// showCancel: false
// });
callBack(uniInvitationCode)
//当前用户是其他用户推荐下载的。这里登记他的推荐者id 为当前用户的myInviteCode。判断如果是注册
} else {
callBack(false)
}
},
fail() {
callBack(false)
}
});
})
// #endif
}
// #endif
// console.log(JSON.stringify(option));
callFunctionOption = option
},
complete(e) {
// console.log(JSON.stringify(e));
},
fail(e) { // 失败回调拦截
if (Debug) {
uni.showModal({
content: JSON.stringify(e),
showCancel: false
});
console.error(e);
} else {
uni.showModal({
content: "系统错误请稍后再试!",
showCancel: false,
confirmText: "知道了"
});
}
//如果执行错误,检查是否断网
uni.getNetworkType({
complete: res => {
// console.log(res);
if (res.networkType == 'none') {
uni.showToast({
title: '手机网络异常',
icon: 'none'
});
console.log('手机网络异常');
let callBack = res => {
console.log(res);
if (res.isConnected) {
uni.showToast({
title: '恢复联网自动重新执行',
icon: 'none'
});
console.log(res.networkType, "恢复联网自动重新执行");
uni.offNetworkStatusChange(e => {
console.log("移除监听成功", e);
})
//恢复联网自动重新执行
uniCloud.callFunction(callFunctionOption)
uni.offNetworkStatusChange(callBack);
}
}
uni.onNetworkStatusChange(callBack);
}
}
});
},
success: (e) => {
// console.log(e);
const {
token,
tokenExpired
} = e.result
if (token && tokenExpired) {
store.commit('user/login', {
token,
tokenExpired
})
}
switch (e.result.code) {
case 403:
uni.navigateTo({
url: "/pages/ucenter/login-page/index/index"
})
break;
case 30203:
uni.navigateTo({
url: "/pages/ucenter/login-page/index/index"
})
break;
case 50101:
uni.showToast({
title: e.result.msg,
icon: 'none',
duration: 2000
});
break;
default:
console.log('code的值是:' + e.result.code, '可以在上面添加case,自动处理响应体');
break;
}
switch (e.result.errCode) {
case 'uni-id-token-not-exist':
uni.showToast({
title: '登录信息失效',
icon: 'none'
});
uni.navigateTo({
url: "/pages/ucenter/login-page/index/index"
})
break;
default:
break;
}
}
})
//自定义路由拦截
const {
"router": {
needLogin,
visitor,
login
}
} = uniStarterConfig //需要登录的页面
let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"];
list.forEach(item => { //用遍历的方式分别为,uni.navigateTo,uni.redirectTo,uni.reLaunch,uni.switchTab这4个路由方法添加拦截器
uni.addInterceptor(item, {
invoke(e) { // 调用前拦截
//获取用户的token
const token = uni.getStorageSync('uni_id_token'),
//token是否已失效
tokenExpired = uni.getStorageSync('uni_id_token_expired') < Date.now(),
//获取要跳转的页面路径(url去掉"?"和"?"后的参数)
url = e.url.split('?')[0];
//获取要前往的页面路径(即url去掉"?"和"?"后的参数)
const pages = getCurrentPages();
if (!pages.length) {
console.log("首页启动调用了");
return e
}
const fromUrl = pages[pages.length - 1].route;
let inLoginPage = fromUrl.split('/')[2] == 'login-page'
//控制登录优先级
if ( //判断当前窗口是否为登录页面,如果是则不重定向路由
url == '/pages/ucenter/login-page/index/index' &&
!inLoginPage
) {
//一键登录(univerify)、账号(username)、验证码登录(短信smsCode)
if (login[0] == 'username') {
e.url = "/pages/ucenter/login-page/pwd-login/pwd-login"
} else {
if (e.url == url) {
e.url += '?'
} //添加参数之前判断是否带了`?`号如果没有就补上,因为当开发场景本身有参数的情况下是已经带了`?`号
e.url += "type=" + login[0]
}
} else {
//拦截强制登录页面
let pass = true
//pattern
if (needLogin) {
pass = needLogin.every((item) => {
if (typeof(item) == 'object' && item.pattern) {
return !item.pattern.test(url)
}
return url != item
})
// console.log({pass})
}
if (visitor) {
pass = visitor.some((item) => {
if (typeof(item) == 'object' && item.pattern) {
return item.pattern.test(url)
}
return url == item
})
// console.log({pass})
}
if (!pass && (token == '' || tokenExpired)) {
uni.showToast({
title: '请先登录',
icon: 'none'
})
uni.navigateTo({
url: "/pages/ucenter/login-page/index/index"
})
return false
}
}
return e
},
fail(err) { // 失败回调拦截
console.log(err);
if (Debug) {
console.log(err);
uni.showModal({
content: JSON.stringify(err),
showCancel: false
});
}
}
})
})
// #ifdef APP-PLUS
// 监听并提示设备网络状态变化
uni.onNetworkStatusChange(res => {
console.log(res.isConnected);
console.log(res.networkType);
if (res.networkType != 'none') {
uni.showToast({
title: '当前网络类型:' + res.networkType,
icon: 'none',
duration: 3000
})
} else {
uni.showToast({
title: '网络类型:' + res.networkType,
icon: 'none',
duration: 3000
})
}
});
// #endif
}
/**
* // 初始化appVersion
*/
function initAppVersion() {
// #ifdef APP-PLUS
let appid = plus.runtime.appid;
plus.runtime.getProperty(appid, (wgtInfo) => {
let appVersion = plus.runtime;
let currentVersion = appVersion.versionCode > wgtInfo.versionCode ? appVersion : wgtInfo;
getApp({
allowDefault: true
}).appVersion = {
...currentVersion,
appid,
hasNew: false
}
// 检查更新小红点
callCheckVersion().then(res => {
// console.log('检查是否有可以更新的版本', res);
if (res.result.code > 0) {
// 有新版本
getApp({
allowDefault: true
}).appVersion.hasNew = true;
}
})
});
// 检查更新
// #endif
}
/*
创建在h5端全局悬浮引导用户下载app的功能,
如不需要本功能直接移除配置文件uni-starter.config.js下的h5/openApp即可
*/
import CONFIG from '../uni-starter.config.js';
const CONFIG_OPEN = CONFIG.h5.openApp || {};
// 仅H5端添加"打开APP"
export default function() {
// #ifdef H5
if (!CONFIG_OPEN.openUrl) return;
let openLogo = CONFIG_OPEN.logo ?
`<img src="${CONFIG_OPEN.logo}" style="width: 2rem;height: 2rem;border-radius: 3px;">` : '';
let openApp = document.createElement("div");
openApp.id = 'openApp';
openApp.style =
'position: fixed;background:#FFFFFF;box-shadow: #eeeeee 1px 1px 9px; ;top: 0;left: 0;right: 0;z-index: 999;width: 100%;height: 45px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;box-sizing: border-box;padding: 0 0.5rem;'
openApp.innerHTML = `
<div style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center;">
${openLogo}
<div style="padding-left: 0.3rem;font-size: 12px;">${CONFIG_OPEN.appname || ''}</div>
</div>
<div class="openBtn" style="padding: 5px;font-size:12px;border-radius: 2px;border: 1px solid #007AFF;color: #007AFF;">下载app</div>
`;
document.body.insertBefore(openApp, document.body.firstChild);
document.body.style = 'height:calc(100% - 45px); margin-top:45px;';
openApp.addEventListener('click', e => {
var target = e.target || e.srcElement;
if (target.className.indexOf('openBtn') >= 0) {
window.location.href = CONFIG_OPEN.openUrl;
}
})
//#endif
}
.uni-flex {
display: flex;
}
.uni-flex-row {
@extend .uni-flex;
flex-direction: row;
box-sizing: border-box;
}
.uni-flex-column {
@extend .uni-flex;
flex-direction: column;
}
.uni-color-gary {
color: #3b4144;
}
/* 标题 */
.uni-title {
display: flex;
margin-bottom: $uni-spacing-col-base;
font-size: $uni-font-size-lg;
font-weight: bold;
color: #3b4144;
}
.uni-title-sub {
display: flex;
font-size: $uni-font-size-base;
font-weight: 500;
color: #3b4144;
}
/* 描述 额外文本 */
.uni-note {
margin-top: 10px;
color: #999;
font-size: $uni-font-size-sm;
}
/* 列表内容 */
.uni-list-box {
@extend .uni-flex-row;
flex: 1;
margin-top: 10px;
}
/* 略缩图 */
.uni-thumb {
flex-shrink: 0;
margin-right: $uni-spacing-row-base;
width: 125px;
height: 75px;
border-radius: $uni-border-radius-lg;
overflow: hidden;
border: 1px #f5f5f5 solid;
image {
width: 100%;
height: 100%;
}
}
.uni-media-box {
@extend .uni-flex-row;
border-radius: $uni-border-radius-lg;
overflow: hidden;
.uni-thumb {
margin: 0;
margin-left: 4px;
flex-shrink: 1;
width: 33%;
border-radius:0;
&:first-child {
margin: 0;
}
}
}
/* 内容 */
.uni-content {
@extend .uni-flex-column;
justify-content: space-between;
}
/* 列表footer */
.uni-footer {
@extend .uni-flex-row;
justify-content: space-between;
margin-top: $uni-spacing-col-lg;
}
.uni-footer-text {
font-size: $uni-font-size-sm;
color: $uni-text-color-grey;
margin-left: 5px;
}
/* 标签 */
.uni-tag {
flex-shrink: 0;
padding: 0 5px;
border: 1px $uni-border-color solid;
margin-right: $uni-spacing-row-sm;
border-radius: $uni-border-radius-base;
background: $uni-bg-color-grey;
color: $uni-text-color;
font-size: $uni-font-size-sm;
}
/* 链接 */
.uni-link {
margin-left: 10px;
color: $uni-text-color;
text-decoration: underline;
}
> 插件来源:[https://ext.dcloud.net.cn/plugin?id=1287](https://ext.dcloud.net.cn/plugin?id=1287)
##### 以下是作者写的插件介绍:
# uQRCode
### 云函数版二维码生成插件explain-qrcode现已发布,URL化后一句代码即可生成,有网就有二维码,100%生成成功,不会因为平台差异,设备差异导致生成失败,无需在前端做适配和兼容,极力推荐。插件地址:[explain-qrcode云函数二维码生成](https://ext.dcloud.net.cn/plugin?id=3359)
uQRCode 生成方式简单,可扩展性高,如有复杂需求可通过自定义组件或修改源码完成需求。已测试H5、微信小程序、iPhoneXsMax真机。
本示例项目中的自定义组件旨在抛砖引玉,有其他需求的朋友可自行扩展,自定义组件参考 ``/components/uni-qrcode/uni-qrcode.vue`` ,自定义组件使用案例参考 ``/pages/component/qrcode/qrcode.vue``
联系方式:QQ540000228。
最近一次用于更新代码的 HBuilder X 版本为 2.8.11。
### 二维码
**什么是QR码**
QR码属于矩阵式二维码中的一个种类,由DENSO(日本电装)公司开发,由JIS和ISO将其标准化。
**QR码的特点**
一是高速读取(QR就是取自“Quick Response”的首字母),通过摄像头从拍摄到解码到显示内容也就三秒左右,对摄像的角度也没有什么要求;
二是高容量、高密度,理论上内容经过压缩处理后可以存7089个数字,4296个字母和数字混合字符,2953个8位字节数据,1817个汉字;
三是支持纠错处理,按照QR码的标准文档说明,QR码的纠错分为4个级别,分别是:
- level L : 最大 7% 的错误能够被纠正;
- level M : 最大 15% 的错误能够被纠正;
- level Q : 最大 25% 的错误能够被纠正;
- level H : 最大 30% 的错误能够被纠正;
四是结构化,看似无规则的图形,其实对区域有严格的定义。
更多二维码介绍及原理:[https://blog.csdn.net/jason_ldh/article/details/11801355](https://blog.csdn.net/jason_ldh/article/details/11801355)
### 使用方式
``script`` 中引用组件
```javascript
import uQRCode from '@/common/uqrcode.js'
```
``template`` 中创建 ``<canvas></canvas>``
```html
<canvas canvas-id="qrcode" style="width: 354px;height: 354px;" ></canvas>
```
``script`` 中调用 ``make()`` 方法
```javascript
export default {
methods: {
async make() {
// 回调方式
uQRCode.make({
canvasId: 'qrcode',
componentInstance: this,
text: 'uQRCode',
size: 354,
margin: 10,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'jpg',
errorCorrectLevel: uQRCode.errorCorrectLevel.H,
success: res => {
console.log(res)
}
})
// Promise
uQRCode.make({
canvasId: 'qrcode',
componentInstance: this,
text: 'uQRCode',
size: 354,
margin: 10,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'jpg',
errorCorrectLevel: uQRCode.errorCorrectLevel.H
}).then(res => {
console.log(res)
})
// 同步等待
var res = await uQRCode.make({
canvasId: 'qrcode',
componentInstance: this,
text: 'uQRCode',
size: 354,
margin: 10,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'jpg',
errorCorrectLevel: uQRCode.errorCorrectLevel.H
})
console.log(res)
}
}
}
```
### 属性说明
|属性名|说明|
|---|:---|
|errorCorrectLevel|纠错等级,包含 `errorCorrectLevel.L``errorCorrectLevel.M``errorCorrectLevel.Q``errorCorrectLevel.H` 四个级别,`L`: 最大 7% 的错误能够被纠正;`M`: 最大 15% 的错误能够被纠正;`Q`: 最大 25% 的错误能够被纠正;`H`: 最大 30% 的错误能够被纠正。|
|defaults|二维码生成参数的默认值。|
### 方法说明
|方法名|说明|
|---|:---|
|[make](#makeoptions)|生成二维码。|
### make(options)
生成二维码
**options参数说明:**
|参数|类型|必填|说明|
|---|---|---|:---|
|canvasId|String|是|画布标识,传入 `<canvas></canvas>``canvas-id`|
|componentInstance|Object|否|自定义组件实例 `this` ,表示在这个自定义组件下查找拥有 `canvas-id``<canvas></canvas>` ,如果省略,则不在任何自定义组件内查找|
|text|String|是|二维码内容|
|size|Number|否|画布尺寸大小,请与 `<canvas></canvas>` 所设 `width``height` 保持一致(默认:`354`)|
|margin|Number|否|边距,二维码实际尺寸会根据所设边距值进行缩放调整(默认:`0`)|
|backgroundColor|String|否|背景色,若设置为透明背景, `fileType` 需设置为 `'png'` , 然后设置背景色为 `'rgba(255,255,255,0)'` 即可(默认:`'#ffffff'`)|
|foregroundColor|String|否|前景色(默认:`'#000000'`)|
|fileType|String|否|输出图片的类型,只支持 `'jpg'``'png'`(默认:`'png'`)|
|errorCorrectLevel|Number|否|纠错等级,参考属性说明 `errorCorrectLevel`(默认:`errorCorrectLevel.H`)|
### 使用建议
canvas在二维码生成中请当做一个生成工具来看待,它的作用仅是绘制出二维码。应把生成回调得到的资源保存并使用,显示用image图片组件,原因是方便操作,例如调整大小,或是H5端长按保存或识别,所以canvas应将它放在看不见的地方。不能用`display:none;overflow:hidden;`隐藏,否则生成空白。这里推荐canvas的隐藏样式代码
```html
<style>
.canvas-hide {
/* 1 */
position: fixed;
right: 100vw;
bottom: 100vh;
/* 2 */
z-index: -9999;
/* 3 */
opacity: 0;
}
</style>
```
### 常见问题
**二维码生成不完整**
canvas宽高必须和size一致,并且size的单位是px,如果canvas的单位是rpx,那么不同设备屏幕分辨率不一样,rpx转换成px后的画布尺寸不足以放下全部内容,实际绘制图案超出,就会出现不完整的情况。
**如何扫码跳转指定网页**
text参数直接放入完整的网页地址即可,例如:`https://ext.dcloud.net.cn/plugin?id=1287`。微信客户端不能是ip地址。
**小程序、APP报错**
canvas不支持放在 `slot` 插槽,请尽量放在模板根节点,也就是第一个 `<view></view>` 标签里面
**H5长按识别**
canvas无法长按识别,长按识别需要是图片才行,所以只需将回调过来的资源用image组件显示即可。
### Tips
- 示例项目中的图片采集于互联网,仅作为案例展示,不作为广告/商业,如有侵权,请告知删除。下载使用的用户,请勿把示例项目中的图片应用到你的项目。
\ No newline at end of file
<template>
<view>
<canvas :id="cid" :canvas-id="cid" :style="{width: `${size}px`, height: `${size}px`}" />
</view>
</template>
<script>
import uQRCode from './uqrcode.js'
export default {
props: {
cid: {
type: String,
default(){
return Date.now()+Math.random()+'';
}
},
text: {
type: String,
required: true
},
size: {
type: Number,
default: uni.upx2px(200)
},
margin: {
type: Number,
default: 0
},
backgroundColor: {
type: String,
default: '#ffffff'
},
foregroundColor: {
type: String,
default: '#000000'
},
backgroundImage: {
type: String
},
logo: {
type: String
},
makeOnLoad: {
type: Boolean,
default: false
}
},
data() {
return {
}
},
mounted() {
if (this.makeOnLoad) {
this.make()
}
},
methods: {
async make() {
var options = {
canvasId: this.cid,
componentInstance: this,
text: this.text,
size: this.size,
margin: this.margin,
backgroundColor: this.backgroundImage ? 'rgba(255,255,255,0)' : this.backgroundColor,
foregroundColor: this.foregroundColor
}
var filePath = await this.makeSync(options)
if (this.backgroundImage) {
filePath = await this.drawBackgroundImageSync(filePath)
}
if (this.logo) {
filePath = await this.drawLogoSync(filePath)
}
this.makeComplete(filePath)
},
makeComplete(filePath) {
this.$emit('makeComplete', filePath)
},
drawBackgroundImage(options) {
var ctx = uni.createCanvasContext(this.cid, this)
ctx.drawImage(this.backgroundImage, 0, 0, this.size, this.size)
ctx.drawImage(options.filePath, 0, 0, this.size, this.size)
ctx.draw(false, () => {
uni.canvasToTempFilePath({
canvasId: this.cid,
success: res => {
options.success && options.success(res.tempFilePath)
},
fail: error => {
options.fail && options.fail(error)
}
}, this)
})
},
async drawBackgroundImageSync(filePath) {
return new Promise((resolve, reject) => {
this.drawBackgroundImage({
filePath: filePath,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
},
fillRoundRect(ctx, r, x, y, w, h) {
ctx.save()
ctx.translate(x, y)
ctx.beginPath()
ctx.arc(w - r, h - r, r, 0, Math.PI / 2)
ctx.lineTo(r, h)
ctx.arc(r, h - r, r, Math.PI / 2, Math.PI)
ctx.lineTo(0, r)
ctx.arc(r, r, r, Math.PI, Math.PI * 3 / 2)
ctx.lineTo(w - r, 0)
ctx.arc(w - r, r, r, Math.PI * 3 / 2, Math.PI * 2)
ctx.lineTo(w, h - r)
ctx.closePath()
ctx.setFillStyle('#ffffff')
ctx.fill()
ctx.restore()
},
drawLogo(options) {
var ctx = uni.createCanvasContext(this.cid, this)
ctx.drawImage(options.filePath, 0, 0, this.size, this.size)
var logoSize = this.size / 4
var logoX = this.size / 2 - logoSize / 2
var logoY = logoX
var borderSize = logoSize + 10
var borderX = this.size / 2 - borderSize / 2
var borderY = borderX
var borderRadius = 5
this.fillRoundRect(ctx, borderRadius, borderX, borderY, borderSize, borderSize)
ctx.drawImage(this.logo, logoX, logoY, logoSize, logoSize)
ctx.draw(false, () => {
uni.canvasToTempFilePath({
canvasId: this.cid,
success: res => {
options.success && options.success(res.tempFilePath)
},
fail: error => {
options.fail && options.fail(error)
}
}, this)
})
},
async drawLogoSync(filePath) {
return new Promise((resolve, reject) => {
this.drawLogo({
filePath: filePath,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
},
async makeSync(options) {
return new Promise((resolve, reject) => {
uQRCode.make({
canvasId: options.canvasId,
componentInstance: options.componentInstance,
text: options.text,
size: options.size,
margin: options.margin,
backgroundColor: options.backgroundColor,
foregroundColor: options.foregroundColor,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
}
}
}
</script>
此差异已折叠。
<template>
<view @click="onClick" :style="{width,height}">
<image v-if="cSrc" :style="{width,height}" :src="cSrc" :mode="mode"></image>
</view>
</template>
<script>
export default {
name: "cloud-image",
emits:['click','switchChange'],
props: {
mode: {
type:String,
default () {
return 'widthFix'
}
},
src: {
// type:String,
default () {
return ""
}
},
width: {
type:String,
default () {
return '100rpx'
}
},
height: {
type:String,
default () {
return '100rpx'
}
}
},
watch: {
src:{
handler(src) {
// console.log(src);
// console.log(src.substring(0, 8));
if (src.substring(0, 8) == "cloud://") {
uniCloud.getTempFileURL({
fileList: [src]
}).then(res=>{
// console.log(res);
this.cSrc = res.fileList[0].tempFileURL
})
}else{
this.cSrc = src
}
},
immediate: true
}
},
async mounted() {
},
methods:{
onClick(){
this.$emit('click')
}
},
data() {
return {
cSrc:false
};
}
}
</script>
\ No newline at end of file
<template>
<refresh @refresh="refresh" @pullingdown="onpullingdown" :display="showRefresh ? 'show' : 'hide'">
<view class="refreshBox">
<!-- 可以自己添加图片路径或base64实现图片 <image class="refreshImg" :src="config[state].img" mode="widthFix" resize="cover"></image> -->
<text class="refreshText">{{config[state].text}}</text>
</view>
</refresh>
</template>
<script>
export default {
data() {
return {
showRefresh:false,
state:0
}
},
methods:{
onpullingdown({pullingDistance,viewHeight}) {
if(pullingDistance < viewHeight){
this.state = 0
}else{
this.state = 1
}
},
refresh(){
console.log('refresh');
this.showRefresh = true
this.state = 2
this.$emit('refresh')
}
},
watch: {
loading(loading, oldValue) {
if(!loading){
this.showRefresh = false
this.state = 3
}
}
},
props: {
loading: {
type:Boolean,
default(){
return false
}
},
config: {
type: Array,
default(){
return [
{
text:"继续下拉执行刷新",
img:""//可以自己添加图片路径或base64实现图片
},
{
text:"释放立即刷新",
img:""//可以自己添加图片路径或base64实现图片
},
{
text:"正在疯狂的加载中",
img:""//可以自己添加图片路径或base64实现图片
},
{
text:"加载成功",
img:""//可以自己添加图片路径或base64实现图片
}
]
}
},
},
}
</script>
<style lang="scss" scoped>
.refreshBox{
width: 750rpx;
height: 50px;
justify-content: center;
align-items: center;
flex-direction: row;
/* #ifndef APP-PLUS */
margin-top: -50px;
/* #endif */
}
.refreshImg{
width: 55rpx;
height: 55rpx;
z-index: 111;
}
.refreshText{
font-size: 26rpx;
color: #999999;
padding-left: 6rpx;
}
</style>
<template>
<view class="root">
<checkbox-group @change="setAgree" class="checkbox-group">
<checkbox style="transform: scale(0.7);" />
<text>{{$t('common.agree')}}</text>
</checkbox-group>
<view class="item" v-for="(agreement,index) in agreements" :key="index">
<text class="agreement" @click="navigateTo(agreement)">{{agreement.title}}</text>
<text class="hint" v-if="hasAnd(agreements,index)">&</text>
</view>
</view>
</template>
<script>
export default {
name:"uni-agreements",
computed:{
agreements(){
return getApp().globalData.config.about.agreements||[]
}
},
methods:{
navigateTo({url,title}){
uni.navigateTo({
url: '/pages/common/webview/webview?url='+url+'&title='+title,
success: res => {},
fail: () => {},
complete: () => {}
});
},
hasAnd(agreements,index){
return agreements.length-1>index
},
setAgree(e){
this.isAgree = !this.isAgree
this.$emit('setAgree',this.isAgree)
}
},
created() {
uni.$on('setAgreementsAgree',state=>{
this.$emit('setAgree',state)
})
},
data() {
return {
isAgree:false
};
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
view{
display: flex;
box-sizing: border-box;
flex-direction: column;
}
/* #endif */
.root{
flex-direction: row;
align-items: center;
font-size: 28rpx;
color: #8a8f8b;
}
.checkbox-group{
align-items: center;
display: flex;
flex-direction: row;
}
.item{
flex-direction: row;
}
.agreement{
color:#04498c;
}
</style>
<template>
<uni-popup ref="popup" type="bottom">
<view class="box">
<text class="headBox">绑定资料</text>
<text class="tip">将一键获取你的手机号码绑定你的个人资料</text>
<view class="btnBox">
<text @click="closeMe" class="close">关闭</text>
<button class="agree" type="warn" @click="beforeGetphonenumber" open-type="getPhoneNumber"
@getphonenumber="bindMobileByMpWeixin">获取</button>
</view>
</view>
</uni-popup>
</template>
<script>
import {
mapMutations,
mapGetters
} from 'vuex';
const db = uniCloud.database();
const usersTable = db.collection('uni-id-users')
let userId = ''
export default {
emits: ['next'],
computed: {
...mapGetters({
userInfo: 'user/info',
login: 'user/hasLogin'
})
},
data() {
return {}
},
methods: {
...mapMutations({
setUserInfo: 'user/login'
}),
beforeGetphonenumber() {
uni.showLoading({
mask:true
})
wx.checkSession({
success() {
console.log('session_key 未过期');
uni.hideLoading()
},
fail() {
console.log('session_key 已经失效,正在执行更新');
wx.login({
success({code}) {
uniCloud.callFunction({
name: "uni-id-cf",
data: {
"action": "refreshSessionKey",
"params": {
code
}
},
complete: (e) => {
console.log(e);
uni.hideLoading()
}
})
},
fail: (err) => {
console.error(err);
}
})
}
})
},
bindMobileByMpWeixin(e) {
console.log(e.detail);
uniCloud.callFunction({
name: "uni-id-cf",
data: {
"action": "bindMobileByMpWeixin",
"params": e.detail
},
complete: (e) => {
console.log(e);
},
success: (e) => {
uni.showToast({
title: e.result.msg,
icon: 'none'
});
if(e.result.code === 0){
this.setUserInfo({
"mobile": e.result.mobile
})
}
this.closeMe()
}
})
},
async open(uid) {
userId = uid
this.$refs.popup.open()
this.beforeGetphonenumber()
},
closeMe(e) {
this.$refs.popup.close()
},
}
}
</script>
<style lang="scss" scoped>
view {
display: flex;
}
.box {
background-color: #FFFFFF;
height: 200px;
width: 750rpx;
flex-direction: column;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
}
.headBox {
padding: 20rpx;
height: 80rpx;
line-height: 80rpx;
text-align: left;
font-size: 32upx;
color: #333333;
margin-left: 15rpx;
}
.tip {
color: #666666;
text-align: left;
justify-content: center;
margin: 10rpx 30rpx;
font-size: 36rpx;
}
.btnBox {
margin-top: 45rpx;
justify-content: center;
flex-direction: row;
}
.close,
.agree {
text-align: center;
width: 200rpx;
height: 80upx;
line-height: 80upx;
border-radius: 50px;
margin: 0 20rpx;
font-size: 36rpx;
}
.close {
color: #999999;
border-color: #EEEEEE;
border-style: solid;
border-width: 1px;
background-color: #FFFFFF;
}
.close:active {
color: #989898;
background-color: #E2E2E2;
}
.agree {
background-color: #DD524D;
color: #FFFFFF;
}
/* #ifdef MP */
.agree::after {
border: none;
}
.agree {
background-color: #DD524D;
}
/* #endif */
.agree:active {
background-color: #F5F5F6;
}
</style>
{
"noData": "No Data",
"noNetwork": "Network error",
"toSet": "Go to settings",
"error": "error"
}
import en from './en.json'
import zhHans from './zh-Hans.json'
export default {
en,
'zh-Hans': zhHans
}
{
"noData": "暂无数据",
"noNetwork": "网络异常",
"toSet": "前往设置",
"error": "错误"
}
新增uni-load-state组件,这是一个封装数据请求状态的组件。根据uniCloud-db组件提供的参数直接响应对应的效果。
包括加载中、当前页面为空、没有更多数据、上拉加载更多;
加载错误判断,如果是断网就引导打开系统网络设置页面。恢复联网后自动触发networkResume方法。
\ No newline at end of file
<template>
<view @appear="appear">
<view v-if="state.error">
<view class="box" v-if="networkType == 'none'">
<image class="icon-image" src="@/static/uni-load-state/disconnection.png" mode="widthFix"></image>
<text class="tip-text">{{noNetwork}}</text>
<view class="btn btn-default" @click="openSettings">
<text class="btn-text">{{toSet}}</text>
</view>
</view>
<text class="error" v-else>{{error}}{{JSON.stringify(state.error)}}</text>
</view>
<template v-else>
<!-- #ifdef APP-NVUE -->
<text class="state-text">{{state.loading?'加载中...':(state.hasMore?'上拉加载更多':'没有更多数据了')}}</text>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<uni-load-more class="uni-load-more" :status="state.loading?'loading':(state.hasMore?'hasMore':'noMore')"></uni-load-more>
<!-- #endif -->
</template>
</view>
</template>
<script>
import {
initVueI18n
} from '@dcloudio/uni-i18n'
import messages from './i18n/index.js'
const {
t
} = initVueI18n(messages)
export default {
name: "uni-load-state",
computed: {
noData() {
return t('noData')
},
noNetwork() {
return t('noNetwork')
},
toSet() {
return t('toSet')
},
error() {
return t('error')
}
},
data() {
return {
"networkType": ""
};
},
props: {
state: {
type: Object,
default () {
return {
"loading": true,
"hasMore": false,
"pagination": {
"pages": 0
},
"data": [],
"error": {}
}
}
}
},
mounted() {
uni.onNetworkStatusChange(({
networkType
}) => {
if (this.networkType == 'none' && networkType != 'none') { //之前没网现在有了
this.$emit('networkResume')
}
this.networkType = networkType;
});
uni.getNetworkType({
success: ({
networkType
}) => {
this.networkType = networkType;
}
});
},
methods: {
appear() {
if (!this.state.loading && this.state.hasMore) {
this.$emit('loadMore')
}
},
openSettings() {
if (uni.getSystemInfoSync().platform == "ios") {
var UIApplication = plus.ios.import("UIApplication");
var application2 = UIApplication.sharedApplication();
var NSURL2 = plus.ios.import("NSURL");
var setting2 = NSURL2.URLWithString("App-prefs:root=General");
application2.openURL(setting2);
plus.ios.deleteObject(setting2);
plus.ios.deleteObject(NSURL2);
plus.ios.deleteObject(application2);
} else {
var Intent = plus.android.importClass("android.content.Intent");
var Settings = plus.android.importClass("android.provider.Settings");
var mainActivity = plus.android.runtimeMainActivity();
var intent = new Intent(Settings.ACTION_SETTINGS);
mainActivity.startActivity(intent);
}
}
}
}
</script>
<style scoped>
.box {
flex: 1;
flex-direction: column;
align-items: center;
justify-content: center;
}
.uni-load-more{
align-items: center;
justify-content: center;
width: 690rpx;
}
.state-text {
text-align: center;
font-size: 26rpx;
width: 690rpx;
padding: 10rpx;
color: #999999;
}
.icon-image {
width: 300rpx;
}
.tip-text {
color: #999999;
font-size: 32rpx;
margin-bottom: 30rpx;
}
.btn {
padding: 5px 10px;
width: 128px;
flex-direction: row;
align-items: center;
justify-content: center;
text-align: center;
}
.btn-text {
color: #999999;
font-size: 15px;
}
.btn-default {
border-color: #999999;
border-style: solid;
border-width: 1px;
border-radius: 3px;
}
.error {
width: 690rpx;
color: #DD524D;
}
</style>
<template>
<view>
<view class="quick-login-box">
<view class="item" v-for="(item,index) in servicesList" :key="index"
@click="item.path?to(item.path):login_before(item.id,false)">
<image class="logo" :src="item.logo" mode="widthFix"></image>
<text class="login-title">{{item.text}}</text>
</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<uni-user-profile @next="doUserProfileNext" ref="userProfile"></uni-user-profile>
<!-- #endif -->
</view>
</template>
<script>
import {mapGetters,mapMutations} from 'vuex';
//前一个窗口的页面地址。控制点击切换快捷登录方式是创建还是返回
import loginSuccess from '@/pages/ucenter/login-page/common/loginSuccess.js';
const db = uniCloud.database();
const usersTable = db.collection('uni-id-users')
export default {
computed: {
loginConfig() {
return getApp().globalData.config.router.login
},
agreements() {
return getApp().globalData.config.about.agreements || []
}
},
data() {
return {
servicesList: [{
"id": "username",
"text": this.$t('uniQuickLogin').accountLogin,
"logo": "/static/uni-quick-login/user.png",
"path": "/pages/ucenter/login-page/pwd-login/pwd-login"
},
{
"id": "smsCode",
"text": this.$t('uniQuickLogin').SMSLogin,
"logo": "/static/uni-quick-login/sms.png",
"path": "/pages/ucenter/login-page/index/index?type=smsCode"
},
{
"id": "weixin",
"text": this.$t('uniQuickLogin').wechatLogin,
"logo": "/static/uni-quick-login/wechat.png",
},
{
"id": "apple",
"text": this.$t('uniQuickLogin').appleLogin,
"logo": "/static/uni-quick-login/apple.png",
},
{
"id": "univerify",
"text":this.$t('uniQuickLogin').oneClickLogin,
"logo": "/static/uni-quick-login/univerify.png",
},
{
"id": "qq",
"text": this.$t('uniQuickLogin').QQLogin, //暂未提供该登录方式的接口示例
"logo": "/static/uni-quick-login/univerify.png",
},
{
"id": "xiaomi",
"text": this.$t('uniQuickLogin').xiaomiLogin, //暂未提供该登录方式的接口示例
"logo": "/static/uni-quick-login/univerify.png",
},
{
"id": "sinaweibo",
"text": this.$t('common').weibo, //暂未提供该登录方式的接口示例
"logo": "/static/uni-quick-login/univerify.png",
}
],
config: {},
univerifyStyle: { //一键登录弹出窗的样式配置参数
"fullScreen": true, // 是否全屏显示,true表示全屏模式,false表示非全屏模式,默认值为false。
"backgroundColor": "#ffffff", // 授权页面背景颜色,默认值:#ffffff
"buttons": { // 自定义登录按钮
"iconWidth": "45px", // 图标宽度(高度等比例缩放) 默认值:45px
"list": []
},
"privacyTerms": {
"defaultCheckBoxState": false, // 条款勾选框初始状态 默认值: true
"textColor": "#BBBBBB", // 文字颜色 默认值:#BBBBBB
"termsColor": "#5496E3", // 协议文字颜色 默认值: #5496E3
"prefix": "我已阅读并同意", // 条款前的文案 默认值:“我已阅读并同意”
"suffix": "并使用本机号码登录", // 条款后的文案 默认值:“并使用本机号码登录”
"privacyItems": []
}
}
}
},
watch: {
agree(agree) {
this.univerifyStyle.privacyTerms.defaultCheckBoxState = agree
}
},
props: {
agree: {
type: Boolean,
default () {
return false
}
}
},
async created() {
let servicesList = this.servicesList
//去掉配置中不存在的 注意,在/common/appInit.js中已清除有配置但设备环境不支持的登录项
servicesList = servicesList.filter(item => this.loginConfig.includes(item.id))
//处理一键登录
if (this.loginConfig.includes('univerify')) {
this.univerifyStyle.privacyTerms.privacyItems = this.agreements
//设置一键登录功能底下的快捷登录按钮
servicesList.forEach(({
id,
logo
}) => {
if (id != 'univerify') {
this.univerifyStyle.buttons.list.push({
"iconPath": logo,
"provider": id
})
}
})
}
console.log(servicesList);
//如果当前页面为默认登录界面。当前第一优先级的“微信和苹果登录”要隐藏,因为他已经被渲染在默认登录界面顶部
if (
this.getRoute(1) == '/pages/ucenter/login-page/index/index' && ['weixin', 'apple'].includes(this
.loginConfig[0])
) {
servicesList = servicesList.filter(item => item.id != this.loginConfig[0])
}
//去掉当前页面对应的登录选项
this.servicesList = servicesList.filter(item => {
let path = item.path ? item.path.split('?')[0] : '';
return path != this.getRoute(1)
})
console.log('servicesList', servicesList, this.servicesList);
},
mounted() {
},
methods: {
...mapMutations({
setUserInfo: 'user/login'
}),
getRoute(n = 0) {
let pages = getCurrentPages();
// console.log('route-pages-length', pages.length);
if (n > pages.length) {
return ''
}
return '/' + pages[pages.length - n].route
},
to(path) {
// console.log('比较', this.getRoute(2), path)
if (this.getRoute(2) == path) { // 控制路由是重新打开还是返回,避免重复打开页面
uni.navigateBack();
} else {
uni.navigateTo({
url: path,
animationType: 'slide-in-left'
})
}
},
login_before(type, navigateBack = true) {
if (!this.agree && type != 'univerify') {
return uni.showToast({
title: this.$t('common').noAgree,
icon: 'none'
});
}
uni.showLoading({
mask: true
})
//univerifyManager
if(type == 'univerify' && uni.getUniverifyManager){
// 调用一键登录弹框
const univerifyManager = uni.getUniverifyManager()
univerifyManager.login({
"univerifyStyle": this.univerifyStyle,
success (res) {
console.log('login success', res)
}
})
const callback = (res) => {
// 获取一键登录弹框协议勾选状态
univerifyManager.getCheckBoxState({
success(res) {
console.log("getCheckBoxState res: ", res);
if (res.state) {
// 关闭一键登录弹框
univerifyManager.close()
}
}
})
}
// 订阅自定义按钮点击事件
univerifyManager.onButtonsClick(callback)
// 取消订阅自定义按钮点击事件
univerifyManager.offButtonsClick(callback)
}else{
console.log(type);
console.log('uni.getUniverifyManager:'+uni.getUniverifyManager);
}
uni.login({
"provider": type,
"onlyAuthorize":true, //请勿直接使用前端获取的unionid或openid直接用于登录,前端的数据都是不可靠的
"univerifyStyle": this.univerifyStyle,
complete: (e) => {
uni.hideLoading()
console.log(e);
},
success: async e => {
console.log(e);
if (type == 'apple') {
let res = await this.getUserInfo({
provider: "apple"
})
Object.assign(e.authResult, res.userInfo)
}
this.login( type == 'weixin'?e.code:e.authResult , type)
},
fail:async (err) => {
console.log(err);
if (type == 'univerify') {
if (err.metadata && err.metadata.error_data) {
uni.showToast({
title: this.$t('uniQuickLogin').oneClickLogin + ":" + err.metadata.error_data,
icon: 'none'
});
}
if (err.errMsg) {
uni.showToast({
title:this.$t('uniQuickLogin').oneClickLogin + ":" + err.errMsg,
icon: 'none'
});
}
switch (err.errCode) {
case 30002:
console.log('在一键登录界面,点击其他登录方式');
break;
case 30003:
console.log('关闭了登录');
if (navigateBack) {
uni.navigateBack()
}
break;
case 30006:
uni.showModal({
title: this.$t('uniQuickLogin').loginErr,
content: err.metadata.error_data,
showCancel: false,
confirmText: this.$t('common').gotIt,
});
break;
case "30008":
uni.showToast({
title: this.$t('uniQuickLogin').chooseOtherLogin,
icon: 'none'
});
console.log('点击了第三方登录,provider:', err.provider);
//同步一键登录弹出层隐私协议框是否打勾
let agree = (await uni.getCheckBoxState())[1].state
console.log('agree',agree);
uni.$emit('setAgreementsAgree',agree)
let {
path
} = this.servicesList.find(item => item.id == err.provider) || {}
console.log('path', path);
if (path && path != this.getRoute(1)) { //存在路径,且并不是当前已经打开的路径
this.to(path)
} else {
setTimeout(()=>{
console.log('agree',this.agree);
this.login_before(err.provider)
},500)
}
break;
default:
console.log(err);
break;
}
}
}
})
},
login(params, type) { //联网验证登录
console.log({
params,
type
});
let action = 'loginBy' + type.trim().toLowerCase().replace(type[0], type[0].toUpperCase())
uniCloud.callFunction({
name: 'uni-id-cf',
data: {
action,
params
},
success: async ({
result
}) => {
console.log("login-result", result);
if (result.code === 0) {
if (type == 'univerify') {
uni.closeAuthView()
}
uni.hideLoading()
delete result.userInfo.token
// #ifdef MP-WEIXIN
if (type == 'weixin' && !result.userInfo.nickname) {
return this.$refs.userProfile.open(result.uid)
}
// #endif
this.setUserInfo(result.userInfo)
loginSuccess(result)
} else {
uni.showModal({
content: result.msg,
showCancel: false
});
}
},
complete: () => {
uni.hideLoading()
}
})
},
doUserProfileNext(){
loginSuccess()
},
async getUserInfo(e) {
return new Promise((resolve, reject) => {
uni.getUserInfo({
...e,
success: (res) => {
resolve(res);
},
fail: (err) => {
uni.showModal({
content: JSON.stringify(err),
showCancel: false
});
reject(err);
}
})
})
}
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
view {
display: flex;
box-sizing: border-box;
flex-direction: column;
}
/* #endif */
.quick-login-box {
flex-direction: row;
width: 750rpx;
justify-content: space-around;
position: fixed;
bottom: 10rpx;
left: 0;
}
.item {
flex-direction: column;
justify-content: center;
align-items: center;
height: 200rpx;
}
.logo {
width: 60rpx;
height: 60rpx;
}
.login-title {
margin-top: 4px;
font-size: 26rpx;
}
</style>
\ No newline at end of file
<template>
<view class="uni-section" nvue>
<view v-if="type" class="uni-section__head">
<view :class="type" class="uni-section__head-tag" />
</view>
<view class="uni-section__content">
<text :class="{'distraction':!subTitle}" class="uni-section__content-title">{{ title }}</text>
<text v-if="subTitle" class="uni-section__content-sub">{{ subTitle }}</text>
</view>
<slot />
</view>
</template>
<script>
/**
* Section 标题栏
* @description 标题栏
* @property {String} type = [line|circle] 标题装饰类型
* @value line 竖线
* @value circle 圆形
* @property {String} title 主标题
* @property {String} subTitle 副标题
*/
export default {
name: 'UniSection',
props: {
type: {
type: String,
default: ''
},
title: {
type: String,
default: ''
},
subTitle: {
type: String,
default: ''
}
},
data() {
return {}
},
watch: {
title(newVal) {
if (uni.report && newVal !== '') {
uni.report('title', newVal)
}
}
},
methods: {
onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss" scoped>
.uni-section {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
margin-top: 10px;
flex-direction: row;
align-items: center;
padding: 0 10px;
height: 50px;
background-color: $uni-bg-color-grey;
/* #ifdef APP-NVUE */
// border-bottom-color: $uni-border-color;
// border-bottom-style: solid;
// border-bottom-width: 0.5px;
/* #endif */
font-weight: normal;
}
/* #ifndef APP-NVUE */
// .uni-section:after {
// position: absolute;
// bottom: 0;
// right: 0;
// left: 0;
// height: 1px;
// content: '';
// -webkit-transform: scaleY(.5);
// transform: scaleY(.5);
// background-color: $uni-border-color;
// }
/* #endif */
.uni-section__head {
flex-direction: row;
justify-content: center;
align-items: center;
margin-right: 10px;
}
.line {
height: 15px;
background-color: $uni-text-color-disable;
border-radius: 5px;
width: 3px;
}
.circle {
width: 8px;
height: 8px;
border-top-right-radius: 50px;
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
border-bottom-right-radius: 50px;
background-color: $uni-text-color-disable;
}
.uni-section__content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
flex: 1;
color: $uni-text-color;
}
.uni-section__content-title {
font-size: $uni-font-size-base;
color: $uni-text-color;
}
.distraction {
flex-direction: row;
align-items: center;
}
.uni-section__content-sub {
font-size: $uni-font-size-sm;
color: $uni-text-color-grey;
}
</style>
<template>
<view class="short-code-btn" hover-class="hover" @click="start">
<text class="inner-text" :class="reverseNumber==0?'inner-text-active':''">{{innerText}}</text>
</view>
</template>
<script>
function debounce(func, wait) {
let timer;
wait = wait || 500;
return function() {
let context = this;
let args = arguments;
if (timer) clearTimeout(timer);
let callNow = !timer;
timer = setTimeout(() => {
timer = null;
}, wait)
if (callNow) func.apply(context, args);
}
}
export default {
name: "uni-send-sms-code",
props: {
/**
* 倒计时时长 s
*/
count: {
type: [String, Number],
default: 60
},
/**
* 手机号码
*/
phone: {
type: [String, Number],
default: ''
},
/*
验证码类型,用于防止不同功能的验证码混用,目前支持的类型login登录、register注册、bind绑定手机、unbind解绑手机
*/
codeType:{
type: String,
default(){
return 'login'
}
}
},
data() {
return {
reverseNumber: 0,
reverseTimer: null
};
},
computed: {
innerText() {
if (this.reverseNumber == 0) return this.$t('common.getVerifyCode');
return this.$t('smsCode.resendVerifyCode')+ '('+this.reverseNumber+'s)';
}
},
created() {
this.initClick();
},
methods: {
initClick() {
this.start = debounce(() => {
if (this.reverseNumber != 0) return;
this.sendMsg();
})
},
sendMsg() {
let reg_phone = /^1\d{10}$/;
if(!reg_phone.test(this.phone))return uni.showToast({
title: this.$t('smsCode.phoneErrTip'),
icon: 'none'
});
uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'sendSmsCode',
params:{
"mobile": this.phone,
"type": this.codeType
},
},
success: ({result}) => {
console.log(result);
if(result.code===0){
uni.showToast({
title: this.$t('smsCode.sendSuccessTip'),
icon: 'none'
});
this.reverseNumber = Number(this.count);
this.getCode();
this.$emit('getCode');
}else{
uni.showModal({
content: result.msg,
showCancel: false
});
}
}
})
},
getCode() {
if (this.reverseNumber == 0) {
clearTimeout(this.reverseTimer);
this.reverseTimer = null;
return;
}
this.reverseNumber--;
this.reverseTimer = setTimeout(() => {
this.getCode();
}, 1000)
}
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
view{
display: flex;
box-sizing: border-box;
flex-direction: column;
}
/* #endif */
.short-code-btn {
width: 200rpx;
height: 85rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
.inner-text {
font-size: 28rpx;
color: #AAAAAA;
}
.inner-text-active {
color: #007aff;
}
</style>
此差异已折叠。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
<title></title>
<!--preload-links-->
<!--app-context-->
</head>
<body>
<div id="app"><!--app-html--></div>
<script type="module" src="/main.js"></script>
</body>
</html>
\ No newline at end of file
此差异已折叠。
import langEn from './en'
import zhHans from './zh-Hans'
import uniStarterConfig from '../uni-starter.config.js'
const {i18n:{enable:i18nEnable} }= uniStarterConfig
const messages = {
'en': langEn,
'zh-Hans': zhHans
}
let currentLang
if(i18nEnable){
currentLang = uni.getStorageSync('CURRENT_LANG')
}else{
currentLang = "zh-Hans"
}
// console.log(uni.getStorageSync('CURRENT_LANG'),currentLang);
if (!currentLang) {
if (uni.getLocale) {
console.log('获取应用语言:', uni.getLocale());
let language = 'en'
if (uni.getLocale() != 'en') {
language = 'zh-Hans'
}
uni.setStorageSync('CURRENT_LANG', language)
currentLang = language
} else {
uni.getSystemInfo({
success: function(res) {
console.log('获取设备信息:', res);
let language = 'zh-Hans'
if (res.language == 'en') {
language = 'en'
}
uni.setStorageSync('CURRENT_LANG', language)
currentLang = language
},
fail: (err) => {
console.error(err)
}
})
}
}
let i18nConfig = {
locale: currentLang, // set locale
messages // set locale messages
}
// #ifdef VUE2
import Vue from 'vue'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
const i18n = new VueI18n(i18nConfig)
// #endif
// #ifdef VUE3
import {
createI18n
} from 'vue-i18n'
const i18n = createI18n(i18nConfig)
// #endif
export default i18n
if(i18nEnable){
console.log(`
你已开启多语言国际化,将自动根据语言获取【lang/en.js】或【lang/en.js】文件中配置的tabbar的值,
覆盖你在pages.json中的tabbar的值
如果你不需要多语言国际化,请打开配置文件uni-starter.config.js找到 -> i18n -> enable把值设置为false
`);
let initLanguageAfter = () => {
function $i18n(e){
// #ifdef VUE3
return i18n.global.messages[i18n.global.locale][e]
// #endif
return i18n.messages[i18n.locale][e]
}
setTimeout(function(){
//底部tabbar更新
$i18n('tabbar').split(',').forEach((text, index) => {
// console.log(text);
uni.setTabBarItem({
index,
text,
complete: e => {
// console.log("e: " + JSON.stringify(e));
}
})
})
},1)
//更新 uni-starter.config agreements
let agreementsTitle = $i18n('agreementsTitle').split(',')
let agreements = uniStarterConfig.about.agreements
agreements[0].title = agreementsTitle[0]
agreements[1].title = agreementsTitle[1]
uniStarterConfig.about.agreements = agreements
}
initLanguageAfter()
uni.$on('changeLanguage', e => {
console.log('changeLanguage', e);
initLanguageAfter(e)
})
}
\ No newline at end of file
此差异已折叠。
import App from './App'
import store from './store'
import i18n from './lang/i18n'
// #ifndef VUE3
import Vue from 'vue'
Vue.config.productionTip = false
Vue.prototype.$store = store
App.mpType = 'app'
const app = new Vue({
i18n,
store,
...App
})
app.$mount()
// #endif
// #ifdef VUE3
import {createSSRApp} from 'vue'
export function createApp() {
const app = createSSRApp(App)
app.use(i18n)
app.use(store)
return {app}
}
// #endif
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
import {mapMutations} from 'vuex';
import loginSuccess from './loginSuccess.js';
let mixin = {
methods:{
...mapMutations({
setUserInfo: 'user/login'
}),
loginSuccess(result){
loginSuccess(result)
delete result.userInfo.token
this.setUserInfo(result.userInfo)
}
}
}
export default mixin
\ No newline at end of file
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册