Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: 修复许可证失效主题切换错误问题 #7075

Merged
merged 1 commit into from
Nov 15, 2024
+3 −6
Merged

fix: 修复许可证失效主题切换错误问题 #7075

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions frontend/src/components/license-import/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,7 @@ const submit = async () => {
globalStore.isProductPro = true;
const xpackRes = await getXpackSetting();
if (xpackRes) {
globalStore.themeConfig.theme = xpackRes.data.theme;
globalStore.themeConfig.themeColor = xpackRes.data.themeColor;
}
loading.value = false;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

在这个代码中没有发现明显的错误或优化问题。

themeConfig对象应该使用JSON.stringify来避免字符串格式化时丢失信息的问题。这样在异步操作后的数据结构可能会发生变化，如果不进行转换，可能会引发解析错误或者影响其他函数的结果准确性。

所以可以改写为：

const submit = async () => {

   globalStore.isProductPro = true;

   const res = await getXpackSetting();

   if (res && typeof(res.data) === "object") { // 验证返回值是否满足预期类型

      try {
         let themeCfgStr = JSON.stringify(globalStore.themeConfig);
         window.localStorage.setItem("Theme Config", themeCfgStr); // 这样会保证数据是有效的，因为本地存储会自动处理null和undefined等。
         
         return new Promise((resolve, reject) => {

          globalStore.themeConfig.theme = Object.assign({}, ...res.data).theme;
          
          setTimeout(() => resolve({ data: Object.values(res.data)[0], success: true }), 0);

        });
       } catch(e){
        console.log('Error:', e)
        return null;
       }
        
     }

这个版本的逻辑更清晰，并确保了数据的安全性和有效性。

Expand Down
8 changes: 2 additions & 6 deletions frontend/src/views/setting/panel/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -300,14 +300,14 @@ const search = async () => {
if (isProductPro.value) {
const xpackRes = await getXpackSetting();
if (xpackRes) {
form.theme = xpackRes.data.theme || globalStore.themeConfig.theme;
form.theme = xpackRes.data.theme || globalStore.themeConfig.theme || 'light';
form.themeColor = JSON.parse(xpackRes.data.themeColor);
globalStore.themeConfig.themeColor = xpackRes.data.themeColor;
globalStore.themeConfig.theme = form.theme;
form.proxyDocker = xpackRes.data.proxyDocker;
}
} else {
form.theme = res.data.theme;
form.theme = globalStore.themeConfig.theme || res.data.theme || 'light';
}
};

Expand Down Expand Up @@ -395,10 +395,6 @@ const onSave = async (key: string, val: any) => {
}
globalStore.themeConfig.primary = color;
setPrimaryColor(color);
MsgSuccess(i18n.t('commons.msg.operationSuccess'));
loading.value = false;
await search();
return;
}
}
if (key === 'MenuTabs') {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个代码库中的函数是用于设置主题颜色和配置页面标题的。然而在当前版本中（2021年9月），它可能不再符合最新的设计标准或最佳实践。

建议修改此片段以遵循如下原则：

  1. 强调组件之间的功能关系。
  2. 使用更具描述性的变量名，如theme而不是res.data.theme;同样，使用具有更清晰含义的名称来标识属性，并避免不必要的省略号，例如data' 和 themeColor' 而不是仅写为'main_theme_color'.

以下是根据上述指示进行调整后的代码：

let theme;
// 根据需要从不同的来源获取主题信息
function getThemeInfo() {
    // 模拟不同的数据来源并返回一个对象
}
const setThemePreference = (newTheme) => {};

这样可以在不同场景下轻松地改变默认的配色方案和其他外观参数而不影响整个应用的可读性。

Expand Down
Loading