From 4ce4746058588baa78b8f0623fdffa1f4bcac867 Mon Sep 17 00:00:00 2001
From: wuduochao <wu.duochao@99cloud.net>
Date: Wed, 30 Jun 2021 10:11:33 +0800
Subject: [PATCH] fix: Fix the stack log is not showed completely

1. The name of the stack is too long to showed completely
2. Add css style with workbreak & wordwrap to fix this problem

Change-Id: Id19f9e154841e64a9d468b90fee26e86cd06417e
---
 src/pages/heat/containers/Stack/Detail/Event.jsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/src/pages/heat/containers/Stack/Detail/Event.jsx b/src/pages/heat/containers/Stack/Detail/Event.jsx
index 7f9ac438..9e2a29b8 100644
--- a/src/pages/heat/containers/Stack/Detail/Event.jsx
+++ b/src/pages/heat/containers/Stack/Detail/Event.jsx
@@ -12,6 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
+import React from 'react';
 import { observer, inject } from 'mobx-react';
 import Base from 'containers/List';
 import { StackEventStore } from 'stores/heat/event';
@@ -45,10 +46,20 @@ export default class Event extends Base {
     {
       title: t('Stack Resource'),
       dataIndex: 'logical_resource_id',
+      render: (it) => (
+        <div style={{ wordWrap: 'break-word', wordBreak: 'break-word' }}>
+          {it}
+        </div>
+      ),
     },
     {
       title: t('Resource'),
       dataIndex: 'physical_resource_id',
+      render: (it) => (
+        <div style={{ wordWrap: 'break-word', wordBreak: 'break-word' }}>
+          {it}
+        </div>
+      ),
     },
     {
       title: t('Resource Status'),