Merge branch 'nuxt' of http://192.168.32.253:3000/Software/android-cloud-H5 into nuxt

.eslintrc.js

@@ -14,6 +14,7 @@ module.exports = {
   rules: {
     'no-var': ['warn'],
     'no-unused-vars': ['warn'],
+    'vue/multi-word-component-names': ['off'],
   },
   ignorePatterns: ['node_modules/', 'static/'],
 };

assets/style/main.scss

@@ -1,3 +1,7 @@
 html {
   font-size: 16px;
+  // box-sizing: border-box;
+  // * {
+  //   box-sizing: inherit;
+  // }
 }

layouts/empty.vue

@@ -1,7 +1,9 @@
 <template>
-  <div class="empty-layout">
-    <Nuxt />
-  </div>
+  <v-app ref="app" class="empty-layout">
+    <v-main ref="main">
+      <Nuxt />
+    </v-main>
+  </v-app>
 </template>
 
 <script>
@@ -10,5 +12,11 @@ export default {
   data() {
     return {};
   },
+  created() {},
+  mounted() {
+    // this.$nuxt.$vuetifyApp = this.$refs.app;
+    this.$vuetify.app = this.$refs.app;
+    this.$vuetify.main = this.$refs.main;
+  },
 };
 </script>

nuxt.config.js

@@ -1,5 +1,5 @@
 // import colors from 'vuetify/es5/util/colors'
-// import zhHans from 'vuetify/lib/locale/zh-Hans';
+import zhHans from 'vuetify/lib/locale/zh-Hans';
 import dotenv from 'dotenv';
 // dotenv.config({
 //   path: `.env`,
