Accueil Explorer Aide
S'inscrire Connexion
litianbiao
/
shenze-sysMan
2
0
Fork 0
Fichiers Tickets 0 Pull Requests 0 Wiki
Parcourir la source

feat: "TODO: 微信登录"
fix: "logo定制"

ritchie il y a 2 ans
Parent
71b24998be
commit
37483a41f6
14 fichiers modifiés avec 556 ajouts et 70 suppressions
Vue séparée Afficher les stats Diff
  1. 3 2
      package.json
  2. 11 10
      public/index.html
  3. 7 1
      src/assets/language/en.json
  4. 13 4
      src/assets/language/zh.json
  5. BIN
      src/assets/user/bindWechatIcon.png
  6. 2 0
      src/router/index.js
  7. 6 0
      src/service/bindWechat.js
  8. 1 1
      src/service/device/index.js
  9. 4 0
      src/service/login.js
  10. 303 0
      src/views/bindWechat.vue
  11. 5 6
      src/views/device/customLogo.vue
  12. 143 45
      src/views/login.vue
  13. 47 0
      src/views/user.vue
  14. 11 1
      vue.config.js

+ 3 - 2
package.json
Voir le fichier 

@@ -10,9 +10,9 @@
 
     "lint": "vue-cli-service lint"
 
   },
 
   "dependencies": {
 
-    "airwallex-payment-elements": "latest",
 
     "@amap/amap-jsapi-loader": "^1.0.1",
 
     "@vant/touch-emulator": "^1.4.0",
 
+    "airwallex-payment-elements": "latest",
 
     "axios": "^0.20.0",
 
     "better-scroll": "^2.3.0",
 
     "big.js": "^6.2.1",
 
@@ -23,13 +23,14 @@
 
     "lib-flexible": "^0.3.2",
 
     "moment": "^2.29.4",
 
     "pushstate-server": "^3.1.0",
 
+    "qrcode-terminal": "^0.12.0",
 
     "qs": "^6.11.0",
 
     "vant": "^3.5.2",
 
     "vue": "^3.0.0",
 
     "vue-i18n": "^9.1.10",
 
     "vue-router": "^4.0.0-beta.13",
 
     "vue2-verify": "^1.1.5",
 
-    "vuex": "^4.0.0-beta.4"
 
+    "vuex": "^4.1.0"
 
   },
 
   "devDependencies": {
 
     "@vue/cli-plugin-babel": "~4.5.0",

+ 11 - 10
public/index.html
Voir le fichier 

@@ -2,21 +2,22 @@
 
 <html lang="en">
 
 
 <head>
 
-  <meta charset="utf-8">
 
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-  <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
-  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
-  <title>shenze</title>
 
-  <link rel="stylesheet" href="./fontIcon.css">
 
-  <script type="text/javascript" src="./echarts.min.js"></script>
 
+    <meta charset="utf-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
+    <title>shenze</title>
 
+    <link rel="stylesheet" href="./fontIcon.css">
 
+    <script type="text/javascript" src="./echarts.min.js"></script>
 
+    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
 
 </head>
 
 
 <body>
 
-  <noscript>
 
+<noscript>
 
     <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
 
         Please enable it to continue.</strong>
 
-  </noscript>
 
-  <div id="app"></div>
 
+</noscript>
 
+<div id="app"></div>
 
 </body>
 
 
 </html>

+ 7 - 1
src/assets/language/en.json
Voir le fichier 

@@ -1141,7 +1141,13 @@
 
     "confirmLog": "confirm",
 
     "logOutContent": "Are you sure you want to log out",
 
     "corrEmailPlace": "Please enter the correct email address",
 
-    "corrPhonePlace": "Please enter the correct mobile number"
 
+    "corrPhonePlace": "Please enter the correct mobile number",
 
+    "bindWechat":"Bind WeChat"
 
+  },
 
