mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2024-11-28 05:15:04 +08:00
style: 统一优化页面布局 (#5654)
This commit is contained in:
zhengkunwang
zhengkunwang223
parent
87be4af655
commit
a1b1790935
@ -1,14 +1,19 @@
|
||||
<template>
|
||||
<div class="complex-table">
|
||||
<div class="complex-table__header" v-if="$slots.header || header">
|
||||
<div class="complex-table__header" v-if="slots.header || header">
|
||||
<slot name="header">{{ header }}</slot>
|
||||
</div>
|
||||
<div v-if="$slots.toolbar" style="margin-bottom: 10px">
|
||||
<div v-if="slots.toolbar" class="bt-5">
|
||||
<slot name="toolbar"></slot>
|
||||
</div>
|
||||
|
||||
<div class="complex-table__body">
|
||||
<fu-table v-bind="$attrs" ref="tableRef" @selection-change="handleSelectionChange">
|
||||
<fu-table
|
||||
v-bind="$attrs"
|
||||
ref="tableRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:max-height="tableHeight"
|
||||
>
|
||||
<slot></slot>
|
||||
<template #empty>
|
||||
<slot name="empty"></slot>
|
||||
@ -35,6 +40,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted } from 'vue';
|
||||
import { GlobalStore } from '@/store';
|
||||
const slots = useSlots();
|
||||
|
||||
defineOptions({ name: 'ComplexTable' });
|
||||
const props = defineProps({
|
||||
@ -44,16 +50,18 @@ const props = defineProps({
|
||||
required: false,
|
||||
default: () => {},
|
||||
},
|
||||
heightDiff: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['search', 'update:selects', 'update:paginationConfig']);
|
||||
|
||||
const globalStore = GlobalStore();
|
||||
|
||||
const mobile = computed(() => {
|
||||
return globalStore.isMobile();
|
||||
});
|
||||
|
||||
const tableRef = ref();
|
||||
const tableHeight = ref(0);
|
||||
|
||||
function currentChange() {
|
||||
emit('search');
|
||||
@ -94,6 +102,17 @@ onMounted(() => {
|
||||
props.paginationConfig.pageSize = itemSize;
|
||||
}
|
||||
}
|
||||
let heightDiff = 320;
|
||||
if (props.heightDiff) {
|
||||
heightDiff = props.heightDiff;
|
||||
}
|
||||
|
||||
tableHeight.value = window.innerHeight - heightDiff;
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
tableHeight.value = window.innerHeight - heightDiff;
|
||||
})();
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -9,6 +9,7 @@ import TableSetting from './table-setting/index.vue';
|
||||
import Tooltip from '@/components/tooltip/index.vue';
|
||||
import CopyButton from '@/components/copy-button/index.vue';
|
||||
import MsgInfo from '@/components/msg-info/index.vue';
|
||||
import MainDiv from '@/components/main-div/index.vue';
|
||||
export default {
|
||||
install(app: App) {
|
||||
app.component(LayoutContent.name, LayoutContent);
|
||||
@ -21,5 +22,6 @@ export default {
|
||||
app.component(TableSearch.name, TableSearch);
|
||||
app.component(TableSetting.name, TableSetting);
|
||||
app.component(MsgInfo.name, MsgInfo);
|
||||
app.component(MainDiv.name, MainDiv);
|
||||
},
|
||||
};
|
||||
|
||||
@ -3,9 +3,7 @@
|
||||
<div class="content-container__app" v-if="slots.app">
|
||||
<slot name="app"></slot>
|
||||
</div>
|
||||
<div class="content-container__toolbar" v-if="slots.toolbar">
|
||||
<slot name="toolbar"></slot>
|
||||
</div>
|
||||
|
||||
<div class="content-container__search" v-if="slots.search">
|
||||
<el-card>
|
||||
<slot name="search"></slot>
|
||||
@ -31,21 +29,30 @@
|
||||
:reload="reload"
|
||||
v-if="showBack"
|
||||
>
|
||||
<template v-if="slots.buttons" #buttons>
|
||||
<template v-if="slots.leftToolBar" #buttons>
|
||||
<slot name="leftToolBar"></slot>
|
||||
</template>
|
||||
<template v-else-if="slots.buttons" #buttons>
|
||||
<slot name="buttons"></slot>
|
||||
</template>
|
||||
</back-button>
|
||||
<div class="flex justify-between" v-else>
|
||||
<div>
|
||||
{{ title }}
|
||||
<el-divider direction="vertical" v-if="slots.leftToolBar || slots.buttons" />
|
||||
<slot name="leftToolBar" v-if="slots.leftToolBar"></slot>
|
||||
<slot name="buttons" v-if="slots.buttons"></slot>
|
||||
</div>
|
||||
<div class="flex justify-end" v-if="slots.rightToolBar || slots.rightButton">
|
||||
<slot name="rightToolBar"></slot>
|
||||
<slot name="rightButton"></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span v-else>
|
||||
{{ title }}
|
||||
<span v-if="slots.buttons">
|
||||
<el-divider direction="vertical" />
|
||||
<slot name="buttons"></slot>
|
||||
</span>
|
||||
<span class="float-right">
|
||||
<slot v-if="slots.rightButton" name="rightButton"></slot>
|
||||
</span>
|
||||
<span v-if="slots.toolbar">
|
||||
<slot name="toolbar"></slot>
|
||||
</span>
|
||||
|
||||
<div v-if="prop.divider">
|
||||
<div class="divider"></div>
|
||||
</div>
|
||||
@ -103,10 +110,6 @@ const showBack = computed(() => {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.content-container__toolbar {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.content-container_form {
|
||||
text-align: -webkit-center;
|
||||
width: 60%;
|
||||
@ -134,6 +137,6 @@ const showBack = computed(() => {
|
||||
position: relative;
|
||||
}
|
||||
.main-content {
|
||||
margin-top: 20px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
</style>
|
||||
|
||||
32
frontend/src/components/main-div/index.vue
Normal file
32
frontend/src/components/main-div/index.vue
Normal file
@ -0,0 +1,32 @@
|
||||
<template>
|
||||
<div class="overflow-y-auto overflow-x-hidden" :style="'height: ' + mainHeight + 'px'">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps({
|
||||
heightDiff: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
});
|
||||
|
||||
let mainHeight = ref(0);
|
||||
|
||||
onMounted(() => {
|
||||
let heightDiff = 300;
|
||||
if (props.heightDiff) {
|
||||
heightDiff = props.heightDiff;
|
||||
}
|
||||
|
||||
mainHeight.value = window.innerHeight - heightDiff;
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
mainHeight.value = window.innerHeight - heightDiff;
|
||||
})();
|
||||
};
|
||||
});
|
||||
|
||||
defineOptions({ name: 'MainDiv' });
|
||||
</script>
|
||||
@ -1,27 +1,26 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-popover placement="bottom-start" :width="240" trigger="click">
|
||||
<el-popover placement="bottom-start" :width="200" trigger="click">
|
||||
<template #reference>
|
||||
<el-button round class="timer-button">{{ $t('commons.table.tableSetting') }}</el-button>
|
||||
<el-button class="timer-button" :icon="Refresh"></el-button>
|
||||
</template>
|
||||
<div style="margin-left: 15px">
|
||||
<span>{{ $t('commons.table.refreshRate') }}</span>
|
||||
<el-select style="margin-left: 5px; width: 120px" v-model="refreshRate" @change="changeRefresh">
|
||||
<el-option :label="$t('commons.table.noRefresh')" :value="0"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [5])" :value="5"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [10])" :value="10"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [30])" :value="30"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [60])" :value="60"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [120])" :value="120"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [300])" :value="300"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-select v-model="refreshRate" @change="changeRefresh">
|
||||
<template #prefix>{{ $t('commons.table.refreshRate') }}</template>
|
||||
<el-option :label="$t('commons.table.noRefresh')" :value="0"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [5])" :value="5"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [10])" :value="10"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [30])" :value="30"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [60])" :value="60"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [120])" :value="120"></el-option>
|
||||
<el-option :label="$t('commons.table.refreshRateUnit', [300])" :value="300"></el-option>
|
||||
</el-select>
|
||||
</el-popover>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import { Refresh } from '@element-plus/icons-vue';
|
||||
defineOptions({ name: 'TableSetting' });
|
||||
|
||||
const refreshRate = ref<number>(0);
|
||||
|
||||
@ -23,7 +23,7 @@ import { DeviceType } from '@/enums/app';
|
||||
import { getSystemAvailable } from '@/api/modules/setting';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { loadProductProFromDB } from '@/utils/xpack';
|
||||
import { useTheme } from '@/hooks/use-theme';
|
||||
import { useTheme } from '@/global/use-theme';
|
||||
const { switchTheme } = useTheme();
|
||||
useResize();
|
||||
|
||||
|
||||
@ -242,22 +242,8 @@ html {
|
||||
}
|
||||
}
|
||||
|
||||
// search条圆角
|
||||
.search-button {
|
||||
float: right;
|
||||
width: 250px;
|
||||
margin-right: 10px;
|
||||
.el-input__wrapper {
|
||||
border-radius: 50px;
|
||||
}
|
||||
.el-input-group__prepend {
|
||||
border-top-left-radius: 50px;
|
||||
border-bottom-left-radius: 50px;
|
||||
}
|
||||
.el-input-group__append {
|
||||
border-top-right-radius: 50px;
|
||||
border-bottom-right-radius: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
// drawer头部增加按钮
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
--el-color-primary-light-7: #b2cef9;
|
||||
--el-color-primary-light-8: #ccdefb;
|
||||
--el-color-primary-light-9: #e5eefd;
|
||||
--el-font-weight-primary: 400;
|
||||
}
|
||||
|
||||
html {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<LayoutContent v-loading="loading" v-if="!showDetail" :title="$t('app.app')">
|
||||
<template #toolbar>
|
||||
<template #search>
|
||||
<el-row :gutter="5">
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<el-button
|
||||
@ -49,115 +49,128 @@
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="searchByName()" v-model:searchName="req.name" />
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4"></el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template #rightButton>
|
||||
<div class="flex justify-end">
|
||||
<div class="mr-10">
|
||||
<el-checkbox v-model="req.resource" true-value="all" false-value="remote" @change="search(req)">
|
||||
{{ $t('app.showLocal') }}
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<fu-table-pagination
|
||||
v-model:current-page="paginationConfig.currentPage"
|
||||
v-model:page-size="paginationConfig.pageSize"
|
||||
v-bind="paginationConfig"
|
||||
@change="search(req)"
|
||||
:layout="mobile ? ' prev, pager, next' : ' prev, pager, next'"
|
||||
/>
|
||||
<el-badge is-dot :hidden="!canUpdate" class="ml-5">
|
||||
<el-button @click="sync" type="primary" plain :disabled="syncing">
|
||||
{{ $t('app.syncAppList') }}
|
||||
</el-button>
|
||||
</el-badge>
|
||||
</div>
|
||||
<template #leftToolBar>
|
||||
<el-badge is-dot :hidden="!canUpdate">
|
||||
<el-button @click="sync" type="primary" plain :disabled="syncing">
|
||||
{{ $t('app.syncAppList') }}
|
||||
</el-button>
|
||||
</el-badge>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<!-- <fu-table-pagination
|
||||
v-model:current-page="paginationConfig.currentPage"
|
||||
v-model:page-size="paginationConfig.pageSize"
|
||||
v-bind="paginationConfig"
|
||||
@change="search(req)"
|
||||
:layout="mobile ? ' prev, pager, next' : ' prev, pager, next'"
|
||||
class="mr-2.5"
|
||||
/> -->
|
||||
<el-checkbox
|
||||
class="!mr-2.5"
|
||||
v-model="req.resource"
|
||||
true-value="all"
|
||||
false-value="remote"
|
||||
@change="search(req)"
|
||||
>
|
||||
{{ $t('app.showLocal') }}
|
||||
</el-checkbox>
|
||||
<TableSearch @search="searchByName()" v-model:searchName="req.name" />
|
||||
</template>
|
||||
<template #main>
|
||||
<el-alert type="info" :title="$t('app.appHelper')" :closable="false" />
|
||||
<el-row :gutter="5">
|
||||
<el-col
|
||||
class="app-col-12"
|
||||
v-for="(app, index) in apps"
|
||||
:key="index"
|
||||
:xs="24"
|
||||
:sm="12"
|
||||
:md="8"
|
||||
:lg="8"
|
||||
:xl="8"
|
||||
>
|
||||
<div class="app-card">
|
||||
<el-card class="e-card" @click.stop="openDetail(app.key)">
|
||||
<el-row :gutter="20">
|
||||
<el-col :xs="8" :sm="6" :md="6" :lg="6" :xl="5">
|
||||
<div class="app-icon-container">
|
||||
<div class="app-icon">
|
||||
<el-avatar
|
||||
shape="square"
|
||||
:size="60"
|
||||
:src="'data:image/png;base64,' + app.icon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="16" :sm="18" :md="18" :lg="18" :xl="19">
|
||||
<div class="app-content">
|
||||
<div class="app-header">
|
||||
<span class="app-title">{{ app.name }}</span>
|
||||
<el-text type="success" class="!ml-2" v-if="app.installed">
|
||||
{{ $t('app.allReadyInstalled') }}
|
||||
</el-text>
|
||||
<el-button
|
||||
class="app-button"
|
||||
type="primary"
|
||||
plain
|
||||
round
|
||||
size="small"
|
||||
:disabled="
|
||||
(app.installed && app.limit == 1) || app.status === 'TakeDown'
|
||||
"
|
||||
@click.stop="openInstall(app)"
|
||||
>
|
||||
{{ $t('app.install') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="app-desc">
|
||||
<span class="desc">
|
||||
{{
|
||||
language == 'zh' || language == 'tw'
|
||||
? app.shortDescZh
|
||||
: app.shortDescEn
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="app-tag">
|
||||
<el-tag v-for="(tag, ind) in app.tags" :key="ind" class="p-mr-5">
|
||||
<span>
|
||||
{{ language == 'zh' || language == 'tw' ? tag.name : tag.key }}
|
||||
</span>
|
||||
</el-tag>
|
||||
<el-tag v-if="app.status === 'TakeDown'" class="p-mr-5">
|
||||
<span style="color: red">{{ $t('app.takeDown') }}</span>
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="page-button">
|
||||
<fu-table-pagination
|
||||
v-model:current-page="paginationConfig.currentPage"
|
||||
v-model:page-size="paginationConfig.pageSize"
|
||||
v-bind="paginationConfig"
|
||||
@change="search(req)"
|
||||
:page-sizes="[30, 60, 90]"
|
||||
:layout="mobile ? 'total, prev, pager, next' : 'total, sizes, prev, pager, next, jumper'"
|
||||
/>
|
||||
<div>
|
||||
<MainDiv :heightDiff="350">
|
||||
<el-alert type="info" :title="$t('app.appHelper')" :closable="false" />
|
||||
<el-row :gutter="5">
|
||||
<el-col
|
||||
class="app-col-12"
|
||||
v-for="(app, index) in apps"
|
||||
:key="index"
|
||||
:xs="24"
|
||||
:sm="12"
|
||||
:md="8"
|
||||
:lg="8"
|
||||
:xl="8"
|
||||
>
|
||||
<div class="app-card">
|
||||
<el-card class="e-card" @click.stop="openDetail(app.key)">
|
||||
<el-row :gutter="20">
|
||||
<el-col :xs="8" :sm="6" :md="6" :lg="6" :xl="5">
|
||||
<div class="app-icon-container">
|
||||
<div class="app-icon">
|
||||
<el-avatar
|
||||
shape="square"
|
||||
:size="60"
|
||||
:src="'data:image/png;base64,' + app.icon"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="16" :sm="18" :md="18" :lg="18" :xl="19">
|
||||
<div class="app-content">
|
||||
<div class="app-header">
|
||||
<span class="app-title">{{ app.name }}</span>
|
||||
<el-text type="success" class="!ml-2" v-if="app.installed">
|
||||
{{ $t('app.allReadyInstalled') }}
|
||||
</el-text>
|
||||
<el-button
|
||||
class="app-button"
|
||||
type="primary"
|
||||
plain
|
||||
round
|
||||
size="small"
|
||||
:disabled="
|
||||
(app.installed && app.limit == 1) ||
|
||||
app.status === 'TakeDown'
|
||||
"
|
||||
@click.stop="openInstall(app)"
|
||||
>
|
||||
{{ $t('app.install') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="app-desc">
|
||||
<span class="desc">
|
||||
{{
|
||||
language == 'zh' || language == 'tw'
|
||||
? app.shortDescZh
|
||||
: app.shortDescEn
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="app-tag">
|
||||
<el-tag v-for="(tag, ind) in app.tags" :key="ind" class="p-mr-5">
|
||||
<span>
|
||||
{{
|
||||
language == 'zh' || language == 'tw'
|
||||
? tag.name
|
||||
: tag.key
|
||||
}}
|
||||
</span>
|
||||
</el-tag>
|
||||
<el-tag v-if="app.status === 'TakeDown'" class="p-mr-5">
|
||||
<span style="color: red">{{ $t('app.takeDown') }}</span>
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</MainDiv>
|
||||
<div class="page-button">
|
||||
<fu-table-pagination
|
||||
v-model:current-page="paginationConfig.currentPage"
|
||||
v-model:page-size="paginationConfig.pageSize"
|
||||
v-bind="paginationConfig"
|
||||
@change="search(req)"
|
||||
:page-sizes="[30, 60, 90]"
|
||||
:layout="mobile ? 'total, prev, pager, next' : 'total, sizes, prev, pager, next, jumper'"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</LayoutContent>
|
||||
@ -211,6 +224,7 @@ const detailRef = ref();
|
||||
const installRef = ref();
|
||||
const installKey = ref('');
|
||||
const moreTag = ref('');
|
||||
const mainHeight = ref(0);
|
||||
|
||||
const search = async (req: App.AppReq) => {
|
||||
loading.value = true;
|
||||
@ -310,6 +324,12 @@ onMounted(() => {
|
||||
installRef.value.acceptParams(params);
|
||||
}
|
||||
search(req);
|
||||
mainHeight.value = window.innerHeight - 380;
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
mainHeight.value = window.innerHeight - 380;
|
||||
})();
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,63 +1,55 @@
|
||||
<template>
|
||||
<LayoutContent v-loading="loading || syncLoading" :title="activeName">
|
||||
<template #toolbar>
|
||||
<el-row :gutter="5">
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<div>
|
||||
<template #search>
|
||||
<div>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="activeTag === 'all' ? '' : 'no-active'"
|
||||
@click="changeTag('all')"
|
||||
:type="activeTag === 'all' ? 'primary' : ''"
|
||||
:plain="activeTag !== 'all'"
|
||||
>
|
||||
{{ $t('app.all') }}
|
||||
</el-button>
|
||||
<div v-for="item in tags.slice(0, 7)" :key="item.key" class="inline">
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="activeTag === item.key ? '' : 'no-active'"
|
||||
@click="changeTag(item.key)"
|
||||
:type="activeTag === item.key ? 'primary' : ''"
|
||||
:plain="activeTag !== item.key"
|
||||
>
|
||||
{{ language == 'zh' || language == 'tw' ? item.name : item.key }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="inline">
|
||||
<el-dropdown>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="activeTag === 'all' ? '' : 'no-active'"
|
||||
@click="changeTag('all')"
|
||||
:type="activeTag === 'all' ? 'primary' : ''"
|
||||
:plain="activeTag !== 'all'"
|
||||
:type="moreTag !== '' ? 'primary' : ''"
|
||||
:class="moreTag !== '' ? '' : 'no-active'"
|
||||
>
|
||||
{{ $t('app.all') }}
|
||||
{{ moreTag == '' ? $t('tabs.more') : getTagValue(moreTag) }}
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
<div v-for="item in tags.slice(0, 7)" :key="item.key" class="inline">
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="activeTag === item.key ? '' : 'no-active'"
|
||||
@click="changeTag(item.key)"
|
||||
:type="activeTag === item.key ? 'primary' : ''"
|
||||
:plain="activeTag !== item.key"
|
||||
>
|
||||
{{ language == 'zh' || language == 'tw' ? item.name : item.key }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="inline">
|
||||
<el-dropdown>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:type="moreTag !== '' ? 'primary' : ''"
|
||||
:class="moreTag !== '' ? '' : 'no-active'"
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
v-for="item in tags.slice(7)"
|
||||
@click="changeTag(item.key)"
|
||||
:key="item.key"
|
||||
>
|
||||
{{ moreTag == '' ? $t('tabs.more') : getTagValue(moreTag) }}
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item
|
||||
v-for="item in tags.slice(7)"
|
||||
@click="changeTag(item.key)"
|
||||
:key="item.key"
|
||||
>
|
||||
{{ language == 'zh' || language == 'tw' ? item.name : item.key }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="search()" v-model:searchName="searchReq.name" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
{{ language == 'zh' || language == 'tw' ? item.name : item.key }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #rightButton>
|
||||
<template #leftToolBar>
|
||||
<el-button @click="sync" type="primary" plain v-if="mode === 'installed' && data != null">
|
||||
{{ $t('app.sync') }}
|
||||
</el-button>
|
||||
@ -65,103 +57,124 @@
|
||||
{{ $t('app.showIgnore') }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchReq.name" />
|
||||
</template>
|
||||
<template #main>
|
||||
<el-alert type="info" :closable="false" v-if="mode === 'installed'">
|
||||
<template #title>
|
||||
<span class="flx-align-center">
|
||||
{{ $t('app.installHelper') }}
|
||||
<el-link class="ml-5" icon="Position" @click="quickJump()" type="primary">
|
||||
{{ $t('firewall.quickJump') }}
|
||||
</el-link>
|
||||
|
||||
</span>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-alert type="info" :title="$t('app.upgradeHelper')" :closable="false" v-if="mode === 'upgrade'" />
|
||||
<div class="update-prompt" v-if="data == null">
|
||||
<span>{{ mode === 'upgrade' ? $t('app.updatePrompt') : $t('app.installPrompt') }}</span>
|
||||
<div>
|
||||
<img src="@/assets/images/no_update_app.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="5">
|
||||
<el-col
|
||||
v-for="(installed, index) in data"
|
||||
:key="index"
|
||||
:xs="24"
|
||||
:sm="24"
|
||||
:md="24"
|
||||
:lg="12"
|
||||
:xl="12"
|
||||
class="install-card-col-12"
|
||||
>
|
||||
<div class="install-card">
|
||||
<el-card class="e-card">
|
||||
<el-row :gutter="20">
|
||||
<el-col :xs="3" :sm="3" :md="3" :lg="4" :xl="4">
|
||||
<div class="icon" @click.stop="openDetail(installed.appKey)">
|
||||
<el-avatar
|
||||
shape="square"
|
||||
:size="66"
|
||||
:src="'data:image/png;base64,' + installed.icon"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="21" :md="21" :lg="20" :xl="20">
|
||||
<div class="a-detail">
|
||||
<div class="d-name">
|
||||
<el-button link type="info">
|
||||
<span class="name">{{ installed.name }}</span>
|
||||
</el-button>
|
||||
<div>
|
||||
<MainDiv :heightDiff="mode === 'upgrade' ? 280 : 380">
|
||||
<el-alert
|
||||
type="info"
|
||||
:title="$t('app.upgradeHelper')"
|
||||
:closable="false"
|
||||
v-if="mode === 'upgrade'"
|
||||
/>
|
||||
|
||||
<span class="status">
|
||||
<Status :key="installed.status" :status="installed.status"></Status>
|
||||
</span>
|
||||
<span class="msg">
|
||||
<el-popover
|
||||
v-if="isAppErr(installed)"
|
||||
placement="bottom"
|
||||
:width="400"
|
||||
trigger="hover"
|
||||
:content="installed.message"
|
||||
:popper-options="options"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="danger">
|
||||
<el-icon><Warning /></el-icon>
|
||||
</el-button>
|
||||
</template>
|
||||
<div class="app-error">
|
||||
{{ installed.message }}
|
||||
</div>
|
||||
</el-popover>
|
||||
</span>
|
||||
<span class="ml-1">
|
||||
<el-tooltip effect="dark" :content="$t('app.toFolder')" placement="top">
|
||||
<el-button type="primary" link @click="toFolder(installed.path)">
|
||||
<el-icon>
|
||||
<FolderOpened />
|
||||
</el-icon>
|
||||
<el-alert type="info" :closable="false" v-if="mode === 'installed'">
|
||||
<template #title>
|
||||
<span class="flx-align-center">
|
||||
{{ $t('app.installHelper') }}
|
||||
<el-link class="ml-5" icon="Position" @click="quickJump()" type="primary">
|
||||
{{ $t('firewall.quickJump') }}
|
||||
</el-link>
|
||||
|
||||
</span>
|
||||
</template>
|
||||
</el-alert>
|
||||
<div class="update-prompt" v-if="data == null">
|
||||
<span>{{ mode === 'upgrade' ? $t('app.updatePrompt') : $t('app.installPrompt') }}</span>
|
||||
<div>
|
||||
<img src="@/assets/images/no_update_app.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<el-row :gutter="5">
|
||||
<el-col
|
||||
v-for="(installed, index) in data"
|
||||
:key="index"
|
||||
:xs="24"
|
||||
:sm="24"
|
||||
:md="24"
|
||||
:lg="12"
|
||||
:xl="12"
|
||||
class="install-card-col-12"
|
||||
>
|
||||
<div class="install-card">
|
||||
<el-card class="e-card">
|
||||
<el-row :gutter="20">
|
||||
<el-col :xs="3" :sm="3" :md="3" :lg="4" :xl="4">
|
||||
<div class="icon" @click.stop="openDetail(installed.appKey)">
|
||||
<el-avatar
|
||||
shape="square"
|
||||
:size="66"
|
||||
:src="'data:image/png;base64,' + installed.icon"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="21" :md="21" :lg="20" :xl="20">
|
||||
<div class="a-detail">
|
||||
<div class="d-name">
|
||||
<el-button link type="info">
|
||||
<span class="name">{{ installed.name }}</span>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
<span class="ml-1">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="$t('commons.button.log')"
|
||||
placement="top"
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="openLog(installed)"
|
||||
:disabled="installed.status === 'DownloadErr'"
|
||||
>
|
||||
<el-icon><Tickets /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
|
||||
<span class="status">
|
||||
<Status
|
||||
:key="installed.status"
|
||||
:status="installed.status"
|
||||
></Status>
|
||||
</span>
|
||||
<span class="msg">
|
||||
<el-popover
|
||||
v-if="isAppErr(installed)"
|
||||
placement="bottom"
|
||||
:width="400"
|
||||
trigger="hover"
|
||||
:content="installed.message"
|
||||
:popper-options="options"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="danger">
|
||||
<el-icon><Warning /></el-icon>
|
||||
</el-button>
|
||||
</template>
|
||||
<div class="app-error">
|
||||
{{ installed.message }}
|
||||
</div>
|
||||
</el-popover>
|
||||
</span>
|
||||
<span class="ml-1">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="$t('app.toFolder')"
|
||||
placement="top"
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="toFolder(installed.path)"
|
||||
>
|
||||
<el-icon>
|
||||
<FolderOpened />
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
<span class="ml-1">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="$t('commons.button.log')"
|
||||
placement="top"
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="openLog(installed)"
|
||||
:disabled="installed.status === 'DownloadErr'"
|
||||
>
|
||||
<el-icon><Tickets /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
|
||||
<el-button
|
||||
class="h-button"
|
||||
@ -215,60 +228,65 @@
|
||||
{{ $t('app.version') }}：{{ installed.version }}
|
||||
</el-button>
|
||||
|
||||
<el-button
|
||||
v-if="installed.httpPort > 0"
|
||||
@click="goDashboard(installed.httpPort, 'http')"
|
||||
class="tagMargin"
|
||||
icon="Position"
|
||||
plain
|
||||
size="small"
|
||||
>
|
||||
{{ $t('app.busPort') }}：{{ installed.httpPort }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="installed.httpPort > 0"
|
||||
@click="goDashboard(installed.httpPort, 'http')"
|
||||
class="tagMargin"
|
||||
icon="Position"
|
||||
plain
|
||||
size="small"
|
||||
>
|
||||
{{ $t('app.busPort') }}：{{ installed.httpPort }}
|
||||
</el-button>
|
||||
|
||||
<el-button
|
||||
v-if="installed.httpsPort > 0"
|
||||
@click="goDashboard(installed.httpsPort, 'https')"
|
||||
class="tagMargin"
|
||||
icon="Position"
|
||||
plain
|
||||
size="small"
|
||||
>
|
||||
{{ $t('app.busPort') }}：{{ installed.httpsPort }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="installed.httpsPort > 0"
|
||||
@click="goDashboard(installed.httpsPort, 'https')"
|
||||
class="tagMargin"
|
||||
icon="Position"
|
||||
plain
|
||||
size="small"
|
||||
>
|
||||
{{ $t('app.busPort') }}：{{ installed.httpsPort }}
|
||||
</el-button>
|
||||
|
||||
<div class="description">
|
||||
<span>
|
||||
{{ $t('app.alreadyRun') }}： {{ getAge(installed.createdAt) }}
|
||||
</span>
|
||||
<div class="description">
|
||||
<span>
|
||||
{{ $t('app.alreadyRun') }}：
|
||||
{{ getAge(installed.createdAt) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="app-divider" />
|
||||
<div
|
||||
class="d-button"
|
||||
v-if="mode === 'installed' && installed.status != 'Installing'"
|
||||
>
|
||||
<el-button
|
||||
class="app-button"
|
||||
v-for="(button, key) in buttons"
|
||||
:key="key"
|
||||
:type="
|
||||
button.disabled && button.disabled(installed) ? 'info' : ''
|
||||
"
|
||||
plain
|
||||
round
|
||||
size="small"
|
||||
@click="button.click(installed)"
|
||||
:disabled="button.disabled && button.disabled(installed)"
|
||||
>
|
||||
{{ button.label }}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="app-divider" />
|
||||
<div
|
||||
class="d-button"
|
||||
v-if="mode === 'installed' && installed.status != 'Installing'"
|
||||
>
|
||||
<el-button
|
||||
class="app-button"
|
||||
v-for="(button, key) in buttons"
|
||||
:key="key"
|
||||
:type="button.disabled && button.disabled(installed) ? 'info' : ''"
|
||||
plain
|
||||
round
|
||||
size="small"
|
||||
@click="button.click(installed)"
|
||||
:disabled="button.disabled && button.disabled(installed)"
|
||||
>
|
||||
{{ button.label }}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</MainDiv>
|
||||
</div>
|
||||
<div class="page-button" v-if="mode === 'installed'">
|
||||
<fu-table-pagination
|
||||
v-model:current-page="paginationConfig.currentPage"
|
||||
|
||||
@ -24,18 +24,14 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog()">
|
||||
{{ $t('container.createCompose') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog()">
|
||||
{{ $t('container.createCompose') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -43,6 +39,7 @@
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
@search="search"
|
||||
:heightDiff="350"
|
||||
>
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
|
||||
@ -6,62 +6,42 @@
|
||||
<span>{{ $t('container.startIn') }}</span>
|
||||
</el-card>
|
||||
<LayoutContent :title="$t('container.container')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #rightButton>
|
||||
<div class="flex justify-end">
|
||||
<div class="mr-10">
|
||||
<el-checkbox v-model="includeAppStore" @change="search()">
|
||||
{{ $t('container.includeAppstore') }}
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<fu-table-column-select
|
||||
:columns="columns"
|
||||
trigger="hover"
|
||||
:title="$t('commons.table.selectColumn')"
|
||||
popper-class="popper-class"
|
||||
/>
|
||||
</div>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('container.create') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.containerPrune') }}
|
||||
</el-button>
|
||||
<el-button-group class="ml-4">
|
||||
<el-button :disabled="checkStatus('start', null)" @click="onOperate('start', null)">
|
||||
{{ $t('container.start') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('stop', null)" @click="onOperate('stop', null)">
|
||||
{{ $t('container.stop') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('restart', null)" @click="onOperate('restart', null)">
|
||||
{{ $t('container.restart') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('kill', null)" @click="onOperate('kill', null)">
|
||||
{{ $t('container.kill') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('pause', null)" @click="onOperate('pause', null)">
|
||||
{{ $t('container.pause') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('unpause', null)" @click="onOperate('unpause', null)">
|
||||
{{ $t('container.unpause') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('remove', null)" @click="onOperate('remove', null)">
|
||||
{{ $t('container.remove') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('container.create') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.containerPrune') }}
|
||||
</el-button>
|
||||
<el-button-group class="ml-4">
|
||||
<el-button :disabled="checkStatus('start', null)" @click="onOperate('start', null)">
|
||||
{{ $t('container.start') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('stop', null)" @click="onOperate('stop', null)">
|
||||
{{ $t('container.stop') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('restart', null)" @click="onOperate('restart', null)">
|
||||
{{ $t('container.restart') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('kill', null)" @click="onOperate('kill', null)">
|
||||
{{ $t('container.kill') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('pause', null)" @click="onOperate('pause', null)">
|
||||
{{ $t('container.pause') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('unpause', null)" @click="onOperate('unpause', null)">
|
||||
{{ $t('container.unpause') }}
|
||||
</el-button>
|
||||
<el-button :disabled="checkStatus('remove', null)" @click="onOperate('remove', null)">
|
||||
{{ $t('container.remove') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<TableSetting title="container-refresh" @search="refresh()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-select v-model="searchState" @change="search()" clearable class="p-w-200">
|
||||
<template #rightToolBar>
|
||||
<el-checkbox v-model="includeAppStore" @change="search()" class="!mr-2.5">
|
||||
{{ $t('container.includeAppstore') }}
|
||||
</el-checkbox>
|
||||
<el-select v-model="searchState" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value="all"></el-option>
|
||||
<el-option :label="$t('commons.status.created')" value="created"></el-option>
|
||||
@ -72,6 +52,14 @@
|
||||
<el-option :label="$t('commons.status.exited')" value="exited"></el-option>
|
||||
<el-option :label="$t('commons.status.dead')" value="dead"></el-option>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting title="container-refresh" @search="refresh()" class="mr-2.5" />
|
||||
<fu-table-column-select
|
||||
:columns="columns"
|
||||
trigger="hover"
|
||||
:title="$t('commons.table.selectColumn')"
|
||||
popper-class="popper-class"
|
||||
/>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -84,6 +72,7 @@
|
||||
style="width: 100%"
|
||||
:columns="columns"
|
||||
localKey="containerColumn"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column type="selection" />
|
||||
<el-table-column
|
||||
|
||||
@ -7,33 +7,29 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('container.image')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" plain @click="onOpenPull">
|
||||
{{ $t('container.imagePull') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenload">
|
||||
{{ $t('container.importImage') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenBuild">
|
||||
{{ $t('container.imageBuild') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenBuildCache()">
|
||||
{{ $t('container.cleanBuildCache') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenPrune()">
|
||||
{{ $t('container.imagePrune') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" plain @click="onOpenPull">
|
||||
{{ $t('container.imagePull') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenload">
|
||||
{{ $t('container.importImage') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenBuild">
|
||||
{{ $t('container.imageBuild') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenBuildCache()">
|
||||
{{ $t('container.cleanBuildCache') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenPrune()">
|
||||
{{ $t('container.imagePrune') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search" :heightDiff="300">
|
||||
<el-table-column label="ID" prop="id" width="140" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
<el-text type="primary" class="cursor-pointer" @click="onInspect(row.id)">
|
||||
|
||||
@ -7,24 +7,20 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('container.network')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('container.createNetwork') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.networkPrune') }}
|
||||
</el-button>
|
||||
<el-button :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('container.createNetwork') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.networkPrune') }}
|
||||
</el-button>
|
||||
<el-button :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -32,6 +28,7 @@
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
@search="search"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column type="selection" :selectable="selectable" fix />
|
||||
<el-table-column
|
||||
|
||||
@ -7,18 +7,14 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('container.repo')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog('add')">
|
||||
{{ $t('container.createRepo') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('add')">
|
||||
{{ $t('container.createRepo') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -26,6 +22,7 @@
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
@search="search"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column :label="$t('commons.table.name')" prop="name" min-width="60" />
|
||||
<el-table-column
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<div class="app-status" style="margin-top: 20px">
|
||||
<div class="app-status p-mt-20">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-tag style="float: left" effect="dark" type="success">Docker</el-tag>
|
||||
<el-tag class="float-left" effect="dark" type="success">Docker</el-tag>
|
||||
<el-tag round class="status-content" v-if="form.status === 'Running'" type="success">
|
||||
{{ $t('commons.status.running') }}
|
||||
</el-tag>
|
||||
@ -35,18 +35,18 @@
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<LayoutContent style="margin-top: 20px" :title="$t('container.setting')" :divider="true">
|
||||
<LayoutContent class="p-mt-20" :title="$t('container.setting')">
|
||||
<template #main>
|
||||
<el-radio-group v-model="confShowType" @change="changeMode">
|
||||
<el-radio-button value="base">{{ $t('database.baseConf') }}</el-radio-button>
|
||||
<el-radio-button value="all">{{ $t('database.allConf') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-row style="margin-top: 20px" v-if="confShowType === 'base'">
|
||||
<el-row class="p-mt-20" v-if="confShowType === 'base'">
|
||||
<el-col :span="1"><br /></el-col>
|
||||
<el-col :xs="24" :sm="24" :md="15" :lg="12" :xl="10">
|
||||
<el-form :model="form" label-position="left" :rules="rules" ref="formRef" label-width="120px">
|
||||
<el-form-item :label="$t('container.mirrors')" prop="mirrors">
|
||||
<div style="width: 100%" v-if="form.mirrors">
|
||||
<div class="w-full" v-if="form.mirrors">
|
||||
<el-input
|
||||
type="textarea"
|
||||
:rows="5"
|
||||
@ -66,20 +66,15 @@
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('container.mirrorsHelper') }}</span>
|
||||
<span class="input-help flx-align-center" style="display: flex">
|
||||
<span class="input-help flex flx-align-center">
|
||||
{{ $t('container.mirrorsHelper2') }}
|
||||
<el-link
|
||||
style="font-size: 12px; margin-left: 5px"
|
||||
icon="Position"
|
||||
@click="toDoc()"
|
||||
type="primary"
|
||||
>
|
||||
<el-link class="p-ml-5 text-xs" icon="Position" @click="toDoc()" type="primary">
|
||||
{{ $t('firewall.quickJump') }}
|
||||
</el-link>
|
||||
</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('container.registries')" prop="registries">
|
||||
<div style="width: 100%" v-if="form.registries">
|
||||
<div class="w-full" v-if="form.registries">
|
||||
<el-input
|
||||
type="textarea"
|
||||
:rows="5"
|
||||
@ -118,9 +113,7 @@
|
||||
<span class="input-help"></span>
|
||||
<div v-if="logOptionShow">
|
||||
<el-tag>{{ $t('container.maxSize') }}: {{ form.logMaxSize }}</el-tag>
|
||||
<el-tag style="margin-left: 5px">
|
||||
{{ $t('container.maxFile') }}: {{ form.logMaxFile }}
|
||||
</el-tag>
|
||||
<el-tag class="p-ml-5">{{ $t('container.maxFile') }}: {{ form.logMaxFile }}</el-tag>
|
||||
<div>
|
||||
<el-button @click="handleLogOption" type="primary" link>
|
||||
{{ $t('commons.button.view') }}
|
||||
@ -178,7 +171,7 @@
|
||||
:extensions="extensions"
|
||||
v-model="dockerConf"
|
||||
/>
|
||||
<el-button :disabled="loading" type="primary" @click="onSaveFile" style="margin-top: 5px">
|
||||
<el-button :disabled="loading" type="primary" @click="onSaveFile" class="p-ml-5">
|
||||
{{ $t('commons.button.save') }}
|
||||
</el-button>
|
||||
</div>
|
||||
@ -194,16 +187,16 @@
|
||||
:close-on-press-escape="false"
|
||||
:show-close="false"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<span style="color: red">{{ $t('container.iptablesHelper2') }}</span>
|
||||
<div style="margin-top: 10px">
|
||||
<span style="font-size: 12px">{{ $t('database.restartNowHelper') }}</span>
|
||||
<div class="mt-2.5">
|
||||
<span class="text-rose-500">{{ $t('container.iptablesHelper2') }}</span>
|
||||
<div class="mt-2.5">
|
||||
<span class="text-xs">{{ $t('database.restartNowHelper') }}</span>
|
||||
</div>
|
||||
<div style="margin-top: 10px">
|
||||
<span style="font-size: 12px">{{ $t('commons.msg.operateConfirm') }}</span>
|
||||
<span style="font-size: 12px; color: red; font-weight: 500">'{{ $t('database.restartNow') }}'</span>
|
||||
<div class="mt-2.5">
|
||||
<span class="text-xs">{{ $t('commons.msg.operateConfirm') }}</span>
|
||||
<span class="text-xs text-rose-500 font-medium">'{{ $t('database.restartNow') }}'</span>
|
||||
</div>
|
||||
<el-input style="margin-top: 10px" v-model="submitInput"></el-input>
|
||||
<el-input class="mt-2.5" v-model="submitInput"></el-input>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
|
||||
@ -7,21 +7,17 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('container.composeTemplate')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('container.createComposeTemplate') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('container.createComposeTemplate') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -29,6 +25,7 @@
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
@search="search"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column
|
||||
|
||||
@ -7,24 +7,20 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('container.volume')" :class="{ mask: dockerStatus != 'Running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('container.createVolume') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.volumePrune') }}
|
||||
</el-button>
|
||||
<el-button :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('container.createVolume') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('container.volumePrune') }}
|
||||
</el-button>
|
||||
<el-button :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -32,6 +28,7 @@
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
@search="search"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column
|
||||
|
||||
@ -9,29 +9,25 @@
|
||||
]"
|
||||
/>
|
||||
<LayoutContent v-loading="loading" v-if="!isRecordShow" :title="$t('cronjob.cronTask')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('cronjob.cronTask') }}
|
||||
</el-button>
|
||||
<el-button-group class="ml-4">
|
||||
<el-button plain :disabled="selects.length === 0" @click="onBatchChangeStatus('enable')">
|
||||
{{ $t('commons.button.enable') }}
|
||||
</el-button>
|
||||
<el-button plain :disabled="selects.length === 0" @click="onBatchChangeStatus('disable')">
|
||||
{{ $t('commons.button.disable') }}
|
||||
</el-button>
|
||||
<el-button plain :disabled="selects.length === 0" @click="onDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('cronjob.cronTask') }}
|
||||
</el-button>
|
||||
<el-button-group class="ml-4">
|
||||
<el-button plain :disabled="selects.length === 0" @click="onBatchChangeStatus('enable')">
|
||||
{{ $t('commons.button.enable') }}
|
||||
</el-button>
|
||||
<el-button plain :disabled="selects.length === 0" @click="onBatchChangeStatus('disable')">
|
||||
{{ $t('commons.button.disable') }}
|
||||
</el-button>
|
||||
<el-button plain :disabled="selects.length === 0" @click="onDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<div class="app-status" style="margin-top: 20px" v-if="currentDB?.from === 'remote'">
|
||||
<div class="app-status mt-5" v-if="currentDB?.from === 'remote'">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-tag style="float: left" effect="dark" type="success">
|
||||
<el-tag class="float-left" effect="dark" type="success">
|
||||
{{ currentDB?.type === 'mysql' ? 'Mysql' : 'MariaDB' }}
|
||||
</el-tag>
|
||||
<el-tag class="status-content">{{ $t('app.version') }}: {{ currentDB?.version }}</el-tag>
|
||||
@ -21,9 +21,47 @@
|
||||
@is-exist="checkExist"
|
||||
></AppStatus>
|
||||
</template>
|
||||
|
||||
<template #search v-if="currentDB">
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200">
|
||||
<template #leftToolBar>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')"
|
||||
type="primary"
|
||||
@click="onOpenDialog()"
|
||||
>
|
||||
{{ $t('database.create') }}
|
||||
</el-button>
|
||||
<el-button v-if="currentDB" @click="onChangeConn" type="primary" plain>
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')"
|
||||
@click="loadDB"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
{{ $t('database.loadFromRemote') }}
|
||||
</el-button>
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
<el-dropdown class="ml-3">
|
||||
<el-button type="primary" plain>
|
||||
{{ $t('database.manage') }}
|
||||
<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item icon="Position" @click="goDashboard('phpMyAdmin')">
|
||||
phpMyAdmin
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item icon="Position" @click="goDashboard('Adminer')" divided>
|
||||
Adminer
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200 mr-2.5" v-if="currentDB">
|
||||
<template #prefix>{{ $t('commons.table.type') }}</template>
|
||||
<el-option-group :label="$t('database.local')">
|
||||
<div v-for="(item, index) in dbOptionsLocal" :key="index">
|
||||
@ -58,53 +96,7 @@
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')"
|
||||
type="primary"
|
||||
@click="onOpenDialog()"
|
||||
>
|
||||
{{ $t('database.create') }}
|
||||
</el-button>
|
||||
<el-button v-if="currentDB" @click="onChangeConn" type="primary" plain>
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || mysqlStatus === 'Running')"
|
||||
@click="loadDB"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
{{ $t('database.loadFromRemote') }}
|
||||
</el-button>
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
<el-dropdown class="ml-3">
|
||||
<el-button type="primary" plain>
|
||||
{{ $t('database.manage') }}
|
||||
<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item icon="Position" @click="goDashboard('phpMyAdmin')">
|
||||
phpMyAdmin
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item icon="Position" @click="goDashboard('Adminer')" divided>
|
||||
Adminer
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</template>
|
||||
<template #main v-if="currentDB">
|
||||
<ComplexTable
|
||||
@ -113,6 +105,7 @@
|
||||
@sort-change="search"
|
||||
@search="search"
|
||||
:data="data"
|
||||
:heightDiff="370"
|
||||
>
|
||||
<el-table-column :label="$t('commons.table.name')" prop="name" sortable min-width="90">
|
||||
<template #default="{ row }">
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<div class="app-status" style="margin-top: 20px" v-if="currentDB?.from === 'remote'">
|
||||
<div class="app-status mt-5" v-if="currentDB?.from === 'remote'">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-tag style="float: left" effect="dark" type="success">PostgreSQL</el-tag>
|
||||
<el-tag class="float-left" effect="dark" type="success">PostgreSQL</el-tag>
|
||||
<el-tag class="status-content">{{ $t('app.version') }}: {{ currentDB?.version }}</el-tag>
|
||||
</div>
|
||||
</el-card>
|
||||
@ -19,9 +19,32 @@
|
||||
@is-exist="checkExist"
|
||||
></AppStatus>
|
||||
</template>
|
||||
|
||||
<template #search v-if="currentDB">
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200">
|
||||
<template #leftToolBar>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || postgresqlStatus === 'Running')"
|
||||
type="primary"
|
||||
@click="onOpenDialog()"
|
||||
>
|
||||
{{ $t('database.create') }}
|
||||
</el-button>
|
||||
<el-button v-if="currentDB" @click="onChangeConn" type="primary" plain>
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || postgresqlStatus === 'Running')"
|
||||
@click="loadDB"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
{{ $t('database.loadFromRemote') }}
|
||||
</el-button>
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
<el-button @click="goDashboard()" type="primary" plain>PGAdmin4</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200 mr-2.5" v-if="currentDB">
|
||||
<template #prefix>{{ $t('commons.table.type') }}</template>
|
||||
<el-option-group :label="$t('database.local')">
|
||||
<div v-for="(item, index) in dbOptionsLocal" :key="index">
|
||||
@ -50,38 +73,7 @@
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || postgresqlStatus === 'Running')"
|
||||
type="primary"
|
||||
@click="onOpenDialog()"
|
||||
>
|
||||
{{ $t('database.create') }}
|
||||
</el-button>
|
||||
<el-button v-if="currentDB" @click="onChangeConn" type="primary" plain>
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="currentDB && (currentDB.from !== 'local' || postgresqlStatus === 'Running')"
|
||||
@click="loadDB"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
{{ $t('database.loadFromRemote') }}
|
||||
</el-button>
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
<el-button @click="goDashboard()" type="primary" plain>PGAdmin4</el-button>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</template>
|
||||
<template #main v-if="currentDB">
|
||||
<ComplexTable
|
||||
@ -90,6 +82,7 @@
|
||||
@sort-change="search"
|
||||
@search="search"
|
||||
:data="data"
|
||||
:heightDiff="370"
|
||||
>
|
||||
<el-table-column :label="$t('commons.table.name')" prop="name" sortable>
|
||||
<template #default="{ row }">
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<div class="app-status" style="margin-top: 20px" v-if="currentDB && currentDB.from === 'remote'">
|
||||
<div class="app-status mt-5" v-if="currentDB && currentDB.from === 'remote'">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-tag style="float: left" effect="dark" type="success">Redis</el-tag>
|
||||
<el-tag class="float-left" effect="dark" type="success">Redis</el-tag>
|
||||
<el-tag class="status-content">{{ $t('app.version') }}: {{ currentDB?.version }}</el-tag>
|
||||
</div>
|
||||
</el-card>
|
||||
@ -19,44 +19,46 @@
|
||||
@setting="onSetting"
|
||||
></AppStatus>
|
||||
</template>
|
||||
<template #search v-if="!isOnSetting && currentDB">
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200">
|
||||
<template #prefix>{{ $t('commons.table.type') }}</template>
|
||||
<el-option-group :label="$t('database.local')">
|
||||
<div v-for="(item, index) in dbOptionsLocal" :key="index">
|
||||
<el-option v-if="item.from === 'local'" :value="item.database" class="optionClass">
|
||||
<span v-if="item.database.length < 25">{{ item.database }}</span>
|
||||
<el-tooltip v-else :content="item.database" placement="top">
|
||||
<span>{{ item.database.substring(0, 25) }}...</span>
|
||||
</el-tooltip>
|
||||
</el-option>
|
||||
</div>
|
||||
<el-button link type="primary" class="jumpAdd" @click="goRouter('app')" icon="Position">
|
||||
{{ $t('database.goInstall') }}
|
||||
<template #search v-if="!isOnSetting">
|
||||
<div class="flex">
|
||||
<div>
|
||||
<el-button v-if="currentDB" type="primary" plain @click="onLoadConn">
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
<el-option-group :label="$t('database.remote')">
|
||||
<div v-for="(item, index) in dbOptionsRemote" :key="index">
|
||||
<el-option v-if="item.from === 'remote'" :value="item.database" class="optionClass">
|
||||
<span v-if="item.database.length < 25">{{ item.database }}</span>
|
||||
<el-tooltip v-else :content="item.database" placement="top">
|
||||
<span>{{ item.database.substring(0, 25) }}...</span>
|
||||
</el-tooltip>
|
||||
</el-option>
|
||||
</div>
|
||||
<el-button link type="primary" class="jumpAdd" @click="goRouter('remote')" icon="Position">
|
||||
{{ $t('database.createRemoteDB') }}
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #toolbar v-if="!isOnSetting">
|
||||
<el-button v-if="currentDB" type="primary" plain @click="onLoadConn">
|
||||
{{ $t('database.databaseConnInfo') }}
|
||||
</el-button>
|
||||
<el-button @click="goRemoteDB" type="primary" plain>
|
||||
{{ $t('database.remoteDB') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-select v-model="currentDBName" @change="changeDatabase()" class="p-w-200 ml-5" v-if="currentDB">
|
||||
<template #prefix>{{ $t('commons.table.type') }}</template>
|
||||
<el-option-group :label="$t('database.local')">
|
||||
<div v-for="(item, index) in dbOptionsLocal" :key="index">
|
||||
<el-option v-if="item.from === 'local'" :value="item.database" class="optionClass">
|
||||
<span v-if="item.database.length < 25">{{ item.database }}</span>
|
||||
<el-tooltip v-else :content="item.database" placement="top">
|
||||
<span>{{ item.database.substring(0, 25) }}...</span>
|
||||
</el-tooltip>
|
||||
</el-option>
|
||||
</div>
|
||||
<el-button link type="primary" class="jumpAdd" @click="goRouter('app')" icon="Position">
|
||||
{{ $t('database.goInstall') }}
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
<el-option-group :label="$t('database.remote')">
|
||||
<div v-for="(item, index) in dbOptionsRemote" :key="index">
|
||||
<el-option v-if="item.from === 'remote'" :value="item.database" class="optionClass">
|
||||
<span v-if="item.database.length < 25">{{ item.database }}</span>
|
||||
<el-tooltip v-else :content="item.database" placement="top">
|
||||
<span>{{ item.database.substring(0, 25) }}...</span>
|
||||
</el-tooltip>
|
||||
</el-option>
|
||||
</div>
|
||||
<el-button link type="primary" class="jumpAdd" @click="goRouter('remote')" icon="Position">
|
||||
{{ $t('database.createRemoteDB') }}
|
||||
</el-button>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</div>
|
||||
</template>
|
||||
</LayoutContent>
|
||||
|
||||
|
||||
@ -57,128 +57,107 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<div class="btn-container">
|
||||
<div class="left-section">
|
||||
<el-dropdown @command="handleCreate">
|
||||
<el-button type="primary">
|
||||
{{ $t('commons.button.create') }}
|
||||
<el-icon><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item command="dir">
|
||||
<svg-icon iconName="p-file-folder"></svg-icon>
|
||||
{{ $t('file.dir') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="file">
|
||||
<svg-icon iconName="p-file-normal"></svg-icon>
|
||||
{{ $t('file.file') }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button-group>
|
||||
<el-button plain @click="openUpload">{{ $t('file.upload') }}</el-button>
|
||||
<el-button plain @click="openWget">{{ $t('file.remoteFile') }}</el-button>
|
||||
<el-button plain @click="openMove('copy')" :disabled="selects.length === 0">
|
||||
{{ $t('file.copy') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openMove('cut')" :disabled="selects.length === 0">
|
||||
{{ $t('file.move') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openCompress(selects)" :disabled="selects.length === 0">
|
||||
{{ $t('file.compress') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openBatchRole(selects)" :disabled="selects.length === 0">
|
||||
{{ $t('file.role') }}
|
||||
</el-button>
|
||||
<el-button plain @click="batchDelFiles" :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<template #leftToolBar>
|
||||
<el-dropdown @command="handleCreate" class="mr-2.5">
|
||||
<el-button type="primary">
|
||||
{{ $t('commons.button.create') }}
|
||||
<el-icon><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item command="dir">
|
||||
<svg-icon iconName="p-file-folder"></svg-icon>
|
||||
{{ $t('file.dir') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="file">
|
||||
<svg-icon iconName="p-file-normal"></svg-icon>
|
||||
{{ $t('file.file') }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button-group>
|
||||
<el-button plain @click="openUpload">{{ $t('file.upload') }}</el-button>
|
||||
<el-button plain @click="openWget">{{ $t('file.remoteFile') }}</el-button>
|
||||
<el-button plain @click="openMove('copy')" :disabled="selects.length === 0">
|
||||
{{ $t('file.copy') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openMove('cut')" :disabled="selects.length === 0">
|
||||
{{ $t('file.move') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openCompress(selects)" :disabled="selects.length === 0">
|
||||
{{ $t('file.compress') }}
|
||||
</el-button>
|
||||
<el-button plain @click="openBatchRole(selects)" :disabled="selects.length === 0">
|
||||
{{ $t('file.role') }}
|
||||
</el-button>
|
||||
<el-button plain @click="batchDelFiles" :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
|
||||
<el-button class="btn" @click="toTerminal">
|
||||
{{ $t('menu.terminal') }}
|
||||
<el-button class="btn ml-2.5" @click="toTerminal">
|
||||
{{ $t('menu.terminal') }}
|
||||
</el-button>
|
||||
|
||||
<el-button-group class="copy-button" v-if="moveOpen">
|
||||
<el-tooltip class="box-item" effect="dark" :content="$t('file.paste')" placement="bottom">
|
||||
<el-button plain @click="openPaste">{{ $t('file.paste') }}({{ fileMove.count }})</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip class="box-item" effect="dark" :content="$t('file.cancel')" placement="bottom">
|
||||
<el-button plain class="close" @click="closeMove">
|
||||
<el-icon class="close-icon"><Close /></el-icon>
|
||||
</el-button>
|
||||
|
||||
<el-button-group class="copy-button" v-if="moveOpen">
|
||||
<el-tooltip class="box-item" effect="dark" :content="$t('file.paste')" placement="bottom">
|
||||
<el-button plain @click="openPaste">
|
||||
{{ $t('file.paste') }}({{ fileMove.count }})
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip class="box-item" effect="dark" :content="$t('file.cancel')" placement="bottom">
|
||||
<el-button plain class="close" @click="closeMove">
|
||||
<el-icon class="close-icon"><Close /></el-icon>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<div class="right-section">
|
||||
<el-popover placement="bottom" :width="200" trigger="hover" @before-enter="getFavoriates">
|
||||
<template #reference>
|
||||
<el-button @click="openFavorite">
|
||||
{{ $t('file.favorite') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<div class="favorite-item">
|
||||
<el-table :data="favorites">
|
||||
<el-table-column prop="name">
|
||||
<template #default="{ row }">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="row.path"
|
||||
placement="top"
|
||||
>
|
||||
<span
|
||||
class="table-link text-ellipsis"
|
||||
@click="toFavorite(row)"
|
||||
type="primary"
|
||||
>
|
||||
<svg-icon
|
||||
v-if="row.isDir"
|
||||
className="table-icon"
|
||||
iconName="p-file-folder"
|
||||
></svg-icon>
|
||||
<svg-icon
|
||||
v-else
|
||||
className="table-icon"
|
||||
iconName="p-file-normal"
|
||||
></svg-icon>
|
||||
{{ row.name }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-popover>
|
||||
|
||||
<el-button class="btn" @click="openRecycleBin">
|
||||
{{ $t('file.recycleBin') }}
|
||||
</el-tooltip>
|
||||
</el-button-group>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<el-popover placement="bottom" :width="200" trigger="hover" @before-enter="getFavoriates">
|
||||
<template #reference>
|
||||
<el-button @click="openFavorite">
|
||||
{{ $t('file.favorite') }}
|
||||
</el-button>
|
||||
<div class="search-button">
|
||||
<el-input
|
||||
v-model="req.search"
|
||||
clearable
|
||||
@clear="search()"
|
||||
@keydown.enter="search()"
|
||||
:placeholder="$t('file.search')"
|
||||
>
|
||||
<template #prepend>
|
||||
<el-checkbox v-model="req.containSub">
|
||||
{{ $t('file.sub') }}
|
||||
</el-checkbox>
|
||||
</template>
|
||||
<div class="favorite-item">
|
||||
<el-table :data="favorites">
|
||||
<el-table-column prop="name">
|
||||
<template #default="{ row }">
|
||||
<el-tooltip class="box-item" effect="dark" :content="row.path" placement="top">
|
||||
<span class="table-link text-ellipsis" @click="toFavorite(row)" type="primary">
|
||||
<svg-icon
|
||||
v-if="row.isDir"
|
||||
className="table-icon"
|
||||
iconName="p-file-folder"
|
||||
></svg-icon>
|
||||
<svg-icon v-else className="table-icon" iconName="p-file-normal"></svg-icon>
|
||||
{{ row.name }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<template #append>
|
||||
<el-button icon="Search" @click="search" round />
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-button class="btn mr-5" @click="openRecycleBin">
|
||||
{{ $t('file.recycleBin') }}
|
||||
</el-button>
|
||||
<div class="w-96">
|
||||
<el-input
|
||||
v-model="req.search"
|
||||
clearable
|
||||
@clear="search()"
|
||||
@keydown.enter="search()"
|
||||
:placeholder="$t('file.search')"
|
||||
>
|
||||
<template #prepend>
|
||||
<el-checkbox v-model="req.containSub">
|
||||
{{ $t('file.sub') }}
|
||||
</el-checkbox>
|
||||
</template>
|
||||
<template #append>
|
||||
<el-button icon="Search" @click="search" round />
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</template>
|
||||
<template #main>
|
||||
@ -189,6 +168,7 @@
|
||||
:data="data"
|
||||
@search="search"
|
||||
@sort-change="changeSort"
|
||||
:heightDiff="350"
|
||||
>
|
||||
<el-table-column type="selection" width="30" />
|
||||
<el-table-column
|
||||
@ -1014,21 +994,6 @@ onMounted(() => {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.left-section,
|
||||
.right-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.left-section > *:not(:first-child) {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.right-section {
|
||||
.btn {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.favorite-item {
|
||||
max-height: 650px;
|
||||
overflow: auto;
|
||||
|
||||
@ -18,21 +18,17 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('firewall.forwardRule')" :class="{ mask: fireStatus != 'running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('firewall.forwardRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('firewall.forwardRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -40,6 +36,7 @@
|
||||
v-model:selects="selects"
|
||||
@search="search"
|
||||
:data="data"
|
||||
:heightDiff="370"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column :label="$t('commons.table.protocol')" :min-width="70" prop="protocol" />
|
||||
|
||||
@ -19,31 +19,23 @@
|
||||
</el-card>
|
||||
|
||||
<LayoutContent :title="$t('firewall.ipRule')" :class="{ mask: fireStatus != 'running' }">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }} {{ $t('firewall.ipRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }} {{ $t('firewall.ipRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<div class="flx-align-center">
|
||||
<el-select v-model="searchStrategy" @change="search()" clearable class="p-w-200">
|
||||
<template #prefix>{{ $t('firewall.strategy') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.allow')" value="accept"></el-option>
|
||||
<el-option :label="$t('firewall.deny')" value="drop"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="searchStrategy" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('firewall.strategy') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.allow')" value="accept"></el-option>
|
||||
<el-option :label="$t('firewall.deny')" value="drop"></el-option>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -51,6 +43,7 @@
|
||||
v-model:selects="selects"
|
||||
@search="search"
|
||||
:data="data"
|
||||
:heightDiff="370"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column :min-width="80" :label="$t('firewall.address')" prop="address">
|
||||
|
||||
@ -35,37 +35,29 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #search>
|
||||
<div class="flx-align-center">
|
||||
<el-select v-model="searchStatus" @change="search()" clearable class="p-w-200">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.unUsed')" value="free"></el-option>
|
||||
<el-option :label="$t('firewall.used')" value="used"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="searchStrategy" @change="search()" clearable class="p-w-200 ml-2.5">
|
||||
<template #prefix>{{ $t('firewall.strategy') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.accept')" value="accept"></el-option>
|
||||
<el-option :label="$t('firewall.drop')" value="drop"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('firewall.portRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('commons.button.create') }}{{ $t('firewall.portRule') }}
|
||||
</el-button>
|
||||
<el-button @click="onDelete(null)" plain :disabled="selects.length === 0">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="searchStatus" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.unUsed')" value="free"></el-option>
|
||||
<el-option :label="$t('firewall.used')" value="used"></el-option>
|
||||
</el-select>
|
||||
<el-select v-model="searchStrategy" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('firewall.strategy') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('firewall.accept')" value="accept"></el-option>
|
||||
<el-option :label="$t('firewall.drop')" value="drop"></el-option>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -73,6 +65,7 @@
|
||||
v-model:selects="selects"
|
||||
@search="search"
|
||||
:data="data"
|
||||
:heightDiff="420"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column :label="$t('commons.table.protocol')" :min-width="70" prop="protocol" />
|
||||
|
||||
@ -2,41 +2,43 @@
|
||||
<div>
|
||||
<FireRouter />
|
||||
<LayoutContent :title="$t('menu.network')" v-loading="loading">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<div style="width: 100%">
|
||||
<el-form-item style="float: right">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.pid')"
|
||||
v-model:searchName="netSearch.processID"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.processName')"
|
||||
v-model:searchName="netSearch.processName"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.port')"
|
||||
v-model:searchName="netSearch.port"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #rightToolBar>
|
||||
<div class="w-full">
|
||||
<el-form-item class="float-right">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.pid')"
|
||||
v-model:searchName="netSearch.processID"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.processName')"
|
||||
v-model:searchName="netSearch.processName"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.port')"
|
||||
v-model:searchName="netSearch.port"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :data="data" @sort-change="changeSort" @filter-change="changeFilter" ref="tableRef">
|
||||
<ComplexTable
|
||||
:data="data"
|
||||
@sort-change="changeSort"
|
||||
@filter-change="changeFilter"
|
||||
ref="tableRef"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column :label="$t('commons.table.type')" fix prop="type"></el-table-column>
|
||||
<el-table-column :label="'PID'" fix prop="PID" max-width="60px" sortable></el-table-column>
|
||||
<el-table-column
|
||||
|
||||
@ -2,41 +2,43 @@
|
||||
<div>
|
||||
<FireRouter />
|
||||
<LayoutContent :title="$t('menu.process')" v-loading="loading">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<div style="width: 100%">
|
||||
<el-form-item class="float-right">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.pid')"
|
||||
v-model:searchName="processSearch.pid"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.name')"
|
||||
v-model:searchName="processSearch.name"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.user')"
|
||||
v-model:searchName="processSearch.username"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #rightToolBar>
|
||||
<div class="w-full">
|
||||
<el-form-item class="float-right">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('process.pid')"
|
||||
v-model:searchName="processSearch.pid"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.name')"
|
||||
v-model:searchName="processSearch.name"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch
|
||||
@search="search()"
|
||||
:placeholder="$t('commons.table.user')"
|
||||
v-model:searchName="processSearch.username"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :data="data" @sort-change="changeSort" @filter-change="changeFilter" ref="tableRef">
|
||||
<ComplexTable
|
||||
:data="data"
|
||||
@sort-change="changeSort"
|
||||
@filter-change="changeFilter"
|
||||
ref="tableRef"
|
||||
:heightDiff="300"
|
||||
>
|
||||
<el-table-column :label="'PID'" fix prop="PID" max-width="60px" sortable></el-table-column>
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<FireRouter />
|
||||
|
||||
<Log />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -5,26 +5,19 @@
|
||||
<el-alert type="info" :title="$t('ssh.sshAlert2')" :closable="false" />
|
||||
<div class="mt-2"><el-alert type="info" :title="$t('ssh.sshAlert')" :closable="false" /></div>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-select v-model="searchStatus" @change="search()" class="p-w-200">
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="searchStatus" @change="search()" class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value="All"></el-option>
|
||||
<el-option :label="$t('commons.status.success')" value="Success"></el-option>
|
||||
<el-option :label="$t('commons.status.failed')" value="Failed"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16"></el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchInfo" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<TableSetting @search="search()" class="mr-2.5" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchInfo" />
|
||||
</template>
|
||||
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search" :heightDiff="400">
|
||||
<el-table-column min-width="80" :label="$t('logs.loginIP')" prop="address" />
|
||||
<el-table-column min-width="60" :label="$t('ssh.belong')" prop="area" />
|
||||
<el-table-column min-width="60" :label="$t('commons.table.port')" prop="port" />
|
||||
|
||||
@ -2,19 +2,11 @@
|
||||
<div>
|
||||
<FireRouter />
|
||||
<LayoutContent :title="$t('ssh.session')">
|
||||
<template #toolbar>
|
||||
<div style="width: 100%">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8"></el-col>
|
||||
<el-col :span="8"></el-col>
|
||||
<el-col :span="8">
|
||||
<TableSearch @search="search()" v-model:searchName="sshSearch.loginUser" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="sshSearch.loginUser" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :data="data" ref="tableRef" v-loading="loading">
|
||||
<ComplexTable :data="data" ref="tableRef" v-loading="loading" :heightDiff="260">
|
||||
<el-table-column :label="$t('commons.table.user')" fix prop="username"></el-table-column>
|
||||
<el-table-column :label="'TTY'" fix prop="terminal"></el-table-column>
|
||||
<el-table-column :label="$t('ssh.loginIP')" fix prop="host"></el-table-column>
|
||||
|
||||
@ -2,10 +2,10 @@
|
||||
<div v-loading="loading">
|
||||
<FireRouter />
|
||||
|
||||
<div class="app-status" style="margin-top: 20px">
|
||||
<div class="app-status mt-5">
|
||||
<el-card>
|
||||
<div>
|
||||
<el-tag style="float: left" effect="dark" type="success">SSH</el-tag>
|
||||
<el-tag class="float-left" effect="dark" type="success">SSH</el-tag>
|
||||
<el-tag round class="status-content" v-if="form.status === 'Enable'" type="success">
|
||||
{{ $t('commons.status.running') }}
|
||||
</el-tag>
|
||||
@ -50,98 +50,99 @@
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<LayoutContent style="margin-top: 20px" :title="$t('menu.config')" :divider="true">
|
||||
<LayoutContent>
|
||||
<template #main>
|
||||
<el-radio-group v-model="confShowType" @change="changeMode">
|
||||
<el-radio-button value="base">{{ $t('database.baseConf') }}</el-radio-button>
|
||||
<el-radio-button value="all">{{ $t('database.allConf') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-row style="margin-top: 20px" v-if="confShowType === 'base'">
|
||||
<el-col :span="1"><br /></el-col>
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="10" :xl="10">
|
||||
<el-form :model="form" label-position="left" ref="formRef" label-width="120px">
|
||||
<el-form-item :label="$t('commons.table.port')" prop="port">
|
||||
<el-input disabled v-model.number="form.port">
|
||||
<template #append>
|
||||
<el-button @click="onChangePort" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.portHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.listenAddress')" prop="listenAddress">
|
||||
<el-input disabled v-model="form.listenAddressItem">
|
||||
<template #append>
|
||||
<el-button @click="onChangeAddress" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.addressHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.permitRootLogin')" prop="permitRootLoginItem">
|
||||
<el-input disabled v-model="form.permitRootLoginItem">
|
||||
<template #append>
|
||||
<el-button @click="onChangeRoot" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.rootSettingHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.passwordAuthentication')" prop="passwordAuthentication">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'PasswordAuthentication', form.passwordAuthentication)"
|
||||
v-model="form.passwordAuthentication"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.pwdAuthHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.pubkeyAuthentication')" prop="pubkeyAuthentication">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'PubkeyAuthentication', form.pubkeyAuthentication)"
|
||||
v-model="form.pubkeyAuthentication"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.keyAuthHelper') }}</span>
|
||||
<el-button link @click="onOpenDrawer" type="primary">
|
||||
{{ $t('ssh.pubkey') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.useDNS')" prop="useDNS">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'UseDNS', form.useDNS)"
|
||||
v-model="form.useDNS"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.dnsHelper') }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<MainDiv :heightDiff="300">
|
||||
<el-radio-group v-model="confShowType" @change="changeMode">
|
||||
<el-radio-button value="base">{{ $t('database.baseConf') }}</el-radio-button>
|
||||
<el-radio-button value="all">{{ $t('database.allConf') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-row class="mt-10" v-if="confShowType === 'base'">
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="10" :xl="10">
|
||||
<el-form :model="form" label-position="right" ref="formRef" label-width="100px">
|
||||
<el-form-item :label="$t('commons.table.port')" prop="port">
|
||||
<el-input disabled v-model.number="form.port">
|
||||
<template #append>
|
||||
<el-button @click="onChangePort" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.portHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.listenAddress')" prop="listenAddress">
|
||||
<el-input disabled v-model="form.listenAddressItem">
|
||||
<template #append>
|
||||
<el-button @click="onChangeAddress" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.addressHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.permitRootLogin')" prop="permitRootLoginItem">
|
||||
<el-input disabled v-model="form.permitRootLoginItem">
|
||||
<template #append>
|
||||
<el-button @click="onChangeRoot" icon="Setting">
|
||||
{{ $t('commons.button.set') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
<span class="input-help">{{ $t('ssh.rootSettingHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.passwordAuthentication')" prop="passwordAuthentication">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'PasswordAuthentication', form.passwordAuthentication)"
|
||||
v-model="form.passwordAuthentication"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.pwdAuthHelper') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.pubkeyAuthentication')" prop="pubkeyAuthentication">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'PubkeyAuthentication', form.pubkeyAuthentication)"
|
||||
v-model="form.pubkeyAuthentication"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.keyAuthHelper') }}</span>
|
||||
<el-button link @click="onOpenDrawer" type="primary">
|
||||
{{ $t('ssh.pubkey') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('ssh.useDNS')" prop="useDNS">
|
||||
<el-switch
|
||||
active-value="yes"
|
||||
inactive-value="no"
|
||||
@change="onSave(formRef, 'UseDNS', form.useDNS)"
|
||||
v-model="form.useDNS"
|
||||
></el-switch>
|
||||
<span class="input-help">{{ $t('ssh.dnsHelper') }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div v-if="confShowType === 'all'">
|
||||
<codemirror
|
||||
:autofocus="true"
|
||||
placeholder="# The SSH configuration file does not exist or is empty (/etc/ssh/sshd_config)"
|
||||
:indent-with-tab="true"
|
||||
:tabSize="4"
|
||||
style="margin-top: 10px; height: calc(100vh - 405px)"
|
||||
:lineWrapping="true"
|
||||
:matchBrackets="true"
|
||||
theme="cobalt"
|
||||
:styleActiveLine="true"
|
||||
:extensions="extensions"
|
||||
v-model="sshConf"
|
||||
/>
|
||||
<el-button :disabled="loading" type="primary" @click="onSaveFile" style="margin-top: 5px">
|
||||
{{ $t('commons.button.save') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div v-if="confShowType === 'all'">
|
||||
<codemirror
|
||||
:autofocus="true"
|
||||
placeholder="# The SSH configuration file does not exist or is empty (/etc/ssh/sshd_config)"
|
||||
:indent-with-tab="true"
|
||||
:tabSize="4"
|
||||
style="margin-top: 10px; height: calc(100vh - 405px)"
|
||||
:lineWrapping="true"
|
||||
:matchBrackets="true"
|
||||
theme="cobalt"
|
||||
:styleActiveLine="true"
|
||||
:extensions="extensions"
|
||||
v-model="sshConf"
|
||||
/>
|
||||
<el-button :disabled="loading" type="primary" @click="onSaveFile" style="margin-top: 5px">
|
||||
{{ $t('commons.button.save') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</MainDiv>
|
||||
</template>
|
||||
</LayoutContent>
|
||||
|
||||
@ -162,6 +163,7 @@ import PubKey from '@/views/host/ssh/ssh/pubkey/index.vue';
|
||||
import Root from '@/views/host/ssh/ssh/root/index.vue';
|
||||
import Port from '@/views/host/ssh/ssh/port/index.vue';
|
||||
import Address from '@/views/host/ssh/ssh/address/index.vue';
|
||||
import MainDiv from '@/components/main-div/index.vue';
|
||||
import i18n from '@/lang';
|
||||
import { MsgSuccess } from '@/utils/message';
|
||||
import { getSSHConf, getSSHInfo, operateSSH, updateSSH, updateSSHByfile } from '@/api/modules/host';
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<template #prompt>
|
||||
<el-alert type="info" :title="$t('terminal.quickCommandHelper')" :closable="false" />
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('commons.button.create') }} {{ $t('terminal.quickCommand') }}
|
||||
</el-button>
|
||||
@ -15,21 +15,15 @@
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-row :gutter="5">
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<el-select v-model="group" @change="search()" clearable class="p-w-200">
|
||||
<template #prefix>{{ $t('terminal.group') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<div v-for="item in groupList" :key="item.name">
|
||||
<el-option :value="item.id" :label="item.name" />
|
||||
</div>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="search()" v-model:searchName="commandReq.name" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="group" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('terminal.group') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<div v-for="item in groupList" :key="item.name">
|
||||
<el-option :value="item.id" :label="item.name" />
|
||||
</div>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="commandReq.name" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
@ -38,6 +32,7 @@
|
||||
:data="data"
|
||||
@sort-change="search"
|
||||
@search="search"
|
||||
:heightDiff="350"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
<el-table-column
|
||||
|
||||
@ -1,32 +1,26 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" :title="$t('terminal.host')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="20">
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('terminal.addHost') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenGroupDialog()">
|
||||
{{ $t('terminal.group') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<TableSearch @search="search()" v-model:searchName="info" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onOpenDialog('create')">
|
||||
{{ $t('terminal.addHost') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onOpenGroupDialog()">
|
||||
{{ $t('terminal.group') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="onBatchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-select v-model="group" @change="search()" clearable class="p-w-200">
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="group" @change="search()" clearable class="p-w-200 mr-5">
|
||||
<template #prefix>{{ $t('terminal.group') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<div v-for="item in groupList" :key="item.name">
|
||||
<el-option :value="item.id" :label="item.name" />
|
||||
</div>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="info" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
|
||||
@ -1,44 +1,34 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" :title="$t('logs.login')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button" type="primary" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<div class="flex justify-end">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchIP" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<template #search>
|
||||
<div class="flx-align-center">
|
||||
<el-select v-model="searchStatus" @change="search()" clearable class="p-w-200">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('commons.status.success')" value="Success"></el-option>
|
||||
<el-option :label="$t('commons.status.failed')" value="Failed"></el-option>
|
||||
</el-select>
|
||||
|
||||
<el-button type="primary" plain @click="onClean()" class="ml-2.5">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button" type="primary" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="searchStatus" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('commons.status.success')" value="Success"></el-option>
|
||||
<el-option :label="$t('commons.status.failed')" value="Failed"></el-option>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="searchIP" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search" :heightDiff="370">
|
||||
<el-table-column :label="$t('logs.loginIP')" prop="ip" />
|
||||
<el-table-column :label="$t('logs.loginAddress')" prop="address" />
|
||||
<el-table-column :label="$t('logs.loginAgent')" show-overflow-tooltip prop="agent" />
|
||||
|
||||
@ -1,27 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" :title="$t('logs.operation')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button type="primary" class="tag-button" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<TableSetting @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-select v-model="searchGroup" @change="search()" clearable class="p-w-200">
|
||||
<el-button type="primary" class="tag-button" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" plain @click="onClean()">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<el-select v-model="searchGroup" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('logs.resource') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('logs.detail.apps')" value="apps"></el-option>
|
||||
@ -36,24 +33,17 @@
|
||||
<el-option :label="$t('logs.detail.logs')" value="logs"></el-option>
|
||||
<el-option :label="$t('logs.detail.settings')" value="settings"></el-option>
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="searchStatus"
|
||||
@change="search()"
|
||||
clearable
|
||||
style="margin-left: 10px"
|
||||
class="p-w-200"
|
||||
>
|
||||
<el-select v-model="searchStatus" @change="search()" clearable class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('commons.table.status') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" value=""></el-option>
|
||||
<el-option :label="$t('commons.status.success')" value="Success"></el-option>
|
||||
<el-option :label="$t('commons.status.failed')" value="Failed"></el-option>
|
||||
</el-select>
|
||||
<el-button type="primary" style="margin-left: 10px" plain @click="onClean()">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search" :heightDiff="370">
|
||||
<el-table-column :label="$t('logs.resource')" prop="group" fix>
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.source">
|
||||
|
||||
@ -1,31 +1,27 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" :title="$t('logs.system')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button" type="primary" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template #search>
|
||||
<el-select class="float-left p-w-200" v-model="logConfig.name" @change="search()">
|
||||
<template #prefix>{{ $t('commons.button.log') }}</template>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('OperationLog')">
|
||||
{{ $t('logs.operation') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button no-active" @click="onChangeRoute('LoginLog')">
|
||||
{{ $t('logs.login') }}
|
||||
</el-button>
|
||||
<el-button class="tag-button" type="primary" @click="onChangeRoute('SystemLog')">
|
||||
{{ $t('logs.system') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #leftToolBar>
|
||||
<el-select class="p-w-200 mr-2.5" v-model="logConfig.name" @change="search()">
|
||||
<template #prefix>{{ $t('commons.table.date') }}</template>
|
||||
<el-option v-for="(item, index) in fileList" :key="index" :label="item" :value="item" />
|
||||
</el-select>
|
||||
<div class="watchCheckbox">
|
||||
<el-checkbox border @change="changeTail" v-model="isWatch">
|
||||
<el-button>
|
||||
<el-checkbox @change="changeTail" v-model="isWatch">
|
||||
{{ $t('commons.button.watch') }}
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<LogFile
|
||||
@ -89,12 +85,3 @@ onMounted(() => {
|
||||
loadFiles();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.watchCheckbox {
|
||||
margin-top: 2px;
|
||||
margin-bottom: 10px;
|
||||
float: left;
|
||||
margin-left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,62 +1,57 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" :title="$t('logs.websiteLog')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :span="16">
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="logConfig.name === 'access.log' ? '' : 'no-active'"
|
||||
:type="logConfig.name === 'access.log' ? 'primary' : ''"
|
||||
@click="changeType('access.log')"
|
||||
>
|
||||
{{ $t('logs.runLog') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="logConfig.name === 'error.log' ? '' : 'no-active'"
|
||||
:type="logConfig.name === 'error.log' ? 'primary' : ''"
|
||||
@click="changeType('error.log')"
|
||||
>
|
||||
{{ $t('logs.errLog') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template #search>
|
||||
<div>
|
||||
<el-select v-model="logConfig.id" @change="changeWebsite()" class="p-w-200">
|
||||
<template #prefix>{{ $t('website.website') }}</template>
|
||||
<el-option
|
||||
v-for="(website, index) in websites"
|
||||
:key="index"
|
||||
:label="website.primaryDomain"
|
||||
:value="website.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-button class="left-button">
|
||||
<el-checkbox v-model="tailLog" @change="changeTail" :disabled="logConfig.id == undefined">
|
||||
{{ $t('commons.button.watch') }}
|
||||
</el-checkbox>
|
||||
</el-button>
|
||||
<el-button class="left-button" @click="onDownload" icon="Download" :disabled="!hasContent">
|
||||
{{ $t('file.download') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()" class="left-button" :disabled="!hasContent">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="logConfig.name === 'access.log' ? '' : 'no-active'"
|
||||
:type="logConfig.name === 'access.log' ? 'primary' : ''"
|
||||
@click="changeType('access.log')"
|
||||
>
|
||||
{{ $t('logs.runLog') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
class="tag-button"
|
||||
:class="logConfig.name === 'error.log' ? '' : 'no-active'"
|
||||
:type="logConfig.name === 'error.log' ? 'primary' : ''"
|
||||
@click="changeType('error.log')"
|
||||
>
|
||||
{{ $t('logs.errLog') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #leftToolBar>
|
||||
<el-select v-model="logConfig.id" @change="changeWebsite()" class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('website.website') }}</template>
|
||||
<el-option
|
||||
v-for="(website, index) in websites"
|
||||
:key="index"
|
||||
:label="website.primaryDomain"
|
||||
:value="website.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-button>
|
||||
<el-checkbox v-model="tailLog" @change="changeTail" :disabled="logConfig.id == undefined">
|
||||
{{ $t('commons.button.watch') }}
|
||||
</el-checkbox>
|
||||
</el-button>
|
||||
<el-button @click="onDownload" icon="Download" :disabled="!hasContent">
|
||||
{{ $t('file.download') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onClean()" :disabled="!hasContent">
|
||||
{{ $t('logs.deleteLogs') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<LogFile
|
||||
ref="logRef"
|
||||
:config="logConfig"
|
||||
:default-button="false"
|
||||
v-if="showLog"
|
||||
v-model:loading="loading"
|
||||
v-model:hasContent="hasContent"
|
||||
:style="'height: calc(100vh - 370px)'"
|
||||
/>
|
||||
<MainDiv :heightDiff="370">
|
||||
<LogFile
|
||||
ref="logRef"
|
||||
:config="logConfig"
|
||||
:default-button="false"
|
||||
v-if="showLog"
|
||||
v-model:loading="loading"
|
||||
v-model:hasContent="hasContent"
|
||||
/>
|
||||
</MainDiv>
|
||||
</template>
|
||||
</LayoutContent>
|
||||
<ConfirmDialog ref="confirmDialogRef" @confirm="onSubmitClean"></ConfirmDialog>
|
||||
|
||||
@ -1,34 +1,30 @@
|
||||
<template>
|
||||
<div>
|
||||
<LayoutContent v-loading="loading" v-if="!isRecordShow" :title="$t('setting.snapshot')">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('setting.createSnapshot') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onImport()">
|
||||
{{ $t('setting.importSnapshot') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onIgnore()">
|
||||
{{ $t('setting.ignoreRule') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<TableSetting ref="timerRef" @search="search()" />
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="onCreate()">
|
||||
{{ $t('setting.createSnapshot') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onImport()">
|
||||
{{ $t('setting.importSnapshot') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="onIgnore()">
|
||||
{{ $t('setting.ignoreRule') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain :disabled="selects.length === 0" @click="batchDelete(null)">
|
||||
{{ $t('commons.button.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #rightToolBar>
|
||||
<TableSearch @search="search()" v-model:searchName="searchName" class="mr-2.5" />
|
||||
<TableSetting ref="timerRef" @search="search()" />
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable
|
||||
:pagination-config="paginationConfig"
|
||||
v-model:selects="selects"
|
||||
:data="data"
|
||||
style="margin-top: 20px"
|
||||
class="mt-5"
|
||||
@search="search"
|
||||
>
|
||||
<el-table-column type="selection" fix />
|
||||
|
||||
@ -1,18 +1,13 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<LayoutContent :title="$t('setting.diskClean')" :divider="true">
|
||||
<template #toolbar>
|
||||
<el-row>
|
||||
<el-col :xs="24" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-button type="primary" @click="scanData">
|
||||
{{ $t('clean.scan') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="scanData">
|
||||
{{ $t('clean.scan') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<el-row class="mt-5 mb-5">
|
||||
<el-col :span="1"><br /></el-col>
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="10" :xl="10">
|
||||
<div v-if="scanStatus !== 'scanned'">
|
||||
<div v-if="scanStatus === 'beforeScan'">
|
||||
|
||||
@ -12,8 +12,8 @@
|
||||
v-model:mask-show="maskShow"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="showTable" #toolbar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
<template v-if="showTable" #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate" :disabled="showStopped">
|
||||
{{ $t('commons.button.create') + $t('tool.supervisor.list') }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('runtime.create') }}
|
||||
</el-button>
|
||||
@ -19,7 +19,7 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
fix
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('runtime.create') }}
|
||||
</el-button>
|
||||
@ -19,7 +19,7 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
fix
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('runtime.create') }}
|
||||
</el-button>
|
||||
@ -19,7 +19,7 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
fix
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
</template>
|
||||
</el-alert>
|
||||
</template>
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('runtime.create') }}
|
||||
</el-button>
|
||||
@ -23,7 +23,7 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()">
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
fix
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<RouterButton :buttons="routerButton" />
|
||||
<LayoutContent :title="$t('website.ssl')">
|
||||
<template #toolbar>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" @click="openSSL()">
|
||||
{{ $t('ssl.create') }}
|
||||
</el-button>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<el-form-item prop="enable" :label="$t('website.enableOrNot')">
|
||||
<el-switch v-model="enable" @change="changeEnable" :disabled="data.length === 0"></el-switch>
|
||||
</el-form-item>
|
||||
<ComplexTable :data="data" @search="search" v-loading="loading">
|
||||
<ComplexTable :data="data" @search="search" v-loading="loading" :heightDiff="420">
|
||||
<template #toolbar>
|
||||
<el-button type="primary" plain @click="openCreate">
|
||||
{{ $t('commons.button.create') }}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<ComplexTable :data="data" @search="search" v-loading="loading">
|
||||
<ComplexTable :data="data" @search="search" v-loading="loading" :heightDiff="400">
|
||||
<template #toolbar>
|
||||
<el-button type="primary" plain @click="openCreate">{{ $t('website.addDomain') }}</el-button>
|
||||
</template>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<el-row :gutter="20" v-loading="loading">
|
||||
<el-col :xs="24" :sm="18" :md="8" :lg="8" :xl="8">
|
||||
<el-form ref="websiteForm" label-position="right" label-width="150px" :model="form" :rules="rules">
|
||||
<el-form ref="websiteForm" label-position="right" label-width="100px" :model="form" :rules="rules">
|
||||
<el-form-item :label="$t('website.primaryDomain')" prop="primaryDomain">
|
||||
<el-input v-model="form.primaryDomain"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
:expire-date="website.expireDate"
|
||||
/>
|
||||
</template>
|
||||
<template #buttons>
|
||||
<template #leftToolBar>
|
||||
<el-button type="primary" :plain="index !== 'basic'" @click="changeTab('basic')">
|
||||
{{ $t('website.basic') }}
|
||||
</el-button>
|
||||
@ -32,10 +32,12 @@
|
||||
</el-button>
|
||||
</template>
|
||||
<template #main>
|
||||
<Basic :id="id" v-if="index === 'basic'"></Basic>
|
||||
<Log :id="id" v-if="index === 'log'"></Log>
|
||||
<Resource :id="id" v-if="index === 'resource'"></Resource>
|
||||
<PHP :id="id" v-if="index === 'php'"></PHP>
|
||||
<MainDiv :heightDiff="320">
|
||||
<Basic :id="id" v-if="index === 'basic'"></Basic>
|
||||
<Log :id="id" v-if="index === 'log'"></Log>
|
||||
<Resource :id="id" v-if="index === 'resource'"></Resource>
|
||||
<PHP :id="id" v-if="index === 'php'"></PHP>
|
||||
</MainDiv>
|
||||
</template>
|
||||
</LayoutContent>
|
||||
</div>
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
:placeholder="$t('commons.msg.noneData')"
|
||||
:indent-with-tab="true"
|
||||
:tabSize="4"
|
||||
style="height: calc(100vh - 352px)"
|
||||
:lineWrapping="true"
|
||||
:matchBrackets="true"
|
||||
theme="cobalt"
|
||||
|
||||
@ -18,40 +18,32 @@
|
||||
@is-exist="checkExist"
|
||||
></AppStatus>
|
||||
</template>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #toolbar>
|
||||
<el-row :class="{ mask: nginxStatus != 'Running' }">
|
||||
<el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('website.create') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openGroup">
|
||||
{{ $t('website.group') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openDefault">
|
||||
{{ $t('website.defaultServer') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openDefaultHtml">
|
||||
{{ $t('website.defaultHtml') }}
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="4" :md="4" :lg="4" :xl="4">
|
||||
<TableSearch @search="search()" v-model:searchName="req.name" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #leftToolBar>
|
||||
<el-button type="primary" @click="openCreate">
|
||||
{{ $t('website.create') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openGroup">
|
||||
{{ $t('website.group') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openDefault">
|
||||
{{ $t('website.defaultServer') }}
|
||||
</el-button>
|
||||
<el-button type="primary" plain @click="openDefaultHtml">
|
||||
{{ $t('website.defaultHtml') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #search>
|
||||
<div :class="{ mask: nginxStatus != 'Running' }">
|
||||
<el-select v-model="req.websiteGroupId" @change="search()" class="p-w-200">
|
||||
<template #prefix>{{ $t('website.group') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" :value="0"></el-option>
|
||||
<el-option
|
||||
v-for="(group, index) in groups"
|
||||
:key="index"
|
||||
:label="group.name"
|
||||
:value="group.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #rightToolBar>
|
||||
<el-select v-model="req.websiteGroupId" @change="search()" class="p-w-200 mr-2.5">
|
||||
<template #prefix>{{ $t('website.group') }}</template>
|
||||
<el-option :label="$t('commons.table.all')" :value="0"></el-option>
|
||||
<el-option
|
||||
v-for="(group, index) in groups"
|
||||
:key="index"
|
||||
:label="group.name"
|
||||
:value="group.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<TableSearch @search="search()" v-model:searchName="req.name" />
|
||||
</template>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #main>
|
||||
<ComplexTable
|
||||
@ -60,6 +52,7 @@
|
||||
@sort-change="changeSort"
|
||||
@search="search()"
|
||||
:class="{ mask: nginxStatus != 'Running' }"
|
||||
:heightDiff="370"
|
||||
>
|
||||
<el-table-column
|
||||
:label="$t('commons.table.name')"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user