main.stml 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. <template>
  2. <safe-area class="page">
  3. <view class="body">
  4. <img id='loading' class="img" src="../../image/loading.gif" />
  5. </view>
  6. </safe-area>
  7. </template>
  8. <script>
  9. export default {
  10. name: 'main',
  11. apiready() {
  12. var that = this;
  13. api.openFrame({
  14. name: 'main',
  15. url: 'https://m.alipearlhair.com',
  16. rect: {
  17. x: 0,
  18. y: 0,
  19. w: 'auto',
  20. h: 'auto'
  21. },
  22. useWKWebView: true,
  23. historyGestureEnabled: true,
  24. bounces: false,
  25. progress:{
  26. type:'page'
  27. }
  28. });
  29. api.setStatusBarStyle({
  30. style: 'light'
  31. });
  32. api.setFrameClient({
  33. frameName:'main'
  34. },function(ret){
  35. that.onBrowserStateChange(ret);
  36. });
  37. this.removeLogic();
  38. api.addEventListener({
  39. name: 'keyback'
  40. }, function(ret, err){
  41. api.historyBack({
  42. frameName:'main'
  43. },function(ret,err){
  44. if(!ret.status){
  45. api.closeWidget();
  46. }
  47. });
  48. });
  49. this.removeLogic();
  50. // this.googlePushInit();
  51. },
  52. data() {
  53. return {
  54. msg: "Hello APICloud",
  55. launchRemoved: false,
  56. loadingRemoved: false,
  57. };
  58. },
  59. methods: {
  60. onBrowserStateChange(ret){
  61. if(0 == ret.state){//开始加载
  62. if(!this.launchRemoved){
  63. this.launchRemoved = true;
  64. this.removeLaunch();
  65. }
  66. }
  67. if(2 == ret.state){
  68. if(!this.loadingRemoved){
  69. this.loadingRemoved = true;
  70. document.getElementById('loading').style.display = 'none';
  71. }
  72. }
  73. },
  74. removeLogic(){
  75. var that = this;
  76. setTimeout(function(){
  77. if(!that.launchRemoved){
  78. that.launchRemoved = true;
  79. that.removeLaunch();
  80. }
  81. }, 3000);
  82. },
  83. removeLaunch(){
  84. // 移除启动图
  85. api.removeLaunchView({
  86. animation:{
  87. type:"fade",
  88. subType:"from_right",
  89. duration:300
  90. }
  91. });
  92. },
  93. /*
  94. // google推送
  95. googlePushInit() {
  96. var googlePush = api.require('googlePush');
  97. // 初始化
  98. googlePush.initFcm(function(ret, err) {
  99. console.log('---initFcm satrt---');
  100. console.log(JSON.stringify(ret));
  101. console.log(JSON.stringify(err));
  102. console.log('---initFcm end---');
  103. // 获取token
  104. googlePush.registerToken(function(ret, err){
  105. console.log('---registerToken satrt---');
  106. console.log(JSON.stringify(ret));
  107. console.log(JSON.stringify(err));
  108. console.log('---registerToken end---');
  109. });
  110. // 收到消息时会触发
  111. googlePush.addOnMessageLisener(function(ret){
  112. console.log('---addOnMessageLisener satrt---');
  113. console.log(JSON.stringify(ret));
  114. console.log('---addOnMessageLisener end---');
  115. });
  116. });
  117. // 监听通知栏消息被点击
  118. api.addEventListener({
  119. name:'appintent'
  120. },function(ret,err){
  121. console.log('---appintent satrt---');
  122. console.log(JSON.stringify(ret));
  123. console.log(JSON.stringify(err));
  124. console.log('---appintent end---');
  125. var appParam = ret.appParam;
  126. if(api.systemType == 'ios'){
  127. var iosUrl = ret.iosUrl;
  128. } else {
  129. var sourceAppId = ret.sourceAppId;
  130. console.log(JSON.stringify(appParam));
  131. if(appParam.url) {
  132. api.openWin({
  133. name: 'WestKiss Sale',
  134. url: appParam.url,
  135. pageParam: {
  136. name: 'test'
  137. }
  138. });
  139. }
  140. }
  141. });
  142. }
  143. */
  144. }
  145. };
  146. </script>
  147. <style>
  148. .page {
  149. width: 100%;
  150. height: 100%;
  151. background: #fff;
  152. display:flex;
  153. justify-content:center;
  154. align-items: center;
  155. }
  156. .body{
  157. position: relative;
  158. }
  159. .img{
  160. display:block;
  161. width: 40px;
  162. height: 40px;
  163. }
  164. </style>