:fix: 修复移动端alt按键映射
This commit is contained in:
parent
fc42e1b29a
commit
846c19ceb3
@ -32,6 +32,9 @@
|
|||||||
|
|
||||||
|
|
||||||
@media screen and (max-width: 968px) {
|
@media screen and (max-width: 968px) {
|
||||||
|
.login_box {
|
||||||
|
width: 86vw!important;
|
||||||
|
}
|
||||||
.view_container {
|
.view_container {
|
||||||
.aside_container {
|
.aside_container {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -13,9 +13,10 @@
|
|||||||
:model="loginForm"
|
:model="loginForm"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
:hide-required-asterisk="true"
|
:hide-required-asterisk="true"
|
||||||
|
:show-message="false"
|
||||||
label-suffix=":"
|
label-suffix=":"
|
||||||
label-width="90px"
|
label-width="90px"
|
||||||
:show-message="false"
|
label-position="top"
|
||||||
>
|
>
|
||||||
<el-form-item prop="loginName" label="用户名">
|
<el-form-item prop="loginName" label="用户名">
|
||||||
<el-input
|
<el-input
|
||||||
@ -44,20 +45,10 @@
|
|||||||
<el-input v-model.trim="loginForm.pwd" />
|
<el-input v-model.trim="loginForm.pwd" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item prop="jwtExpires" label="有效期">
|
<el-form-item prop="jwtExpires" label="有效期">
|
||||||
<el-radio-group v-model="isSession" class="login-indate">
|
<el-radio-group v-model="expireTime" class="login-indate">
|
||||||
<el-radio :value="true">一次性会话</el-radio>
|
<el-radio :value="expireEnum.ONE_SESSION">一次性会话</el-radio>
|
||||||
<el-radio :value="false">自定义(小时)</el-radio>
|
<el-radio :value="expireEnum.CURRENT_DAY">当天有效</el-radio>
|
||||||
<el-input-number
|
<el-radio :value="expireEnum.THREE_DAY">三天有效</el-radio>
|
||||||
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>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
@ -85,14 +76,19 @@ import { RSAEncrypt } from '@utils/index.js'
|
|||||||
// const router = useRouter()
|
// const router = useRouter()
|
||||||
const { proxy: { $store, $api, $message, $messageBox, $router } } = getCurrentInstance()
|
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 loginFormRefs = ref(null)
|
||||||
const isSession = ref(true)
|
|
||||||
const notKey = ref(false)
|
const notKey = ref(false)
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const loginForm = reactive({
|
const loginForm = reactive({
|
||||||
loginName: '',
|
loginName: '',
|
||||||
pwd: '',
|
pwd: '',
|
||||||
jwtExpires: 8
|
jwtExpires: 1
|
||||||
})
|
})
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
loginName: { required: true, message: '需输入用户名', trigger: 'change' },
|
loginName: { required: true, message: '需输入用户名', trigger: 'change' },
|
||||||
@ -102,9 +98,16 @@ const rules = reactive({
|
|||||||
const handleLogin = () => {
|
const handleLogin = () => {
|
||||||
loginFormRefs.value.validate().then(() => {
|
loginFormRefs.value.validate().then(() => {
|
||||||
let { jwtExpires, loginName, pwd } = loginForm
|
let { jwtExpires, loginName, pwd } = loginForm
|
||||||
jwtExpires = isSession.value ? '12h' : `${ jwtExpires }h`
|
switch (expireTime.value) {
|
||||||
if (!isSession.value) {
|
case expireEnum.ONE_SESSION:
|
||||||
localStorage.setItem('jwtExpires', jwtExpires)
|
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)
|
const ciphertext = RSAEncrypt(pwd)
|
||||||
if (ciphertext === -1) return $message.error({ message: '公钥加载失败', center: true })
|
if (ciphertext === -1) return $message.error({ message: '公钥加载失败', center: true })
|
||||||
@ -112,7 +115,7 @@ const handleLogin = () => {
|
|||||||
$api.login({ loginName, ciphertext, jwtExpires })
|
$api.login({ loginName, ciphertext, jwtExpires })
|
||||||
.then(({ data, msg }) => {
|
.then(({ data, msg }) => {
|
||||||
const { token } = data
|
const { token } = data
|
||||||
$store.setJwtToken(token, isSession.value)
|
$store.setJwtToken(token, expireEnum.ONE_SESSION === expireTime.value)
|
||||||
$store.setUser(loginName)
|
$store.setUser(loginName)
|
||||||
$message.success({ message: msg || 'success', center: true })
|
$message.success({ message: msg || 'success', center: true })
|
||||||
if (loginName === 'admin' && pwd === 'admin') {
|
if (loginName === 'admin' && pwd === 'admin') {
|
||||||
@ -156,7 +159,7 @@ onMounted(async () => {
|
|||||||
|
|
||||||
.login_box {
|
.login_box {
|
||||||
margin-top: -80px;
|
margin-top: -80px;
|
||||||
width: 500px;
|
width: 450px;
|
||||||
min-height: 250px;
|
min-height: 250px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
@ -182,7 +185,7 @@ onMounted(async () => {
|
|||||||
|
|
||||||
.login-indate {
|
.login-indate {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: nowrap;
|
// flex-wrap: nowrap;
|
||||||
|
|
||||||
.input {
|
.input {
|
||||||
margin-left: -25px;
|
margin-left: -25px;
|
||||||
|
@ -334,18 +334,17 @@ function extractLastCdPath(text) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const onData = () => {
|
const onData = () => {
|
||||||
// term.value.off('data', listenerInput)
|
|
||||||
term.value.onData((key) => {
|
term.value.onData((key) => {
|
||||||
// console.log('key: ', key)
|
console.log('key: ', key)
|
||||||
// if (key === '\x03') console.log('Ctrl + C detected')
|
|
||||||
if (socketConnected.value === false) return
|
if (socketConnected.value === false) return
|
||||||
if (isLongPressCtrl.value || isLongPressAlt.value) {
|
if (isLongPressCtrl.value || isLongPressAlt.value) {
|
||||||
const keyCode = key.toUpperCase().charCodeAt(0)
|
const keyCode = key.toUpperCase().charCodeAt(0)
|
||||||
|
console.log('keyCode: ', keyCode)
|
||||||
const ansiCode = keyCode - 64
|
const ansiCode = keyCode - 64
|
||||||
// console.log('ansiCode:', ansiCode)
|
console.log('ansiCode:', ansiCode)
|
||||||
if (ansiCode >= 1 && ansiCode <= 26) {
|
if (ansiCode >= 1 && ansiCode <= 26) {
|
||||||
const controlChar = String.fromCharCode(ansiCode)
|
const controlChar = String.fromCharCode(ansiCode)
|
||||||
socket.value.emit('input', controlChar)
|
socket.value.emit('input', isLongPressCtrl.value ? controlChar : `\x1b${ key }`)
|
||||||
}
|
}
|
||||||
emit('reset-long-press')
|
emit('reset-long-press')
|
||||||
return
|
return
|
||||||
|
Loading…
x
Reference in New Issue
Block a user