From d4674f8f7eeadbeceeca19eed9d3ceed065787a1 Mon Sep 17 00:00:00 2001
From: "zhu.yawen" <zhu.yawen@ustcinfo.com>
Date: Fri, 13 Oct 2023 14:39:20 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E7=BB=84=E4=BB=B6=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E7=BB=95x=E8=BD=B4y=E8=BD=B4=E6=89=AD=E6=9B=B2=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../BasicComponents/Button/settingConfig.js   |  4 ++-
 .../BasicComponents/ChartTab/settingConfig.js |  4 ++-
 .../CurrentTime/settingConfig.js              |  4 ++-
 .../DateTimePicker/settingConfig.js           |  4 ++-
 .../DigitalFlop/settingConfig.js              |  4 ++-
 .../BasicComponents/FlyMap/settingConfig.js   |  4 ++-
 .../HorizontalLine/settingConfig.js           |  4 ++-
 .../IframeChart/settingConfig.js              |  4 ++-
 .../IndexCard/settingConfig.js                |  4 ++-
 .../IndexCard2/settingConfig.js               |  4 ++-
 .../IndicatorCard/settingConfig.js            |  4 ++-
 .../IndicatorCard2/settingConfig.js           |  4 ++-
 .../BasicComponents/Input/settingConfig.js    |  4 ++-
 .../LinkChart/settingConfig.js                |  4 ++-
 .../BasicComponents/Map/settingConfig.js      |  4 ++-
 .../BasicComponents/Marquee/settingConfig.js  |  4 ++-
 .../BasicComponents/Numbers/settingConfig.js  |  4 ++-
 .../BasicComponents/Picture/settingConfig.js  |  4 ++-
 .../ScreenScrollBoard/setting.vue             |  4 ++-
 .../ScreenScrollBoard/settingConfig.js        |  4 ++-
 .../ScreenScrollRanking/settingConfig.js      |  4 ++-
 .../BasicComponents/Select/settingConfig.js   |  4 ++-
 .../BasicComponents/Tables/settingConfig.js   |  4 ++-
 .../BasicComponents/Texts/settingConfig.js    |  4 ++-
 .../ThemeSelect/settingConfig.js              |  4 ++-
 .../ThemeSwitcher/settingConfig.js            |  4 ++-
 .../TimeCountDown/settingConfig.js            |  4 ++-
 .../TimePicker/settingConfig.js               |  4 ++-
 .../VerticalLine/settingConfig.js             |  4 ++-
 .../BasicComponents/Video/settingConfig.js    |  4 ++-
 .../RightSetting/RotateSetting.vue            | 28 ++++++++++++++++++-
 .../BigScreenDesign/RightSetting/index.vue    |  2 ++
 .../packages/Borders/Border1/settingConfig.js |  4 ++-
 .../Borders/Border10/settingConfig.js         |  4 ++-
 .../Borders/Border11/settingConfig.js         |  4 ++-
 .../Borders/Border12/settingConfig.js         |  4 ++-
 .../Borders/Border13/settingConfig.js         |  4 ++-
 .../Borders/Border14/settingConfig.js         |  4 ++-
 .../Borders/Border15/settingConfig.js         |  4 ++-
 .../packages/Borders/Border2/settingConfig.js |  4 ++-
 .../packages/Borders/Border3/settingConfig.js |  4 ++-
 .../packages/Borders/Border4/settingConfig.js |  4 ++-
 .../packages/Borders/Border5/settingConfig.js |  4 ++-
 .../packages/Borders/Border6/settingConfig.js |  4 ++-
 .../packages/Borders/Border7/settingConfig.js |  4 ++-
 .../packages/Borders/Border8/settingConfig.js |  4 ++-
 .../packages/Borders/Border9/settingConfig.js |  4 ++-
 .../Decorations/Decoration1/settingConfig.js  |  4 ++-
 .../Decorations/Decoration10/settingConfig.js |  4 ++-
 .../Decorations/Decoration11/settingConfig.js |  4 ++-
 .../Decorations/Decoration12/settingConfig.js |  4 ++-
 .../Decorations/Decoration2/settingConfig.js  |  4 ++-
 .../Decorations/Decoration3/settingConfig.js  |  4 ++-
 .../Decorations/Decoration4/settingConfig.js  |  4 ++-
 .../Decoration4Reverse/settingConfig.js       |  4 ++-
 .../Decorations/Decoration5/settingConfig.js  |  4 ++-
 .../Decorations/Decoration6/settingConfig.js  |  4 ++-
 .../Decorations/Decoration8/settingConfig.js  |  4 ++-
 .../Decoration8Reverse/settingConfig.js       |  4 ++-
 .../Decorations/Decoration9/settingConfig.js  |  4 ++-
 data-room-ui/packages/Echarts/echartList.js   |  2 ++
 data-room-ui/packages/G2Plots/plotList.js     |  2 ++
 .../RemoteComponents/remoteComponentsList.js  |  4 +++
 data-room-ui/packages/Render/index.vue        |  2 +-
 64 files changed, 212 insertions(+), 60 deletions(-)

