feat: Enhance log container with copy mode and improved UI layout#11905
feat: Enhance log container with copy mode and improved UI layout#11905HynoR wants to merge 2 commits into1Panel-dev:dev-v2from
Conversation
- Added a copy mode for logs, allowing users to copy log entries easily. - Improved the layout of the log container with a toolbar and better organization of controls. - Introduced new checkboxes for displaying timestamps and watching logs, with disabled states based on copy mode. - Refactored styles for better responsiveness and usability.
|
Adding the "do-not-merge/release-note-label-needed" label because no release-note block was detected, please follow our release note process to remove it. DetailsInstructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. |
- Enhanced the copy mode button with an icon that changes based on the mode (CopyDocument or Close). - Improved user experience by visually indicating the current action of the button.
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
| /> | ||
| </div> | ||
|
|
||
| <div v-show="showType === 'env'"> |
| <div class="compose-actions"> | ||
| <el-tooltip :content="$t('home.dir')" placement="top" :show-after="400"> | ||
| <el-button | ||
| size="small" |
There was a problem hiding this comment.
悬浮显示按钮很好,只是建议保持原来的按钮格式,系统整体样式统一
| <hightlight :log="log" type="container" :container="container"></hightlight> | ||
| </div> | ||
| <template v-if="isCopyMode"> | ||
| <div v-for="(log, index) in logs" :key="`copy-${index}`" class="log-copy-item"> |
| </div> | ||
| <template v-if="isCopyMode"> | ||
| <div v-for="(log, index) in logs" :key="`copy-${index}`" class="log-copy-item"> | ||
| <span class="whitespace-pre">{{ log }}</span> |
There was a problem hiding this comment.
日志内容很多的时候,点击复制按钮全部渲染会比较卡,是否可以加一个 loading 之类的效果
| <template v-if="isCopyMode"> | ||
| <div v-for="(log, index) in logs" :key="`copy-${index}`" class="log-copy-item"> | ||
| <span class="whitespace-pre">{{ log }}</span> | ||
| </div> |
There was a problem hiding this comment.
也可以支持一波全选操作,如果日志内容太多的话,滚轮复制也不是一个好办法

What this PR does / why we need it?
改进 docker 编排页面
新增复制组件,支持日志框选复制功能
Summary of your change
Please indicate you've done the following: