feat: 概览页重启按钮优化 (#2926)

Refs #2921
1Panel-dev · Nov 13, 2023 · fb556d6 · fb556d6
1 parent 78576a3
commit fb556d6
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 28 deletions.
diff --git a/backend/app/service/dashboard.go b/backend/app/service/dashboard.go
@@ -31,7 +31,7 @@ func NewIDashboardService() IDashboardService {
 }
 
 func (u *DashboardService) Restart(operation string) error {
- if operation != "panel" && operation != "system" {
+ if operation != "1panel" && operation != "system" {
  return fmt.Errorf("handle restart operation %s failed, err: nonsupport such operation", operation)
  }
  itemCmd := fmt.Sprintf("%s 1pctl restart", cmd.SudoHandleCmd())

diff --git a/frontend/src/components/confirm-dialog/index.vue b/frontend/src/components/confirm-dialog/index.vue
@@ -6,8 +6,8 @@
  </div>
  </template>
  <div>
- <span style="font-size: 12px">{{ operationInfo }}</span>
- <div style="margin-top: 10px">
+ <span v-if="operationInfo" style="font-size: 12px">{{ operationInfo }}</span>
+ <div :style="{ 'margin-top': operationInfo ? '10px' : '0px' }">
  <span style="font-size: 12px">{{ $t('commons.msg.operateConfirm') }}</span>
  <span style="font-size: 12px; color: red; font-weight: 500">'{{ submitInputInfo }}'</span>
  </div>

diff --git a/frontend/src/lang/modules/en.ts b/frontend/src/lang/modules/en.ts
@@ -286,9 +286,6 @@ const message = {
  home: {
  restart_1panel: 'Restart Panel',
  restart_system: 'Restart Server',
- panel: '1Panel',
- system: '1Panel Server',
- restartHelper: 'About to restart {0}, do you want to continue?',
  operationSuccess: 'Operation successful! Restarting, please wait...',
  overview: 'Overview',
  entranceHelper:

diff --git a/frontend/src/lang/modules/tw.ts b/frontend/src/lang/modules/tw.ts
@@ -284,9 +284,6 @@ const message = {
  home: {
  restart_1panel: '重啟面板',
  restart_system: '重啟服務器',
- panel: '1Panel 面板',
- system: '1Panel 服務器',
- restartHelper: '即將重新啟動 {0}，是否繼續？',
  operationSuccess: '操作成功！正在重啟，請稍候...',
  overview: '概覽',
  entranceHelper: '設置安全入口有利於提高系統的安全性，如有需要，前往 面板設置-安全 中，啟用安全入口',

diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts
@@ -284,9 +284,6 @@ const message = {
  home: {
  restart_1panel: '重启面板',
  restart_system: '重启服务器',
- panel: '1Panel 面板',
- system: '1Panel 服务器',
- restartHelper: '即将重新启动 {0}，是否继续？',
  operationSuccess: '操作成功！正在重启，请稍候...',
  overview: '概览',
  entranceHelper: '设置安全入口有利于提高系统的安全性，如有需要，前往 面板设置-安全 中，启用安全入口',

diff --git a/frontend/src/views/home/index.vue b/frontend/src/views/home/index.vue
@@ -10,11 +10,11 @@
  >
  <template #route-button>
  <div class="router-button">
- <el-button link type="primary" @click="restart('panel')">
+ <el-button link type="primary" @click="onRestart('1panel')">
  {{ $t('home.restart_1panel') }}
  </el-button>
  <el-divider direction="vertical" />
- <el-button link type="primary" @click="restart('system')">
+ <el-button link type="primary" @click="onRestart('system')">
  {{ $t('home.restart_system') }}
  </el-button>
  </div>
@@ -230,10 +230,13 @@
  </CardWithHeader>
  </el-col>
  </el-row>
+
+ <ConfirmDialog ref="confirmDialogRef" @confirm="onSave"></ConfirmDialog>
  </div>
 </template>
 
 <script lang="ts" setup>
+import ConfirmDialog from '@/components/confirm-dialog/index.vue';
 import { onMounted, onBeforeUnmount, ref, reactive } from 'vue';
 import Status from '@/views/home/status/index.vue';
 import App from '@/views/home/app/index.vue';
@@ -252,6 +255,8 @@ const router = useRouter();
 const globalStore = GlobalStore();
 
 const statusRef = ref();
+const restartType = ref();
+const confirmDialogRef = ref();
 const appRef = ref();
 
 const isSafety = ref();
@@ -540,20 +545,19 @@ const loadSafeStatus = async () => {
  isSafety.value = res.data.securityEntrance;
 };
 
-const restart = async (type: string) => {
- ElMessageBox.confirm(
- i18n.global.t('home.restartHelper', [i18n.global.t('home.' + type)]),
- i18n.global.t('commons.msg.operate'),
- {
- confirmButtonText: i18n.global.t('commons.button.confirm'),
- cancelButtonText: i18n.global.t('commons.button.cancel'),
- type: 'info',
- },
- ).then(async () => {
- globalStore.isOnRestart = true;
- MsgSuccess(i18n.global.t('home.operationSuccess'));
- await systemRestart(type);
- });
+const onRestart = (type: string) => {
+ restartType.value = type;
+ let params = {
+ header: i18n.global.t('home.restart_' + type),
+ operationInfo: '',
+ submitInputInfo: i18n.global.t('database.restartNow'),
+ };
+ confirmDialogRef.value!.acceptParams(params);
+};
+const onSave = async () => {
+ globalStore.isOnRestart = true;
+ MsgSuccess(i18n.global.t('home.operationSuccess'));
+ await systemRestart(restartType.value);
 };
 
 const onFocus = () => {