+  "bindWechat": {
 
+    "cancel": "Cancel",
 
+    "bindCommit": "Bind WeChat",
 
+    "bindSuccess": "Bind Success"
 
   },
 
   "labelMan": {
 
     "title": "Label management",

+ 13 - 4
src/assets/language/zh.json
Voir le fichier 

@@ -258,7 +258,7 @@
 
     "advancedParameterConfiguration": "进阶参数配置",
 
     "debuggingParameterConfiguration": "调试参数配置",
 
     "humidityParameterConfiguration": "湿度参数配置",
 
-    "submitUpdates": "提交更新",	
+    "submitUpdates": "提交更新",
 
     "modificationSucceeded": "修改成功",
 
     "addDistributor": "添加分销人",
 
     "equipmentNoLabel": "设备编号",
 
@@ -1144,8 +1144,13 @@
 
     "confirmLog":"确定",
 
     "logOutContent":"确定需要退出登录吗",
 
     "corrEmailPlace":"请输入正确的邮箱",
 
-    "corrPhonePlace":"请输入正确的手机号"
 
-
 
+    "corrPhonePlace":"请输入正确的手机号",
 
+    "bindWechat":"绑定微信"
 
+  },
 
+  "bindWechat": {
 
+    "cancel": "取消",
 
+    "bindCommit": "绑定微信",
 
+    "bindSuccess": "绑定成功"
 
   },
 
   "labelMan":{
 
     "title":"标签管理",
 
@@ -1224,6 +1229,10 @@
 
 	"standbyWithdrawalAccountNo": "备用提现账号",
 
 	"merchantManagement": "商户管理",
 
 	"labelMan": "标签管理"
 
-	
+
 
+  },
 
+  "wechat":{
 
+    "headerName": "绑定微信"
 
+
 
   }
 
 }

BIN
src/assets/user/bindWechatIcon.png
Voir le fichier


+ 2 - 0
src/router/index.js
Voir le fichier 

