Skip to content

Commit

Permalink
chore(frontend): db-manage 业务组件路径调整 #7073
Browse files Browse the repository at this point in the history
  • Loading branch information
hLinx committed Sep 24, 2024
1 parent e110e9a commit 5122980
Show file tree
Hide file tree
Showing 324 changed files with 1,951 additions and 1,906 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
-->

<template>
<div class="render-cluster-status">
<div class="db-cluster-status">
<DbIcon
svg
:type="statusIcon" />
Expand Down Expand Up @@ -50,7 +50,7 @@
const statusText = computed(() => textMap[props.data.toLocaleLowerCase() as keyof typeof textMap]);
</script>
<style lang="less">
.render-cluster-status {
.db-cluster-status {
display: flex;
align-items: center;
}
Expand Down
35 changes: 20 additions & 15 deletions dbm-ui/frontend/src/components/cost-timer/CostTimer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -21,27 +21,32 @@
import { useIntervalFn } from '@vueuse/core';

interface Props {
value: number,
isTiming: boolean,
startTime: number,
value: number;
isTiming: boolean;
startTime: number;
}

const props = defineProps<Props>();

const costTime = ref(0);
// 计时
const {
resume,
pause,
} = useIntervalFn(() => {
costTime.value = Math.floor(Date.now() / 1000) - props.startTime;
}, 1000, { immediate: false });

watch(() => props.value, (time) => {
if (!props.isTiming) {
costTime.value = time;
}
}, { immediate: true });
const { resume, pause } = useIntervalFn(
() => {
costTime.value = Math.floor(Date.now() / 1000) - props.startTime;
},
1000,
{ immediate: false },
);

watch(
() => props.value,
(time) => {
if (!props.isTiming) {
costTime.value = time;
}
},
{ immediate: true },
);

watch(
() => props.isTiming,
Expand Down
24 changes: 14 additions & 10 deletions dbm-ui/frontend/src/components/db-form/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@
import { debounce } from 'lodash';

interface Props {
model?: Record<string, any>,
autoLabelWidth?: boolean,
model?: Record<string, any>;
autoLabelWidth?: boolean;
}

const props = withDefaults(defineProps<Props>(), {
Expand All @@ -36,15 +36,19 @@

const dbFormRef = ref();

watch(() => props.model, () => {
if (isUserChange.value) {
window.changeConfirm = true;
}
}, { deep: true });
watch(
() => props.model,
() => {
if (isUserChange.value) {
window.changeConfirm = true;
}
},
{ deep: true },
);

/** 用户主动操作变更表单 */
const isUserChange = ref(false);
const handleUserChange = () => isUserChange.value = true;
const handleUserChange = () => (isUserChange.value = true);

const getCssStyle = (el: HTMLElement, prop: string) => window.getComputedStyle(el, null).getPropertyValue(prop);
const calcLableWidth = () => {
Expand Down Expand Up @@ -99,8 +103,8 @@
});

defineExpose({
validate: (fields?: string | Array<string>) => dbFormRef.value.validate(fields)
.catch((error: Error) => {
validate: (fields?: string | Array<string>) =>
dbFormRef.value.validate(fields).catch((error: Error) => {
const errorItemEl = dbFormRef.value.$el.querySelector('.bk-form-item.is-error');
if (errorItemEl) {
errorItemEl.scrollIntoView();
Expand Down
71 changes: 35 additions & 36 deletions dbm-ui/frontend/src/components/db-member-selector/index_bak.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,10 @@
* the specific language governing permissions and limitations under the License.
-->


<template>
<div
class="db-member-selector-wrapper"
:class="{'is-focus': isFocous}">
:class="{ 'is-focus': isFocous }">
<BkSelect
class="db-member-selector"
:clearable="false"
Expand Down Expand Up @@ -46,10 +45,10 @@

import { useCopy } from '@hooks';

type GetUsesParams = ServiceParameters<typeof getUserList>
type GetUsesParams = ServiceParameters<typeof getUserList>;

interface Props {
collapseTags?: boolean
collapseTags?: boolean;
}

withDefaults(defineProps<Props>(), {
Expand All @@ -62,7 +61,7 @@
const copy = useCopy();

const state = reactive({
list: [] as {username: string}[],
list: [] as { username: string }[],
});
const isFocous = ref(false);

Expand All @@ -72,7 +71,7 @@
const fetchUseList = async (params: GetUsesParams = {}) => {
await getUserList(params).then((res) => {
// 过滤已经选中的用户
state.list = res.results.filter(item => !modelValue.value?.includes(item.username));
state.list = res.results.filter((item) => !modelValue.value?.includes(item.username));
});
};
// 初始化加载
Expand All @@ -89,44 +88,44 @@
modelValue.value = values;
};

const handleFocus = () => isFocous.value = true;
const handleBlur = () => isFocous.value = false;
const handleFocus = () => (isFocous.value = true);
const handleBlur = () => (isFocous.value = false);

const handleCopy = () => {
copy(modelValue.value.join(';'));
};
</script>

<style lang="less" scoped>
.db-member-selector-wrapper {
position: relative;

&:hover,
&.is-focus {
.db-member-selector-copy {
display: block;
.db-member-selector-wrapper {
position: relative;

&:hover,
&.is-focus {
.db-member-selector-copy {
display: block;
}
}
}
}

.db-member-selector-copy {
position: absolute;
top: 50%;
right: 2px;
z-index: 99;
display: none;
width: 20px;
height: 20px;
margin-top: -10px;
margin-right: 4px;
font-size: 16px;
line-height: 20px;
cursor: pointer;
background-color: white;

&:hover {
color: @primary-color;
background-color: #e1ecff;

.db-member-selector-copy {
position: absolute;
top: 50%;
right: 2px;
z-index: 99;
display: none;
width: 20px;
height: 20px;
margin-top: -10px;
margin-right: 4px;
font-size: 16px;
line-height: 20px;
cursor: pointer;
background-color: white;

&:hover {
color: @primary-color;
background-color: #e1ecff;
}
}
}
</style>
15 changes: 9 additions & 6 deletions dbm-ui/frontend/src/components/db-table/OriginalTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -41,9 +41,9 @@
(e: 'clearSearch'): void;
}
interface Props {
columns: InstanceType<typeof Table>['$props']['columns'],
isAnomalies?: boolean,
isSearching?: boolean,
columns: InstanceType<typeof Table>['$props']['columns'];
isAnomalies?: boolean;
isSearching?: boolean;
}

const props = withDefaults(defineProps<Props>(), {
Expand All @@ -55,9 +55,12 @@

const tableKey = ref(Date.now().toString());

watch(() => props.columns, () => {
tableKey.value = Date.now().toString();
});
watch(
() => props.columns,
() => {
tableKey.value = Date.now().toString();
},
);

const handleRefresh = () => emits('refresh');
const handleClearSearch = () => emits('clearSearch');
Expand Down
25 changes: 15 additions & 10 deletions dbm-ui/frontend/src/components/editable-info/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -149,14 +149,14 @@

<script setup lang="tsx">
interface Props {
readonly?: boolean,
columns?: Array<Array<InfoColumn>>,
data?: Record<string, any>,
width?: string,
readonly?: boolean;
columns?: Array<Array<InfoColumn>>;
data?: Record<string, any>;
width?: string;
}

interface Emits {
(e: 'save', value: EditEmitData): void
(e: 'save', value: EditEmitData): void;
}

const props = withDefaults(defineProps<Props>(), {
Expand All @@ -172,9 +172,13 @@
const loading = ref(false);
const rules = [{ required: true, trigger: 'blur', message: t('必填项') }];

watch(() => props.columns, () => {
unique.value = generateId('EDITABLE_INFO_KEY_', 6);
}, { deep: true });
watch(
() => props.columns,
() => {
unique.value = generateId('EDITABLE_INFO_KEY_', 6);
},
{ deep: true },
);

/**
* 编辑基本信息
Expand Down Expand Up @@ -205,13 +209,14 @@
return;
}

const validate = await editItemRef.value[0]?.validate()
const validate = await editItemRef.value[0]
?.validate()
.then(() => true)
.catch(() => false);
if (validate) {
loading.value = true;
let editResolve = (value: unknown = true) => value;
const promise = new Promise(resolve => editResolve = resolve);
const promise = new Promise((resolve) => (editResolve = resolve));
emit('save', { ...editState, editResolve });
const res = await promise;
loading.value = false;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
import { useFunController } from '@stores';
interface Props {
moduleId: ExtractedControllerDataKeys,
controllerId?: T
moduleId: ExtractedControllerDataKeys;
controllerId?: T;
}
const props = defineProps<Props>();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
-->

<template>
<div class="host-agent-status">
<div class="db-host-agent-status">
<DbIcon
svg
:type="statusIcon" />
Expand Down Expand Up @@ -45,7 +45,7 @@
const statusText = computed(() => textMap[props.data as keyof typeof textMap]);
</script>
<style lang="less">
.host-agent-status {
.db-host-agent-status {
display: flex;
align-items: center;
}
Expand Down
Loading

0 comments on commit 5122980

Please sign in to comment.