From 75f8f633a23a9e5a1fd07fefc91960bddb202f33 Mon Sep 17 00:00:00 2001
From: LivySara <1936808975@qq.com>
Date: Wed, 11 Dec 2024 10:18:55 +0800
Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=E5=B8=AE=E5=8A=A9=E6=96=87=E6=A1=A3?=
 =?UTF-8?q?=E8=AF=A6=E6=83=85=E6=A0=B7=E5=BC=8F=E6=94=BE=E5=BC=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lib/client/src/components/help-doc-detail/index.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/lib/client/src/components/help-doc-detail/index.vue b/lib/client/src/components/help-doc-detail/index.vue
index 90dc76bcb..f2822ac42 100644
--- a/lib/client/src/components/help-doc-detail/index.vue
+++ b/lib/client/src/components/help-doc-detail/index.vue
@@ -48,7 +48,7 @@
                 </div>
             </aside>
             <div class="main-content">
-                <div v-if="isExistDoc" :class="['container', detailBodyCls]">
+                <div v-if="isExistDoc" :class="['doc-container', detailBodyCls]">
                     <components :is="selectDoc" />
                 </div>
                 <bk-exception v-else type="empty" scene="part" ext-cls="excep-cls">
@@ -182,9 +182,9 @@
     })
 </script>
 
-<style lang="postcss" scoped>
+<style lang="postcss">
     @import './index.css';
-    .container{
+    .doc-container{
         width: 1000px;
         margin: 0 auto;
     }

From f0b5e99b307ff9bd6cd6eb8347365ee7b56cfe12 Mon Sep 17 00:00:00 2001
From: LivySara <1936808975@qq.com>
Date: Wed, 11 Dec 2024 10:22:43 +0800
Subject: [PATCH 2/3] =?UTF-8?q?fix:=20vue3/vue2=E7=9A=84bk=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E5=B8=A6=E6=9C=89vModel=E7=9A=84=E5=B1=9E=E6=80=A7tip?=
 =?UTF-8?q?s=E4=BF=AE=E6=94=B9&vue3=E7=9A=84bk=E7=BB=84=E4=BB=B6=E5=8F=AF?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AEvModel=E6=8C=87=E4=BB=A4=E6=B7=BB=E5=8A=A0=20?=
 =?UTF-8?q?#=20Reviewed,=20transaction=20id:=2026408?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../materials/vue2/bk/cascade/index.js              |  2 +-
 .../materials/vue2/bk/checkbox-group/index.js       |  2 ++
 .../materials/vue2/bk/checkbox/index.js             |  1 +
 .../materials/vue2/bk/color-picker/index.js         |  2 +-
 .../materials/vue2/bk/date-picker/index.js          |  2 +-
 .../materials/vue2/bk/input-textarea/index.js       |  1 +
 .../materials/vue2/bk/input/index.js                |  1 +
 .../materials/vue2/bk/radio-button-group/index.js   |  2 +-
 .../materials/vue2/bk/radio-group/index.js          |  2 ++
 .../materials/vue2/bk/search-select/index.js        |  2 +-
 .../materials/vue2/bk/select/index.js               |  2 +-
 .../materials/vue2/bk/slider/index.js               |  1 +
 .../materials/vue2/bk/switcher/index.js             |  1 +
 .../materials/vue2/bk/time-picker/index.js          |  2 +-
 .../materials/vue3/bk/cascader/index.js             |  8 +++++++-
 .../materials/vue3/bk/checkbox-group/index.js       |  9 ++++++++-
 .../materials/vue3/bk/checkbox/index.js             |  8 +++++++-
 .../materials/vue3/bk/collapse/index.js             |  7 +++++++
 .../materials/vue3/bk/color-picker/index.js         |  8 +++++++-
 .../materials/vue3/bk/date-picker/index.js          |  8 +++++++-
 .../materials/vue3/bk/dialog/index.js               |  6 ++++++
 .../materials/vue3/bk/input-textarea/index.js       |  7 +++++++
 .../materials/vue3/bk/input/index.js                |  7 +++++++
 .../materials/vue3/bk/pagination/index.js           |  8 +++++++-
 .../materials/vue3/bk/process/index.js              |  8 +++++++-
 .../materials/vue3/bk/radio-group/index.js          |  9 ++++++++-
 .../materials/vue3/bk/rate/index.js                 |  8 +++++++-
 .../materials/vue3/bk/search-select/index.js        |  8 +++++++-
 .../materials/vue3/bk/select/index.js               |  8 +++++++-
 .../materials/vue3/bk/sideslider/index.js           |  8 +++++++-
 .../materials/vue3/bk/slider/index.js               |  7 +++++++
 .../materials/vue3/bk/switcher/index.js             |  7 +++++++
 .../materials/vue3/bk/tag-input/index.js            |  8 +++++++-
 .../materials/vue3/bk/time-picker/index.js          |  8 +++++++-
 .../materials/vue3/bk/transfer/index.js             | 10 ++++++++--
 lib/shared/page-code/template/page/directive.js     |  3 +++
 lib/shared/page-code/template/page/prop.js          | 13 ++++++++-----
 37 files changed, 176 insertions(+), 28 deletions(-)

diff --git a/lib/client/src/element-materials/materials/vue2/bk/cascade/index.js b/lib/client/src/element-materials/materials/vue2/bk/cascade/index.js
index 07739b620..f33e0fd3d 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/cascade/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/cascade/index.js
@@ -121,7 +121,7 @@ export default {
                 ]
             }],
             displayName: '当前被选中值',
