简柏林 / thingskit-app · Commits

Commit 5a10304e39140d359700dd06e521766b4a4fca8c

Authored by 黄 x
0 parents

Initial commit

Inline Side-by-side
Showing 6 changed files with 424 additions and 0 deletions

Too many changes to show.
Reload with full diff Plain diff Email patch

To preserve performance only 6 of 668 files are displayed.

  1 +{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
  2 + // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
  3 + "version": "0.0",
  4 + "configurations": [{
  5 + "app-plus" :
  6 + {
  7 + "launchtype" : "local"
  8 + },
  9 + "default" :
  10 + {
  11 + "launchtype" : "local"
  12 + },
  13 + "mp-weixin" :
  14 + {
  15 + "launchtype" : "local"
  16 + },
  17 + "type" : "uniCloud"
  18 + }
  19 + ]
  20 +}
... ...
  1 +<script>
  2 + import base from "@/config/baseUrl";
  3 + import store from "@/store";
  4 + // #ifdef APP-PLUS
  5 + import APPUpdate from '@/uni_modules/zhouWei-APPUpdate/js_sdk/appUpdate';
  6 + // #endif
  7 +
  8 + import { mpUpData,scene } from '@/config/common';
  9 + export default {
  10 + onLaunch(e) {
  11 + //取出缓存数据
  12 + store.commit('setCacheData');
  13 + //获取二维码信息
  14 + scene(e)
  15 + // #ifdef APP-PLUS
  16 + APPUpdate() //检测app更新
  17 + // #endif
  18 + },
  19 + onShow(e) {
  20 + // #ifdef MP
  21 + mpUpData() //检测小程序更新
  22 + // #endif
  23 + },
  24 + onHide() {
  25 + console.log('App Hide')
  26 + }
  27 + }
  28 +</script>
  29 +
  30 +<style lang="scss">
  31 +/* #ifndef APP-NVUE */
  32 +@import "@/uni_modules/uview-ui/index.scss";
  33 +@import './style/iconfont.scss';
  34 +@import "./style/common.scss";
  35 +page {
  36 + background-color: #f5f5f5;
  37 +}
  38 +// 隐藏滚动条
  39 +::-webkit-scrollbar {
  40 + width: 0;
  41 + height: 0;
  42 + color: transparent;
  43 +}
  44 +/* #endif */
  45 +</style>
... ...
  1 +## ThingsKit物联网小程序、app
  2 +
  3 +### 项目结构
  4 +
  5 +```
  6 +├── components // 组件
  7 +├── config
  8 +│   ├── baseUrl.js // 基础配置(域名、系统信息等)
  9 +│   ├── common.js // 通用js(小程序更新、app缓存、扫码、定位等)
  10 +│   ├── componentConfig.js // app升级配置接口
  11 +│   ├── h5Utils.js // h5通用js(包含h5公众号登录等)
  12 +│   ├── login.js // 登录js
  13 +│   ├── pay.js // 支付js
  14 +│   └── request.js // 接口配置(基于uview配置)
  15 +├── pages // 项目页面
  16 +│   ├── goods // 商品列表
  17 +│   ├── index // 首页
  18 +│   ├── personal // 个人中心
  19 +│   └── device // 设备
  20 +├── plugins // 功能js
  21 +├── static // 图片文件
  22 +├── store // vuex
  23 +├── style
  24 +│ ├── common.scss // 公共样式文件
  25 +│ └── iconfont.scss // 图标样式
  26 +├── uni_modules
  27 +│ ├── fan-canvas // 绘图通用方法
  28 +│ ├── mescroll-uni // mescroll分页
  29 +│ ├── uview-ui // uview2.0
  30 +│ └── zhouWei-APPUpdate // app更新升级(wgt)
  31 +├── unpackage // 项目编译后的文件
  32 +├── App.vue // 项目基础文件
  33 +├── main.js // 项目基础文件
  34 +├── manifest.json // 项目基础文件
  35 +├── uni.scss // 项目基础文件
  36 +├── pages.json // 项目基础文件json
  37 +├── README.md // 项目介绍md
  38 +└── template.h5.html // h5自定义模板
  39 +```
