feat: add pugins

Author: w-xuefeng

src/components/BottomNav.vue

@@ -0,0 +1,26 @@
+<template>
+  <div class="bottomNav">
+    13245879
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BottomNav',
+  props: {
+    title: String
+  }
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+.bottomNav {
+  height: 60px;
+  width: 100%;
+  padding-bottom: 20px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+</style>

src/components/ComHeader.vue

@@ -0,0 +1,33 @@
+<template>
+  <div class="headre">
+    <span>{{ title }}</span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ComHeader',
+  props: {
+    title: String
+  }
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+.headre {
+  height: 50px;
+  width: 100%;
+  padding-top: 30px;
+  color: #ffffff;
+  font-size: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-image: linear-gradient(
+    45deg,
+    rgb(108, 189, 255) 0%,
+    rgb(7, 87, 179) 100%
+  );
+}
+</style>

src/components/HelloWorld.vue

@@ -0,0 +1,3 @@
+export default {
+  
+}

src/config/ui.js

@@ -1,6 +1,8 @@
 import App from './app';
 import Vue from 'vue';
+import apicloud from '@/utils/common';
 
+Vue.use(apicloud);
 Vue.config.productionTip = false;
 
 new Vue({

src/main.js

@@ -1,13 +1,26 @@
 <template>
-  <div class="index">{{ title }}</div>
+  <div class="index">
+    <com-header :title="title" />
+    <button
+      style="height:100px; width: 100%; background: deepskyblue"
+      @click="$openPage({ name: 'login', url: 'loginindex.html' })"
+    >
+      123456
+    </button>
+  </div>
 </template>
 
 <script>
+import ComHeader from '@/components/ComHeader';
+
 export default {
   name: 'index',
+  components: {
+    ComHeader
+  },
   data() {
     return {
-      title: 'lalala'
+      title: '首页'
     };
   },
   mounted() {}
@@ -16,8 +29,6 @@ export default {
 
 <style lang="scss" scoped>
 .index {
-  width: 100px;
-  color: #000;
-  background: dodgerblue;
+  width: 100%;
 }
 </style>

src/pages/index/index.vue

@@ -0,0 +1,26 @@
+export class APICloud {
+  $isMobile = typeof api !== 'undefined';
+
+  openWin(params) {
+    console.log(typeof api);
+    if (this.$isMobile) {
+      window.api.openWin(params);
+    } else {
+      location.href = params.url;
+    }
+  }
+
+  install = Vue => {
+    if (this.$isMobile) {
+      Vue.prototype.$api = window.api;
+    }
+    Vue.prototype.$isMobile = this.$isMobile;
+    Vue.prototype.$openPage = this.openWin;
+    Vue.mixin({
+      created: function() {}
+    });
+  };
+}
+
+const apicloud = new APICloud();
+export default apicloud;