-            tips: '当前被选中的值，支持v-model，多选时配置一个二维数组',
+            tips: '当前被选中的值，多选时配置一个二维数组，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'selection'
         },
         list: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/checkbox-group/index.js b/lib/client/src/element-materials/materials/vue2/bk/checkbox-group/index.js
index 3750e5c0f..cd27e521f 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/checkbox-group/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/checkbox-group/index.js
@@ -52,7 +52,9 @@ export default {
         value: {
             type: 'array',
             val: [],
+            directive: 'v-model',
             displayName: '选中的数值',
+            tips: '选中的数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/checkbox/index.js b/lib/client/src/element-materials/materials/vue2/bk/checkbox/index.js
index 8e8afde17..dc0dd9116 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/checkbox/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/checkbox/index.js
@@ -54,6 +54,7 @@ export default {
             type: 'boolean',
             val: false,
             displayName: '选中的数值',
+            tips: '选中的数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/color-picker/index.js b/lib/client/src/element-materials/materials/vue2/bk/color-picker/index.js
index 6bbfa7ce0..3b1c3354f 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/color-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/color-picker/index.js
@@ -55,7 +55,7 @@ export default {
             type: 'string',
             val: '#3A84FF',
             displayName: '初始RGB颜色值',
-            tips: '当前选择的RGB颜色值',
+            tips: '当前选择的RGB颜色值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         size: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/date-picker/index.js b/lib/client/src/element-materials/materials/vue2/bk/date-picker/index.js
index 46db867a7..1f6241d41 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/date-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/date-picker/index.js
@@ -83,7 +83,7 @@ export default {
             // 正则校验错误时的提示文本，默认值为"格式错误，请重新输入"
             regErrorText: '请输入正确的日期格式，如"2020-01-01"',
             displayName: '日历值',
-            tips: '日期，如"2020-01-01"',
+            tips: '日期，如"2020-01-01"，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         placeholder: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/input-textarea/index.js b/lib/client/src/element-materials/materials/vue2/bk/input-textarea/index.js
index aec05dd19..fd2b7f4f7 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/input-textarea/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/input-textarea/index.js
@@ -103,6 +103,7 @@ export default {
             type: 'text',
             val: '',
             displayName: '输入框内容',
+            tips: '输入框内容，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'input'
         },
         type: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/input/index.js b/lib/client/src/element-materials/materials/vue2/bk/input/index.js
index 673469064..a424d0fea 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/input/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/input/index.js
@@ -115,6 +115,7 @@ export default {
             type: ['string', 'number'],
             val: '',
             displayName: '输入框内容',
+            tips: '输入框内容，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'input'
         },
         type: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/radio-button-group/index.js b/lib/client/src/element-materials/materials/vue2/bk/radio-button-group/index.js
index 9ac6cd15c..92d872e8b 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/radio-button-group/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/radio-button-group/index.js
@@ -53,7 +53,7 @@ export default {
             type: 'string',
             val: 'qq',
             displayName: '选中的数值',
-            tips: '当前选中的value值',
+            tips: '当前选中的value值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/radio-group/index.js b/lib/client/src/element-materials/materials/vue2/bk/radio-group/index.js
index 1585d08be..cb5546f04 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/radio-group/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/radio-group/index.js
@@ -51,7 +51,9 @@ export default {
     props: {
         value: {
             type: ['string', 'number', 'boolean'],
+            directive: 'v-model',
             displayName: '选中的数值',
+            tips: '选中的数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/search-select/index.js b/lib/client/src/element-materials/materials/vue2/bk/search-select/index.js
index ab421b2d6..041abb1d1 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/search-select/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/search-select/index.js
@@ -177,7 +177,7 @@ export default {
             type: 'array',
             val: [],
             displayName: '查询条件',
-            tips: '选择中查询条件',
+            tips: '选择中查询条件，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'queryCondition'
         },
         'split-code': {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/select/index.js b/lib/client/src/element-materials/materials/vue2/bk/select/index.js
index b83ddb676..98f82213e 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/select/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/select/index.js
@@ -94,7 +94,7 @@ export default {
             },
             // defaultValList: ['sss', [1, 2, 3], 3],
             displayName: '选中的值',
-            tips: '当前被选中的值',
+            tips: '当前被选中的值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         multiple: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/slider/index.js b/lib/client/src/element-materials/materials/vue2/bk/slider/index.js
index 2ba30867a..d9318c1d0 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/slider/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/slider/index.js
@@ -48,6 +48,7 @@ export default {
             type: 'number',
             val: 30,
             displayName: '滑动数值',
+            tips: '滑动数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         'min-value': {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/switcher/index.js b/lib/client/src/element-materials/materials/vue2/bk/switcher/index.js
index b32ce669a..c589609bf 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/switcher/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/switcher/index.js
@@ -69,6 +69,7 @@ export default {
             type: 'boolean',
             val: false,
             displayName: '是否打开',
+            tips: '是否打开，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         disabled: {
diff --git a/lib/client/src/element-materials/materials/vue2/bk/time-picker/index.js b/lib/client/src/element-materials/materials/vue2/bk/time-picker/index.js
index 726a666d9..74e684e9c 100644
--- a/lib/client/src/element-materials/materials/vue2/bk/time-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue2/bk/time-picker/index.js
@@ -67,7 +67,7 @@ export default {
                 return ['timerange'].includes(renderProps?.type?.renderValue) ? 'array' : 'string'
             },
             displayName: '时间值',
-            tips: '时间选择器组件的值',
+            tips: '时间选择器组件的值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         placeholder: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/cascader/index.js b/lib/client/src/element-materials/materials/vue3/bk/cascader/index.js
index b4ee3d1f4..677d35661 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/cascader/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/cascader/index.js
@@ -50,6 +50,12 @@ export default {
         verticalAlign: 'middle',
         background: '#fff'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '数据源', value: 'data' },
         { label: '选中值', value: 'selectVal' },
@@ -68,7 +74,7 @@ export default {
             type: 'array',
             val: [],
             displayName: '当前被选中值',
-            tips: '当前被选中的值，支持v-model，多选时配置一个二维数组',
+            tips: '当前被选中的值，多选时配置一个二维数组，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'selectVal'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/checkbox-group/index.js b/lib/client/src/element-materials/materials/vue3/bk/checkbox-group/index.js
index d874a8c62..681b545a6 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/checkbox-group/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/checkbox-group/index.js
@@ -38,17 +38,24 @@ export default {
         display: 'inline-block',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'modelValue'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '状态', value: 'state' },
         { label: '其他', value: 'other' }
     ],
     props: {
-        'model-value': {
+        'modelValue': {
             type: 'array',
             val: [],
             directive: 'v-model',
             displayName: '选中的数值',
+            tips: '选中的数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/checkbox/index.js b/lib/client/src/element-materials/materials/vue3/bk/checkbox/index.js
index 4f7051062..648e8b7de 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/checkbox/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/checkbox/index.js
@@ -38,6 +38,12 @@ export default {
         display: 'inline-block',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '状态', value: 'state' },
@@ -49,7 +55,7 @@ export default {
             type: ['boolean', 'string', 'number'],
             val: false,
             displayName: '设置绑定值',
-            tips: '绑定值',
+            tips: '绑定值，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/collapse/index.js b/lib/client/src/element-materials/materials/vue3/bk/collapse/index.js
index 5cf33ebbf..6fadaf8e4 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/collapse/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/collapse/index.js
@@ -21,6 +21,12 @@ export default {
         { displayName: '点击标题', name: 'item-click', tips: '点击时触发，回调参数为点击的面板对象 (item)' }
     ],
     styles: ['position', 'size', 'margin', 'pointer', 'opacity'],
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '激活面板', value: 'activePanel' },
         { label: '头部', value: 'header' },
@@ -33,6 +39,7 @@ export default {
             val: [],
             displayName: '当前激活面板的key',
             directive: 'v-model',
+            tips: '当前激活面板的key，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'activePanel'
         },
         accordion: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/color-picker/index.js b/lib/client/src/element-materials/materials/vue3/bk/color-picker/index.js
index 5f9890912..15d7193ce 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/color-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/color-picker/index.js
@@ -38,6 +38,12 @@ export default {
         display: 'inline-flex',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '显示', value: 'display' },
@@ -50,7 +56,7 @@ export default {
             type: 'string',
             val: '#3A84FF',
             displayName: '初始RGB颜色值',
-            tips: '当前选择的RGB颜色值',
+            tips: '当前选择的RGB颜色值，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/date-picker/index.js b/lib/client/src/element-materials/materials/vue3/bk/date-picker/index.js
index 81df88787..8de712a36 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/date-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/date-picker/index.js
@@ -64,6 +64,12 @@ export default {
         width: '300px',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '值的格式', value: 'format' },
@@ -85,7 +91,7 @@ export default {
             // 正则校验错误时的提示文本，默认值为"格式错误，请重新输入"
             regErrorText: '请输入正确的日期格式，如"2020-01-01"',
             displayName: '日历值',
-            tips: '日期，如"2020-01-01"',
+            tips: '日期，如"2020-01-01"，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/dialog/index.js b/lib/client/src/element-materials/materials/vue3/bk/dialog/index.js
index fbccb442d..3f53d5020 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/dialog/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/dialog/index.js
@@ -54,6 +54,12 @@ export default {
     renderStyles: {
         display: 'inline-block'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'is-show'
+        }
+    ],
     groups: [
         { label: '显示', value: 'display' },
         { label: '状态', value: 'state' },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/input-textarea/index.js b/lib/client/src/element-materials/materials/vue3/bk/input-textarea/index.js
index 2cf2ba757..7b3d1cd2d 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/input-textarea/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/input-textarea/index.js
@@ -73,6 +73,12 @@ export default {
         verticalAlign: 'middle',
         width: '300px'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '输入内容', value: 'input' },
         { label: '提示', value: 'tip' },
@@ -89,6 +95,7 @@ export default {
             val: '',
             directive: 'v-model',
             displayName: '输入框内容',
+            tips: '输入框内容，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'input'
         },
         type: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/input/index.js b/lib/client/src/element-materials/materials/vue3/bk/input/index.js
index c85ead634..4be45c4dd 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/input/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/input/index.js
@@ -83,6 +83,12 @@ export default {
         display: 'inline-flex',
         width: '300px'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '输入内容', value: 'input' },
         { label: '类型', value: 'type' },
@@ -101,6 +107,7 @@ export default {
             val: '',
             directive: 'v-model',
             displayName: '输入框内容',
+            tips: '输入框内容，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'input'
         },
         type: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/pagination/index.js b/lib/client/src/element-materials/materials/vue3/bk/pagination/index.js
index 2da4d0c5a..43ddf1376 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/pagination/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/pagination/index.js
@@ -71,6 +71,12 @@ export default {
     ],
     renderStyles: {
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '数据量', value: 'data' },
         { label: '页码', value: 'pageNumber' },
@@ -87,7 +93,7 @@ export default {
             type: 'number',
             val: 1,
             displayName: '当前页码',
-            tips: '当前页码',
+            tips: '当前页码，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'pageNumber'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/process/index.js b/lib/client/src/element-materials/materials/vue3/bk/process/index.js
index b4c086908..4a3dba9cb 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/process/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/process/index.js
@@ -34,6 +34,12 @@ export default {
         'pointer',
         'opacity'
     ],
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'cur-process'
+        }
+    ],
     groups: [
         { label: '数据源', value: 'dataSource' },
         { label: '步骤索引', value: 'stepIndex' },
@@ -77,7 +83,7 @@ export default {
             type: 'number',
             val: 0,
             displayName: '步骤索引值',
-            tips: '当前步骤的索引值，支持 .sync 修饰符',
+            tips: '当前步骤的索引值，支持 .sync 修饰符，也支持v-model双向绑定，v-model优先级更高',
             regExp: /^(0|[1-9][0-9]*)$/,
             regErrorText: '请输入大于等于0的整数',
             directive: 'v-model',
diff --git a/lib/client/src/element-materials/materials/vue3/bk/radio-group/index.js b/lib/client/src/element-materials/materials/vue3/bk/radio-group/index.js
index 5659680d8..78024211c 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/radio-group/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/radio-group/index.js
@@ -38,6 +38,12 @@ export default {
         display: 'inline-block',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'modelValue'
+        }
+    ],
     groups: [
         { label: '数值', value: 'value' },
         { label: '状态', value: 'state' },
@@ -45,11 +51,12 @@ export default {
         { label: '其他', value: 'other' }
     ],
     props: {
-        'model-value': {
+        'modelValue': {
             type: ['string', 'number'],
             val: '1',
             directive: 'v-model',
             displayName: '选中的数值',
+            tips: '选中的数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         name: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/rate/index.js b/lib/client/src/element-materials/materials/vue3/bk/rate/index.js
index 2ae46a3d5..41e022de4 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/rate/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/rate/index.js
@@ -43,6 +43,12 @@ export default {
         display: 'inline-block',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '分数值', value: 'value' },
         { label: '样式', value: 'style' },
@@ -53,7 +59,7 @@ export default {
             type: 'number',
             val: 0,
             displayName: '显示的分数',
-            tips: '显示的分数',
+            tips: '显示的分数，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/search-select/index.js b/lib/client/src/element-materials/materials/vue3/bk/search-select/index.js
index e34b46806..5fbbc04e3 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/search-select/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/search-select/index.js
@@ -42,6 +42,12 @@ export default {
     renderStyles: {
         display: 'block'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '数据源', value: 'dataSource' },
         { label: '查询条件', value: 'queryCondition' },
@@ -89,7 +95,7 @@ export default {
             type: 'array',
             val: [],
             displayName: '已选择的数据项',
-            tips: '已选择的数据项',
+            tips: '已选择的数据项，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'queryCondition'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/select/index.js b/lib/client/src/element-materials/materials/vue3/bk/select/index.js
index d4adeda02..c60b56f2e 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/select/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/select/index.js
@@ -85,6 +85,12 @@ export default {
         verticalAlign: 'middle',
         background: '#fff'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '数据源', value: 'dataSource' },
         { label: '数值', value: 'value' },
@@ -109,7 +115,7 @@ export default {
             // defaultValList: ['sss', [1, 2, 3], 3],
             val: '',
             displayName: '选中的值',
-            tips: '当前被选中的值',
+            tips: '当前被选中的值，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/sideslider/index.js b/lib/client/src/element-materials/materials/vue3/bk/sideslider/index.js
index 0f310d7fb..e4d2fb33a 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/sideslider/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/sideslider/index.js
@@ -43,6 +43,12 @@ export default {
     renderStyles: {
         display: 'inline-block'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'is-show'
+        }
+    ],
     groups: [
         { label: '可见性', value: 'visibility' },
         { label: 'header区域', value: 'header' },
@@ -55,7 +61,7 @@ export default {
         'is-show': {
             type: 'boolean',
             displayName: '是否显示侧栏',
-            tips: '是否显示组件，支持v-model写法',
+            tips: '是否显示组件，支持v-model双向绑定，v-model优先级更高',
             val: true,
             staticValue: true, // 静态值，表示只是代码和UI改变，画布内的值不变
             directive: 'v-model',
diff --git a/lib/client/src/element-materials/materials/vue3/bk/slider/index.js b/lib/client/src/element-materials/materials/vue3/bk/slider/index.js
index a729df19d..26b5d4fe1 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/slider/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/slider/index.js
@@ -27,6 +27,12 @@ export default {
         'pointer',
         'opacity'
     ],
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '方向', value: 'direction' },
@@ -43,6 +49,7 @@ export default {
             val: 30,
             directive: 'v-model',
             displayName: '滑动数值',
+            tips: '滑动数值，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         vertical: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/switcher/index.js b/lib/client/src/element-materials/materials/vue3/bk/switcher/index.js
index 880b2501c..da2d3a7ea 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/switcher/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/switcher/index.js
@@ -37,6 +37,12 @@ export default {
     renderStyles: {
         display: 'inline-block'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '文本', value: 'text' },
@@ -65,6 +71,7 @@ export default {
             val: false,
             directive: 'v-model',
             displayName: '是否打开',
+            tips: '是否打开，支持v-model双向绑定，v-model优先级更高',
             belongGroup: 'value'
         },
         disabled: {
diff --git a/lib/client/src/element-materials/materials/vue3/bk/tag-input/index.js b/lib/client/src/element-materials/materials/vue3/bk/tag-input/index.js
index f2fe8aa5f..d7ea27639 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/tag-input/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/tag-input/index.js
@@ -69,6 +69,12 @@ export default {
         width: '300px',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '输入值', value: 'input' },
         { label: '数据', value: 'data' },
@@ -86,7 +92,7 @@ export default {
         'model-value': {
             type: ['string', 'array'],
             val: '',
-            tips: '空白提示',
+            tips: '空白提示，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             displayName: '标签输入值',
             belongGroup: 'input'
diff --git a/lib/client/src/element-materials/materials/vue3/bk/time-picker/index.js b/lib/client/src/element-materials/materials/vue3/bk/time-picker/index.js
index 585aa88e3..e76441cd0 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/time-picker/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/time-picker/index.js
@@ -60,6 +60,12 @@ export default {
         width: '300px',
         verticalAlign: 'middle'
     },
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'model-value'
+        }
+    ],
     groups: [
         { label: '值', value: 'value' },
         { label: '类型', value: 'type' },
@@ -78,7 +84,7 @@ export default {
                 return ['timerange'].includes(renderProps?.type?.renderValue) ? 'array' : 'string'
             },
             displayName: '时间值',
-            tips: '时间选择器组件的值',
+            tips: '时间选择器组件的值，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'value'
         },
diff --git a/lib/client/src/element-materials/materials/vue3/bk/transfer/index.js b/lib/client/src/element-materials/materials/vue3/bk/transfer/index.js
index 2a12714f2..f912dcf04 100644
--- a/lib/client/src/element-materials/materials/vue3/bk/transfer/index.js
+++ b/lib/client/src/element-materials/materials/vue3/bk/transfer/index.js
@@ -34,6 +34,12 @@ export default {
         'pointer',
         'opacity'
     ],
+    directives: [
+        {
+            type: 'v-model',
+            prop: 'target-list'
+        }
+    ],
     groups: [
         { label: '数据', value: 'data' },
         { label: '文本', value: 'text' },
@@ -100,11 +106,11 @@ export default {
             tips: '排序所依据的 key',
             belongGroup: 'data'
         },
-        'model-value': {
+        'target-list': {
             type: 'array',
             val: [],
             displayName: '已选择数据',
-            tips: '已选择数据，数据格式[\'shenzhen\', \'guangzhou\']',
+            tips: '已选择数据，数据格式[\'shenzhen\', \'guangzhou\']，支持v-model双向绑定，v-model优先级更高',
             directive: 'v-model',
             belongGroup: 'data'
         },
diff --git a/lib/shared/page-code/template/page/directive.js b/lib/shared/page-code/template/page/directive.js
index c93655f6d..294d24d15 100644
--- a/lib/shared/page-code/template/page/directive.js
+++ b/lib/shared/page-code/template/page/directive.js
@@ -34,6 +34,9 @@ export default function (code, renderDirectives, componentId) {
                 vueDirectives.push(`v-for="(${id}Item, ${id}Index) in ${disPlayVal}" :key="${id}Index"`)
                 break
             case 'v-model':
+                const directiveProp = code.framework === 'vue3' ? `${type}:${prop}="${disPlayVal}"` : `${type}="${disPlayVal}"`
+                propDirectives.push(directiveProp)
+                break
             case 'v-show':
             case 'v-html':
                 propDirectives.push(`${type}="${disPlayVal}"`)
diff --git a/lib/shared/page-code/template/page/prop.js b/lib/shared/page-code/template/page/prop.js
index 8333f4889..a45c1d045 100644
--- a/lib/shared/page-code/template/page/prop.js
+++ b/lib/shared/page-code/template/page/prop.js
@@ -54,7 +54,7 @@ function getPropsStr (code, type, compId, props, dirProps, slots) {
     const keyList = []
     for (const i in props) {
         if ((dirProps.find((directive) => (directive.prop === i)) && !['remote', 'data-source', 'table-data-source'].includes(props[i].valueType))
-            || (['bk-checkbox-group', 'bk-radio-group'].includes(type) && ['value', 'modelValue'].includes(i))) continue
+            || (['bk-checkbox-group', 'bk-radio-group'].includes(type) && ['value', 'modelValue'].includes(i) && props[i].format === 'value')) continue
         
         const keyId = camelCase(i, { transform: camelCaseTransformMerge })
         if (keyList.indexOf(keyId) > -1) {
@@ -235,13 +235,16 @@ function getPropsStr (code, type, compId, props, dirProps, slots) {
     }
     // 某些组件库组件的联动首先是靠增加vmodel实现的，需要程序自动生成
     const hasVModel = dirProps.filter(item => item.type === 'v-model').length
-    if (type === 'bk-checkbox-group' && !hasVModel) {
-        const propVal = props.value?.renderValue || props.modelValue?.renderValue
-        const checkedValue = (slots.default.code || []).filter(c => c.checked === true).map(c => c.value) || propVal
+    // 绑定值格式是value
+    const isModelTypeVal = props.value?.format || props.modelValue?.format
+    if (type === 'bk-checkbox-group' && !hasVModel && isModelTypeVal === 'value') {
+        const propVal = props.value?.code || props.modelValue?.code
+        const checkedItem = (slots.default.code || []).filter(c => c.checked === true).map(c => c.value)
+        const checkedValue = checkedItem?.length ? checkedItem : propVal
         code.dataTemplate(`${compId}Vmodel`, JSON.stringify(checkedValue))
         propsStr += `v-model="${compId}Vmodel"`
     }
-    if (type === 'bk-radio-group' && !hasVModel) {
+    if (type === 'bk-radio-group' && !hasVModel && isModelTypeVal === 'value') {
         const propVal = props.value?.renderValue || props.modelValue?.renderValue
         const checkedItem = (slots.default.code || []).find(c => c.checked === true)
         const checkedValue = (checkedItem && checkedItem.value) || propVal || ''

From b252a86afe2f3dc6979db024c67cfc184bc12082 Mon Sep 17 00:00:00 2001
From: LivySara <1936808975@qq.com>
Date: Fri, 13 Dec 2024 16:55:40 +0800
Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=E6=BA=90=E7=A0=81=E7=94=9F=E6=88=90?=
 =?UTF-8?q?=E5=85=AC=E5=85=B1=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96=20#=20Re?=
 =?UTF-8?q?viewed,=20transaction=20id:=2026745?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lib/client/src/css/common.css             | 69 +++++++++++++++++++
 .../lib/client/src/css/common.css             | 69 +++++++++++++++++++
 lib/shared/page-code/common/utils.js          | 11 +++
 lib/shared/page-code/index.js                 |  3 +-
 .../style/default-style/common-style.js       | 16 ++++-
 .../page-code/style/default-style/index.js    | 12 ++--
 lib/shared/page-code/style/index.js           |  2 +-
 .../template/page/component/index.js          |  4 +-
 .../page-code/template/page/layout/index.js   |  5 +-
 9 files changed, 180 insertions(+), 11 deletions(-)
 create mode 100644 lib/server/project-template/vue2/project-init-code/lib/client/src/css/common.css
 create mode 100644 lib/server/project-template/vue3/project-init-code/lib/client/src/css/common.css

diff --git a/lib/server/project-template/vue2/project-init-code/lib/client/src/css/common.css b/lib/server/project-template/vue2/project-init-code/lib/client/src/css/common.css
new file mode 100644
index 000000000..695a553b1
--- /dev/null
+++ b/lib/server/project-template/vue2/project-init-code/lib/client/src/css/common.css
@@ -0,0 +1,69 @@
+[align-horizontal-left] > *,
+    [align-horizontal-center] > *,
+    [align-horizontal-right] > *,
+    [align-horizontal-space-between] > *,
+    [align-vertical-top] > *,
+    [align-vertical-center] > *,
+    [align-vertical-bottom] > *{
+        flex-shrink: 0;
+    }
+    [align-horizontal-left],
+    [align-horizontal-center],
+    [align-horizontal-right],
+    [align-horizontal-space-between]{
+        display: flex !important;
+        align-items: flex-start;
+        flex-wrap: wrap;
+    }
+    [align-horizontal-left]{
+        justify-content: flex-start;
+    }
+    [align-horizontal-center]{
+        justify-content: center;
+    }
+    [align-horizontal-right]{
+        justify-content: flex-end;
+    }
+    [align-horizontal-space-between]{
+        justify-content: space-between;
+    }
+    [align-vertical-top],
+    [align-vertical-center],
+    [align-vertical-bottom]{
+        display: flex !important;
+        flex-wrap: wrap;
+    }
+    [align-vertical-top]{
+        align-items: flex-start;
+    }
+    [align-vertical-center]{
+        align-items: center;
+    }
+    [align-vertical-bottom]{
+        align-items: flex-end;
+    }
+    [absolute-align-horizontal-left] {
+        left: 0 !important;
+    }
+    [absolute-align-horizontal-center] {
+        left: 50% !important;
+        transform: translateX(-50%) !important;
+    }
+    [absolute-align-horizontal-right] {
+        left: unset !important;
+        right: 0 !important;
+    }
+    [absolute-align-vertical-top] {
+        top: 0 !important;
+    }
+    [absolute-align-vertical-center] {
+        top: 50% !important;
+        transform: translateY(-50%) !important;
+    }
+    [absolute-align-vertical-bottom] {
+        top: unset !important;
+        bottom: 0 !important;
+    }
+    [absolute-align-horizontal-center][absolute-align-vertical-center]{
+        transform: translate(-50%, -50%) !important;
+    }
\ No newline at end of file
diff --git a/lib/server/project-template/vue3/project-init-code/lib/client/src/css/common.css b/lib/server/project-template/vue3/project-init-code/lib/client/src/css/common.css
new file mode 100644
index 000000000..695a553b1
--- /dev/null
+++ b/lib/server/project-template/vue3/project-init-code/lib/client/src/css/common.css
@@ -0,0 +1,69 @@
+[align-horizontal-left] > *,
+    [align-horizontal-center] > *,
+    [align-horizontal-right] > *,
+    [align-horizontal-space-between] > *,
+    [align-vertical-top] > *,
+    [align-vertical-center] > *,
+    [align-vertical-bottom] > *{
+        flex-shrink: 0;
+    }
+    [align-horizontal-left],
+    [align-horizontal-center],
+    [align-horizontal-right],
+    [align-horizontal-space-between]{
+        display: flex !important;
+        align-items: flex-start;
+        flex-wrap: wrap;
+    }
+    [align-horizontal-left]{
+        justify-content: flex-start;
+    }
+    [align-horizontal-center]{
+        justify-content: center;
+    }
+    [align-horizontal-right]{
+        justify-content: flex-end;
+    }
+    [align-horizontal-space-between]{
+        justify-content: space-between;
+    }
+    [align-vertical-top],
+    [align-vertical-center],
+    [align-vertical-bottom]{
+        display: flex !important;
+        flex-wrap: wrap;
+    }
+    [align-vertical-top]{
+        align-items: flex-start;
+    }
+    [align-vertical-center]{
+        align-items: center;
+    }
+    [align-vertical-bottom]{
+        align-items: flex-end;
+    }
+    [absolute-align-horizontal-left] {
+        left: 0 !important;
+    }
+    [absolute-align-horizontal-center] {
+        left: 50% !important;
+        transform: translateX(-50%) !important;
+    }
+    [absolute-align-horizontal-right] {
+        left: unset !important;
+        right: 0 !important;
+    }
+    [absolute-align-vertical-top] {
+        top: 0 !important;
+    }
+    [absolute-align-vertical-center] {
+        top: 50% !important;
+        transform: translateY(-50%) !important;
+    }
+    [absolute-align-vertical-bottom] {
+        top: unset !important;
+        bottom: 0 !important;
+    }
+    [absolute-align-horizontal-center][absolute-align-vertical-center]{
+        transform: translate(-50%, -50%) !important;
+    }
\ No newline at end of file
diff --git a/lib/shared/page-code/common/utils.js b/lib/shared/page-code/common/utils.js
index 11f29d462..36d1fec01 100644
--- a/lib/shared/page-code/common/utils.js
+++ b/lib/shared/page-code/common/utils.js
@@ -141,3 +141,14 @@ export function getAlignStr (renderAlign = {}, inFreeLayout = false) {
     }
     return alignStr
 }
+
+/**
+ * @desc 判断是否插入公共样式
+ * @param { CodeModel } code 对齐相关的属性配置
+ * @param { string } alignStr 公共样式前缀
+ * @returns
+ */
+export function getInsertCommonStyle (code, alignStr) {
+    const val = !code.isStaticCommonStyle && alignStr?.trim() !== '' ? true : code.isStaticCommonStyle
+    code.setProperty('isStaticCommonStyle', val)
+}
diff --git a/lib/shared/page-code/index.js b/lib/shared/page-code/index.js
index 34d39a590..2e8690310 100644
--- a/lib/shared/page-code/index.js
+++ b/lib/shared/page-code/index.js
@@ -38,7 +38,8 @@ class NewPageCode {
     codeErrMessage = '' // 记录生成源码中里的错误信息
     h5ContainerInitOption = true // h5容器初始化选项
     framework = 'vue2'
-
+    isStaticCommonStyle = false // 是否接入公共样式
+    
     // 支持设置权限的组件 type 集合
     appPermComponents = {
         'bk-button': 'auth-button'
diff --git a/lib/shared/page-code/style/default-style/common-style.js b/lib/shared/page-code/style/default-style/common-style.js
index ea52cbbfa..0a2d2e7c0 100644
--- a/lib/shared/page-code/style/default-style/common-style.js
+++ b/lib/shared/page-code/style/default-style/common-style.js
@@ -31,7 +31,21 @@ export default function (uniqueKey) {
         height: 100%;
         position: relative;
     }
-    [align-horizontal-left] > *,
+    `
+}
+
+/**
+ * @desc 返回需要内置固有的样式
+ * @param { Boolean } isStaticCommonStyle 是否插入固定样式
+ * @param { String } pageType 页面类型
+ * @returns { String }
+ */
+export function getStaticCommonStyle (isStaticCommonStyle, pageType) {
+    if (pageType === 'projectCode') {
+        return '@import \'@/css/common.css\';'
+    }
+    if (!isStaticCommonStyle) return ''
+    return `[align-horizontal-left] > *,
     [align-horizontal-center] > *,
     [align-horizontal-right] > *,
     [align-horizontal-space-between] > *,
diff --git a/lib/shared/page-code/style/default-style/index.js b/lib/shared/page-code/style/default-style/index.js
index 5793d7587..c206ec79a 100644
--- a/lib/shared/page-code/style/default-style/index.js
+++ b/lib/shared/page-code/style/default-style/index.js
@@ -1,15 +1,19 @@
-import getCommonStyle from './common-style'
+import getCommonStyle, { getStaticCommonStyle } from './common-style'
 import getPcStyle from './pc-style'
 import getMobileStyle from './mobile-style'
 
 /**
  * @desc 返回对应平台类型页面的内置样式
- * @param { String } uniqueKey 页面唯一标识
- * @param { String } platform 平台： PC/MOBILE
+ * @param { CodeModel } code
  * @returns { String }
  */
-export default function (uniqueKey, platform = 'PC') {
+export default function (code) {
+    const { uniqueKey, platform = 'PC', isStaticCommonStyle, pageType = 'vueCode' } = code
     let defaultCss = getCommonStyle(uniqueKey)
+    const staticCommonCss = getStaticCommonStyle(isStaticCommonStyle, pageType)
+    defaultCss = (pageType === 'projectCode')
+        ? defaultCss = staticCommonCss + defaultCss
+        : defaultCss += staticCommonCss
     if (platform === 'MOBILE') {
         defaultCss += getMobileStyle()
     } else {
diff --git a/lib/shared/page-code/style/index.js b/lib/shared/page-code/style/index.js
index 4ce38a19f..ae4c5e1ac 100644
--- a/lib/shared/page-code/style/index.js
+++ b/lib/shared/page-code/style/index.js
@@ -16,7 +16,7 @@ export default function (code) {
     head = '<style lang="css" scoped>'
 
     // 根据页面类型，获取默认内置样式
-    defaultStyle = getDefaultStyle(code.uniqueKey, code.platform)
+    defaultStyle = getDefaultStyle(code)
 
     if (code.hasLayout) {
         // 获取导航布局样式
diff --git a/lib/shared/page-code/template/page/component/index.js b/lib/shared/page-code/template/page/component/index.js
index 22c865304..425314814 100644
--- a/lib/shared/page-code/template/page/component/index.js
+++ b/lib/shared/page-code/template/page/component/index.js
@@ -1,5 +1,5 @@
 import { camelCase, camelCaseTransformMerge } from 'change-case'
-import { handleRenderStyles, getAlignStr, getFreeLayoutItemStyle } from '../../../common/utils'
+import { handleRenderStyles, getAlignStr, getFreeLayoutItemStyle, getInsertCommonStyle } from '../../../common/utils'
 import getItemProps from '../prop'
 import getItemStyles from '../style'
 import getItemEvents from '../event'
@@ -51,7 +51,7 @@ export default function generateComponment (code, item, vueDirective, propDirect
     let css = ''
     let styles = handleRenderStyles(item.renderStyles)
     const alignStr = getAlignStr(item.renderAlign || {}, inFreeLayout)
-
+    getInsertCommonStyle(code, alignStr)
     if (inFreeLayout) {
         const { css: returnCss, styles: returnStyles } = getFreeLayoutItemStyle(styles, item.type)
         css = returnCss
diff --git a/lib/shared/page-code/template/page/layout/index.js b/lib/shared/page-code/template/page/layout/index.js
index 8d00102d1..f12123414 100644
--- a/lib/shared/page-code/template/page/layout/index.js
+++ b/lib/shared/page-code/template/page/layout/index.js
@@ -1,4 +1,4 @@
-import { getAlignStr } from '../../../common/utils'
+import { getAlignStr, getInsertCommonStyle } from '../../../common/utils'
 import getDirectives from '../directive'
 import getItemStyles from '../style'
 import generateComponent from '../component'
@@ -28,7 +28,7 @@ export default function generateLayout (code, items = [], inFreeLayout = false)
         if (templateDirective) templateCode += `\n<template ${templateDirective}>`
         // 或者对布局设置的居中、居左、居右样式
         const alignStr = getAlignStr(item.renderAlign || {}, inFreeLayout)
-
+        getInsertCommonStyle(code, alignStr)
         // 多列布局
         if (item.type === 'render-grid') {
             /* eslint-disable no-unused-vars, indent */
@@ -38,6 +38,7 @@ export default function generateLayout (code, items = [], inFreeLayout = false)
                     ${item.renderSlots && item.renderSlots.default && item.renderSlots.default.map(col => {
                         getItemStyles(code, col.componentId, col.renderStyles, col.renderProps, {})
                         const colAlignStr = getAlignStr(col.renderAlign || {}, inFreeLayout)
+                        getInsertCommonStyle(code, colAlignStr)
                         const {
                             vueDirectives: rowVueDirs,
                             propDirectives: rowPropDirs,