... ...
  1 +<template>
  2 + <view class="mask mask-show u_loading" v-if="loadingShow" @touchmove.stop.prevent="preventTouchMove">
  3 + <!-- 加载动画开始 -->
  4 + <view class="preloader">
  5 + <view class="loader">
  6 + <view></view>
  7 + <view></view>
  8 + <view></view>
  9 + <view></view>
  10 + <view></view>
  11 + </view>
  12 + </view>
  13 + <!-- 加载动画结束 -->
  14 + <view class="title">加载中...</view>
  15 + </view>
  16 +</template>
  17 +
  18 +<script scoped="true">
  19 +import { mapState, mapMutations } from 'vuex';
  20 +export default {
  21 + computed: {
  22 + ...mapState(['loadingShow'])
  23 + },
  24 + methods:{
  25 + preventTouchMove(){
  26 + console.log('stop user scroll it!');
  27 + return;
  28 + }
  29 + }
  30 +};
  31 +</script>
  32 +
  33 +<style lang="scss" scoped>
  34 +.u_loading{
  35 + &.mask {
  36 + /* pointer-events: none; */
  37 + position: fixed;
  38 + z-index: 99999;
  39 + top: 0;
  40 + left: 0;
  41 + right: 0;
  42 + bottom: 0;
  43 + height: 100vh;
  44 + width: 100vw;
  45 + /* #ifndef APP-NVUE */
  46 + display: flex;
  47 + /* #endif */
  48 + flex-direction: column;
  49 + justify-content: center;
  50 + align-items: center;
  51 + flex-wrap: wrap;
  52 + }
  53 + &.mask-show {
  54 + background: rgba(255,255,255, 0.3);
  55 + }
  56 + .title {
  57 + color: #666;
  58 + font-size: 28rpx;
  59 + margin-top: 40rpx;
  60 + }
  61 + .loader {
  62 + width: 45px;
  63 + position: relative;
  64 + }
  65 + .loader view {
  66 + display: block;
  67 + position: absolute;
  68 + bottom: 0px;
  69 + width: 7px;
  70 + height: 5px;
  71 + background: coral;
  72 + -webkit-animation: loader 1.5s infinite ease-in-out;
  73 + animation: loader 1.5s infinite ease-in-out;
  74 + }
  75 + .loader view:nth-child(2) {
  76 + left: 11px;
  77 + -webkit-animation-delay: 0.2s;
  78 + animation-delay: 0.2s;
  79 + }
  80 + .loader view:nth-child(3) {
  81 + left: 22px;
  82 + -webkit-animation-delay: 0.4s;
  83 + animation-delay: 0.4s;
  84 + }
  85 + .loader view:nth-child(4) {
  86 + left: 33px;
  87 + -webkit-animation-delay: 0.6s;
  88 + animation-delay: 0.6s;
  89 + }
  90 + .loader view:nth-child(5) {
  91 + left: 44px;
  92 + -webkit-animation-delay: 0.8s;
  93 + animation-delay: 0.8s;
  94 + }
  95 +
  96 + @-webkit-keyframes loader {
  97 + 0% {
  98 + height: 5px;
  99 + -webkit-transform: translateY(0px);
  100 + transform: translateY(0px);
  101 + background: coral;
  102 + }
  103 + 25% {
  104 + height: 30px;
  105 + -webkit-transform: translateY(15px);
  106 + transform: translateY(15px);
  107 + background: cornflowerblue;
  108 + }
  109 + 50% {
  110 + height: 5px;
  111 + -webkit-transform: translateY(0px);
  112 + transform: translateY(0px);
  113 + background: cornflowerblue;
  114 + }
  115 + 100% {
  116 + height: 5px;
  117 + -webkit-transform: translateY(0px);
  118 + transform: translateY(0px);
  119 + background: coral;
  120 + }
  121 + }
  122 +
  123 + @keyframes loader {
  124 + 0% {
  125 + height: 5px;
  126 + -webkit-transform: translateY(0px);
  127 + transform: translateY(0px);
  128 + background: coral;
  129 + }
  130 + 25% {
  131 + height: 30px;
  132 + -webkit-transform: translateY(15px);
  133 + transform: translateY(15px);
  134 + background: cornflowerblue;
  135 + }
  136 + 50% {
  137 + height: 5px;
  138 + -webkit-transform: translateY(0px);
  139 + transform: translateY(0px);
  140 + background: cornflowerblue;
  141 + }
  142 + 100% {
  143 + height: 5px;
  144 + -webkit-transform: translateY(0px);
  145 + transform: translateY(0px);
  146 + background: coral;
  147 + }
  148 + }
  149 +
  150 +}
  151 +
  152 +</style>
... ...
  1 +<template>
  2 + <view>
  3 + <!-- 加载动画组件 -->
  4 + <f-loading></f-loading>
  5 + <!-- 登录弹窗组件 -->
  6 + <f-login></f-login>
  7 + </view>
  8 +</template>
  9 +
  10 +<script>
  11 + import { mapState, mapMutations } from 'vuex';
  12 + import fLoading from "@/components/common/loading"
  13 + import fLogin from "@/components/module/f-login/f-login.vue"
  14 + export default {
  15 + components:{
  16 + fLoading,
  17 + fLogin
  18 + },
  19 + data() {
  20 + return {}
  21 + },
  22 + methods:{
  23 +
  24 + }
  25 + };
  26 +</script>
  27 +<style>
  28 +
  29 +</style>
