Merge branch 'PR' into develop

Author: nengyuanzhang

myems-admin/app/controllers/settings/svg/svg.controller.js

@@ -13,7 +13,7 @@ app.controller('SVGController', function(
 	$scope.exportdata = '';
 	$scope.importdata = '';
 	$scope.current_svg = null;
-
+	$scope.searchKeyword = '';
 	$scope.getAllSVGs = function() {
 		let headers = { "User-UUID": $scope.cur_user.uuid, "Token": $scope.cur_user.token, "QUICKMODE": true };
 		SVGService.getAllSVGs(headers, function(response) {
@@ -241,6 +241,39 @@ app.controller('SVGController', function(
 		$rootScope.modalInstance = modalInstance;
 	};
 
+	let searchDebounceTimer = null;
+	function safeApply(scope) {
+		if (!scope.$$phase && !scope.$root.$$phase) {
+			scope.$apply();
+		}
+	}
+	$scope.searchSVGs = function() {
+		const headers = {
+			"User-UUID": $scope.cur_user?.uuid,
+			"Token": $scope.cur_user?.token
+		};
+
+		const rawKeyword = $scope.searchKeyword || "";
+		const trimmedKeyword = rawKeyword.trim();
+
+		if (searchDebounceTimer) {
+			clearTimeout(searchDebounceTimer);
+		}
+
+		searchDebounceTimer = setTimeout(() => {
+			if (!trimmedKeyword) {
+				$scope.getAllSVGs();
+				safeApply($scope);
+				return;
+			}
+
+			SVGService.searchSVGs(trimmedKeyword, headers, (response) => {
+				$scope.svgs = (response.status === 200) ? response.data : [];
+				$scope.parentmeters = [...$scope.svgs];
+			});
+		}, 300);
+	};
+
 	$scope.getAllSVGs();
 });
 

myems-admin/app/services/settings/svg/svg.service.js

@@ -18,7 +18,10 @@ app.factory('SVGService', function($http) {
             });
         },
         searchSVGs: function(query, headers, callback) {
-            $http.get(getAPI()+'svgs', { params: { q: query } }, {headers})
+            $http.get(getAPI()+'svgs', {
+                params: {q: query},
+                headers: headers
+            })
             .then(function (response) {
                 callback(response);
             }, function (response) {

myems-admin/views/settings/svg/svg.html

@@ -5,10 +5,16 @@
 				<uib-tabset>
 					<uib-tab heading="{{'COMMON.SVG' | translate}}">
 						<div class="panel-body" ng-controller="SVGController">
-							<a ng-click="addSVG()" class="btn btn-primary btn-rounded  btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'SVG.ADD_SVG' | translate}}</a>
-              <a ng-click="importSVG()" class="btn btn-primary btn-rounded  btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'SETTING.IMPORT' | translate}}</a>
-							<br>
-							<br>
+                            <div class="col-md-3">
+							   <a ng-click="addSVG()" class="btn btn-primary btn-rounded  btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'SVG.ADD_SVG' | translate}}</a>
+                               <a ng-click="importSVG()" class="btn btn-primary btn-rounded  btn-outline" href=""><i class="fa fa-plus-circle"></i> {{'SETTING.IMPORT' | translate}}</a>
+                            </div>
+                            <div class="col-md-9">
+                                <input type="text" class="form-control m-b-xs"
+                                       placeholder="{{'SETTING.SEARCH' | translate}}"
+                                       ng-model="searchKeyword"
+                                       ng-keyup="searchSVGs()">
+                            </div>
               <table class="footable table table-bordered table-hover" data-sort="true" data-page-size="15">
 								<thead>
 									<tr>

myems-api/core/svg.py

@@ -15,6 +15,7 @@ class SVGCollection:
     It provides endpoints for listing all SVGs and creating new SVGs.
     SVGs are used for displaying graphical representations in the energy management system.
     """
+
     def __init__(self):
         """Initialize SVGCollection"""
         pass
@@ -33,10 +34,17 @@ def on_get(req, resp):
             access_control(req)
         else:
             api_key_control(req)
+
+        search_query = req.get_param('q', default=None)
+        if search_query is not None:
+            search_query = search_query.strip()
+        else:
+            search_query = ''
+
         # if turn quick mode on, do not return source code
         is_quick_mode = False
         if 'QUICKMODE' in req.headers and \
-            isinstance(req.headers['QUICKMODE'], str) and \
+                isinstance(req.headers['QUICKMODE'], str) and \
                 len(str.strip(req.headers['QUICKMODE'])) > 0 and \
                 str.lower(req.headers['QUICKMODE']) in ('true', 't', 'on', 'yes', 'y'):
             is_quick_mode = True
@@ -45,25 +53,32 @@ def on_get(req, resp):
         cursor = cnx.cursor()
         if is_quick_mode:
             query = (" SELECT id, name, uuid, description "
-                     " FROM tbl_svgs "
-                     " ORDER BY id ")
-            cursor.execute(query)
+                     " FROM tbl_svgs ")
+            params = []
+            if search_query:
+                query += " WHERE name LIKE %s    OR  description LIKE %s "
+                params = [f'%{search_query}%', f'%{search_query}%']
+            query += " ORDER BY id "
+            cursor.execute(query, params)
             rows_svgs = cursor.fetchall()
 
             result = list()
             if rows_svgs is not None and len(rows_svgs) > 0:
                 for row in rows_svgs:
-
                     meta_result = {"id": row[0],
                                    "name": row[1],
                                    "uuid": row[2],
                                    "description": row[3]}
                     result.append(meta_result)
         else:
             query = (" SELECT id, name, uuid, source_code, description "
-                     " FROM tbl_svgs "
-                     " ORDER BY id ")
-            cursor.execute(query)
+                     " FROM tbl_svgs ")
+            params = []
+            if search_query:
+                query += " WHERE name LIKE %s    OR  description LIKE %s "
+                params = [f'%{search_query}%', f'%{search_query}%']
+            query += " ORDER BY id "
+            cursor.execute(query, params)
             rows_svgs = cursor.fetchall()
 
             result = list()