From 2a55403526c781eb934ece4e8970d6350ff14229 Mon Sep 17 00:00:00 2001
From: mou <10402885@qq.com>
Date: Thu, 3 Aug 2023 00:37:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=B9=E5=99=A8=E7=BB=84=E4=BB=B6=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E6=BB=9A=E5=8A=A8=E6=9D=A1=E5=BC=80=E5=85=B3=20contai?=
 =?UTF-8?q?ner=20add=20scroll=20Switch?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lowcoder/src/comps/comps/containerComp/containerComp.tsx  | 4 ++++
 .../src/comps/comps/triContainerComp/triContainer.tsx         | 4 ++++
 client/packages/lowcoder/src/i18n/locales/en.ts               | 1 +
 client/packages/lowcoder/src/i18n/locales/zh.ts               | 1 +
 4 files changed, 10 insertions(+)

diff --git a/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx b/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
index e2b85b9c5..81a8ec0db 100644
--- a/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
+++ b/client/packages/lowcoder/src/comps/comps/containerComp/containerComp.tsx
@@ -14,10 +14,12 @@ import { disabledPropertyView, hiddenPropertyView } from "comps/utils/propertyUt
 import { trans } from "i18n";
 import { BoolCodeControl } from "comps/controls/codeControl";
 import { DisabledContext } from "comps/generators/uiCompBuilder";
+import { BoolControl } from "@lowcoder-ee/comps/controls/boolControl";
 
 export const ContainerBaseComp = (function () {
   const childrenMap = {
     disabled: BoolCodeControl,
+    showScroll: BoolControl.DEFAULT_TRUE,
   };
   return new ContainerCompBuilder(childrenMap, (props, dispatch) => {
     return (
@@ -32,6 +34,8 @@ export const ContainerBaseComp = (function () {
           <Section name={sectionNames.interaction}>{disabledPropertyView(children)}</Section>
           <Section name={sectionNames.layout}>
             {children.container.getPropertyView()}
+            {!children.container.children.autoHeight.getView() && children.showScroll.propertyView({
+            label: trans("container.showScroll")})}
             {hiddenPropertyView(children)}
           </Section>
           <Section name={sectionNames.style}>{children.container.stylePropertyView()}</Section>
diff --git a/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx b/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
index f9c0e23a4..3ebf8c960 100644
--- a/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
+++ b/client/packages/lowcoder/src/comps/comps/triContainerComp/triContainer.tsx
@@ -39,9 +39,11 @@ const BodyInnerGrid = styled(InnerGrid)<{
   showBorder: boolean;
   backgroundColor: string;
   borderColor: string;
+  showScroll?: boolean;
 }>`
   border-top: ${(props) => `${props.showBorder ? 1 : 0}px solid ${props.borderColor}`};
   flex: 1;
+  overflow: ${(props) => `${props.showScroll ? 'auto' : 'hidden'}`};
   ${(props) => props.backgroundColor && `background-color: ${props.backgroundColor};`}
   border-radius: 0;
 `;
@@ -59,6 +61,7 @@ const FooterInnerGrid = styled(InnerGrid)<{
 
 export type TriContainerProps = TriContainerViewProps & {
   hintPlaceholder?: ReactNode;
+  showScroll?: boolean;
 };
 
 export function TriContainer(props: TriContainerProps) {
@@ -110,6 +113,7 @@ export function TriContainer(props: TriContainerProps) {
             hintPlaceholder={props.hintPlaceholder ?? HintPlaceHolder}
             backgroundColor={style?.background}
             borderColor={style?.border}
+            showScroll={props?.showScroll}
             style={{padding: style.containerbodypadding}}
           />
         </BackgroundColorContext.Provider>
diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts
index 941a77767..e6c754e0a 100644
--- a/client/packages/lowcoder/src/i18n/locales/en.ts
+++ b/client/packages/lowcoder/src/i18n/locales/en.ts
@@ -1355,6 +1355,7 @@ export const en = {
   },
   container: {
     title: "Container title",
+    showScroll: "Show scroll",
   },
   drawer: {
     placement: "Drawer placement",
diff --git a/client/packages/lowcoder/src/i18n/locales/zh.ts b/client/packages/lowcoder/src/i18n/locales/zh.ts
index 7fb2416d5..7880b30f1 100644
--- a/client/packages/lowcoder/src/i18n/locales/zh.ts
+++ b/client/packages/lowcoder/src/i18n/locales/zh.ts
@@ -1333,6 +1333,7 @@ selectionControl: {
 },
 container: {
     title: "容器标题",
+    showScroll: "显示滚动条",
 },
 drawer: {
     placement: "抽屉位置",