diff --git a/data-room-ui/packages/BasicComponents/Button/settingConfig.js b/data-room-ui/packages/BasicComponents/Button/settingConfig.js
index a94019b9..d75dbbf0 100644
--- a/data-room-ui/packages/BasicComponents/Button/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Button/settingConfig.js
@@ -45,7 +45,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   // 自定义属性
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/ChartTab/settingConfig.js b/data-room-ui/packages/BasicComponents/ChartTab/settingConfig.js
index 6af968e8..8d197ff5 100644
--- a/data-room-ui/packages/BasicComponents/ChartTab/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/ChartTab/settingConfig.js
@@ -23,7 +23,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     tabList: [],
diff --git a/data-room-ui/packages/BasicComponents/CurrentTime/settingConfig.js b/data-room-ui/packages/BasicComponents/CurrentTime/settingConfig.js
index 4ec7fde1..98da4553 100644
--- a/data-room-ui/packages/BasicComponents/CurrentTime/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/CurrentTime/settingConfig.js
@@ -24,7 +24,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     fontSize: 28,
diff --git a/data-room-ui/packages/BasicComponents/DateTimePicker/settingConfig.js b/data-room-ui/packages/BasicComponents/DateTimePicker/settingConfig.js
index 08dd1889..14e68276 100644
--- a/data-room-ui/packages/BasicComponents/DateTimePicker/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/DateTimePicker/settingConfig.js
@@ -26,7 +26,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   // 自定义属性
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/DigitalFlop/settingConfig.js b/data-room-ui/packages/BasicComponents/DigitalFlop/settingConfig.js
index 2956b6ad..4ca410c8 100644
--- a/data-room-ui/packages/BasicComponents/DigitalFlop/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/DigitalFlop/settingConfig.js
@@ -39,7 +39,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     color: '#fff',
diff --git a/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js b/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
index ab4046ce..088664f3 100644
--- a/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
@@ -45,7 +45,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 地图id
diff --git a/data-room-ui/packages/BasicComponents/HorizontalLine/settingConfig.js b/data-room-ui/packages/BasicComponents/HorizontalLine/settingConfig.js
index 1b15e801..daa4546a 100644
--- a/data-room-ui/packages/BasicComponents/HorizontalLine/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/HorizontalLine/settingConfig.js
@@ -20,7 +20,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框线颜色
diff --git a/data-room-ui/packages/BasicComponents/IframeChart/settingConfig.js b/data-room-ui/packages/BasicComponents/IframeChart/settingConfig.js
index 6b19d37d..7f9043f5 100644
--- a/data-room-ui/packages/BasicComponents/IframeChart/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/IframeChart/settingConfig.js
@@ -27,7 +27,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     fontSize: 20,
diff --git a/data-room-ui/packages/BasicComponents/IndexCard/settingConfig.js b/data-room-ui/packages/BasicComponents/IndexCard/settingConfig.js
index 915001bb..d73fbac3 100644
--- a/data-room-ui/packages/BasicComponents/IndexCard/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/IndexCard/settingConfig.js
@@ -44,7 +44,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     src: '',
diff --git a/data-room-ui/packages/BasicComponents/IndexCard2/settingConfig.js b/data-room-ui/packages/BasicComponents/IndexCard2/settingConfig.js
index d0678f44..1f4e50b9 100644
--- a/data-room-ui/packages/BasicComponents/IndexCard2/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/IndexCard2/settingConfig.js
@@ -44,7 +44,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     src: '',
diff --git a/data-room-ui/packages/BasicComponents/IndicatorCard/settingConfig.js b/data-room-ui/packages/BasicComponents/IndicatorCard/settingConfig.js
index c0d6b246..0f8c3d08 100644
--- a/data-room-ui/packages/BasicComponents/IndicatorCard/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/IndicatorCard/settingConfig.js
@@ -44,7 +44,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     borderRadius: 0,
diff --git a/data-room-ui/packages/BasicComponents/IndicatorCard2/settingConfig.js b/data-room-ui/packages/BasicComponents/IndicatorCard2/settingConfig.js
index b854ee55..534069b1 100644
--- a/data-room-ui/packages/BasicComponents/IndicatorCard2/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/IndicatorCard2/settingConfig.js
@@ -44,7 +44,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     borderRadius: 0,
diff --git a/data-room-ui/packages/BasicComponents/Input/settingConfig.js b/data-room-ui/packages/BasicComponents/Input/settingConfig.js
index 21ff3242..4fdf3ca8 100644
--- a/data-room-ui/packages/BasicComponents/Input/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Input/settingConfig.js
@@ -21,7 +21,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   // 自定义属性
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/LinkChart/settingConfig.js b/data-room-ui/packages/BasicComponents/LinkChart/settingConfig.js
index fbef488d..a88f597b 100644
--- a/data-room-ui/packages/BasicComponents/LinkChart/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/LinkChart/settingConfig.js
@@ -38,7 +38,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     title: '超链接占位符',
diff --git a/data-room-ui/packages/BasicComponents/Map/settingConfig.js b/data-room-ui/packages/BasicComponents/Map/settingConfig.js
index 68b6c4ce..a1489dcc 100644
--- a/data-room-ui/packages/BasicComponents/Map/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Map/settingConfig.js
@@ -46,7 +46,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     mapId: '',
diff --git a/data-room-ui/packages/BasicComponents/Marquee/settingConfig.js b/data-room-ui/packages/BasicComponents/Marquee/settingConfig.js
index 63828478..bc813a56 100644
--- a/data-room-ui/packages/BasicComponents/Marquee/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Marquee/settingConfig.js
@@ -38,7 +38,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     title: '跑马灯占位符',
diff --git a/data-room-ui/packages/BasicComponents/Numbers/settingConfig.js b/data-room-ui/packages/BasicComponents/Numbers/settingConfig.js
index 1ec1dbdc..97698e70 100644
--- a/data-room-ui/packages/BasicComponents/Numbers/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Numbers/settingConfig.js
@@ -48,7 +48,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     title: '1234',
diff --git a/data-room-ui/packages/BasicComponents/Picture/settingConfig.js b/data-room-ui/packages/BasicComponents/Picture/settingConfig.js
index f9a73b27..c0b7e674 100644
--- a/data-room-ui/packages/BasicComponents/Picture/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Picture/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     url: '',
diff --git a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/setting.vue b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/setting.vue
index 4a6109e3..2ff4d702 100644
--- a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/setting.vue
+++ b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/setting.vue
@@ -128,13 +128,15 @@ import SettingTitle from 'data-room-ui/SettingTitle/index.vue'
 import ColorPicker from 'data-room-ui/ColorPicker/index.vue'
 import BorderSetting from 'data-room-ui/BigScreenDesign/RightSetting/BorderSetting.vue'
 import PosWhSetting from 'data-room-ui/BigScreenDesign/RightSetting/PosWhSetting.vue'
