Update the number of cards in board while drop successful

Author: rogerluo410

templates/repo/projects/view.tmpl

@@ -75,7 +75,7 @@
 			<div class="ui segment board-column" data-id="{{.ID}}" data-sorting="{{.Sorting}}" data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}/{{.ID}}">
 				<div class="board-column-header">
 					<div class="ui large label board-label">
-					  <div class="ui small circular grey label">
+					  <div class="ui small circular grey label board-card-cnt">
 						{{ len .Issues}}
 					  </div>
 					  {{.Title}}

web_src/js/features/projects.js

@@ -50,6 +50,14 @@ export default async function initProject() {
             },
             contentType: 'application/json',
             type: 'POST',
+            success: () => {
+              // Update the number of cards in board while drop successful.
+              const fromCnt = e.from.parentElement.getElementsByClassName('board-card').length;
+              e.from.parentElement.getElementsByClassName('board-card-cnt')[0].innerText = fromCnt;
+
+              const toCnt = e.to.parentElement.getElementsByClassName('board-card').length;
+              e.to.parentElement.getElementsByClassName('board-card-cnt')[0].innerText = toCnt;
+            },
             error: () => {
               e.from.insertBefore(e.item, e.from.children[e.oldIndex]);
             },