@@ -60,7 +60,7 @@ export default {
 
   // Global CSS: https://go.nuxtjs.dev/config-css
   css: [
-    'normalize.css',
+    // 'normalize.css',
     '@mdi/font/css/materialdesignicons.css',
     '~/assets/style/main.scss',
     // 'vant/lib/index.css'
@@ -72,6 +72,7 @@ export default {
     // '~/plugins/api',
     '~/plugins/file-upload',
     // '~/plugins/message',
+    '~/plugins/toast',
     '~/plugins/error-captured',
     '~/plugins/user-agent',
     '~/plugins/native',
@@ -103,11 +104,12 @@ export default {
     // https://go.nuxtjs.dev/stylelint
     '@nuxtjs/stylelint-module',
     // '~/modules/unplugin-vue-components'
-    '@aceforth/nuxt-optimized-images',
+    // '@aceforth/nuxt-optimized-images',
     '~/modules/postcss-px-to-viewport',
-    '~/modules/vant',
+    // '~/modules/vant',
     // https://go.nuxtjs.dev/vuetify
-    // '@nuxtjs/vuetify',
+    '@nuxtjs/vuetify',
+    '@unocss/nuxt',
     // '@nuxtjs/composition-api/module',
   ],
 
@@ -116,7 +118,6 @@ export default {
     // https://go.nuxtjs.dev/axios
     '@nuxtjs/axios',
     '@nuxtjs/auth-next',
-    '@unocss/nuxt',
   ],
   unocss: {
     uno: true,
@@ -179,31 +180,32 @@ export default {
       //   // autoFetch: true
       // },
     },
+    cookie: false,
   },
 
   // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify
-  // vuetify: {
-  //   defaultAssets: false,
-  //   customVariables: ['~/assets/variables.scss'],
-  //   lang: {
-  //     locales: { zhHans },
-  //     current: 'zhHans',
-  //   },
-  //   theme: {
-  //     dark: false,
-  //     // themes: {
-  //     //   dark: {
-  //     //     primary: colors.blue.darken2,
-  //     //     accent: colors.grey.darken3,
-  //     //     secondary: colors.amber.darken3,
-  //     //     info: colors.teal.lighten1,
-  //     //     warning: colors.amber.base,
-  //     //     error: colors.deepOrange.accent4,
-  //     //     success: colors.green.accent3,
-  //     //   },
-  //     // },
-  //   },
-  // },
+  vuetify: {
+    defaultAssets: false,
+    customVariables: ['~/assets/style/variables.scss'],
+    lang: {
+      locales: { zhHans },
+      current: 'zhHans',
+    },
+    theme: {
+      dark: false,
+      // themes: {
+      //   dark: {
+      //     primary: colors.blue.darken2,
+      //     accent: colors.grey.darken3,
+      //     secondary: colors.amber.darken3,
+      //     info: colors.teal.lighten1,
+      //     warning: colors.amber.base,
+      //     error: colors.deepOrange.accent4,
+      //     success: colors.green.accent3,
+      //   },
+      // },
+    },
+  },
 
   // Build Configuration: https://go.nuxtjs.dev/config-build
   build: {
@@ -223,6 +225,13 @@ export default {
     postcss: {
       plugins: {},
     },
+    loaders: {
+      vue: {
+        transformAssetUrls: {
+          'v-img': 'src',
+        },
+      },
+    },
   },
   router: {
     base: '/h5/',

package.json

@@ -24,6 +24,8 @@
     "@nuxtjs/auth-next": "5.0.0-1648802546.c9880dc",
     "@nuxtjs/axios": "^5.13.6",
     "axios": "^0.27.2",
+    "clipboard": "^2.0.11",
+    "clipboardy": "^3.0.0",
     "core-js": "^3.19.3",
     "dayjs": "^1.11.3",
     "format-number": "^3.0.0",
@@ -41,7 +43,6 @@
     "webpack": "^4.46.0"
   },
   "devDependencies": {
-    "@aceforth/nuxt-optimized-images": "^1.4.0",
     "@babel/eslint-parser": "^7.16.3",
     "@commitlint/cli": "^15.0.0",
     "@commitlint/config-conventional": "^15.0.0",
@@ -58,19 +59,12 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-nuxt": "^3.1.0",
     "eslint-plugin-vue": "^8.2.0",
-    "imagemin-gifsicle": "^7.0.0",
-    "imagemin-mozjpeg": "^9.0.0",
-    "imagemin-pngquant": "^9.0.2",
-    "imagemin-svgo": "^8.0.0",
     "less": "^4.1.3",
     "less-loader": "^7.3.0",
     "lqip-loader": "^2.2.1",
     "postcss-html": "^1.3.0",
     "postcss-px-to-viewport": "^1.1.1",
     "prettier": "^2.5.1",
-    "responsive-loader": "^2.3.0",
-    "sharp": "^0.30.6",
-    "sqip-loader": "^1.0.0",
     "stylelint": "^14.1.0",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-recommended-vue": "^1.1.0",

pages/activity/invite-user.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="invite-user">
+  <v-container class="invite-user pa-0" fluid>
     <div class="box box1">
-      <div class="box-title">参与步骤</div>
-      <div class="box-content">
-        <van-image
+      <div class="box-header">参与步骤</div>
+      <div class="box-main">
+        <v-img
           class="cybz-content"
           src="~/assets/image/activity/invite-user/cybz-content@2x.png"
         />
@@ -12,13 +12,14 @@
           <div class="cybz-content-text-item">邀请购买云机</div>
           <div class="cybz-content-text-item">返星币换现金</div>
         </div>
-        <van-button class="share-button" round @click="share()"></van-button>
+        <v-btn class="share-button" rounded @click="share()"></v-btn>
+        <!-- <button @click="share()">邀请</button> -->
       </div>
       <!-- <div class="h-40">13</div> -->
     </div>
     <div class="box box2">
-      <div class="box-title">收益明细</div>
-      <div class="box-content">
+      <div class="box-header">收益明细</div>
+      <div class="box-main">
         <div class="grid grid-cols-2 gap-x-4 gap-y-8">
           <div
             v-for="(item, index) in dataList"
@@ -38,12 +39,12 @@
       </div>
     </div>
     <!-- <div class="box box3">
-      <div class="box-title">返利套餐</div>
-      <div class="box-content"></div>
+      <div class="box-header">返利套餐</div>
+      <div class="box-main"></div>
     </div> -->
     <div class="box box4">
-      <div class="box-title">活动规则</div>
-      <div class="box-content text-sm">
+      <div class="box-header">活动规则</div>
+      <div class="box-main text-sm">
         <p>1、传播过程中有任何疑问，可直接咨询客服</p>
         <p>
           2、用户可以通过分享页面或者套餐给想要分享的人，被分享人购买云机套餐后，分享人可获得套餐对应的星币
@@ -75,12 +76,14 @@
 
     <div class="ccc">{{ 36666666.123456 | formatNumber }}</div>
     <div class="ccc">{{ '2020-01-01' | formatDate }}</div> -->
-  </div>
+  </v-container>
 </template>
 
 <script>
 import qs from 'qs';
+import clipboard from 'clipboardy/browser';
 import { getStarCoinOverview } from '~/api/activity/invite-user.js';
+
 export default {
   // auth: false,
   name: 'InviteUser',
@@ -132,17 +135,44 @@ export default {
   },
   mounted() {},
   methods: {
-    share() {
+    async share() {
+      console.log(this);
       this.$tongji.trackEvent('活动', '分享', '', 0);
-      this.$native.share({
-        title: '标题',
-        content: '内容',
-        gotoUrl: `${location.origin}${location.pathname}${qs.stringify(
-          { id: 666 },
-          { addQueryPrefix: true },
-        )}`,
-        shareImg: 'http://localhost',
-      });
+
+      const url =
+        location.origin +
+        this.$router.resolve({
+          path: '/register-for-invite',
+          query: {
+            invitationUserName: this.$auth.user?.phone,
+            activityId: 1,
+          },
+        }).href;
+
+      if (this.$userAgent.isMiniProgram) {
+        // 小程序环境
+        await clipboard.write(url);
+        this.$toast.success('链接复制成功');
+      } else if (this.$userAgent.isApp) {
+        // app环境
+        this.$native.share({
+          title: '双子星APP',
+          content: '分享好友购买云机套餐,返星币换现金',
+          gotoUrl: `${location.origin}${location.pathname}${qs.stringify(
+            { id: 666 },
+            { addQueryPrefix: true },
+          )}`,
+          shareImg: url,
+        });
+      } else {
+        // 浏览器环境
+        // await clipboard.write(url);
+        throw new Error('1231');
+        // this.$toast.success('链接复制成功');
+      }
+    },
+    share2() {
+      throw new Error('1231');
     },
   },
 };
@@ -173,7 +203,7 @@ export default {
   + .box {
     margin-top: 30px;
   }
-  .box-title {
+  .box-header {
     position: absolute;
     top: -30px;
     // left: 141px;
@@ -183,13 +213,13 @@ export default {
     padding: 0 130px;
     color: #fff;
   }
-  .box-content {
+  .box-main {
     padding: 30px 15px 20px;
   }
 }
 .box1 {
   margin-top: 275px;
-  .box-content {
+  .box-main {
     // padding: 30px 15px 20px;
     padding-left: 0;
     padding-right: 0;
@@ -237,13 +267,13 @@ export default {
     color: #ff6600;
     // font-size: 24px;
   }
-  .box-content {
+  .box-main {
     padding-left: 20px;
     padding-right: 20px;
   }
 }
 .box4 {
-  .box-content {
+  .box-main {
     // padding-left: 20px;
     padding-top: 0;
   }

pages/register-for-invite.vue

@@ -16,6 +16,7 @@
 import { registerForInvite } from '~/api/user/client.js';
 import { sendSmsCode } from '~/api/message/phone.js';
 export default {
+  auth: false,
   name: 'RegisterForInvite',
   data() {
     return {

plugins/axios.js

@@ -2,7 +2,9 @@ import AxiosError from 'axios/lib/core/AxiosError';
 
 export default function ({ $axios, redirect }) {
   // $axios.defaults.dataKey = 'data';
+
   $axios.onRequest((config) => {
+    config.headers.client = 7;
     return config;
   });
   $axios.onResponse((response) => {

plugins/error-captured.js

@@ -1,10 +1,20 @@
+// import Vue from 'vue';
+
 export default function ({ app, $message }) {
   app.errorCaptured = (err, vm, info) => {
     if (process.client) {
       // console.error(err);
       // $message.error({ content: err.message });
-      vm.$toast.fail({ message: err.message, position: 'bottom' });
+      // vm.$toast.fail({ message: err.message, position: 'bottom' });
+      vm.$toast.error({ message: err.message });
       return false;
     }
   };
+
+  // Vue.config.errorHandler = function (err, vm, info) {
+  //   if (process.client) {
+  //     vm.$toast.fail({ message: err.message, position: 'bottom' });
+  //     return false;
+  //   }
+  // };
 }

plugins/native.js

@@ -3,6 +3,9 @@ export default function ({ $userAgent }, i) {
     if ($userAgent.isApp) {
       return;
     }
+    //  else if ($userAgent.isMiniProgram) {
+    //   throw new Error('小程序环境不支持');
+    // }
     throw new Error('非App环境');
   };
 

plugins/toast/index.js

@@ -0,0 +1,40 @@
+import Vue from 'vue';
+import toastOptions from './toast.vue';
+const Toast = Vue.extend(toastOptions);
+export default function (c, i) {
+  const isString = (v) =>
+    Object.prototype.toString.call(v) === '[object String]';
+  const fixOptios = (optios) =>
+    isString(optios)
+      ? {
+          message: optios,
+        }
+      : optios;
+
+  // 插入到app组件下
+  const getParent = () => c?.$vuetify?.app ?? window?.$nuxt;
+
+  const toast = (optios) => {
+    optios = fixOptios(optios);
+
+    return new Toast({
+      parent: getParent(),
+      propsData: {
+        // message: optios.message,
+        // icon: optios.icon,
+        ...optios,
+      },
+    }).$mount();
+  };
+
+  ['error', 'success', 'warning', 'info'].forEach((key) => {
+    toast[key] = (optios) => {
+      optios = fixOptios(optios);
+      return toast({
+        ...optios,
+        icon: '$' + key,
+      });
+    };
+  });
+  i('toast', toast);
+}

plugins/toast/toast.vue

@@ -0,0 +1,57 @@
+<template>
+  <v-snackbar
+    app
+    class="toast"
+    :value.sync="value"
+    color="rgba(0,0,0,.8)"
+    v-bind="attrs"
+    @input="!$event && destroy()"
+  >
+    <v-icon v-if="icon" left>{{ icon }}</v-icon>
+    <span>{{ message }}</span>
+  </v-snackbar>
+</template>
+
+<script>
+export default {
+  name: 'Toast',
+  props: {
+    message: {
+      type: String,
+      default: '',
+    },
+    icon: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      value: false,
+    };
+  },
+  computed: {
+    attrs() {
+      return Object.entries(this.$options.propsData).reduce(
+        (o, [key, value]) => {
+          !Object.hasOwn(this.$props, key) && (o[key] = value);
+          return o;
+        },
+        {},
+      );
+    },
+  },
+  mounted() {
+    this.$parent.$el.append(this.$el);
+    this.value = true;
+  },
+  destroyed() {
+    this.$el.remove();
+  },
+  methods: {
+    destroy() {
+      setTimeout(() => this.$destroy(), 1000);
+    },
+  },
+};
+</script>

static/microserviceUserH5/vcloud/cloudanniversaryActive.html

@@ -34,7 +34,7 @@
 		toastr.options.timeOut = '3000';
 	</script>
 	<script type="text/javascript">
-		var baseUrl = 'http://14.18.190.141:1280'
+		// var baseUrl = 'http://14.18.190.141:1280'
 		let timer, flag = true;
 		var url = window.location.href;
 		url = url.split('/')