|
|
@ -51,20 +51,19 @@ |
|
|
|
</el-option-group> |
|
|
|
</el-option-group> |
|
|
|
</el-select> |
|
|
|
</el-select> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<template #toolbar v-if="!isOnSetting && redisIsExist"> |
|
|
|
<template #toolbar v-if="!isOnSetting && currentDB"> |
|
|
|
<div :class="{ mask: redisStatus != 'Running' }"> |
|
|
|
<div :class="{ mask: redisStatus != 'Running' && currentDB.from === 'local' }"> |
|
|
|
<el-button type="primary" plain @click="onChangePassword"> |
|
|
|
<el-button type="primary" plain @click="onChangePassword"> |
|
|
|
{{ $t('database.databaseConnInfo') }} |
|
|
|
{{ $t('database.databaseConnInfo') }} |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
<el-button @click="goRemoteDB" type="primary" plain> |
|
|
|
<el-button @click="goRemoteDB" type="primary" plain> |
|
|
|
{{ $t('database.remoteDB') }} |
|
|
|
{{ $t('database.remoteDB') }} |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
<el-button type="primary" plain @click="goDashboard" icon="Position">Redis-Commander</el-button> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</LayoutContent> |
|
|
|
</LayoutContent> |
|
|
|
|
|
|
|
|
|
|
|
<div v-if="redisIsExist && !isOnSetting" class="mt-5"> |
|
|
|
<div v-if="currentDB && !isOnSetting" class="mt-5"> |
|
|
|
<Terminal |
|
|
|
<Terminal |
|
|
|
:style="{ height: `calc(100vh - ${loadHeight()})` }" |
|
|
|
:style="{ height: `calc(100vh - ${loadHeight()})` }" |
|
|
|
:key="isRefresh" |
|
|
|
:key="isRefresh" |
|
|
@ -75,7 +74,7 @@ |
|
|
|
v-if="redisStatus !== 'Running' || (currentDB.from === 'remote' && !redisCliExist)" |
|
|
|
v-if="redisStatus !== 'Running' || (currentDB.from === 'remote' && !redisCliExist)" |
|
|
|
:style="{ height: `calc(100vh - ${loadHeight()})`, 'background-color': '#000' }" |
|
|
|
:style="{ height: `calc(100vh - ${loadHeight()})`, 'background-color': '#000' }" |
|
|
|
:description=" |
|
|
|
:description=" |
|
|
|
currentDB.from !== 'remote' |
|
|
|
currentDB.from === 'remote' |
|
|
|
? $t('commons.service.serviceNotStarted', ['Redis']) |
|
|
|
? $t('commons.service.serviceNotStarted', ['Redis']) |
|
|
|
: $t('database.redisCliHelper') |
|
|
|
: $t('database.redisCliHelper') |
|
|
|
" |
|
|
|
" |
|
|
@ -116,7 +115,6 @@ |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
<PortJumpDialog ref="dialogPortJumpRef" /> |
|
|
|
|
|
|
|
<QuickCmd ref="dialogQuickCmdRef" @reload="loadQuickCmd" /> |
|
|
|
<QuickCmd ref="dialogQuickCmdRef" @reload="loadQuickCmd" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
@ -126,10 +124,9 @@ import Setting from '@/views/database/redis/setting/index.vue'; |
|
|
|
import Password from '@/views/database/redis/password/index.vue'; |
|
|
|
import Password from '@/views/database/redis/password/index.vue'; |
|
|
|
import Terminal from '@/components/terminal/index.vue'; |
|
|
|
import Terminal from '@/components/terminal/index.vue'; |
|
|
|
import AppStatus from '@/components/app-status/index.vue'; |
|
|
|
import AppStatus from '@/components/app-status/index.vue'; |
|
|
|
import PortJumpDialog from '@/components/port-jump/index.vue'; |
|
|
|
|
|
|
|
import QuickCmd from '@/views/database/redis/command/index.vue'; |
|
|
|
import QuickCmd from '@/views/database/redis/command/index.vue'; |
|
|
|
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'; |
|
|
|
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'; |
|
|
|
import { CheckAppInstalled, GetAppPort } from '@/api/modules/app'; |
|
|
|
import { CheckAppInstalled } from '@/api/modules/app'; |
|
|
|
import router from '@/routers'; |
|
|
|
import router from '@/routers'; |
|
|
|
import { GlobalStore } from '@/store'; |
|
|
|
import { GlobalStore } from '@/store'; |
|
|
|
import { listDatabases, checkRedisCli, installRedisCli } from '@/api/modules/database'; |
|
|
|
import { listDatabases, checkRedisCli, installRedisCli } from '@/api/modules/database'; |
|
|
@ -149,7 +146,6 @@ const redisIsExist = ref(false); |
|
|
|
const redisStatus = ref(); |
|
|
|
const redisStatus = ref(); |
|
|
|
const terminalShow = ref(false); |
|
|
|
const terminalShow = ref(false); |
|
|
|
|
|
|
|
|
|
|
|
const redisCommandPort = ref(); |
|
|
|
|
|
|
|
const commandVisible = ref(false); |
|
|
|
const commandVisible = ref(false); |
|
|
|
|
|
|
|
|
|
|
|
const redisCliExist = ref(); |
|
|
|
const redisCliExist = ref(); |
|
|
@ -165,8 +161,6 @@ const quickCmd = ref(); |
|
|
|
const quickCmdList = ref([]); |
|
|
|
const quickCmdList = ref([]); |
|
|
|
const dialogQuickCmdRef = ref(); |
|
|
|
const dialogQuickCmdRef = ref(); |
|
|
|
|
|
|
|
|
|
|
|
const dialogPortJumpRef = ref(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const isRefresh = ref(); |
|
|
|
const isRefresh = ref(); |
|
|
|
|
|
|
|
|
|
|
|
const onSetting = async () => { |
|
|
|
const onSetting = async () => { |
|
|
@ -180,13 +174,6 @@ const loadHeight = () => { |
|
|
|
return globalStore.openMenuTabs ? '470px' : '380px'; |
|
|
|
return globalStore.openMenuTabs ? '470px' : '380px'; |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const goDashboard = async () => { |
|
|
|
|
|
|
|
if (redisCommandPort.value === 0) { |
|
|
|
|
|
|
|
commandVisible.value = true; |
|
|
|
|
|
|
|
return; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
dialogPortJumpRef.value.acceptParams({ port: redisCommandPort.value }); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
const getAppDetail = (key: string) => { |
|
|
|
const getAppDetail = (key: string) => { |
|
|
|
router.push({ name: 'AppAll', query: { install: key } }); |
|
|
|
router.push({ name: 'AppAll', query: { install: key } }); |
|
|
|
}; |
|
|
|
}; |
|
|
@ -197,11 +184,6 @@ const goRemoteDB = async () => { |
|
|
|
router.push({ name: 'Redis-Remote' }); |
|
|
|
router.push({ name: 'Redis-Remote' }); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const loadDashboardPort = async () => { |
|
|
|
|
|
|
|
const res = await GetAppPort('redis-commander', ''); |
|
|
|
|
|
|
|
redisCommandPort.value = res.data; |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const passwordRef = ref(); |
|
|
|
const passwordRef = ref(); |
|
|
|
const onChangePassword = async () => { |
|
|
|
const onChangePassword = async () => { |
|
|
|
passwordRef.value!.acceptParams({ database: currentDBName.value }); |
|
|
|
passwordRef.value!.acceptParams({ database: currentDBName.value }); |
|
|
@ -331,8 +313,14 @@ const closeTerminal = async (isKeepShow: boolean) => { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const checkCliValid = async () => { |
|
|
|
const checkCliValid = async () => { |
|
|
|
const res = await checkRedisCli(); |
|
|
|
await checkRedisCli() |
|
|
|
redisCliExist.value = res.data; |
|
|
|
.then((res) => { |
|
|
|
|
|
|
|
redisCliExist.value = res.data; |
|
|
|
|
|
|
|
loadDBOptions(); |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
.catch(() => { |
|
|
|
|
|
|
|
loadDBOptions(); |
|
|
|
|
|
|
|
}); |
|
|
|
}; |
|
|
|
}; |
|
|
|
const installCli = async () => { |
|
|
|
const installCli = async () => { |
|
|
|
loading.value = true; |
|
|
|
loading.value = true; |
|
|
@ -341,6 +329,7 @@ const installCli = async () => { |
|
|
|
loading.value = false; |
|
|
|
loading.value = false; |
|
|
|
redisCliExist.value = true; |
|
|
|
redisCliExist.value = true; |
|
|
|
MsgSuccess(i18n.global.t('commons.msg.operationSuccess')); |
|
|
|
MsgSuccess(i18n.global.t('commons.msg.operationSuccess')); |
|
|
|
|
|
|
|
reOpenTerminal(); |
|
|
|
}) |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
.catch(() => { |
|
|
|
loading.value = false; |
|
|
|
loading.value = false; |
|
|
@ -363,9 +352,7 @@ const onSetQuickCmd = () => { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
onMounted(() => { |
|
|
|
loadDBOptions(); |
|
|
|
|
|
|
|
loadQuickCmd(); |
|
|
|
loadQuickCmd(); |
|
|
|
loadDashboardPort(); |
|
|
|
|
|
|
|
checkCliValid(); |
|
|
|
checkCliValid(); |
|
|
|
}); |
|
|
|
}); |
|
|
|
const onBefore = () => { |
|
|
|
const onBefore = () => { |
|
|
|