邃芒智像(Uniapp : WX、TT、H5)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

157 lines
3.8 KiB

  1. <template>
  2. <view class="page">
  3. <image class="bgImg" src="../../assets/img/homeImg.png" mode="aspectFit" />
  4. <!-- 视频,已废弃 -->
  5. <view v-show="false" class="videoBox">
  6. <!-- <video
  7. src="https://video.metavatar.cc/sv/d51a6f6-187fa2dff79/d51a6f6-187fa2dff79.mp4"
  8. autoplay
  9. muted
  10. loop
  11. :controls="false"
  12. /> -->
  13. <!-- <video
  14. src="https://wenlian.wenzhou.gov.cn//upload/video/2021-01-14%E3%80%8A%E7%93%AF%E8%B6%8A%E4%B9%8B%E5%8D%8E%E3%80%8B%E6%B8%A0%E5%B7%9D%EF%BC%9A%E8%B5%B0%E7%AC%94%E5%86%99%E4%BA%BA%E7%94%9F.mp4"
  15. autoplay
  16. loop
  17. :controls="false"
  18. /> -->
  19. </view>
  20. <view class="bottomBox">
  21. <view class="bottomBtn" @click="toCreate"> 开始制作我的数字分身 </view>
  22. <u-checkbox-group v-model="checkboxValue1" placement="row">
  23. <u-checkbox
  24. labelColor="white"
  25. activeColor="red"
  26. v-for="(item, index) in checkboxList1"
  27. :key="index"
  28. :label="item.name"
  29. :name="item.name"
  30. >
  31. </u-checkbox>
  32. </u-checkbox-group>
  33. </view>
  34. </view>
  35. </template>
  36. <script setup>
  37. //#region 导入
  38. import { ref, reactive } from "vue";
  39. import { voiceTotalApi, loginPhoneApi } from "../../api/login.js";
  40. import { userInfoModules } from "@/store/modules/userInfo";
  41. //#endregion
  42. const userInfoModulesPinia = userInfoModules();
  43. //#region 勾选
  44. const checkboxValue1 = ref([]);
  45. const checkboxList1 = ref([
  46. {
  47. name: "同意智像相机用户使用协议",
  48. disabled: false,
  49. },
  50. ]);
  51. async function toCreate() {
  52. if (checkboxValue1.value[0]) {
  53. await handleLogin();
  54. } else {
  55. uni.showModal({
  56. title: "提示",
  57. content: "同意慧图相机用户使用协议?",
  58. success: function (res) {
  59. if (res.confirm) {
  60. checkboxList1.value[0].disabled = true;
  61. handleLogin();
  62. } else if (res.cancel) {
  63. }
  64. },
  65. });
  66. }
  67. }
  68. const userInfo = ref(null);
  69. async function handleLogin() {
  70. // uni.getUserInfo({});
  71. uni.getUserProfile({
  72. desc: "用于完善用户信息",
  73. success: async (res1) => {
  74. userInfo.value = res1.userInfo;
  75. userInfoModulesPinia.userInfo = res1.userInfo;
  76. console.log(userInfoModulesPinia.openId, "拿出openid");
  77. const data = {
  78. appId: "wx75cf14e3a0d45821",
  79. openId: userInfoModulesPinia.openId,
  80. encryptedData: res1.encryptedData,
  81. iv: res1.iv,
  82. };
  83. try {
  84. const res2 = await loginPhoneApi(data);
  85. uni.showToast({
  86. icon: "none",
  87. title: "获取成功",
  88. });
  89. } catch (error) {
  90. uni.showToast({
  91. icon: "none",
  92. title: "获取失败",
  93. });
  94. }
  95. },
  96. fail: (err) => {
  97. console.log(err);
  98. uni.showToast({
  99. icon: "none",
  100. title: "用户拒绝获取",
  101. });
  102. },
  103. });
  104. }
  105. //#endregion ---------------------
  106. voiceTotalApi();
  107. </script>
  108. <style lang="scss">
  109. .page {
  110. position: relative;
  111. padding: 0;
  112. min-height: 100vh;
  113. }
  114. .bgImg {
  115. width: 750rpx;
  116. height: 100vh;
  117. }
  118. .videoBox {
  119. width: 750rpx;
  120. height: 1120rpx;
  121. // aspect-ratio: 9/12;
  122. video {
  123. width: 100%;
  124. height: 100%;
  125. // aspect-ratio: 9/12;
  126. }
  127. }
  128. .bottomBox {
  129. position: absolute;
  130. bottom: 0;
  131. width: 100%;
  132. height: 345rpx;
  133. display: flex;
  134. flex-direction: column;
  135. align-items: center;
  136. background-color: rgba(0, 0, 0, 0.8);
  137. color: #fff !important;
  138. .bottomBtn {
  139. margin-top: 55rpx;
  140. margin-bottom: 65rpx;
  141. width: 520rpx;
  142. height: 100rpx;
  143. border-radius: 50rpx;
  144. line-height: 100rpx;
  145. text-align: center;
  146. background-color: rgba(255, 79, 0, 1);
  147. font-size: 30rpx;
  148. font-weight: 900;
  149. }
  150. }
  151. </style>