@@ -14,6 +14,8 @@ const router = createRouter({
 
     { path: '/register', name: 'register', component: () => import('@/views/register.vue'), meta: { index: 1, noLogin: true } },
 
     // 忘记密码页面
 
     { path: '/forgetpassword', name: 'forgetPassword', component: () => import('@/views/forgetPassword'), meta: { index: 1, noLogin: true } },
 
+    // 绑定微信
 
+    { path: '/bindWechat', name: 'bindWechat', component: () => import('@/views/bindWechat.vue'), meta: {index: 1, noLogin: true}},
 
     // 修改密码页面
 
     { path: '/changepassword', name: 'changePassword', component: () => import('@/views/changePassword'), meta: { index: 1, noLogin: true } },
 
     // 设备页面

+ 6 - 0
src/service/bindWechat.js
Voir le fichier 

@@ -0,0 +1,6 @@
 
+import axios from '../utils/axios';
 
+
 
+// 绑定微信
 
+export function bindWechat(params) {
 
+    return axios.get(`/SZWL-SERVER/tWechat/bindWechat?adminId=${params.adminId}`, params);
 
+}

+ 1 - 1
src/service/device/index.js
Voir le fichier 

@@ -136,5 +136,5 @@ export function updateDevicePassword(params) {
 
 }
 
 // 定制Logo
 
 export function customLogo(params) {
 
-  return axios.post(`/SZWL-SERVER/tLogo/customLogo?${stringToUrl(params)}`, params)
 
+  return axios.post(`/SZWL-SERVER/tLogo/customLogo`, params)
 
 }

+ 4 - 0
src/service/login.js
Voir le fichier 

@@ -8,4 +8,8 @@ export function login(params) {
 
 // 根据系统ID获取logo和系统名称
 
 export function getSys(params) {
 
   return axios.get(`/SZWL-SERVER/tLogo/getLogo?${stringToUrl(params)}`);
 
+}
 
+// 微信登录
 
+export function wxLogin(params) {
 
+  return axios.get('/SZWL-SERVER/wxLogin/menuOauth', params);
 
 }

+ 303 - 0
src/views/bindWechat.vue
Voir le fichier 

@@ -0,0 +1,303 @@
 
+<template>
 
+  <!-- 绑定微信 -->
 
+  <div class="bindWechat">
 
+    <s-header
 
+        :name="$t('wechat.headerName')"
 
+        :noback="false"
 
+    ></s-header>
 
+
 
+
 
+<!--    <div class="loginLogoBox l-re">-->
 
+<!--      &lt;!&ndash;      用户头像 用户昵称 &ndash;&gt;-->
 
+<!--      <van-image class="userAvatar" :src="avatarUrl"></van-image>-->
 
+<!--      <view class="title">-->
 
+<!--        {{ 用户昵称 }}-->
 
+<!--      </view>-->
 
+<!--    </div>-->
 
+
 
+
 
+    <div class="loginFormBox">
 
+      <van-form @submit="onSubmit">
 
+        <van-field
 
+            v-model="userName"
 
+            name="userName"
 
+            label=""
 
+            :placeholder="$t('login.userNameInput')"
 
+            :rules="[{ required: true, message: $t('login.userNameInput') }]"
 
+        />
 
+        <van-field
 
+            v-model="userPwd"
 
+            type="password"
 
+            name="userPwd"
 
+            label=""
 
+            :placeholder="$t('login.passWordInput')"
 
+            :rules="[{ required: true, message: $t('login.passWordInput') }]"
 
+        />
 
+
 
+
 
+
 
+        <div class="buttonBox">
 
+          <!-- 取消绑定微信，返回登录页 -->
 
+          <van-button
 
+              round
 
+              type="primary"
 
+              class="register"
 
+              @click="cancelClick"
 
+          >{{ $t('bindWechat.cancel') }}
 
+          </van-button>
 
+
 
+          <!-- 用户回车，默认触发 form 表单提交操作 -->
 
+          <van-button
 
+              round
 
+              type="primary"
 
+              native-type="submit"
 
+          >{{ $t('bindWechat.bindCommit') }}</van-button>
 
+
 
+        </div>
 
+      </van-form>
 
+    </div>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import {onMounted, ref} from "vue";
 
+import { Toast } from "vant";
 
+import { bindWechat } from "@/service/bindWechat";
 
+import {setLocal, getLocal, navigatorLanguage, getLoginUser} from "@/common/js/utils";
 
+import sHeader from "@/components/SimpleHeader";
 
+import logiLogoImgUrl from "@/assets/login/logo.png";
 
+import {  useRouter } from "vue-router";
 
+import { useI18n } from "vue-i18n";
 
+
 
+
 
+export default {
 
+  setup() {
 
+    let languageName = ref(getLocal("curLang"));
 
+    const { t } = useI18n();
 
+
 
+
 
+    const checked = ref(false); // 是否记住密码状态
 
+    const userName = ref("");
 
+    const userPwd = ref("");
 
+    const router = useRouter();
 
+    const sys = ref(null);
 
+    // 页面初始化
 
+    onMounted(() => {
 
+      // localStorage.clear();
 
+      // 如果没有语言缓存
 
+      if (!getLocal("curLang")) {
 
+        //  根据浏览器语言重新缓存到localstorage
 
+        setLocal("curLang", navigatorLanguage());
 
+        languageName.value = getLocal("curLang");
 
+      }
 
+
 
+    });
 
+
 
+    const user = getLoginUser();
 
+
 
+    // 返回用户页
 
+    const cancelClick = async () => {
 
+      await router.push("/user");
 
+    }
 
+    // 绑定微信
 
+    const onSubmit = async () => {
 
+      const { data } = await bindWechat({
 
+        adminId: user.id,
 
+      });
 
+
 
+      if (data.code === "00000") {
 
+        Toast(t('bindWechat.bindSuccess'));
 
+        await router.push({path: '/user'});
 
+      } else {
 
+        Toast.fail(data.message);
 
+      }
 
+
 
+    };
 
+
 
+
 
+    return {
 
+      logiLogoImgUrl,
 
+      checked,
 
+      userName,
 
+      userPwd,
 
+      onSubmit,
 
+      sys,
 
+      cancelClick,
 
+    };
 
+  },
 
+  components: { sHeader },
 
+};
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+@import "../common/style/mixin";
 
+
 
+.bindWechat {
 
+  display: flex;
 
+  flex-wrap: wrap;
 
+  flex-direction: row;
 
+  align-content: flex-start;
 
+
 
+  .loginLogoBox {
 
+    width: 100%;
 
+    text-align: center;
 
+
 
+    .loginLogo {
 
+      width: 216px;
 
+      height: 87px;
 
+      margin-top: 41px;
 
+    }
 
+    .languageCon {
 
+      right: 10px;
 
+      top: 10px;
 
+      border: 1px solid #4d6add;
 
+      padding: 5px 10px;
 
+      border-radius: 10px;
 
+    }
 
+  }
 
+
 
+  .loginTitleBox {
 
+    width: 100%;
 
+
 
+    .loginTitle {
 
+      // width: 80px;
 
+      height: 28px;
 
+      overflow-wrap: break-word;
 
+      color: #404d74;
 
+      font-size: 20px;
 
+      font-family: PingFangSC-Medium;
 
+      text-align: center;
 
+      white-space: nowrap;
 
+      line-height: 28px;
 
+      display: block;
 
+      margin: 8px auto 0 auto;
 
+      font-weight: 600;
 
+    }
 
+  }
 
+
 
+  .loginFormBox {
 
+    width: 100%;
 
+    margin-top: 38px;
 
+
 
+    /deep/ .van-field__body {
 
+      height: 100%;
 
+    }
 
+
 
+    .van-form .van-cell {
 
+      width: 281px;
 
+      height: 38px;
 
+      background-color: rgba(255, 255, 255, 1);
 
+      border-radius: 2px;
 
+      border: 0.5px solid rgba(185, 186, 208, 1);
 
+      padding: 0;
 
+      color: rgba(168, 168, 197, 1);
 
+      font-size: 13px;
 
+      margin: 0 auto;
 
+      margin-top: 20px;
 
+      overflow: visible;
 
+
 
+      .van-field__control {
 
+        height: 38px;
 
+        line-height: 38px;
 
+        padding: 6px;
 
+
 
+        &:-internal-autofill-previewed,
 
+        &:-internal-autofill-selected {
 
+          -webkit-text-fill-color: #323233 !important;
 
+          transition: background-color 5000s ease-in-out 0s !important;
 
+        }
 
+      }
 
+
 
+      .van-field__control::-webkit-input-placeholder {
 
+        color: rgba(168, 168, 197, 1);
 
+      }
 
+    }
 
+
 
+    .checkedPasswordBox {
 
+      width: 281px;
 
+      margin: 20px auto 0 auto;
 
+      font-size: 13px;
 
+      color: #4d6add;
 
+      display: flex;
 
+      justify-content: space-between;
 
+      height: 13px;
 
+      line-height: 13px;
 
+
 
+      .van-checkbox {
 
+        overflow: visible;
 
+      }
 
+
 
+      .van-checkbox__icon {
 
+        font-size: 13px;
 
+
 
+        .van-icon {
 
+          width: 12px;
 
+          height: 12px;
 
+          border-color: #4d6add;
 
+        }
 
+      }
 
+
 
+      .van-checkbox__label {
 
+        color: #4d6add;
 
+        line-height: 13px;
 
+      }
 
+
 
+      .van-checkbox__icon--checked .van-icon-success {
 
+        border-color: #4d6add;
 
+        background: #4d6add;
 
+      }
 
+
 
+      .van-checkbox__icon--checked .van-icon-success::before {
 
+        content: "";
 
+        background: #fff;
 
+        width: 40%;
 
+        height: 40%;
 
+        position: absolute;
 
+        top: 30%;
 
+        left: 30%;
 
+        border-radius: 100%;
 
+      }
 
+
 
+      .forgetPassWord {
 
+        cursor: pointer;
 
+      }
 
+    }
 
+  }
 
+
 
+  .loginWithWechat {
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+  }
 
+  .wechat-btn {
 
+    width: 60px;
 
+    height: 60px;
 
+    margin: 0;
 
+    padding: 0;
 
+    border: none;
 
+    border-radius: 50%; /* 将按钮样式修改为圆形 */
 
+  }
 
+  .wechat-icon {
 
+    width: 40px;
 
+    height: 40px;
 
+  }
 
+  .buttonBox {
 
+    width: 281px;
 
+    margin: 20px auto 0 auto;
 
+    display: flex;
 
+    justify-content: space-between;
 
+
 
+    .van-button {
 
+      width: 120px;
 
+      height: 34px;
 
+      border: 1px solid rgba(77, 106, 221, 1);
 
+      background-color: rgba(77, 106, 221, 1);
 
+    }
 
+
 
+    .register {
 
+      background-color: transparent;
 
+      color: rgba(77, 106, 221, 1);
 
+    }
 
+  }
 
+}
 
+</style>

+ 5 - 6
src/views/device/customLogo.vue
Voir le fichier 

@@ -53,21 +53,20 @@ export default defineComponent({
 
       } else { Toast.fail(data.message); }
 
     }
 
 
+    // 定制Logo
 
     const submitChange = async ()=> {
 
       console.log('提交：${logoNumber.value}');
 
-      // TODO: 提交逻辑 done
 
-      // if (deviceId.value === "") {
 
-      //   Toast.fail(t('device.'))
 
-      // }
 
+
 
       const { data } = await customLogo({
 
-        id: deviceId,
 
+        deviceId: deviceId,
 
+        logoNumber: logoNumber
 
       })
 
       if (data.code === '00000') {
 
         Toast.success(t('device.modificationSucceeded'));
 
       } else {
 
         Toast.fail(data.message);
 
       }
 
-      console.log('submitChange', {equipmentId: deviceId});
 
+      console.log('submitChange', {equipmentId: deviceId, logoNumber: logoNumber});
 
 
     }

+ 143 - 45
src/views/login.vue
Voir le fichier 

@@ -2,11 +2,10 @@
 
   <!-- 登录 -->
 
   <div class="login">
 
     <s-header
 
-      :name="sys ? sys.title : $t('public.sysName')"
 
-      :noback="false"
 
+        :name="sys ? sys.title : $t('public.sysName')"
 
     ></s-header>
 
     <div class="loginLogoBox l-re">
 
-      <van-image class="loginLogo" :src="sys ? sys.imgUrl : logiLogoImgUrl" />
 
+      <van-image class="loginLogo" :src="sys ? sys.imgUrl : logiLogoImgUrl"/>
 
       <div class="l-ab pointer languageCon" @click="languageClk">
 
         <div class="c-text-b c-color-theme">
 
           {{ compLang }}
 
@@ -19,48 +18,58 @@
 
     <div class="loginFormBox">
 
       <van-form @submit="onSubmit">
 
         <van-field
 
-          v-model="userName"
 
-          name="userName"
 
-          label=""
 
-          :placeholder="$t('login.userNameInput')"
 
-          :rules="[{ required: true, message: $t('login.userNameInput') }]"
 
+            v-model="userName"
 
+            name="userName"
 
+            label=""
 
+            :placeholder="$t('login.userNameInput')"
 
+            :rules="[{ required: true, message: $t('login.userNameInput') }]"
 
         />
 
         <van-field
 
-          v-model="userPwd"
 
-          type="password"
 
-          name="userPwd"
 
-          label=""
 
-          :placeholder="$t('login.passWordInput')"
 
-          :rules="[{ required: true, message: $t('login.passWordInput') }]"
 
+            v-model="userPwd"
 
+            type="password"
 
+            name="userPwd"
 
+            label=""
 
+            :placeholder="$t('login.passWordInput')"
 
+            :rules="[{ required: true, message: $t('login.passWordInput') }]"
 
         />
 
         <div class="checkedPasswordBox">
 
           <van-checkbox
 
-            icon-size="18px"
 
-            class="checkedPassWord"
 
-            v-model="checked"
 
-            checked-color="#4d6add"
 
+              icon-size="18px"
 
+              class="checkedPassWord"
 
+              v-model="checked"
 
+              checked-color="#4d6add"
 
           >
 
             <template #default>
 
               <span :class="checked ? 'c-color-theme' : ''">{{
 
-                $t("login.checkedPassWord")
 
-              }}</span>
 
+                  $t("login.checkedPassWord")
 
+                }}</span>
 
             </template>
 
           </van-checkbox>
 
           <span class="forgetPassWord" @click="forgetPassword">{{
 
-            $t("login.forgetPassWord")
 
-          }}</span>
 
+              $t("login.forgetPassWord")
 
+            }}</span>
 
         </div>
 