+import RotateSetting from 'data-room-ui/BigScreenDesign/RightSetting/RotateSetting.vue'
 export default {
   name: 'BarSetting',
   components: {
     ColorPicker,
     PosWhSetting,
     SettingTitle,
-    BorderSetting
+    BorderSetting,
+    RotateSetting
   },
   data () {
     return {
diff --git a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/settingConfig.js b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/settingConfig.js
index a12343a6..d7078d7f 100644
--- a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/settingConfig.js
@@ -41,7 +41,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     rowNum: 5,
diff --git a/data-room-ui/packages/BasicComponents/ScreenScrollRanking/settingConfig.js b/data-room-ui/packages/BasicComponents/ScreenScrollRanking/settingConfig.js
index 83033918..207cf0b8 100644
--- a/data-room-ui/packages/BasicComponents/ScreenScrollRanking/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/ScreenScrollRanking/settingConfig.js
@@ -34,7 +34,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     rowNum: 5,
diff --git a/data-room-ui/packages/BasicComponents/Select/settingConfig.js b/data-room-ui/packages/BasicComponents/Select/settingConfig.js
index 05cb5fd9..95a13962 100644
--- a/data-room-ui/packages/BasicComponents/Select/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Select/settingConfig.js
@@ -33,7 +33,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   // 自定义属性
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/Tables/settingConfig.js b/data-room-ui/packages/BasicComponents/Tables/settingConfig.js
index ff9e204f..93be7841 100644
--- a/data-room-ui/packages/BasicComponents/Tables/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Tables/settingConfig.js
@@ -43,7 +43,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 500
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
 
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/Texts/settingConfig.js b/data-room-ui/packages/BasicComponents/Texts/settingConfig.js
index 9c4060fa..607f88b5 100644
--- a/data-room-ui/packages/BasicComponents/Texts/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Texts/settingConfig.js
@@ -48,7 +48,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     title: '文本标签占位符',
diff --git a/data-room-ui/packages/BasicComponents/ThemeSelect/settingConfig.js b/data-room-ui/packages/BasicComponents/ThemeSelect/settingConfig.js
index f6df1e5b..11abeaf4 100644
--- a/data-room-ui/packages/BasicComponents/ThemeSelect/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/ThemeSelect/settingConfig.js
@@ -26,7 +26,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     title: '文本标签占位符',
diff --git a/data-room-ui/packages/BasicComponents/ThemeSwitcher/settingConfig.js b/data-room-ui/packages/BasicComponents/ThemeSwitcher/settingConfig.js
index 0fab58a2..b5c771a6 100644
--- a/data-room-ui/packages/BasicComponents/ThemeSwitcher/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/ThemeSwitcher/settingConfig.js
@@ -26,7 +26,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     activeColor: '#007aff', // 单选框字体激活状态
diff --git a/data-room-ui/packages/BasicComponents/TimeCountDown/settingConfig.js b/data-room-ui/packages/BasicComponents/TimeCountDown/settingConfig.js
index fac7a0d7..5b5e6928 100644
--- a/data-room-ui/packages/BasicComponents/TimeCountDown/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/TimeCountDown/settingConfig.js
@@ -23,7 +23,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     fontSize: 28,
diff --git a/data-room-ui/packages/BasicComponents/TimePicker/settingConfig.js b/data-room-ui/packages/BasicComponents/TimePicker/settingConfig.js
index 0d931df7..a7899595 100644
--- a/data-room-ui/packages/BasicComponents/TimePicker/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/TimePicker/settingConfig.js
@@ -26,7 +26,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   // 自定义属性
   customize: {
diff --git a/data-room-ui/packages/BasicComponents/VerticalLine/settingConfig.js b/data-room-ui/packages/BasicComponents/VerticalLine/settingConfig.js
index 60b34b13..cc981da0 100644
--- a/data-room-ui/packages/BasicComponents/VerticalLine/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/VerticalLine/settingConfig.js
@@ -20,7 +20,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框线颜色
diff --git a/data-room-ui/packages/BasicComponents/Video/settingConfig.js b/data-room-ui/packages/BasicComponents/Video/settingConfig.js
index 82ae825a..acf85d8a 100644
--- a/data-room-ui/packages/BasicComponents/Video/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Video/settingConfig.js
@@ -20,7 +20,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     videoType: 'application/x-mpegURL',
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/RotateSetting.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/RotateSetting.vue
index 8f4093f8..fa48e4b6 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/RotateSetting.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/RotateSetting.vue
@@ -51,6 +51,30 @@
         :step="1"
       />
     </el-form-item>
+    <el-form-item
+      :label-width="labelWidth"
+      label="沿x轴扭曲角度"
+    >
+      <el-input-number
+        v-model="config.skewX"
+        class="bs-el-input-number"
+        :min="-180"
+        :max="180"
+        :step="1"
+      />
+    </el-form-item>
+    <el-form-item
+      :label-width="labelWidth"
+      label="绕y轴扭曲角度"
+    >
+      <el-input-number
+        v-model="config.skewY"
+        class="bs-el-input-number"
+        :min="-180"
+        :max="180"
+        :step="1"
+      />
+    </el-form-item>
   </div>
 </template>
 <script>
@@ -63,7 +87,9 @@ export default {
         rotateX: 0,
         rotateY: 0,
         rotateZ: 0,
-        perspective: 0
+        perspective: 0,
+        skewX: 0,
+        skewY: 0
       })
     },
     labelWidth: {
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue
index a54da668..e683b519 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/index.vue
@@ -119,6 +119,8 @@ export default {
         rotateY: this.config?.rotateY,
         rotateZ: this.config?.rotateZ,
         perspective: this.config?.perspective,
+        skewX: this.config?.skewX,
+        skewY: this.config?.skewY,
         setting: cloneDeep(this.config?.setting),
         customize: cloneDeep(this.config?.customize),
         url: this.config?.url,
diff --git a/data-room-ui/packages/Borders/Border1/settingConfig.js b/data-room-ui/packages/Borders/Border1/settingConfig.js
index d70eba6a..60536c96 100644
--- a/data-room-ui/packages/Borders/Border1/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border1/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     borderMainColor: '#83bff6',
diff --git a/data-room-ui/packages/Borders/Border10/settingConfig.js b/data-room-ui/packages/Borders/Border10/settingConfig.js
index 75fdf930..d40efcc2 100644
--- a/data-room-ui/packages/Borders/Border10/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border10/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border11/settingConfig.js b/data-room-ui/packages/Borders/Border11/settingConfig.js
index 1c456a79..4457150d 100644
--- a/data-room-ui/packages/Borders/Border11/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border11/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border12/settingConfig.js b/data-room-ui/packages/Borders/Border12/settingConfig.js
index 9de3fac6..d04993e2 100644
--- a/data-room-ui/packages/Borders/Border12/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border12/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border13/settingConfig.js b/data-room-ui/packages/Borders/Border13/settingConfig.js
index 7ebd78cd..04b55019 100644
--- a/data-room-ui/packages/Borders/Border13/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border13/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border14/settingConfig.js b/data-room-ui/packages/Borders/Border14/settingConfig.js
index 57f2fd1a..0d605641 100644
--- a/data-room-ui/packages/Borders/Border14/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border14/settingConfig.js
@@ -19,7 +19,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框线颜色
diff --git a/data-room-ui/packages/Borders/Border15/settingConfig.js b/data-room-ui/packages/Borders/Border15/settingConfig.js
index 564fda87..80f0500f 100644
--- a/data-room-ui/packages/Borders/Border15/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border15/settingConfig.js
@@ -19,7 +19,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框线颜色
diff --git a/data-room-ui/packages/Borders/Border2/settingConfig.js b/data-room-ui/packages/Borders/Border2/settingConfig.js
index 36403e65..1591b8d6 100644
--- a/data-room-ui/packages/Borders/Border2/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border2/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     borderMainColor: '#83bff6',
diff --git a/data-room-ui/packages/Borders/Border3/settingConfig.js b/data-room-ui/packages/Borders/Border3/settingConfig.js
index 45f92b74..f6dea95d 100644
--- a/data-room-ui/packages/Borders/Border3/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border3/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     borderMainColor: '#83bff6',
diff --git a/data-room-ui/packages/Borders/Border4/settingConfig.js b/data-room-ui/packages/Borders/Border4/settingConfig.js
index 80240b36..1d7c77e8 100644
--- a/data-room-ui/packages/Borders/Border4/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border4/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border5/settingConfig.js b/data-room-ui/packages/Borders/Border5/settingConfig.js
index 584b04ca..a0bfa90d 100644
--- a/data-room-ui/packages/Borders/Border5/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border5/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border6/settingConfig.js b/data-room-ui/packages/Borders/Border6/settingConfig.js
index a6afba0f..f942cf51 100644
--- a/data-room-ui/packages/Borders/Border6/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border6/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border7/settingConfig.js b/data-room-ui/packages/Borders/Border7/settingConfig.js
index e007a867..23b63e95 100644
--- a/data-room-ui/packages/Borders/Border7/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border7/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border8/settingConfig.js b/data-room-ui/packages/Borders/Border8/settingConfig.js
index cd6281c5..8386c5cf 100644
--- a/data-room-ui/packages/Borders/Border8/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border8/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Borders/Border9/settingConfig.js b/data-room-ui/packages/Borders/Border9/settingConfig.js
index 5214a662..5aa7aa58 100644
--- a/data-room-ui/packages/Borders/Border9/settingConfig.js
+++ b/data-room-ui/packages/Borders/Border9/settingConfig.js
@@ -29,7 +29,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     // 边框主要颜色
diff --git a/data-room-ui/packages/Decorations/Decoration1/settingConfig.js b/data-room-ui/packages/Decorations/Decoration1/settingConfig.js
index 2addab00..bbd1a75c 100644
--- a/data-room-ui/packages/Decorations/Decoration1/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration1/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#fff',
diff --git a/data-room-ui/packages/Decorations/Decoration10/settingConfig.js b/data-room-ui/packages/Decorations/Decoration10/settingConfig.js
index 3d9adea5..70111c69 100644
--- a/data-room-ui/packages/Decorations/Decoration10/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration10/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#00c2ff',
diff --git a/data-room-ui/packages/Decorations/Decoration11/settingConfig.js b/data-room-ui/packages/Decorations/Decoration11/settingConfig.js
index 0afc1bc9..a26ec2be 100644
--- a/data-room-ui/packages/Decorations/Decoration11/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration11/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#1a98fc',
diff --git a/data-room-ui/packages/Decorations/Decoration12/settingConfig.js b/data-room-ui/packages/Decorations/Decoration12/settingConfig.js
index 13ec8569..b49dc0e6 100644
--- a/data-room-ui/packages/Decorations/Decoration12/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration12/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: null,
diff --git a/data-room-ui/packages/Decorations/Decoration2/settingConfig.js b/data-room-ui/packages/Decorations/Decoration2/settingConfig.js
index 01be8c24..74f1ee59 100644
--- a/data-room-ui/packages/Decorations/Decoration2/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration2/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#3faacb',
diff --git a/data-room-ui/packages/Decorations/Decoration3/settingConfig.js b/data-room-ui/packages/Decorations/Decoration3/settingConfig.js
index 76469114..e444714e 100644
--- a/data-room-ui/packages/Decorations/Decoration3/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration3/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#7acaec',
diff --git a/data-room-ui/packages/Decorations/Decoration4/settingConfig.js b/data-room-ui/packages/Decorations/Decoration4/settingConfig.js
index 45c78777..8b3f7b12 100644
--- a/data-room-ui/packages/Decorations/Decoration4/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration4/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: 'rgba(255, 255, 255, 0.3)',
diff --git a/data-room-ui/packages/Decorations/Decoration4Reverse/settingConfig.js b/data-room-ui/packages/Decorations/Decoration4Reverse/settingConfig.js
index cab2229c..a29e813d 100644
--- a/data-room-ui/packages/Decorations/Decoration4Reverse/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration4Reverse/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: 'rgba(255, 255, 255, 0.3)',
diff --git a/data-room-ui/packages/Decorations/Decoration5/settingConfig.js b/data-room-ui/packages/Decorations/Decoration5/settingConfig.js
index 49e4caad..544017d1 100644
--- a/data-room-ui/packages/Decorations/Decoration5/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration5/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#3f96a5',
diff --git a/data-room-ui/packages/Decorations/Decoration6/settingConfig.js b/data-room-ui/packages/Decorations/Decoration6/settingConfig.js
index a64c75e7..236983c2 100644
--- a/data-room-ui/packages/Decorations/Decoration6/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration6/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1:'#7acaec',
diff --git a/data-room-ui/packages/Decorations/Decoration8/settingConfig.js b/data-room-ui/packages/Decorations/Decoration8/settingConfig.js
index cec78c73..0963e58d 100644
--- a/data-room-ui/packages/Decorations/Decoration8/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration8/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#3f96a5',
diff --git a/data-room-ui/packages/Decorations/Decoration8Reverse/settingConfig.js b/data-room-ui/packages/Decorations/Decoration8Reverse/settingConfig.js
index 53515319..630fd053 100644
--- a/data-room-ui/packages/Decorations/Decoration8Reverse/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration8Reverse/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: '#3f96a5',
diff --git a/data-room-ui/packages/Decorations/Decoration9/settingConfig.js b/data-room-ui/packages/Decorations/Decoration9/settingConfig.js
index 91b0a668..f1518ec1 100644
--- a/data-room-ui/packages/Decorations/Decoration9/settingConfig.js
+++ b/data-room-ui/packages/Decorations/Decoration9/settingConfig.js
@@ -25,7 +25,9 @@ const customConfig = {
     // 绕z轴旋转角度
     rotateZ: 0,
     // 透视距离
-    perspective: 0
+    perspective: 0,
+    skewX: 0,
+    skewY: 0
   },
   customize: {
     decorationColor1: 'rgba(3, 166, 224, 0.8)',
diff --git a/data-room-ui/packages/Echarts/echartList.js b/data-room-ui/packages/Echarts/echartList.js
index 56e68450..b909960f 100644
--- a/data-room-ui/packages/Echarts/echartList.js
+++ b/data-room-ui/packages/Echarts/echartList.js
@@ -35,6 +35,8 @@ function getEchartsList (files) {
       rotateY: config.rotateY || 0,
       rotateZ: config.rotateZ || 0,
       perspective: config.perspective || 0,
+      skewX: config.skewX || 0,
+      skewY: config.skewY || 0,
       type: 'echartsComponent',
       loading: false,
       // 把默认右侧配置与自定义右侧配置集合
diff --git a/data-room-ui/packages/G2Plots/plotList.js b/data-room-ui/packages/G2Plots/plotList.js
index d7aba9f2..610ea31b 100644
--- a/data-room-ui/packages/G2Plots/plotList.js
+++ b/data-room-ui/packages/G2Plots/plotList.js
@@ -45,6 +45,8 @@ function getPlotList (files) {
       rotateY: config.rotateY || 0,
       rotateZ: config.rotateZ || 0,
       perspective: config.perspective || 0,
+      skewX: config.skewX || 0,
+      skewY: config.skewY || 0,
       type: 'customComponent',
       chartType: config.chartType,
       loading: false,
diff --git a/data-room-ui/packages/RemoteComponents/remoteComponentsList.js b/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
index 2dda2291..5c1a3236 100644
--- a/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
+++ b/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
@@ -43,6 +43,8 @@ export function getRemoteComponents (comList) {
       rotateY: config.rotateY || 0,
       rotateZ: config.rotateZ || 0,
       perspective: config.perspective || 500,
+      skewX: config.skewX || 0,
+      skewY: config.skewY || 0,
       type: 'remoteComponent',
       option: {
         ...cloneDeep(settingConfig),
@@ -79,6 +81,8 @@ export function getRemoteComponentConfig (code, name) {
     rotateY: 0,
     rotateZ: 0,
     perspective: 0,
+    skewX: 0,
+    skewY: 0,
     type: 'remoteComponent',
     option: {
       ...cloneDeep(settingConfig)
diff --git a/data-room-ui/packages/Render/index.vue b/data-room-ui/packages/Render/index.vue
index 7e81efc2..ac360c61 100644
--- a/data-room-ui/packages/Render/index.vue
+++ b/data-room-ui/packages/Render/index.vue
@@ -38,7 +38,7 @@
       :style="{
         zIndex: chart.z || 0,
       }"
-      :transform="`perspective(${chart.perspective > 0? (chart.perspective + 'px') : 'none' }) rotateX(${chart.rotateX == undefined ? 0 : chart.rotateX}deg) rotateY(${chart.rotateY == undefined ? 0 : chart.rotateY}deg)  rotateZ(${chart.rotateZ == undefined ? 0 : chart.rotateZ}deg)`"
+      :transform="`perspective(${chart.perspective > 0? (chart.perspective + 'px') : 'none' }) rotateX(${chart.rotateX == undefined ? 0 : chart.rotateX}deg) rotateY(${chart.rotateY == undefined ? 0 : chart.rotateY}deg)  rotateZ(${chart.rotateZ == undefined ? 0 : chart.rotateZ}deg) skew(${chart.skewX == undefined ? 0 : chart.skewX}deg, ${chart.skewY == undefined? 0 : chart.skewY}deg)`"
       :grid="[1,1]"
       :handles="handlesList"
       class-name-handle="bs-handle-class"