mirror of
https://github.com/1Panel-dev/1Panel.git
synced 2025-01-19 06:32:59 +08:00
style: 一些设置样式的修改
This commit is contained in:
zhengkunwang223
zhengkunwang223
parent
e82b40f5b7
commit
1fcc21839a
@ -3,26 +3,14 @@
|
||||
<div class="app-content" v-if="data.isExist">
|
||||
<el-card class="app-card">
|
||||
<el-row :gutter="20">
|
||||
<el-col :lg="3" :xl="2">
|
||||
<div>
|
||||
<el-tag effect="dark" type="success">{{ data.app }}</el-tag>
|
||||
</div>
|
||||
<el-col :xs="10" :sm="10" :md="10" :lg="10" :xl="6">
|
||||
<el-tag effect="dark" type="success">{{ data.app }}</el-tag>
|
||||
<Status class="status-content" :key="refresh" :status="data.status"></Status>
|
||||
<el-tag class="status-content" type="primary">
|
||||
{{ $t('app.version') }}:{{ data.version }}
|
||||
</el-tag>
|
||||
</el-col>
|
||||
<el-col :lg="3" :xl="2">
|
||||
<div>
|
||||
{{ $t('app.version') }}:
|
||||
<el-tag type="info">{{ data.version }}</el-tag>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :lg="3" :xl="2">
|
||||
<div>
|
||||
{{ $t('commons.table.status') }}:
|
||||
<el-tag type="info">
|
||||
<Status :key="refresh" :status="data.status"></Status>
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :lg="4" :xl="6">
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="6" :xl="4">
|
||||
<el-button type="primary" v-if="data.status != 'Running'" link @click="onOperate('up')">
|
||||
{{ $t('app.up') }}
|
||||
</el-button>
|
||||
@ -30,12 +18,14 @@
|
||||
{{ $t('app.down') }}
|
||||
</el-button>
|
||||
<el-divider direction="vertical" />
|
||||
<el-button type="primary" link @click="onOperate('restart')">{{ $t('app.restart') }}</el-button>
|
||||
<el-button type="primary" link @click="onOperate('restart')">
|
||||
{{ $t('app.restart') }}
|
||||
</el-button>
|
||||
<el-divider direction="vertical" />
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="setting"
|
||||
link
|
||||
:disabled="data.status !== 'Running' && data.app === 'OpenResty'"
|
||||
>
|
||||
{{ $t('commons.button.set') }}
|
||||
@ -145,4 +135,8 @@ onMounted(() => {
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.status-content {
|
||||
margin-left: 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -41,7 +41,7 @@
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
defineOptions({ name: 'ComplexTable' }); // 组件名
|
||||
defineOptions({ name: 'ComplexTable' });
|
||||
defineProps({
|
||||
header: String,
|
||||
searchConfig: Object,
|
||||
|
||||
@ -1,9 +1,13 @@
|
||||
<template>
|
||||
<el-page-header :content="header" @back="props.back">
|
||||
<template v-if="slots.buttons" #content>
|
||||
<el-page-header @back="props.back">
|
||||
<template #content>
|
||||
<span>{{ header }}</span>
|
||||
<el-divider direction="vertical" />
|
||||
<slot name="buttons"></slot>
|
||||
<span v-if="resource">
|
||||
-
|
||||
<el-tag effect="dark" type="success">{{ resource }}</el-tag>
|
||||
</span>
|
||||
<el-divider v-if="slots.buttons" direction="vertical" />
|
||||
<slot v-if="slots.buttons" name="buttons"></slot>
|
||||
</template>
|
||||
</el-page-header>
|
||||
</template>
|
||||
@ -15,5 +19,6 @@ const slots = useSlots();
|
||||
const props = defineProps({
|
||||
header: String,
|
||||
back: Function,
|
||||
resource: String,
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -1,7 +1,9 @@
|
||||
<template>
|
||||
<span :style="{ color: getColor(status) }">
|
||||
<el-tag :type="getType(status)" round effect="light">
|
||||
<!-- <span :style="{ color: getColor(status) }"> -->
|
||||
{{ $t('commons.status.' + status) }}
|
||||
</span>
|
||||
<!-- </span> -->
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
@ -15,12 +17,25 @@ const props = defineProps({
|
||||
});
|
||||
let status = ref('running');
|
||||
|
||||
const getColor = (status: string) => {
|
||||
// const getColor = (status: string) => {
|
||||
// switch (status) {
|
||||
// case 'running':
|
||||
// return '#00c957';
|
||||
// case 'error':
|
||||
// return '#ff0000';
|
||||
// default:
|
||||
// return '';
|
||||
// }
|
||||
// };
|
||||
|
||||
const getType = (status: string) => {
|
||||
switch (status) {
|
||||
case 'running':
|
||||
return '#00c957';
|
||||
return 'success';
|
||||
case 'error':
|
||||
return '#ff0000';
|
||||
return 'danger';
|
||||
case 'stopped':
|
||||
return 'warning';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<el-drawer v-model="backupVisiable" size="50%" :show-close="false">
|
||||
<template #header>
|
||||
<Header :header="$t('database.backup') + ' - ' + websiteName" :back="handleClose"></Header>
|
||||
<Header :header="$t('database.backup')" :resource="websiteName" :back="handleClose"></Header>
|
||||
</template>
|
||||
<ComplexTable
|
||||
v-loading="loading"
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-col :span="10" :offset="1">
|
||||
<el-form
|
||||
ref="wafForm"
|
||||
label-position="left"
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-row>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-col :span="10" :offset="1">
|
||||
<el-form-item prop="enable" :label="$t('website.enable')">
|
||||
<el-switch v-model="enableUpdate.enable" @change="updateEnable"></el-switch>
|
||||
</el-form-item>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-row>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-col :span="10" :offset="1">
|
||||
<el-form-item prop="enable" :label="$t('website.enable')">
|
||||
<el-switch v-model="enableUpdate.enable" @change="updateEnable"></el-switch>
|
||||
</el-form-item>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-row>
|
||||
<el-col :span="10" :offset="2">
|
||||
<el-col :span="10" :offset="1">
|
||||
<el-form-item prop="enable" :label="$t('website.enable')">
|
||||
<el-switch v-model="enableUpdate.enable" @change="updateEnable"></el-switch>
|
||||
</el-form-item>
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
@is-exist="checkExist"
|
||||
></AppStatus>
|
||||
</template>
|
||||
<template v-if="!openNginxConfig" #toolbar>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #toolbar>
|
||||
<el-row :class="{ mask: nginxStatus != 'Running' }">
|
||||
<el-col :span="10">
|
||||
<el-button type="primary" icon="Plus" @click="openCreate">
|
||||
@ -37,7 +37,7 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<template v-if="!openNginxConfig" #search>
|
||||
<template v-if="nginxIsExist && !openNginxConfig" #search>
|
||||
<div :class="{ mask: nginxStatus != 'Running' }">
|
||||
<el-select v-model="req.websiteGroupId" @change="search()">
|
||||
<el-option :label="$t('website.allGroup')" :value="0"></el-option>
|
||||
|
||||
@ -8,16 +8,13 @@
|
||||
</el-col>
|
||||
<el-col :lg="4" :xl="2">
|
||||
<div class="span-font">
|
||||
{{ $t('commons.table.status') }}:
|
||||
<el-tag type="info">
|
||||
<Status class="span-font" :key="props.status" :status="props.status"></Status>
|
||||
</el-tag>
|
||||
<Status class="span-font" :key="props.status" :status="props.status"></Status>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :lg="4" :xl="4">
|
||||
<div class="span-font">
|
||||
{{ $t('website.expireDate') }}:
|
||||
<el-tag type="info">
|
||||
{{ $t('website.expireDate') }}:
|
||||
<span v-if="isEver(props.expireDate)">
|
||||
{{ $t('website.neverExpire') }}
|
||||
</span>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<el-drawer v-model="upVisiable" size="50%" :show-close="false">
|
||||
<template #header>
|
||||
<Header :header="$t('commons.button.import') + ' - ' + websiteName" :back="handleClose"></Header>
|
||||
<Header :header="$t('commons.button.import')" :resource="websiteName" :back="handleClose"></Header>
|
||||
</template>
|
||||
<div v-loading="loading">
|
||||
<el-upload
|
||||
|
||||
Loading…
Reference in New Issue
Block a user