... ...
  1 +<template>
  2 + <view>
  3 + <!-- #ifdef MP-WEIXIN -->
  4 + <view class="adContent">
  5 + <block v-for="(item,index) in typeArr" :key="index">
  6 + <block v-if="item===1">
  7 + <!-- banner广告 -->
  8 + <ad unit-id="adunit-ecdb31747eeb025d" ad-intervals="30"></ad>
  9 + </block>
  10 + <block v-if="item===2">
  11 + <!-- 视频广告 -->
  12 + <ad unit-id="adunit-3e70c6aaf0d18a5c" ad-type="video" ad-theme="white"></ad>
  13 + </block>
  14 + <block v-if="item===3">
  15 + <!-- 原生模板广告 -->
  16 + <ad-custom unit-id="adunit-ce4c3aa5a5a8aea3"></ad-custom>
  17 + </block>
  18 + </block>
  19 + </view>
  20 + <!-- #endif -->
  21 + </view>
  22 +</template>
  23 +
  24 +<script>
  25 +import { mapState, mapMutations } from 'vuex';
  26 +let rewardedVideoAd = null // 定义激励视频广告
  27 +let insertScreenVideoAd = null // 定义插屏视频广告
  28 +export default {
  29 + props:{
  30 + //1.banner广告 2.视频广告 3.原生模板广告 4.插屏视频广告 5.激励视频广告
  31 + typeArray:{
  32 + type: Array,
  33 + default: function() {
  34 + return [];
  35 + },
  36 + }
  37 + },
  38 + data() {
  39 + return {
  40 + _isExcitationLoaded:false, //激励广告是否加载好
  41 + _isInsertScreenLoaded:false,//插屏广告是否加载好
  42 + typeArr:[1]
  43 + };
  44 + },
  45 + created() {
  46 + // #ifdef MP-WEIXIN
  47 + this.typeArr = this.typeArray
  48 + this.typeArr.forEach(item=>{
  49 + if(item===5){
  50 + this.excitationAd('adunit-fb0093bcd1f2f790') //激励
  51 + }else if(item===4){
  52 + this.insertScreenAd('adunit-9d97cc3babda47e5') //插屏
  53 + }
  54 + })
  55 + // #endif
  56 + },
  57 + mounted(e) {
  58 +
  59 + },
  60 + //方法
  61 + methods: {
  62 + // 激励广告
  63 + excitationAd(adUnitId){
  64 + this._isExcitationLoaded = false
  65 + // 在页面onLoad回调事件中创建激励视频广告实例
  66 + if (uni.createRewardedVideoAd) {
  67 + rewardedVideoAd = uni.createRewardedVideoAd({
  68 + adUnitId: adUnitId
  69 + })
  70 + rewardedVideoAd.onLoad(() => {
  71 + this._isExcitationLoaded = true
  72 + })
  73 + rewardedVideoAd.onError((err) => {})
  74 + rewardedVideoAd.onClose((res) => {
  75 + // 用户点击了【关闭广告】按钮
  76 + if (res && res.isEnded) {
  77 + // 正常播放结束，可以下发游戏奖励
  78 + this.$emit('excitationAdCallback',1)
  79 + } else {
  80 + // 播放中途退出，不下发游戏奖励
  81 + this.$emit('excitationAdCallback',2)
  82 + }
  83 + })
  84 + }
  85 + },
  86 + // 显示激励广告
  87 + showExcitationAd(){
  88 + if (this._isExcitationLoaded) {
  89 + rewardedVideoAd.show().catch(() => {
  90 + // 失败重试
  91 + rewardedVideoAd.load()
  92 + .then(() => rewardedVideoAd.show())
  93 + .catch(err => {
  94 + console.log('激励视频 广告显示失败')
  95 + })
  96 + })
  97 + }
  98 + },
  99 + // 插屏广告
  100 + insertScreenAd(adUnitId){
  101 + this._isInsertScreenLoaded = false
  102 + // 在页面onLoad回调事件中创建激励视频广告实例
  103 + if (uni.createInterstitialAd) {
  104 + insertScreenVideoAd = uni.createInterstitialAd({
  105 + adUnitId: adUnitId
  106 + })
  107 + insertScreenVideoAd.onLoad(() => {
  108 + this._isInsertScreenLoaded = true
  109 + console.log('插屏广告加载完')
  110 + this.showInsertScreenAd()
  111 + })
  112 + insertScreenVideoAd.onError((err) => {
  113 + console.log(err,'插屏广告拉取失败')
  114 + })
  115 + insertScreenVideoAd.onClose((res) => {
  116 + console.log('插屏广告关闭')
  117 + })
  118 + }
  119 + },
  120 + // 显示插屏广告
  121 + showInsertScreenAd(){
  122 + console.log('显示插屏广告')
  123 + if (this._isInsertScreenLoaded) {
  124 + insertScreenVideoAd.show().catch((err) => {
  125 + console.error(err,'插屏广告显示失败')
  126 + })
  127 + }
  128 + }
  129 +
  130 +
  131 +
  132 + }
  133 +};
  134 +</script>
  135 +<style lang="scss" scoped>
  136 +.adContent{
  137 + width: 100%;
  138 +}
  139 +</style>
... ...