属性面板样式调整

src/designer/metaComponents/TextInput.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-form-item>
+  <el-form-item :label-width="prop.labelWidth">
     <template #label>
       <div :title="prop.label + ' - ' + prop.field" >
         {{ prop.label }}

src/designer/metaComponents/Transform.vue

@@ -1,4 +1,5 @@
 <template>
+  <div class="gui-toolbar">
     <div class="gui-row">
       <div class="gui-item-name"></div>
       <div class="gui-item">X</div>
@@ -53,6 +54,7 @@
         </div>
       </template>
     </div>
+  </div>
 </template>
 <script>
 import _ from 'lodash'
@@ -165,46 +167,4 @@ export default {
 
 </script>
 <style lang="less">
-.gui-toolbar {
-  color: #fff;
-
-  .el-input-number.is-without-controls .el-input__wrapper {
-    padding-left: 2px;
-    padding-right: 2px;
-  }
-
-  .gui-row {
-    display: flex;
-    flex-direction: row;
-    gap: 3px;
-    padding: 3px 0;
-
-    .gui-item-name {
-      width: 26px;
-      align-self: stretch;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      .el-icon {
-        font-size: 16px;
-      }
-    }
-
-    .gui-item {
-      flex: 1;
-      text-align: center;
-      font-size: 12px;
-
-      .el-input-number {
-        width: 100%;
-
-        .el-input__wrapper {
-          background-color: #424242;
-          box-shadow: none
-        }
-      }
-    }
-  }
-}
 </style>

src/designer/viewWidgets/property/PropertyView.vue

@@ -11,7 +11,7 @@
     </span>
   </div>
   <div class="calc-right-panel">
-    <el-form label-position="right" class="property-panel-form" size="default" @submit.native.prevent>
+    <el-form label-position="right" label-width="60" class="property-panel-form" size="default" @submit.native.prevent>
       <template v-for="(itemMeta, idx) in selectedObjectMeta">
 
         <el-divider v-if="itemMeta.editor === '-'" />
@@ -79,3 +79,65 @@ export default {
   }
 }
 </script>
+<style lang="less">
+.property-panel-form{
+  margin: 0;
+  font-size: 14px;
+  color:#606266;
+  .el-form-item--default{
+    margin:5px 3px 0 0;
+    .el-form-item__label{
+      height: 20px;
+      line-height: 22px;
+    }
+  }
+  .gui-toolbar {
+    color: #333;
+    background: #ffffff;
+    border-top: 1px solid #dcdcdc;
+    margin-top: 5px;
+
+    .el-input-number.is-without-controls .el-input__wrapper {
+      padding-left: 2px;
+      padding-right: 2px;
+    }
+
+    .gui-row {
+      display: flex;
+      flex-direction: row;
+      gap: 3px;
+      padding: 3px 3px 3px 0;
+
+      .gui-item-name {
+        width: 26px;
+        align-self: stretch;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        .el-icon {
+          font-size: 16px;
+        }
+      }
+
+      .gui-item {
+        flex: 1;
+        text-align: center;
+        font-size: 12px;
+
+        .el-input-number {
+          width: 100%;
+
+          .el-input__wrapper {
+            background-color: #efefef;
+            box-shadow: none
+          }
+        }
+      }
+    }
+  }
+  .el-divider{
+    margin: 5px 0;
+  }
+}
+</style>