MBTI人格测试 uniapp

App.vue 7.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231
  1. <script>
  2. import { postJSON as $postJSON, get as $get } from "./config/util";
  3. import { api as $api } from "./config/api";
  4. import appInfo from "./config/appInfo";
  5. const router = require("./utils/router");
  6. export default {
  7. globalData: {
  8. isIOS: false, // 判断是否是ios
  9. isIphoneX: false, // 是否为 iphoneX 及以上机型
  10. statusBarHeight: 44, // 状态栏高度
  11. navBarHeight: 44, // 导航栏高度
  12. pageContentTop: 88, // 页面默认内边距
  13. $router: router,
  14. $appInfo: appInfo, // 小程序静态配置信息
  15. testResult: '', // 测试结果
  16. },
  17. onLaunch: function (options) {
  18. console.log("App onLaunch options => ", options);
  19. // 判断当前设备是否为 iphoneX 及以上机型
  20. this.handleGetIsIphoneX();
  21. // 判断当前小程序是否为最新版本
  22. this.handleVersionUpdate();
  23. // 登录
  24. // this.handleLogin();
  25. },
  26. onShow: function (options) {
  27. console.log("App onShow options => ", options);
  28. },
  29. onHide: function (options) {
  30. console.log("App onHide options => ", options);
  31. },
  32. methods: {
  33. // 判断当前设备是否为 iphoneX 及以上机型
  34. handleGetIsIphoneX() {
  35. const systemInfo = uni.getSystemInfoSync();
  36. console.log("systemInfo => ", systemInfo);
  37. const _app = this.$scope || getApp(); // 兼容方式
  38. const menuButton = uni.getMenuButtonBoundingClientRect();
  39. // 导航栏高度
  40. _app.globalData.navBarHeight =
  41. menuButton.height + (menuButton.top - systemInfo.statusBarHeight) * 2;
  42. // 状态栏高度
  43. _app.globalData.statusBarHeight = systemInfo.statusBarHeight;
  44. // 页面内容内边距
  45. _app.globalData.pageContentTop =
  46. _app.globalData.navBarHeight + _app.globalData.statusBarHeight;
  47. if (systemInfo.system.toUpperCase().includes("IOS")) {
  48. _app.globalData.isIOS = true; // 判断是否是ios
  49. if (systemInfo.safeArea.top > 20) {
  50. _app.globalData.isIphoneX = true;
  51. }
  52. }
  53. },
  54. // 判断当前小程序是否为最新版本
  55. handleVersionUpdate() {
  56. const that = this;
  57. // 判断应用的 getUpdateManager 是否在当前版本可用
  58. if (uni.canIUse("getUpdateManager")) {
  59. const updateManager = uni.getUpdateManager();
  60. // 向小程序后台请求完新版本信息
  61. updateManager.onCheckForUpdate(function (res) {
  62. if (res.hasUpdate) {
  63. // 小程序有新版本,静默下载新版本,新版本下载完成
  64. updateManager.onUpdateReady(function () {
  65. uni.showModal({
  66. title: "更新提示",
  67. content: "小程序已发布新版本,是否重启应用?",
  68. success: function (res) {
  69. if (res.confirm) {
  70. updateManager.applyUpdate();
  71. } else if (res.cancel) {
  72. // 强制用户更新,弹出第二次弹窗
  73. uni.showModal({
  74. title: "提示",
  75. content: "小程序已发布新版本,是否重启应用",
  76. showCancel: false, // 隐藏取消按钮
  77. success: function (res) {
  78. // 第二次提示后,强制更新
  79. if (res.confirm) {
  80. // 当新版本下载完成,调用该方法会强制当前小程序应用上新版本并重启
  81. updateManager.applyUpdate();
  82. } else if (res.cancel) {
  83. // 重新回到版本更新提示
  84. that.handleVersionUpdate();
  85. }
  86. },
  87. });
  88. }
  89. },
  90. });
  91. });
  92. // 当新版本下载失败
  93. updateManager.onUpdateFailed(function () {
  94. uni.showModal({
  95. title: "提示",
  96. content: "小程序版本更新失败,请您删除当前小程序并重新打开",
  97. });
  98. });
  99. }
  100. });
  101. } else {
  102. // 提示用户在最新版本的客户端上体验
  103. uni.showModal({
  104. title: "温馨提示",
  105. content:
  106. "当前微信版本过低,可能无法使用该功能,请升级到最新版本后重试。",
  107. });
  108. }
  109. },
  110. // 显示获取用户信息确认弹框
  111. handleShowModal(content) {
  112. return new Promise((resolve) => {
  113. uni.showModal({
  114. title: "提示",
  115. content: content || "确定执行当前操作吗?",
  116. success: async (res) => {
  117. if (res.confirm) {
  118. resolve("确认");
  119. }
  120. },
  121. });
  122. });
  123. },
  124. // 设置导航栏标题
  125. handleSetNavTitle(title) {
  126. uni.setNavigationBarTitle({
  127. title: title || appInfo.appName,
  128. });
  129. },
  130. // 执行登录
  131. handleLogin() {
  132. return new Promise(async (resolve, reject) => {
  133. try {
  134. const res = await this.handleGetLoginInfo();
  135. // 将当前用户登录信息存储至本地(供后续手机号登录及业务使用)
  136. uni.setStorageSync("openid", res.openid || "");
  137. // uni.setStorageSync("user_id", res.user_id);
  138. // uni.setStorageSync("nickname", res.nickname);
  139. resolve(res);
  140. } catch (error) {
  141. reject(error);
  142. }
  143. });
  144. },
  145. // 获取用户微信登录信息
  146. handleGetLoginInfo() {
  147. return new Promise((resolve, reject) => {
  148. uni.login({
  149. success: async (res) => {
  150. const code = res.code;
  151. try {
  152. const { data: res = {} } = await $postJSON(
  153. $api.login_loginCode,
  154. {
  155. code,
  156. },
  157. {},
  158. false
  159. );
  160. console.log("res => ", res);
  161. if (res && res.errno == 0) {
  162. resolve(res.rst);
  163. } else {
  164. uni.showToast({ title: res.err, icon: "none" });
  165. reject(res.err);
  166. }
  167. } catch (error) {
  168. reject(error);
  169. console.log("error => ", error);
  170. }
  171. },
  172. });
  173. });
  174. },
  175. // 清空用户登录信息缓存
  176. handleClearUserInfo() {
  177. const USER_INFO_KEYS = [
  178. "token",
  179. "user_id",
  180. "userInfo",
  181. "nickname",
  182. "sex",
  183. "default_invite_code",
  184. "openid",
  185. "session_key",
  186. "unionid",
  187. ];
  188. USER_INFO_KEYS.forEach((key) => {
  189. uni.removeStorageSync(key);
  190. });
  191. },
  192. },
  193. };
  194. </script>
  195. <style lang="scss">
  196. @import "uview-ui/index.scss";
  197. @import "./static/style/commom.scss";
  198. /*每个页面公共css */
  199. // 去除u-navbar自定义导航栏下方分割线/底部下划线
  200. .u-border-bottom:after {
  201. border: none !important;
  202. }
  203. //统一背景颜色
  204. page {
  205. background: #f5f5f5;
  206. }
  207. button::after {
  208. border: none;
  209. }
  210. button {
  211. position: relative;
  212. display: block;
  213. margin-left: auto;
  214. margin-right: auto;
  215. padding-left: 0px;
  216. padding-right: 0px;
  217. box-sizing: border-box;
  218. text-align: center;
  219. text-decoration: none;
  220. -webkit-tap-highlight-color: transparent;
  221. overflow: hidden;
  222. color: #000;
  223. background-color: #fff;
  224. }
  225. </style>