+        <br>
 
+        <br>
 
+        <!-- 微信登录 -->
 
+        <div v-if="isInWeChat" class="loginWithWechatClass">
 
+          <van-button class="wechat-btn" type="primary" size="large" @click="wxLoginHandler" >
 
+            <van-icon name="wechat" color="#1bd66c" size="40" class="wechat-icon"/>
 
+          </van-button>
 
+        </div>
 
+
 
         <div class="buttonBox">
 
           <van-button
 
-            round
 
-            type="primary"
 
-            class="register"
 
-            @click="registerClick"
 
-            >{{ $t("login.regusterButton") }}
 
+              round
 
+              type="primary"
 
+              class="register"
 
+              @click="registerClick"
 
+          >{{ $t("login.regusterButton") }}
 
           </van-button>
 
           <van-button round type="primary" native-type="submit">{{
 
-            $t("login.loginButton")
 
-          }}</van-button>
 
+              $t("login.loginButton")
 
+            }}
 
+          </van-button>
 
         </div>
 
       </van-form>
 
     </div>
 
@@ -69,25 +78,24 @@
 
 
 <script>
 
 import md5 from "js-md5";
 
-import { onMounted, ref, computed } from "vue";
 
-import { Toast } from "vant";
 
-import { login, getSys } from "@/service/login";
 
