feat: add control component panel

@@ -316,7 +316,7 @@ mxscript(drawDevUrl + 'js/diagramly/sidebar/thingskit/Sidebar-Engine.js');
 // 基础元件
 mxscript(drawDevUrl + 'js/diagramly/sidebar/thingskit/Sidebar-Basic-Components.js');
 // 控制元件
-mxscript(drawDevUrl + 'js/diagramly/sidebar/thingskit/Sidebar-Controller-Components.js');
+mxscript(drawDevUrl + 'js/diagramly/sidebar/thingskit/Sidebar-Control-Components.js');
 // 阀门
 mxscript(drawDevUrl + 'js/diagramly/sidebar/thingskit/Sidebar-Valve.js');
 // 风机

@@ -26,7 +26,7 @@
 	 *
 	 */
 	// Sidebar.prototype.defaultEntries = 'component;fan;engine;valve;controller;light;button;conduit;instrument;sewage;air;filters;pumps;factoryFacilities;flowMeter;foodProcessing;heater;industrial;plant;power;processCooling;processHeating;sink;';
-	Sidebar.prototype.defaultEntries = 'component;fan;engine;valve;controller;light;button;conduit;instrument;sewage;factoryFacilities;flowMeter;industrial;sink;';
+	Sidebar.prototype.defaultEntries = 'component;fan;engine;valve;control;light;button;conduit;instrument;sewage;factoryFacilities;flowMeter;industrial;sink;';
 
 	/**
 	 * Library definitions
@@ -284,9 +284,10 @@
 	Sidebar.prototype.configuration = [
 		{ id: 'general', libs: ['general', 'misc', 'advanced'] },
 		//加入自定义图形ID
-		{ id: 'fan' }, { id: 'engine' }, { id: 'valve' }, { id: 'component' }, { id: 'controller' }, { id: 'sewage' }, { id: 'conduit' }, { id: 'light' }, { id: 'instrument' }, { id: 'button' },
+		{ id: 'fan' }, { id: 'engine' }, { id: 'valve' }, { id: 'component' }, { id: 'control' }, { id: 'sewage' }, { id: 'conduit' }, { id: 'light' }, { id: 'instrument' }, { id: 'button' },
 		{ id: 'air' }, { id: 'filters' }, { id: 'pumps' }, { id: 'factoryFacilities' }, { id: 'flowMeter' }, { id: 'foodProcessing' }, { id: 'heater' }, { id: 'industrial' }, { id: 'plant' }, { id: 'power' }, { id: 'processCooling' }, { id: 'processHeating' }, { id: 'sink' },
 
+
 		{ id: 'uml' }, { id: 'uml25' }, { id: 'search' }, { id: 'er' },
 		{ id: 'azure2', prefix: 'azure2', libs: ['AI Machine Learning', 'Analytics', 'App Services', 'Azure Stack', 'Azure VMware Solution', 'Blockchain', 'Compute', 'Containers', 'CXP', 'Databases', 'DevOps', 'General', 'Identity', 'Integration', 'Internet of Things', 'Intune', 'IoT', 'Management Governance', 'Migrate', 'Mixed Reality', 'Monitor', 'Networking', 'Other', 'Preview', 'Security', 'Storage', 'Web'] },
 		{ id: 'ios', prefix: 'ios', libs: [''/*prefix is library*/, '7icons', '7ui'] },
@@ -1171,8 +1172,8 @@
 		// thingskit components
 		// 基础原件
 		this.addBasicComponentsPalette();
-		// 控制原价
-		// this.addControllerComponentsPalette();
+		// 控制元件
+		this.addControlComponentsPalette();
 		// 发动机
 		this.addEnginePalette();
 		// 阀门

+
+(function () {
+	// Adds Atlassian shapes
+	// Control Component 控制元件
+	Sidebar.prototype.addControlComponentsPalette = function () {
+		const { COMPONENT_TYPE } = this.enumCellBasicAttribute
+		const { DEFAULT } = this.enumComponentType
+		const gn = 'mxgraph.control';
+		const dt = 'control';
+		const label = '控制元件'
+		const width = 66;
+		const height = 74;
+		const staticPath = '/thingskit-drawio/img/lib/thingskit/'
+		const prefix = 'image;image=img/lib/thingskit/'
+		const defaultStyle = ';imageAspect=0;'
+		this.setCurrentSearchEntryLibrary(dt);
+
+		// 自定义属性
+		const cellAttribute = {
+			[COMPONENT_TYPE]: DEFAULT
+		}
+
+		const graphPathLib = [
+			{ name: '风机1.png', path: 'fan/风机1.png' },
+			{ name: '风机2.png', path: 'fan/风机2.png' },
+			{ name: '风机3.png', path: 'fan/风机3.png' },
+			{ name: '风机4.png', path: 'fan/风机4.png' },
+			{ name: '风机5.gif', path: 'fan/风机5.gif' },
+			{ name: '风机6.gif', path: 'fan/风机6.gif' },
+			{ name: '风机7.gif', path: 'fan/风机7.gif' },
+			{ name: '风机8.png', path: 'fan/风机8.png' },
+		]
+
+		const lib = graphPathLib.map(item => {
+			item.staticPath = staticPath + item.path
+			return item
+		})
+
+		const fns = graphPathLib.map(item => {
+			return this.addEntry(this.getTagsForStencil(gn, item.name, dt).join(' '), mxUtils.bind(this, function () {
+				const cell = new mxCell('', new mxGeometry(0, 0, width, height), `${prefix}${item.path}${defaultStyle}`);
+				cell.setVertex(true)
+				this.setCellAttributes(cell, cellAttribute)
+				return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, item.name);
+			}));
+		})
+
+		this.setVariableImageLib(dt, label, lib)
+
+		this.addPaletteFunctions(dt, label, false, fns);
+
+		this.setCurrentSearchEntryLibrary();
+	};
+})();

-(function()
-{
-	// Adds Atlassian shapes
-	// 控制元件
-	Sidebar.prototype.addControllerComponentsPalette = function()
-	{
-		this.setCurrentSearchEntryLibrary('controller');
-
-		var fns = [
-			this.createVertexTemplateEntry('text;strokeColor=none;fillColor=none;html=1;fontSize=24;fontStyle=1;verticalAlign=middle;align=center;', 100, 40, 'Title', 'Title', null, null, 'text heading title'),
-			this.createEdgeTemplateEntry('shape=filledEdge;rounded=1;fixDash=1;endArrow=none;strokeWidth=10;fillColor=#BAFDFF;edgeStyle=orthogonalEdgeStyle;flowAnimation=1;strokeColor=#6666FF;endFill=1;metaEdit=0;backgroundOutline=0;', 60, 40, '', '线条')
-			];
-
-		this.addPaletteFunctions('controller', '控制元件', false, fns);
-		this.setCurrentSearchEntryLibrary();
-	};
-})();