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.

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

feat: Open international professional features #7472

Merged
merged 1 commit into from
Dec 20, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
8 changes: 5 additions & 3 deletions frontend/src/components/system-upgrade/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
<el-link type="primary" :underline="false" @click="toForum">
<span class="font-normal">{{ $t('setting.forum') }}</span>
</el-link>
<el-divider direction="vertical" v-if="!globalStore.isIntl" />
<el-link type="primary" :underline="false" @click="toDoc" v-if="!globalStore.isIntl">
<el-divider direction="vertical" />
<el-link type="primary" :underline="false" @click="toDoc">
<span class="font-normal">{{ $t('setting.doc2') }}</span>
</el-link>
<el-divider direction="vertical" />
Expand All @@ -17,7 +17,7 @@
</div>
<div class="flex flex-wrap items-center">
<el-link :underline="false" class="-ml-2" type="primary" @click="toLxware">
{{ $t(globalStore.isIntl || !isProductPro ? 'license.community' : 'license.pro') }}
{{ $t(!isProductPro ? 'license.community' : 'license.pro') }}
</el-link>
<el-link :underline="false" class="version" type="primary" @click="copyText(version)">
{{ version }}
Expand Down Expand Up @@ -125,6 +125,8 @@ const handleClose = () => {
const toLxware = () => {
if (!globalStore.isIntl) {
window.open('https://www.lxware.cn/1panel' + '', '_blank', 'noopener,noreferrer');
} else {
window.open('https://1panel.hk' + '', '_blank', 'noopener,noreferrer');
}
};

Copy link
Member

Choose a reason for hiding this comment

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

The provided patch seems mostly correct overall, but there is one change that needs consideration:

  • The link URLs for LxWare have been updated to different domain links ('lxware.cn' vs '1panel.hk'). This could indicate intentional changes based on internationalization context not captured in the knowledge cutoff information.

However, from a functional standpoint, updating the links without further context about internationalization implications does not pose major issues. Here's an outline of what each line does, which helps verify their correctness:

@@ -5,8 +5,8 @@
         <el-link type="primary" :underline="false" @click="toForum">
             <span class="font-normal">{{ $t('setting.forum') }}</span>
         </el-link>
-        <!-- Vertical divider if not international -->
-        <el-divider direction="vertical" v-if="!globalStore.isIntl" />
+        <!-- Vertical divider regardless of global store state -->
+        <el-divider direction="vertical" />
@@ -17,7 +17,7 @@
                 </el-button> -- Adjusting this comment as requested --

@@ -125,6 +125,8 @@ const handleClose = () => {
     ...
 };

+const toLxware = () => {
+    // Updated logic ensuring only appropriate URL opens depending globally configured locale
+
     ...
 };

These modifications align with standard practices in JavaScript and TypeScript development while making some minor syntactic adjustments like removing unnecessary spaces around operators (=). If you have additional requirements such as testing or validation, let me know!

Expand Down
11 changes: 6 additions & 5 deletions frontend/src/layout/components/Sidebar/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -134,18 +134,19 @@ function getCheckedLabels(json: Node): string[] {
const search = async () => {
await checkIsSystemIntl();
let checkedLabels: any[] = [];
if (!globalStore.isIntl) {
const res = await getSettingInfo();
const json: Node = JSON.parse(res.data.xpackHideMenu);
checkedLabels = getCheckedLabels(json);
}
const res = await getSettingInfo();
const json: Node = JSON.parse(res.data.xpackHideMenu);
checkedLabels = getCheckedLabels(json);

let rstMenuList: RouteRecordRaw[] = [];
menuStore.menuList.forEach((item) => {
let menuItem = JSON.parse(JSON.stringify(item));
let menuChildren: RouteRecordRaw[] = [];
if (menuItem.path === '/xpack') {
if (checkedLabels.length) {
menuItem.children = menuItem.children.filter((child: any) => {
return !(globalStore.isIntl && child.path.includes('/xpack/alert'));
});
menuItem.children.forEach((child: any) => {
for (const str of checkedLabels) {
if (child.name === str) {
Copy link
Member

Choose a reason for hiding this comment

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

The provided code appears to be part of a Vue.js application using the Element Plus UI library. Here's an assessment of the code:

Potential Issue

The condition if (menuItem.path === '/xpack') is inside the loop that processes each MenuItem within the MenuList. This means it will process all children regardless of whether their path starts with /xpack/. If there are children at other paths under /xpack, they may become inaccessible depending on the logic used later.

Suggestion

Consider refactoring this loop structure so that you only apply the filtering logic when a specific condition (e.g., checking for sub-paths beneath /xpack) occurs, rather than processing all items every time.

Here’s one possible way to refactor it:

// Initialize filtered menu list directly outside the main loop
let filteredMenuList: RouteRecordRaw[] = [];

menuStore.menuList.forEach((item) => {
    // Process parent item
    let menuItem = JSON.parse(JSON.stringify(item));
    if (menuItem.path === "/xpack") {
        // Determine which parts should remain visible based on user settings
        filteredMenuList.push(menuItem); // Add current item since it matches '/xpack'
        
        // Apply visibility filter to child menu options
        menuItem.children = menuItem.children.filter(child => !child.path.includes("/xpack/alert"));
        
        // Recursively process the child menu
        recursivelyFilterChildMenuItems(filteredMenuList, child);
    } else {
        // Directly add non-menu-item nodes to final result set.
        rstMenuList.push(menuItem);
    }
});

function recursivelyFilterChildMenuItems(parentList: RouteRecordRaw[], targetMenuItem: RouteRecordRaw) {
    // ... Existing code remains same ...
}

By doing this, you ensure that each MenuItem is processed only once, improving efficiency when dealing with nested structures.


Make sure this change aligns fully with your application's requirements and architecture before implementing it!

Expand Down
2 changes: 1 addition & 1 deletion frontend/src/routers/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ router.beforeEach((to, from, next) => {
axiosCanceler.removeAllPending();
const globalStore = GlobalStore();

if (globalStore.isIntl && to.path.includes('xpack')) {
if (globalStore.isIntl && to.path.includes('/xpack/alert')) {
next({ name: '404' });
NProgress.done();
return;
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/styles/element.scss
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ html {
--panel-terminal-tag-hover-text-color: #575758;
--panel-terminal-bg-color: #1e1e1e;
--panel-logs-bg-color: #1e1e1e;
--panel-alert-bg-color: rgba(0, 94, 235, 0.03);;
--panel-alert-bg-color: rgba(0, 94, 235, 0.03);

--panel-alert-bg: #e2e4ec;
--panel-path-bg: #ffffff;
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/views/home/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
]"
>
<template #route-button>
<div class="router-button" v-if="!isProductPro && !globalStore.isIntl">
<div class="router-button" v-if="!isProductPro">
<el-button link type="primary" @click="toUpload">
{{ $t('license.levelUpPro') }}
</el-button>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/views/setting/about/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
<SystemUpgrade />
</div>
<div class="flex w-full justify-center my-5 flex-wrap md:flex-row gap-4">
<el-link @click="toDoc" class="system-link" v-if="!globalStore.isIntl">
<el-link @click="toDoc" class="system-link">
<el-icon><Document /></el-icon>
<span>{{ $t('setting.doc2') }}</span>
</el-link>
Expand Down
6 changes: 0 additions & 6 deletions frontend/src/views/setting/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,6 @@

<script lang="ts" setup>
import i18n from '@/lang';
import { GlobalStore } from '@/store';
const globalStore = GlobalStore();
const buttons = [
{
Expand Down Expand Up @@ -38,8 +36,4 @@ const buttons = [
path: '/settings/about',
},
];
if (globalStore.isIntl) {
buttons.splice(4, 1);
}
</script>
Copy link
Member

Choose a reason for hiding this comment

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

Your code has several improvements, but there are a few areas where you can optimize it further:

  1. Remove Unnecessary Variable Declaration: The globalStore variable is only used once and assigned directly within the condition, so you can simplify this line to assign it on use.

  2. Use of Template Literals: If you need to concatenate strings dynamically, using template literals is more concise and readable.

import i18n from '@/lang';
// Removed: import { GlobalStore } from '@/store';

<script lang="ts" setup>
const globalStore: ReturnType<typeof import('@/store')> = await import('@/store').then(m => m.GlobalStore());

const buttons = [
    {
        text: 'Settings.',
        iconText: '<span aria-hidden="true">fas fa-cog</span>',
        path: '/settings/account',
    },
    ...[
        // other menu items remain unchanged...
    ],
];

if (globalStore.isIntl) {
    buttons.splice(4, 1); // Assuming the index is correct; adjust if necessary.
}
</script>
  1. Avoid Redundant Imports: Ensure that all imports needed at the top level are included.

Here's the optimized code with these changes:

import i18n from '@/lang';
import GlobalStore from '@/store';

const globalStore = new GlobalStore();

const buttons = [
    {
        text: 'Settings.',
        iconText: '<span aria-hidden="true">fas fa-cog</span>',
        path: '/settings/account',
    },
    // ... rest of button configurations ...
];

if (globalStore.isIntl) {
    buttons.splice(4, 1); // Adjust the index based on your logic needs.
}

<template>
    <!-- Your template content here -->
</template>

<script lang="ts">
export default defineComponent({
    components: {},
});
</script>

<style scoped>
/* Your styles go here */
</style>

By making these adjustments, your code will be cleaner, more efficient, and easier to maintain. Make sure to test thoroughly after applying these changes to ensure compatibility and functionality.

4 changes: 2 additions & 2 deletions frontend/src/views/setting/panel/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@
</el-input>
</el-form-item>

<el-form-item v-if="!globalStore.isIntl" :label="$t('setting.proxy')" prop="proxyShow">
<el-form-item :label="$t('setting.proxy')" prop="proxyShow">
<el-input disabled v-model="form.proxyShow">
<template #append>
<el-button @click="onChangeProxy" icon="Setting">
Expand Down Expand Up @@ -166,7 +166,7 @@
<span class="input-help">{{ $t('setting.developerModeHelper') }}</span>
</el-form-item>

<el-form-item v-if="!globalStore.isIntl" :label="$t('setting.advancedMenuHide')">
<el-form-item :label="$t('setting.advancedMenuHide')">
<el-input disabled v-model="form.proHideMenus">
<template #append>
<el-button v-show="!show" @click="onChangeHideMenus" icon="Setting">
Expand Down
157 changes: 83 additions & 74 deletions frontend/src/views/toolbox/clam/operate/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -50,81 +50,90 @@
</template>
</el-input>
</el-form-item>
<div v-if="!globalStore.isIntl">
<el-form-item prop="hasSpec">
<el-checkbox v-model="dialogData.rowData!.hasSpec" :label="$t('toolbox.clam.cron')" />
</el-form-item>
<el-form-item prop="spec" v-if="dialogData.rowData!.hasSpec && isProductPro">
<div class="grid sm:grid-cols-4 gap-4 grid-cols-1">
<el-select v-model="dialogData.rowData!.specObj.specType" @change="changeSpecType()">
<el-option
v-for="item in specOptions"
:key="item.label"
:value="item.value"
:label="item.label"
/>
</el-select>
<el-select
v-if="dialogData.rowData!.specObj.specType === 'perWeek'"
v-model="dialogData.rowData!.specObj.week"
>
<el-option
v-for="item in weekOptions"
:key="item.label"
:value="item.value"
:label="item.label"
/>
</el-select>
<el-input
v-if="hasDay(dialogData.rowData!.specObj)"
v-model.number="dialogData.rowData!.specObj.day"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.day')" placement="top">
{{ $t('commons.units.dayUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="hasHour(dialogData.rowData!.specObj)"
v-model.number="dialogData.rowData!.specObj.hour"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.hour')" placement="top">
{{ $t('commons.units.hourUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="dialogData.rowData!.specObj.specType !== 'perNSecond'"
v-model.number="dialogData.rowData!.specObj.minute"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.minute')" placement="top">
{{ $t('commons.units.minuteUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="dialogData.rowData!.specObj.specType === 'perNSecond'"
v-model.number="dialogData.rowData!.specObj.second"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.second')" placement="top">
{{ $t('commons.units.secondUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
</div>

<el-form-item prop="hasSpec">
<el-checkbox v-model="dialogData.rowData!.hasSpec" :label="$t('toolbox.clam.cron')" />
</el-form-item>
<el-form-item prop="spec" v-if="dialogData.rowData!.hasSpec && isProductPro">
<div class="grid sm:grid-cols-4 gap-4 grid-cols-1">
<el-select v-model="dialogData.rowData!.specObj.specType" @change="changeSpecType()">
<el-option
v-for="item in specOptions"
:key="item.label"
:value="item.value"
:label="item.label"
/>
</el-select>
<el-select
v-if="dialogData.rowData!.specObj.specType === 'perWeek'"
v-model="dialogData.rowData!.specObj.week"
>
<el-option
v-for="item in weekOptions"
:key="item.label"
:value="item.value"
:label="item.label"
/>
</el-select>
<el-input
v-if="hasDay(dialogData.rowData!.specObj)"
v-model.number="dialogData.rowData!.specObj.day"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.day')" placement="top">
{{ $t('commons.units.dayUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="hasHour(dialogData.rowData!.specObj)"
v-model.number="dialogData.rowData!.specObj.hour"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.hour')" placement="top">
{{ $t('commons.units.hourUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="dialogData.rowData!.specObj.specType !== 'perNSecond'"
v-model.number="dialogData.rowData!.specObj.minute"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.minute')" placement="top">
{{ $t('commons.units.minuteUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
<el-input
v-if="dialogData.rowData!.specObj.specType === 'perNSecond'"
v-model.number="dialogData.rowData!.specObj.second"
>
<template #append>
<div class="sm:min-w-8 min-w-14 text-center">
<el-tooltip :content="$t('commons.units.second')" placement="top">
{{ $t('commons.units.secondUnit') }}
</el-tooltip>
</div>
</template>
</el-input>
</div>
</el-form-item>
<div v-if="globalStore.isIntl">
<el-form-item v-if="(dialogData.rowData!.hasSpec) && !isProductPro">
<span>{{ $t('toolbox.clam.alertHelper') }}</span>
<el-button link type="primary" @click="toUpload">
{{ $t('license.levelUpPro') }}
</el-button>
</el-form-item>
</div>
<div v-if="!globalStore.isIntl">
<el-form-item prop="hasAlert">
<el-checkbox v-model="dialogData.rowData!.hasAlert" :label="$t('alert.isAlert')" />
<span class="input-help">{{ $t('alert.clamHelper') }}</span>
Expand Down
Loading