From 846c19ceb36b0dadba4e2e28096ab157b2ae1f3b Mon Sep 17 00:00:00 2001
From: chaos-zhu <ggchaos1022@gmail.com>
Date: Sun, 20 Oct 2024 21:34:36 +0800
Subject: [PATCH] =?UTF-8?q?:fix:=20=E4=BF=AE=E5=A4=8D=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AFalt=E6=8C=89=E9=94=AE=E6=98=A0=E5=B0=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/assets/scss/mobile.scss               |  3 ++
 web/src/views/login/index.vue                 | 49 ++++++++++---------
 .../terminal/components/terminal-tab.vue      |  9 ++--
 3 files changed, 33 insertions(+), 28 deletions(-)

diff --git a/web/src/assets/scss/mobile.scss b/web/src/assets/scss/mobile.scss
index 5f48fa0..1a85e8a 100644
--- a/web/src/assets/scss/mobile.scss
+++ b/web/src/assets/scss/mobile.scss
@@ -32,6 +32,9 @@
 
 
 @media screen and (max-width: 968px) {
+  .login_box {
+    width: 86vw!important;
+  }
   .view_container {
     .aside_container {
       display: none;
diff --git a/web/src/views/login/index.vue b/web/src/views/login/index.vue
index 21f1bed..d7f8c2a 100644
--- a/web/src/views/login/index.vue
+++ b/web/src/views/login/index.vue
@@ -13,9 +13,10 @@
           :model="loginForm"
           :rules="rules"
           :hide-required-asterisk="true"
+          :show-message="false"
           label-suffix="："
           label-width="90px"
-          :show-message="false"
+          label-position="top"
         >
           <el-form-item prop="loginName" label="用户名">
             <el-input
@@ -44,20 +45,10 @@
             <el-input v-model.trim="loginForm.pwd" />
           </el-form-item>
           <el-form-item prop="jwtExpires" label="有效期">
-            <el-radio-group v-model="isSession" class="login-indate">
-              <el-radio :value="true">一次性会话</el-radio>
-              <el-radio :value="false">自定义(小时)</el-radio>
-              <el-input-number
-                v-model="loginForm.jwtExpires"
-                :disabled="isSession"
-                placeholder="单位：小时"
-                class="input"
-                :min="1"
-                :max="72"
-                value-on-clear="min"
-                size="small"
-                controls-position="right"
-              />
+            <el-radio-group v-model="expireTime" class="login-indate">
+              <el-radio :value="expireEnum.ONE_SESSION">一次性会话</el-radio>
+              <el-radio :value="expireEnum.CURRENT_DAY">当天有效</el-radio>
+              <el-radio :value="expireEnum.THREE_DAY">三天有效</el-radio>
             </el-radio-group>
           </el-form-item>
         </el-form>
@@ -85,14 +76,19 @@ import { RSAEncrypt } from '@utils/index.js'
 // const router = useRouter()
 const { proxy: { $store, $api, $message, $messageBox, $router } } = getCurrentInstance()
 
+const expireEnum = reactive({
+  ONE_SESSION: 'one_session',
+  CURRENT_DAY: 'current_day',
+  THREE_DAY: 'three_day'
+})
+const expireTime = ref(expireEnum.ONE_SESSION)
 const loginFormRefs = ref(null)
-const isSession = ref(true)
 const notKey = ref(false)
 const loading = ref(false)
 const loginForm = reactive({
   loginName: '',
   pwd: '',
-  jwtExpires: 8
+  jwtExpires: 1
 })
 const rules = reactive({
   loginName: { required: true, message: '需输入用户名', trigger: 'change' },
@@ -102,9 +98,16 @@ const rules = reactive({
 const handleLogin = () => {
   loginFormRefs.value.validate().then(() => {
     let { jwtExpires, loginName, pwd } = loginForm
-    jwtExpires = isSession.value ? '12h' : `${ jwtExpires }h`
-    if (!isSession.value) {
-      localStorage.setItem('jwtExpires', jwtExpires)
+    switch (expireTime.value) {
+      case expireEnum.ONE_SESSION:
+        jwtExpires = '1h' // 会话登录token1小时有效期，浏览器窗口关闭则立即失效
+        break
+      case expireEnum.CURRENT_DAY:
+        jwtExpires = `${ Math.floor((new Date().setHours(24,0,0,0) - Date.now()) / 1000) }s`
+        break
+      case expireEnum.THREE_DAY:
+        jwtExpires = '3d'
+        break
     }
     const ciphertext = RSAEncrypt(pwd)
     if (ciphertext === -1) return $message.error({ message: '公钥加载失败', center: true })
@@ -112,7 +115,7 @@ const handleLogin = () => {
     $api.login({ loginName, ciphertext, jwtExpires })
       .then(({ data, msg }) => {
         const { token } = data
-        $store.setJwtToken(token, isSession.value)
+        $store.setJwtToken(token, expireEnum.ONE_SESSION === expireTime.value)
         $store.setUser(loginName)
         $message.success({ message: msg || 'success', center: true })
         if (loginName === 'admin' && pwd === 'admin') {
@@ -156,7 +159,7 @@ onMounted(async () => {
 
   .login_box {
     margin-top: -80px;
-    width: 500px;
+    width: 450px;
     min-height: 250px;
     padding: 20px;
     border-radius: 6px;
@@ -182,7 +185,7 @@ onMounted(async () => {
 
 .login-indate {
   display: flex;
-  flex-wrap: nowrap;
+  // flex-wrap: nowrap;
 
   .input {
     margin-left: -25px;
diff --git a/web/src/views/terminal/components/terminal-tab.vue b/web/src/views/terminal/components/terminal-tab.vue
index acabdd5..e7f6a92 100644
--- a/web/src/views/terminal/components/terminal-tab.vue
+++ b/web/src/views/terminal/components/terminal-tab.vue
@@ -334,18 +334,17 @@ function extractLastCdPath(text) {
 }
 
 const onData = () => {
-  // term.value.off('data', listenerInput)
   term.value.onData((key) => {
-    // console.log('key: ', key)
-    // if (key === '\x03') console.log('Ctrl + C detected')
+    console.log('key: ', key)
     if (socketConnected.value === false) return
     if (isLongPressCtrl.value || isLongPressAlt.value) {
       const keyCode = key.toUpperCase().charCodeAt(0)
+      console.log('keyCode: ', keyCode)
       const ansiCode = keyCode - 64
-      // console.log('ansiCode:', ansiCode)
+      console.log('ansiCode:', ansiCode)
       if (ansiCode >= 1 && ansiCode <= 26) {
         const controlChar = String.fromCharCode(ansiCode)
-        socket.value.emit('input', controlChar)
+        socket.value.emit('input', isLongPressCtrl.value ? controlChar : `\x1b${ key }`)
       }
       emit('reset-long-press')
       return