feat:修改bug，增加国际版的开发环境配置

mobile/build/webpack.base.conf.js

@@ -57,7 +57,7 @@ module.exports = {
         options: {
           limit: 10000,
           name: utils.assetsPath('v2/mobile/img/[path][name].[ext]'),
-          publicPath: isProd ? 'https://4dscene.4dage.com/new4dkk/' : ''
+          publicPath: isProd ? process.env.IS_INTERNATIONAL ? 'https://eurs3.4dkankan.com/website/' : 'https://4dscene.4dage.com/new4dkk/' : ''
         }
       },
       {

mobile/build/webpack.dev.conf.en.js

@@ -0,0 +1,101 @@
+'use strict'
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const path = require('path')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const portfinder = require('portfinder')
+
+const HOST = '0.0.0.0'
+const PORT = process.env.PORT && Number(process.env.PORT)
+
+const devWebpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
+  },
+  // cheap-module-eval-source-map is faster for development
+  devtool: config.dev.devtool,
+
+  // these devServer options should be customized in /config/index.js
+  devServer: {
+    clientLogLevel: 'warning',
+    historyApiFallback: {
+      rewrites: [
+        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
+      ],
+    },
+    hot: true,
+    contentBase: false, // since we use CopyWebpackPlugin.
+    compress: true,
+    host: HOST || config.dev.host,
+    port: PORT || config.dev.port,
+    open: config.dev.autoOpenBrowser,
+    overlay: config.dev.errorOverlay
+      ? { warnings: false, errors: true }
+      : false,
+    publicPath: config.dev.assetsPublicPath,
+    proxy: config.dev.proxyTable,
+    quiet: true, // necessary for FriendlyErrorsPlugin
+    watchOptions: {
+      poll: config.dev.poll,
+    },
+    proxy: {
+      '/api': {
+        target: 'https://test.4dkankan.com',
+        changeOrigin: true,
+      }
+    }
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': require('../config/dev.env.en')
+    }),
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
+    new webpack.NoEmitOnErrorsPlugin(),
+    // https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: 'index.html',
+      template: 'index.html',
+      inject: true
+    }),
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.dev.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+
+module.exports = new Promise((resolve, reject) => {
+  portfinder.basePort = process.env.PORT || config.dev.port
+  portfinder.getPort((err, port) => {
+    if (err) {
+      reject(err)
+    } else {
+      // publish the new Port, necessary for e2e tests
+      process.env.PORT = port
+      // add port to devServer config
+      devWebpackConfig.devServer.port = port
+
+      // Add FriendlyErrorsPlugin
+      devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
+        compilationSuccessInfo: {
+          messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
+        },
+        onErrors: config.dev.notifyOnErrors
+        ? utils.createNotifierCallback()
+        : undefined
+      }))
+
+      resolve(devWebpackConfig)
+    }
+  })
+})

mobile/config/dev.env.en.js

@@ -0,0 +1,8 @@
+'use strict'
+const merge = require('webpack-merge')
+const prodEnv = require('./prod.env')
+
+module.exports = merge(prodEnv, {
+  NODE_ENV: '"development"',
+  IS_INTERNATIONAL: '"true"'
+})

mobile/package.json

