样式优化

admin/src/main/resources/static/css/skins_new.css

@@ -35,6 +35,7 @@
 .skin-light .navbar .nav .open>a:focus,
 .skin-light .navbar .nav>.active>a {
 	background: #0D6EFD;
+	box-shadow: 0px 0px 5px #333333;
 }
 
 .skin-light .navbar .sidebar-toggle {
@@ -69,7 +70,8 @@
 .skin-light .logo {
 	background-color: #0D6EFD;
 	/*color: #63686e;*/
-	border-bottom: 0 solid transparent
+	border-bottom: 0 solid transparent;
+	line-height: 46px;
 }
 
 .skin-light li.user-header {

admin/src/main/resources/static/css/style.css

@@ -134,7 +134,7 @@ body.body-small .navbar-top-links li:last-child {
 
 .dropdown-menu>li>a {
     border-radius: 3px;
-    color: inherit;
+    color: #777;
     line-height: 25px;
     margin: 4px;
     text-align: left;

admin/src/main/resources/static/designer/editor-app/configuration/properties-default-controllers.js

@@ -103,7 +103,6 @@ angular.module('flowableModeler').controller('FlowableTextPropertyCtrl', [ '$sco
     // Open the dialog
     _internalCreateModal(opts, $modal, $scope);
 }]);
-
 angular.module('flowableModeler').controller('FlowableTextPropertyPopupCtrl', ['$scope', function($scope) {
 
     $scope.save = function() {
@@ -116,3 +115,36 @@ angular.module('flowableModeler').controller('FlowableTextPropertyPopupCtrl', ['
         $scope.$hide();
     };
 }]);
+
+/*
+ * Json Text controller
+ */
+angular.module('flowableModeler').controller('FlowableJsonTextPropertyCtrl', [ '$scope', '$modal', '$timeout', function($scope, $modal, $timeout) {
+
+    var opts = {
+        template:  'editor-app/configuration/properties/jsontext-popup.html?version=' + Date.now(),
+        scope: $scope,
+        prefixEvent: 'jsonTextModalEvent'
+    };
+
+    $scope.$on('jsonTextModalEvent.hide.before', function() {
+        $timeout(function() {
+            $scope.property.mode = 'read';
+        }, 0);
+    });
+
+    // Open the dialog
+    _internalCreateModal(opts, $modal, $scope);
+}]);
+angular.module('flowableModeler').controller('FlowableJsonTextPropertyPopupCtrl', ['$scope', function($scope) {
+
+    $scope.save = function() {
+        $scope.updatePropertyInModel($scope.property);
+        $scope.close();
+    };
+    
+    $scope.close = function() {
+        $scope.property.mode = 'read';
+        $scope.$hide();
+    };
+}]);

admin/src/main/resources/static/designer/editor-app/configuration/properties.js

@@ -26,6 +26,10 @@ FLOWABLE.PROPERTY_CONFIG =
         "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
         "writeModeTemplateUrl": "editor-app/configuration/properties/text-property-write-template.html"
     },
+    "jsontext" : {
+        "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
+        "writeModeTemplateUrl": "editor-app/configuration/properties/jsontext-property-write-template.html"
+    },
     "flowable-calledelementtype" : {
         "readModeTemplateUrl": "editor-app/configuration/properties/default-value-display-template.html",
         "writeModeTemplateUrl": "editor-app/configuration/properties/calledelementtype-property-write-template.html"

admin/src/main/resources/static/designer/editor-app/configuration/properties/jsontext-popup.html

@@ -0,0 +1,21 @@
+
+<div class="modal" ng-controller="FlowableJsonTextPropertyPopupCtrl">
+    <div class="modal-dialog">
+        <div class="modal-content">
+			<div class="modal-header">
+				<button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
+			    <h3>{{'PROPERTY.PROPERTY.EDIT.TITLE' | translate}} "{{property.title | translate}}"</h3>
+			</div>
+			<div class="modal-body">
+				<div ng-jsoneditor auto-focus
+					 class="form-control"
+					 ng-model="property.value"
+					 options="{ mode: 'text' }"
+					 style="width:100%; height:100%; "></div>
+			</div>
+			<div class="modal-footer">
+				<button ng-click="save()" class="btn btn-primary" translate >ACTION.SAVE</button>
+			</div>
+		</div>
+	</div>
+</div>

admin/src/main/resources/static/designer/editor-app/configuration/properties/jsontext-property-write-template.html

@@ -0,0 +1,4 @@
+
+<!-- Just need to instantiate the controller, and it will take care of showing the modal dialog -->
+<span ng-controller="FlowableJsonTextPropertyCtrl">
+</span>

admin/src/main/resources/static/designer/editor-app/css/style.css

@@ -17,6 +17,24 @@
     font-style: normal;
 }
 
+/* 整个滚动条 */
+::-webkit-scrollbar {
+    /* 对应纵向滚动条的宽度 */
+    width: 10px;
+    /* 对应横向滚动条的宽度 */
+    height: 10px;
+}
+/* 滚动条上的滚动滑块 */
+::-webkit-scrollbar-thumb {
+    background-color: #49b1f5;
+    border-radius: 32px;
+}
+/* 滚动条轨道 */
+::-webkit-scrollbar-track {
+    background-color: #dbeffd;
+    border-radius: 32px;
+}
+
 .row-no-gutter .col-xs-9,
 .row-no-gutter .col-xs-12 {
     padding-left: 0px;
@@ -188,7 +206,7 @@
 -------------------------------- */
 div.canvas-wrapper {
     overflow: auto;
-    background-color: #F8F8F8;
+    background-color: #FFFFFF;
 }
 
 .canvas_resize_indicator i {
@@ -241,7 +259,7 @@ div.canvas-wrapper {
 
 div.propertySection {
     height: 250px;
-    background-color: #e8edf1;
+    background-color: #ffffff;
     margin-bottom: 0px;
 }
 
@@ -250,6 +268,7 @@ div.propertySection {
     font-weight: bold;
     padding: 2px 0 2px 8px;
     border-bottom: 1px solid #a4acb9;
+    border-top: 1px solid #a4acb9;
     cursor: pointer;
 }
 
@@ -337,7 +356,7 @@ div.propertySection {
 }
 
 .propertySection.collapsed .selected-item-title {
-    border: none;
+    /*border: none;*/
 }
 
 .property-row input[type="text"] {
@@ -1123,7 +1142,7 @@ hot-table .column-header.label {
 #paletteSectionFooter {
     height: 30px;
     text-align: center;
-    background-color: #e8edf1;
+    background-color: #ffffff;
     border-top: 1px solid #a4acb9;
     border-right: 1px solid #a4acb9;
     cursor: pointer;
@@ -1137,7 +1156,7 @@ hot-table .column-header.label {
 #paletteSectionOpen {
     width: 30px;
     height: 30px;
-    background-color: #e8edf1;
+    background-color: #ffffff;
     text-align: center;
     bottom: 1px;
     position: fixed;
@@ -1181,6 +1200,7 @@ hot-table .column-header.label {
     background: #f3f3f3;
     border-right: 1px solid #bbbbbb;
     overflow-y: auto;
+    display: none;/*隐藏左边树下部分*/
 }
 
 .process-treeview-header {

admin/src/main/resources/static/designer/editor-app/editor-controller.js

@@ -255,7 +255,7 @@ angular.module('flowableModeler')
 			canvas.height(totalAvailable - propSectionHeight);
 			var footerHeight = jQuery('#paletteSectionFooter').height();
 			var treeViewHeight = jQuery('#process-treeview-wrapper').height();
-			jQuery('#paletteSection').height(totalAvailable - treeViewHeight - footerHeight-15);
+			jQuery('#paletteSection').height(totalAvailable/* - treeViewHeight*/ - footerHeight-15);//隐藏左边树下部分
       
             // Update positions of the resize-markers, according to the canvas
 

admin/src/main/resources/static/designer/editor-app/stencil-controller.js

@@ -626,6 +626,7 @@ angular.module('flowableModeler')
                 return $scope.selectedItem.properties[index].templateUrl;
             };
             $scope.getPropertyReadModeTemplateUrl = function (index) {
+                //debugger
                 return $scope.selectedItem.properties[index].readModeTemplateUrl;
             };
             $scope.getPropertyWriteModeTemplateUrl = function (index) {

admin/src/main/resources/static/designer/editor-app/stencilset.json

@@ -348,7 +348,7 @@
     "name" : "jsontextpackage",
     "properties" : [ {
       "id" : "jsontext",
-      "type" : "Text",
+      "type" : "JsonText",
       "title" : "JSON报文",
       "value" : "",
       "description" : "JSON报文文本",

admin/src/main/resources/static/designer/index.html

@@ -41,7 +41,7 @@
     <link href="styles/common/style-retina.css" rel="stylesheet">
     <link rel="stylesheet" href="styles/style-editor.css">
     <!-- endbuild -->
-
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/9.10.3/jsoneditor.min.css" rel="stylesheet">
 </head>
 <body ng-app="flowableModeler" ng-cloak>
     <!--导航头，可以删除掉-->
@@ -274,5 +274,7 @@
 <!-- Integration extensions -->
 <script src="scripts/resource-loader.js?v=2" app="editor"></script>
 
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/9.10.3/jsoneditor.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-jsoneditor/1.0.0/ng-jsoneditor.min.js"></script>
 </body>
 </html>

admin/src/main/resources/static/designer/scripts/app.js

@@ -32,7 +32,8 @@ var flowableModeler = angular.module('flowableModeler', [
   'angularSpectrumColorpicker',
   'duScroll',
   'dndLists',
-  'ngHandsontable'
+  'ngHandsontable',
+  'ng.jsoneditor'
 ]);
 
 var flowableModule = flowableModeler;

admin/src/main/resources/templates/index-topnav.html

@@ -25,7 +25,8 @@
             <i class="fa-solid fa-xmark"></i>
         </div>
 		<li class="logo hidden-xs">
-			<span class="logo-lg" th:text="${ruoYiConfig.name }"></span>
+			<img th:src="@{/img/logo_bai_tou.png}" style="height: 80%;">
+			<!--span class="logo-lg" th:text="${ruoYiConfig.name }"></span-->
 		</li>
         <div class="sidebar-collapse tab-content" id="side-menu">
 			<!--div class="user-panel">
@@ -204,10 +205,10 @@
 
     <!--右侧部分开始-->
     <div id="page-wrapper" class="gray-bg dashbard-1">
-        <div class="row" style="background-color: transparent">
+        <div class="row" style="background-color: #0D6EFD;">
             <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                 <div class="navbar-header">
-                    <a class="navbar-minimalize minimalize-styl-2" style="color:#495057;" href="#" title="收起菜单">
+                    <a class="navbar-minimalize minimalize-styl-2" style="color:#FFFFFF;" href="#" title="收起菜单">
 						<i class="fa-solid fa-bars"></i>
                     </a>
                 </div>