-import { setLocal, getLocal, navigatorLanguage } from "@/common/js/utils";
 
+import {onMounted, ref, computed, reactive} from "vue";
 
+import {Toast, Dialog, Button} from "vant";
 
+import {login, getSys, wxLogin} from "@/service/login";
 
+import {setLocal, getLocal, navigatorLanguage} from "@/common/js/utils";
 
 import sHeader from "@/components/SimpleHeader";
 
 import logiLogoImgUrl from "@/assets/login/logo.png";
 
-import { useRoute, useRouter } from "vue-router";
 
-import { useI18n } from "vue-i18n";
 
-// vant组件的中英文切换
 
-import { Locale } from "vant";
 
+import {useRoute, useRouter} from "vue-router";
 
+import {useI18n} from "vue-i18n";
 
+// vant 组件的中英文切换
 
+import {Locale} from "vant";
 
 // 引入英文语言包
 
 import enUS from "vant/es/locale/lang/en-US";
 
 // 引入简体中文语言包
 
 import zhCN from "vant/es/locale/lang/zh-CN";
 
-
 
 export default {
 
   setup() {
 
     let languageName = ref(getLocal("curLang"));
 
-    const { locale,t } = useI18n();
 
+    const {locale, t} = useI18n();
 
     // 语言点击
 
     const languageClk = () => {
 
       if (languageName.value === "zh") {
 
@@ -131,7 +139,7 @@ export default {
 
       }
 
     });
 
     const getSysFun = async () => {
 
-      const { data } = await getSys({
 
+      const {data} = await getSys({
 
         relationAdminId: route.query.relation_admin_id,
 
       });
 
       if (data.code === "00000") {
 
@@ -142,7 +150,7 @@ export default {
 
     };
 
     // 登录
 
     const onSubmit = async (values) => {
 
-      const { data } = await login({
 
+      const {data} = await login({
 
         username: values.userName,
 
         password: md5(values.userPwd),
 
       });
 
@@ -151,9 +159,9 @@ export default {
 
         Toast.success(t('login.loginSucess'));
 
         // 需要刷新页面，否则 axios.js 文件里的 token 不会被重置
 
         // window.location.href = '/';
 
-        setTimeout(()=>{
 
+        setTimeout(() => {
 
           router.push("/home");
 
-        },200);
 
+        }, 200);
 
       } else {
 
         Toast.fail(data.message);
 
       }
 
@@ -167,6 +175,44 @@ export default {
 
       router.push("/forgetpassword");
 
     };
 
 
+
 
+    const state = reactive({
 
+      isLoading: false
 
+    })
 
+
 
+    const wxLoginHandler = async () => {
 
+      state.isLoading = true
 
+      try {
 
+        // 用户默认授权，获取 openid
 
+        const {data} = await wxLogin();
 
+        if (data.code === "00000") {
 
+          Toast.success(t('login.loginSucess'));
 
+          setTimeout(() => {
 
+            router.push("/home");
 
+          }, 200);
 
+        } else {
 
+          // 用户未绑定微信
 
+          handleError('您还未绑定微信，请先前往个人中心进行绑定。')
 
+        }
 
+      } catch (error) {
 
+        handleError(error.message || '登录失败，请重试')
 
+      } finally {
 
+        state.isLoading = false
 
+      }
 
+    }
 
+
 
+    const isInWeChat = computed(() => {
 
+      const ua = window.navigator.userAgent.toLowerCase();
 
+      return new RegExp('micromessenger').test(ua);
 
+    });
 
+
 
+    const handleError = (errMsg) => {
 
+      Dialog.alert({
 
+        title: '错误提示',
 
+        message: errMsg
 
+      })
 
+    }
 
+
 
     return {
 
       logiLogoImgUrl,
 
       checked,
 
@@ -178,9 +224,16 @@ export default {
 
       sys,
 
       compLang,
 
       languageClk,
 
+      isInWeChat,
 
+      state,
 
+      wxLoginHandler
 
     };
 
   },
 
-  components: { sHeader },
 
+  components: {
 
+    sHeader,
 
+    [Button.name]: Button,
 
+    [Dialog.name]: Dialog
 
+  },
 
 };
 
 </script>
 
 
@@ -202,6 +255,7 @@ export default {
 
       height: 87px;
 
       margin-top: 41px;
 
     }
 
+
 
     .languageCon {
 
       right: 10px;
 
       top: 10px;
 
@@ -319,9 +373,53 @@ export default {
 
     }
 
   }
 
 
+  .loginWithWechatClass {
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+  }
 
+  .wechat-btn {
 
+    width: 60px;
 
+    height: 60px;
 
+    margin: 0;
 
+    padding: 0;
 
+    border: none;
 
+    border-radius: 50%; /* 将按钮样式修改为圆形 */
 
+    display: flex;
 
+    justify-content: center;
 
+    align-items: center;
 
+  }
 
+
 
+  .wechat-icon {
 
+    width: 40px;
 
+    height: 40px;
 
+  }
 
+
 
+  //.wechatBox{
 
+  //  height: 100vh;
 
+  //  display: flex;
 
+  //  justify-content: center;
 
+  //  align-items: center;
 
+  //}
 
+  //.loginWithWechat {
 
+  //
 
+  //
 
+  //}
 
+  //
 
+  //.wechat-btn {
 
+  //  display: flex;
 
+  //  align-items: center;
 
+  //  justify-content: center;
 
+  //  color: #0dc3c3;
 
+  //  background-color: rosybrown;
 
+  //  width: 120px;
 
+  //  height: 40px;
 
+  //  border-radius: 20px;
 
+  //}
 
+
 
   .buttonBox {
 
     width: 281px;
 
-    margin: 58px auto 0 auto;
 
+    margin: 20px auto 0 auto;
 
     display: flex;
 
     justify-content: space-between;

+ 47 - 0
src/views/user.vue
Voir le fichier 

@@ -143,11 +143,13 @@
 
       </div>
 
       <div class="lineBox"></div>
 
       <div class="commonOperBox">
 
+        <!-- 常用操作 -->
 
         <div class="baseRow flex-row justify-between">
 
           <div class="group2 flex-col"></div>
 
           <span class="baseText">{{ $t("user.commonOperations") }}</span>
 
         </div>
 
         <div class="operListBox">
 
+          <!-- 任务消息 -->
 
           <div
 
             v-if="roleCheck()"
 
             class="taskListRow flex-col"
 
@@ -158,6 +160,8 @@
 
               <div class="taskTitle">{{ $t("user.taskMessage") }}</div>
 
             </div>
 
           </div>
 
+
 
+          <!-- 提现帐号 -->
 
           <div
 
             class="taskListRow flex-col"
 
             @click="pushPageList('/joinpayMch')"
 
@@ -167,6 +171,8 @@
 
               <div class="taskTitle">{{ $t("user.withdrawalAccountNo") }}</div>
 
             </div>
 
           </div>
 
+
 
+          <!-- 备用提现账号 -->
 
           <div class="taskListRow flex-col" @click="pushPageList('/shandeMch')">
 
             <div class="taskIcon shandeMchIcon"></div>
 
             <div class="taskRight">
 
@@ -175,6 +181,19 @@
 
               </div>
 
             </div>
 
           </div>
 
+
 
+          <!-- 绑定微信 -->
 
+          <div v-if="isInWeChat" class="taskListRow flex-col" @click="pushPageList('/bindWechat')">
 
+<!--            <div class="taskListRow flex-col" @click="pushPageList('/bindWechat')">-->
 
+            <div class="taskIcon bindWechatIcon"></div>
 
+            <div class="taskRight">
 
+              <div class="taskTitle">
 
+                {{ $t("user.bindWechat") }}
 
+              </div>
 
+            </div>
 
+          </div>
 
+
 
+          <!-- 修改密码 -->
 
           <div
 
             class="taskListRow flex-col"
 
             @click="pushPageList('/changepassword')"
 
@@ -184,12 +203,15 @@
 
               <div class="taskTitle">{{ $t("user.changePassword") }}</div>
 
             </div>
 
           </div>
 
+
 
+          <!-- 自动充值 -->
 
           <div class="taskListRow flex-col" @click="operUnipay()">
 
             <div class="taskIcon selfPayIcon"></div>
 
             <div class="taskRight">
 
               <div class="taskTitle">{{ $t("user.selfRecharging") }}</div>
 
             </div>
 
           </div>
 
+
 
           <div class="taskListRow flex-col" @click="onperExitSys()">
 
             <div class="taskIcon loginOutIcon"></div>
 
             <div class="taskRight">
 
@@ -453,6 +475,18 @@ export default {
 
         }, 500);
 
       }
 
     };
 
+    const isInWeChat = ref(false);
 
+    const checkInWechat = () => {
 
+      const ua = window.navigator.userAgent.toLowerCase();
 
+      // 如果是在微信中打开
 
+      if (ua.match(/MicroMessenger/i) == 'micromessenger') {
 
+        isInWeChat.value = true;
 
+      }
 
+    };
 
+
 
+    onMounted(() => {
 
+      checkInWechat();
 
+    })
 
     // 获取回显的值
 
     const getAreaName = (e) => {
 
       fieldValue.value = e;
 
@@ -479,6 +513,7 @@ export default {
 
       kCascaderRef,
 
       fieldValueInpClk,
 
       areaPopFinish,
 
+      isInWeChat,
 
       getAreaName,
 
     };
 
   },
 
@@ -661,6 +696,18 @@ export default {
 
             top: 0.4rem;
 
           }
 
 
+          &.bindWechatIcon::after {
 
+            content: "";
 
+            position: absolute;
 
+            background: #fff url("../assets/user/bindWechatIcon.png") top
 
+            center no-repeat;
 
+            background-size: 100%;
 
+            width: 0.6rem;
 
+            height: 0.6rem;
 
+            right: 0.15rem;
 
+            top: 0.4rem;
 
+          }
 
+
 
           &.changePasswordIcon::after {
 
             content: "";
 
             position: absolute;

+ 11 - 1
vue.config.js
Voir le fichier 

@@ -12,7 +12,17 @@ module.exports = {
 
         pathRewrite: {
 
           // '.+?/api': '/api'
 
         } // 这里会对反向代理的地址进行重写。比如我的实际后端资源的URI是http://localhost:5000/api/resource，那么不加这个配置属性的话是访问不到我这个有效地址的。这里配置是一个正则替换，替换后就是后端api真正有效的地址了
 
+      },
 
+      "/weixin": {
 
+        target: "https://api.weixin.qq.com/",
 
+        ws: true,
 
+        secure: true, // 使用的是http协议设置为 false，https协议设置为 true
 
+        changeOrigin: true,
 
+        pathRewrite: {
 
+          "^/weixin": "",
 
+        }
 
       }
 
-    }
 
+    },
 
+    disableHostCheck: true,
 
   }
 
 }