@@ -6,6 +6,7 @@
   "private": true,
   "scripts": {
     "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
+    "dev:en": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.en.js",
     "start": "npm run dev",
     "unit": "jest --config test/unit/jest.conf.js --coverage",
     "e2e": "node test/e2e/runner.js",
@@ -50,6 +51,7 @@
     "chalk": "^2.0.1",
     "chromedriver": "^2.27.2",
     "copy-webpack-plugin": "^4.0.1",
+    "cross-env": "^7.0.3",
     "cross-spawn": "^5.0.1",
     "css-loader": "^0.28.0",
     "eslint": "^4.15.0",

mobile/src/main.js

@@ -12,7 +12,7 @@ import { i18n } from './lang'
 Vue.use(VueAwesomeSwiper)
 // import axios from './util/http.js'
 // import router from './router'
-Vue.prototype.$cdn = 'https://4dscene.4dage.com/new4dkk/mobile/'
+Vue.prototype.$cdn = process.env.IS_INTERNATIONAL ? 'https://eurs3.4dkankan.com/website/mobile/' : 'https://4dscene.4dage.com/new4dkk/mobile/'
 // Vue.prototype.$cdn = 'https://4dscene.oss-cn-shenzhen.aliyuncs.com/new4dkk/mobile/'
 
 Vue.use(vuex)

mobile/src/pages/account/forget/components/emailForget.vue

@@ -105,9 +105,28 @@ export default {
     },
 
     async getAuthCode () {
+      let check = value => {
+        for (let i = 0, len = value.length; i < len; i++) {
+          if (!value[i].val) {
+            return this.$toast.show('warn', (this.language === 'en' ? value[i].En : value[i].name) + this.langToast['7'])
+          }
+        }
+        return true
+      }
+      let checkStr = [
+        {
+          name: '邮箱地址',
+          En: 'E-Mail',
+          val: this.phone
+        }
+      ]
+      if (!check(checkStr)) {
+        return
+      }
       let res = await this.$store.dispatch('getAuthCode', {
         phone: this.phone,
-        code: Number(this.codeActive[1].substr(1))
+        code: '',
+        qudao: 'email'
       })
       if (res) {
         this.interl && clearInterval(this.interl)

mobile/src/pages/account/forget/index.vue

@@ -28,7 +28,7 @@ export default {
   },
   computed: {
     ...mapState({
-      isInternational: state => state.user.isInternational
+      isInternational: state => state.isInternational
     }),
     forgetComponent () {
       return this.isInternational ? 'emailForget' : 'phoneForget'

mobile/src/pages/account/login/index.vue

@@ -10,7 +10,7 @@
         <!-- <img :src="`${$cdn}images/icon/icon-password@2x.png`" alt=""> -->
         <input v-model="password" @focus="inputActive='password'" @blur="inputActive=''" maxlength='16' type="password" :placeholder="$t('login.passwordPlaceholder')">
       </div>
-      <div class="forget">
+      <div class="forget" v-if="!isInternational">
         <!-- <router-link :to="{path:'/forget'}">{{langLogin.forget}}</router-link> -->
         <span></span>
         <router-link :to="{path:'/codeLogin'}">{{langLogin.codeLogin}}</router-link>
@@ -18,7 +18,7 @@
       <div class="btns" @click="login">{{langLogin.login}}</div>
       <div class="to-register">
         <div class="re-con">
-          <router-link :to="{path:'/forget'}">{{$t('login.forgetPassword')}}</router-link><router-link :to="{path:'/register'}">{{$t('login.registerAccount')}}</router-link>
+          <router-link :to="{path:'/forget'}">{{$t('login.forgetPassword')}}</router-link><router-link :to="{path: isInternational ? '/mailRegister' : '/register'}">{{$t('login.registerAccount')}}</router-link>
         </div>
       </div>
     </div>
@@ -36,7 +36,8 @@ export default {
       token: state => state.user.token,
       langToast: state => state.language.home.toast,
       language: state => state.language.current,
-      langLogin: state => state.language.home.home.loginAside
+      langLogin: state => state.language.home.home.loginAside,
+      isInternational: state => state.isInternational
     })
   },
   data () {

mobile/src/pages/account/mailRegister/index.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="register-layout">
-    <h1 class="common-title">{{ $t('login.registerTitle') }}</h1>
+    <h1 class="common-title">{{ $t('login.kankanAccountRegister') }}</h1>
     <div class="login-con">
       <div class="input-con" :class="{inputActive:inputActive==='phone'}">
-        <input class="guding" oninput="value=value" v-model="phone" @focus="inputActive='phone'" @blur="inputActive=''" type="text" :placeholder="$t('login.accountMailPlaceholder')">
+        <input class="guding" oninput="value=value" v-model="phone" @focus="inputActive='phone'" @blur="inputActive=''" type="text" :placeholder="$t('login.emailPlaceholder')">
       </div>
       <div class="code-con">
         <div class="input-con" :class="{inputActive:inputActive==='code'}">
-          <input v-model="authCode" @focus="inputActive='code'" @blur="inputActive=''" oninput="value=value.replace(/[^\d]/g,'')" maxlength='6' style="padding-left:6px;" type="text" :placeholder="$t('login.mailCodePlaceholder')">
+          <input v-model="authCode" @focus="inputActive='code'" @blur="inputActive=''" oninput="value=value.replace(/[^\d]/g,'')" maxlength='6' style="padding-left:6px;" type="text" :placeholder="langLogin.code.placeholder">
           <div v-if="!jishi" class="send-btn" @click="getAuthCode">{{langLogin.code.txt}}</div>
           <span class="send-btn" v-else>{{language==='en'?`Resend after ${interTime}s`:`${interTime}s后重新发送`}}</span>
         </div>
@@ -18,9 +18,9 @@
       <div class="input-con"  :class="{inputActive:inputActive==='confirm'}">
         <input v-model="confirmPass" @focus="inputActive='confirm'" @blur="inputActive=''" maxlength="16" type="password" :placeholder="langLogin.comfirmpass.placeholder">
       </div>
-      <div class="toMail">
+      <!-- <div class="toMail">
         <router-link to="/register">手机号注册</router-link>
-      </div>
+      </div> -->
       <div class="agree">
         <label class="check-con" @click="isAgree=!isAgree">
           <span class="check-box">
@@ -92,7 +92,8 @@ export default {
       let res = await this.$store.dispatch('getAuthCode', {
         phone: this.phone,
         code: Number(this.codeActive[1].substr(1)),
-        type: 'resigter'
+        type: 'resigter',
+        qudao: 'email'
       })
       if (res) {
         this.interl && clearInterval(this.interl)
@@ -124,13 +125,8 @@ export default {
       }
       let checkStr = [
         {
-          name: '昵称',
-          En: 'User name',
-          val: this.nickname
-        },
-        {
-          name: '手机号码',
-          En: 'Phone number',
+          name: '邮箱地址',
+          En: 'E-Mail',
           val: this.phone
         },
         {
@@ -164,7 +160,7 @@ export default {
         password: temp[0],
         phoneNum: this.phone,
         msgAuthCode: this.authCode,
-        nickName: this.nickname,
+        nickName: this.phone,
         country,
         confirmPwd: temp[1]
       }
@@ -177,9 +173,14 @@ export default {
       if (response.code !== 0) {
         return this.$toast.show('warn', this.langToast[response.code])
       }
-      this.$toast.show('success', this.langToast['23'], () => {
-        this.$router.push({path: '/login'})
-      })
+      let params1 = {
+        phoneNum: params.phoneNum,
+        password: encodeStr(Base64.encode(this.password))
+      }
+      await this.$store.dispatch('login', params1)
+      if (this.token) {
+        this.$router.push({name: 'information'})
+      }
     }
   }
 }

mobile/src/store/index.js

@@ -4,6 +4,9 @@ import ui from './ui'
 import language from './language'
 
 const store = new vuex.Store({
+  state: {
+    isInternational: process.env.IS_INTERNATIONAL
+  },
   modules: {
     user,
     language,

mobile/src/store/language/cn/toast.js

@@ -73,7 +73,7 @@ export default{
   '3005': '验证码已过期',
   '3006': '验证码错误',
   '3007': '昵称已存在',
-  '3008': '该手机已被注册',
+  '3008': '该账号已被注册',
   '3009': '两次输入的密码不一致',
   '3010': '手机号码格式错误',
   '3011': '密码必须包含英文大小写、数字，长度8-16个字符',

mobile/src/store/language/en/toast.js

@@ -72,7 +72,7 @@ export default{
   '3005': 'Verification code expired.',
   '3006': 'Incorrect verification code.',
   '3007': 'User name already exists.',
-  '3008': 'The mobile number is already registered.',
+  '3008': 'The account is already registered.',
   '3009': 'The password you typed don\'t match.',
   '3010': 'Incorrect format of mobile number.',
   '3011': 'Password must contain English case and numbers, 8-16 characters. ',

mobile/src/store/user.js

@@ -39,7 +39,6 @@ try {
 
 export default {
   state: {
-    isInternational: process.env.IS_INTERNATIONAL,
     token: token,
     name: null,
     cart: cart,
@@ -366,8 +365,7 @@ export default {
     async getAuthCode (context, item) {
       let toastCode = localStorage.getItem('language') === 'en' ? toastEN : toastZH
 
-      let {phone, code, type = ''} = item
-      console.log(item)
+      let {phone, code, type = '', qudao} = item
       let areaNum = Number(code) || 86
       if (phone) {
         let resp = await http
@@ -390,6 +388,13 @@ export default {
           phoneNum: phone,
           areaNum
         }
+        if (qudao === 'email') {
+          params = {
+            email: phone
+          }
+          API.getEmailAuthCode(params)
+          return true
+        }
         http({
           method: 'post',
           data: params,

pc/build/webpack.dev.conf.en.js

@@ -0,0 +1,104 @@
+'use strict'
+const utils = require('./utils')
+const webpack = require('webpack')
+const config = require('../config')
+const merge = require('webpack-merge')
+const path = require('path')
+const baseWebpackConfig = require('./webpack.base.conf')
+const CopyWebpackPlugin = require('copy-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const portfinder = require('portfinder')
+const wepackDevServer = require('./wepack.dev.server')
+
+// const HOST = '192.168.0.172'
+const HOST = '0.0.0.0'
+const PORT = process.env.PORT && Number(process.env.PORT)
+
+const devWebpackConfig = merge(baseWebpackConfig, {
+  module: {
+    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
+  },
+  // cheap-module-eval-source-map is faster for development
+  devtool: config.dev.devtool,
+
+  // these devServer options should be customized in /config/index.js
+  devServer: {
+    clientLogLevel: 'warning',
+    historyApiFallback: {
+      rewrites: [
+        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
+      ],
+    },
+    hot: true,
+    contentBase: false, // since we use CopyWebpackPlugin.
+    compress: true,
+    host: HOST || config.dev.host,
+    port: PORT || config.dev.port,
+    open: config.dev.autoOpenBrowser,
+    overlay: config.dev.errorOverlay
+      ? { warnings: false, errors: true }
+      : false,
+    publicPath: config.dev.assetsPublicPath,
+    proxy: config.dev.proxyTable,
+    quiet: true, // necessary for FriendlyErrorsPlugin
+    watchOptions: {
+      poll: config.dev.poll,
+    },
+    proxy: {
+      '/api': {
+        target: 'https://test.4dkankan.com',
+        changeOrigin: true,
+      }
+    },
+    setup: wepackDevServer
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env': require('../config/dev.env.en')
+    }),
+    new webpack.HotModuleReplacementPlugin(),
+    new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
+    new webpack.NoEmitOnErrorsPlugin(),
+    // https://github.com/ampedandwired/html-webpack-plugin
+    new HtmlWebpackPlugin({
+      filename: 'index.html',
+      template: 'index.html',
+      inject: true
+    }),
+    // copy custom static assets
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.dev.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
+  ]
+})
+
+module.exports = new Promise((resolve, reject) => {
+  portfinder.basePort = process.env.PORT || config.dev.port
+  portfinder.getPort((err, port) => {
+    if (err) {
+      reject(err)
+    } else {
+      // publish the new Port, necessary for e2e tests
+      process.env.PORT = port
+      // add port to devServer config
+      devWebpackConfig.devServer.port = port
+
+      // Add FriendlyErrorsPlugin
+      devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
+        compilationSuccessInfo: {
+          messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
+        },
+        onErrors: config.dev.notifyOnErrors
+        ? utils.createNotifierCallback()
+        : undefined
+      }))
+
+      resolve(devWebpackConfig)
+    }
+  })
+})

pc/config/dev.env.en.js

@@ -0,0 +1,8 @@
+'use strict'
+const merge = require('webpack-merge')
+const prodEnv = require('./prod.env')
+
+module.exports = merge(prodEnv, {
+  NODE_ENV: '"development"',
+  IS_INTERNATIONAL: '"true"'
+})

pc/package.json

@@ -6,6 +6,7 @@
   "private": true,
   "scripts": {
     "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
+    "dev:en": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.en.js",
     "start": "npm run dev",
     "unit": "jest --config test/unit/jest.conf.js --coverage",
     "e2e": "node test/e2e/runner.js",

pc/src/page/layout/header/index.vue

@@ -189,7 +189,7 @@ export default {
       info: state => state.user.info,
       deviceLogin: state => state.user.deviceLogin,
       languageList: state => state.language.languageList,
-      isInternational: state => state.user.isInternational,
+      isInternational: state => state.isInternational,
       homeLang: state => state.language.home
     }),
     languageObj () {

pc/src/page/login/components/forget/index.vue

@@ -22,7 +22,7 @@ export default {
   },
   computed: {
     ...mapState({
-      isInternational: state => state.user.isInternational
+      isInternational: state => state.isInternational
     }),
     title () {
       return this.$t('login.findPassword')

pc/src/page/login/components/forget/selectType.vue

@@ -13,7 +13,7 @@ import { mapState } from 'vuex'
 export default {
   computed: {
     ...mapState({
-      isInternational: state => state.user.isInternational
+      isInternational: state => state.isInternational
     })
   },
   methods: {

pc/src/page/login/components/login.vue

@@ -4,7 +4,8 @@
       <div class="login-tab" :class="{'is-active': !type || type === 'codeLogin'}" @click="toOtherLogin('')">{{$t('login.userLogin')}}</div><div class="login-tab" :class="{'is-active': type==='camera'}" @click="toOtherLogin('camera')">{{$t('login.cameraLogin')}}</div>
     </div>
     <div class="account-login" v-if="!type">
-      <input type="text" oninput="value=value.replace(/[^\d]/g,'')" maxlength="11" class="input" :placeholder="isInternational? $t('login.emailPlaceholder') : $t('login.phonePlaceholder')" v-model="form.phone">
+      <input type="text" v-if="!isInternational" oninput="value=value.replace(/[^\d]/g,'')" maxlength="11" class="input" :placeholder="isInternational? $t('login.emailPlaceholder') : $t('login.phonePlaceholder')" v-model="form.phone">
+      <input type="text" v-else class="input" :placeholder="isInternational? $t('login.emailPlaceholder') : $t('login.phonePlaceholder')" v-model="form.phone">
       <div class="password-w">
         <input maxLength="16" :type="showPassword ? 'test' : 'password'" class="input password" :placeholder="$t('login.passwordPlaceholder')" v-model="form.password" @keyup.enter="login">
         <h-icon :type="showPassword ? 'mimakejian' : 'mimabukejian'" class="password-visible" @click="showPassword=!showPassword" />
@@ -17,7 +18,7 @@
       <div class="login-btn"  @click="login" >{{$t('login.login')}}</div>
       <div class="others">
         <a class="other-actions" @click="$router.push('/login/forget')">{{ $t('login.forgetPassword') }}</a>
-        <a class="other-actions" @click="$router.push('/login/register')">{{ $t('login.registerAccount') }}</a>
+        <a class="other-actions" @click="$router.push(isInternational ? '/login/register?type=email' : '/login/register')">{{ $t('login.registerAccount') }}</a>
       </div>
     </div>
     <cameraLogin v-if="type === 'camera'" />
@@ -49,7 +50,7 @@ export default {
     ...mapState({
       language: state => state.language.current,
       langToast: state => state.language.home.toast,
-      isInternational: state => state.user.isInternational
+      isInternational: state => state.isInternational
     }),
     type () {
       return this.$route.query.type

pc/src/page/login/components/register/index.vue

@@ -90,7 +90,7 @@ export default {
   computed : {
     ...mapState({
       langToast: state => state.language.home.toast,
-      isInternational: state => state.user.isInternational,
+      isInternational: state => state.isInternational,
       token: state => state.user.token,
       language: state => state.language.current
     })
@@ -124,6 +124,7 @@ export default {
     this.$bus.$on('isAgree', data => {
       this.showCluse = data
     })
+    this.type = this.$route.query.type || 'phone'
   },
   methods: {
     changeArea (item) {
@@ -418,7 +419,7 @@ export default {
   }
   .password-w {
     position: relative;
-    margin-bottom: 20px;
+    margin: 0 0 20px;
     input {
       margin-bottom: 0;
     }

pc/src/store/index.js

@@ -4,6 +4,9 @@ import ui from './ui'
 import language from './language'
 
 const store = new vuex.Store({
+  state: {
+    isInternational: process.env.IS_INTERNATIONAL,
+  },
   modules: {
     user,
     language,

pc/src/store/user.js

@@ -33,7 +33,6 @@ try {
 
 export default {
   state: {
-    isInternational: process.env.IS_INTERNATIONAL,
     token: token,
     fdkankantoken,
     name: null,