style(1.4.0-beta1): 优化溢出文本样式
This commit is contained in:
parent
d31dd100d6
commit
d8cdd22294
@ -1,5 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
<script setup lang="tsx">
|
||||
import { ref } from 'vue';
|
||||
import type { SelectOption } from 'naive-ui';
|
||||
import { NEllipsis } from 'naive-ui';
|
||||
import { $t } from '@/locales';
|
||||
import { translateOptions2 } from '@/utils/common';
|
||||
import { fetchGetAllGroupNameList } from '@/service/api';
|
||||
@ -39,6 +41,8 @@ const handleUpdate = (value: string) => {
|
||||
};
|
||||
|
||||
getGroupNameList();
|
||||
|
||||
const renderLabel = (option: SelectOption) => <NEllipsis>{option.label}</NEllipsis>;
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -49,6 +53,7 @@ getGroupNameList();
|
||||
:disabled="props.disabled"
|
||||
:clearable="props.clearable"
|
||||
filterable
|
||||
:render-label="renderLabel"
|
||||
@update:value="handleUpdate"
|
||||
/>
|
||||
</template>
|
||||
|
@ -1,5 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
<script setup lang="tsx">
|
||||
import { ref, watch } from 'vue';
|
||||
import type { SelectOption } from 'naive-ui';
|
||||
import { NEllipsis } from 'naive-ui';
|
||||
import { $t } from '@/locales';
|
||||
import { translateOptions2 } from '@/utils/common';
|
||||
import { fetchGetRetrySceneList } from '@/service/api';
|
||||
@ -64,6 +66,8 @@ watch(
|
||||
emit('update:value', sceneNameRef.value);
|
||||
}
|
||||
);
|
||||
|
||||
const renderLabel = (option: SelectOption) => <NEllipsis>{option.label}</NEllipsis>;
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -72,6 +76,7 @@ watch(
|
||||
:placeholder="$t('page.retryTask.form.sceneName')"
|
||||
:options="translateOptions2(sceneNameList)"
|
||||
:clearable="props.clearable"
|
||||
:render-label="renderLabel"
|
||||
/>
|
||||
</template>
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
<script setup lang="tsx">
|
||||
import { NButton, NPopconfirm, NTag } from 'naive-ui';
|
||||
import { NButton, NEllipsis, NPopconfirm, NTag } from 'naive-ui';
|
||||
import { ref } from 'vue';
|
||||
import { useBoolean } from '@sa/hooks';
|
||||
import { fetchBatchDeleteNotify, fetchGetNotifyConfigList, fetchUpdateNotifyStatus } from '@/service/api';
|
||||
@ -122,17 +122,29 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
|
||||
|
||||
if (row.systemTaskType === 1) {
|
||||
const label = $t(retryNotifyScene[row.notifyScene! as Api.NotifyConfig.RetryNotifyScene]);
|
||||
return <NTag type={tagColor(row.notifyScene)}>{label}</NTag>;
|
||||
return (
|
||||
<NTag type={tagColor(row.notifyScene)}>
|
||||
<NEllipsis class="w-136px">{label}</NEllipsis>
|
||||
</NTag>
|
||||
);
|
||||
}
|
||||
|
||||
if (row.systemTaskType === 3) {
|
||||
const label = $t(jobNotifyScene[row.notifyScene! as Api.NotifyConfig.JobNotifyScene]);
|
||||
return <NTag type={tagColor(row.notifyScene)}>{label}</NTag>;
|
||||
return (
|
||||
<NTag type={tagColor(row.notifyScene)}>
|
||||
<NEllipsis class="w-136px">{label}</NEllipsis>
|
||||
</NTag>
|
||||
);
|
||||
}
|
||||
|
||||
if (row.systemTaskType === 4) {
|
||||
const label = $t(workflowNotifyScene[row.notifyScene! as Api.NotifyConfig.WorkflowNotifyScene]);
|
||||
return <NTag type={tagColor(row.notifyScene)}>{label}</NTag>;
|
||||
return (
|
||||
<NTag type={tagColor(row.notifyScene)}>
|
||||
<NEllipsis class="w-136px">{label}</NEllipsis>
|
||||
</NTag>
|
||||
);
|
||||
}
|
||||
|
||||
return null;
|
||||
|
Loading…
Reference in New Issue
Block a user