upload.sh

YI_LIUYANG

@@ -0,0 +1,7 @@
+-----BEGIN OPENSSH PRIVATE KEY-----
+b3BlbnNzaC1rZXktdjEAAAAABG5vbmUAAAAEbm9uZQAAAAAAAAABAAAAMwAAAAtzc2gtZW
+QyNTUxOQAAACA20GNyqm4LjDk1gVVnW1B8LnWw8pbZdDCwI+5wU4ishgAAAJDh6vD44erw
++AAAAAtzc2gtZWQyNTUxOQAAACA20GNyqm4LjDk1gVVnW1B8LnWw8pbZdDCwI+5wU4ishg
+AAAECr8W4FkpVwEtReeKxc7PoSe3q089fPxreRPvGDI3+o9TbQY3KqbguMOTWBVWdbUHwu
+dbDyltl0MLAj7nBTiKyGAAAACllJX0xJVVlBTkcBAgM=
+-----END OPENSSH PRIVATE KEY-----

index.html

@@ -5,6 +5,7 @@
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>授权登录-上海一草一木教育科技有限公司</title>
+    <script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
     <style>
       body {
         margin: 0;

package.json

@@ -6,7 +6,9 @@
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "upload": "bash ./upload.sh",
+    "build-and-upload": "npm run build && npm run upload"
   },
   "dependencies": {
     "sso-web": "file:",

src/components/Login.vue

@@ -1,24 +1,20 @@
 <template>
   <div class="login-container">
     <div class="login-box">
-      <!-- 添加 logo -->
       <img class="logo" src="https://static-data-ycymedu.oss-cn-shanghai.aliyuncs.com/logo.png" alt="logo" />
 
-      <!-- 选项卡 -->
       <div class="tabs">
         <div class="tab" :class="{ active: selectedTab === 'wechat' }" @click="switchTab('wechat')">微信扫码</div>
         <div class="tab" :class="{ active: selectedTab === 'phone' }" @click="switchTab('phone')">验证码</div>
         <div class="tab" :class="{ active: selectedTab === 'password' }" @click="switchTab('password')">密码</div>
       </div>
 
-      <!-- 账号密码登录 -->
       <div v-if="selectedTab === 'password'">
         <input type="text" placeholder="用户名或邮箱" v-model="username" />
         <input type="password" placeholder="密码" v-model="password" />
         <button @click="login">登录</button>
       </div>
 
-      <!-- 手机号验证码登录 -->
       <div v-if="selectedTab === 'phone'">
         <input type="text" placeholder="手机号" v-model="phone" />
         <div class="verification-row">
@@ -30,26 +26,20 @@
         <button @click="login">登录</button>
       </div>
 
-      <!-- 微信扫码登录 -->
       <div v-if="selectedTab === 'wechat'">
-        <div class="qr-code">
-          <img src="https://via.placeholder.com/150?text=WeChat+QR+Code" alt="微信扫码登录" />
-        </div>
-        <p>使用微信扫码登录</p>
+        <div class="qr-code" id="login_container"></div>
       </div>
     </div>
-
-
   </div>
 </template>
 
 <script>
-import { ref } from 'vue';
+import { ref, onMounted, watch, nextTick } from 'vue';
 
 export default {
   setup() {
-    const selectedTab = ref('password'); // 默认选择账号密码登录
-    const countdown = ref(null); // 初始化倒计时状态
+    const selectedTab = ref('wechat'); // 默认选择微信扫码登录
+    const countdown = ref(null);
     const username = ref('');
     const password = ref('');
     const phone = ref('');
@@ -62,7 +52,7 @@ export default {
 
     // 开始倒计时
     const startCountdown = () => {
-      const duration = 60; // 倒计时总秒数
+      const duration = 60;
       let remainingTime = duration;
       countdown.value = remainingTime;
 
@@ -77,7 +67,39 @@ export default {
       }, 1000);
     };
 
-    // 登录函数 (此处可以添加实际的登录逻辑)
+    // 微信扫码登录初始化
+    const initWeChatLogin = () => {
+      nextTick(() => {
+        const appid = 'wxf8db44d5ec082dfc';
+        const redirectUri = encodeURIComponent('https://api.sso.ycymedu.com/api/syswechat/snlogin?redirect_uri=https://uat.test.ycymedu.com');
+        const state = Math.random().toString(36).substr(2);
+
+        new WxLogin({
+          self_redirect: false,
+          id: "login_container",
+          appid: appid,
+          scope: "snsapi_login",
+          redirect_uri: redirectUri,
+          state: state,
+          style: "black",
+          href: ""
+        });
+      });
+    };
+
+    // 在组件加载时初始化微信扫码登录
+    onMounted(() => {
+      initWeChatLogin();
+    });
+
+    // 监听选项卡变化，切换到微信扫码时重新初始化
+    watch(selectedTab, (newTab) => {
+      if (newTab === 'wechat') {
+        initWeChatLogin();
+      }
+    });
+
+    // 登录函数
     const login = () => {
       alert('登录功能尚未实现');
     };
@@ -199,7 +221,6 @@ button:disabled {
   margin-top: 20px;
 }
 
-
 /* 响应式布局 */
 @media screen and (min-width: 768px) { /* 平板及更大屏幕 */
   .login-container {

upload.sh

@@ -0,0 +1,42 @@
+#!/bin/bash
+
+# 服务器信息
+SERVER_USER="root"
+SERVER_HOST="106.14.30.150"
+SERVER_PATH="/opt/1panel/apps/openresty/openresty/www/sites/sso.ycymedu.com/index"
+PRIVATE_KEY="YI_LIUYANG"
+BACKUP_PATH="${SERVER_PATH}-backup-$(date +%Y%m%d%H%M%S).zip"
+DINGDING_WEBHOOK="https://oapi.dingtalk.com/robot/send?access_token=fca104958fea6273c9c7ef3f08b3d552645c214f929066785e8caf6e1885a5a6"
+
+# 在上传之前备份原来的文件并压缩
+ssh -i $PRIVATE_KEY $SERVER_USER@$SERVER_HOST "cd $(dirname $SERVER_PATH) && zip -r $(basename $BACKUP_PATH) $(basename $SERVER_PATH)"
+
+# 使用 scp 上传文件
+scp -i $PRIVATE_KEY -r dist/* $SERVER_USER@$SERVER_HOST:$SERVER_PATH
+
+# 提示上传完成
+if [ $? -eq 0 ]; then
+  echo "上传成功！备份存储于 $BACKUP_PATH"
+  
+  # 发送钉钉通知
+  curl -X POST "$DINGDING_WEBHOOK" \
+       -H "Content-Type: application/json" \
+       -d '{
+             "msgtype": "text",
+             "text": {
+               "content": "single html| upload success!!！ backup to'"$BACKUP_PATH"'"
+             }
+           }'
+else
+  echo "上传失败，请检查错误信息。"
+  
+  # 发送钉钉通知
+  curl -X POST "$DINGDING_WEBHOOK" \
+       -H "Content-Type: application/json" \
+       -d '{
+             "msgtype": "text",
+             "text": {
+               "content": "single html|upload fail，please check error info。"
+             }
+           }'
+fi