Add permission check for moving issue action in project view page (#24589)

Fix #22954
Only users who have write permission can move issues in the project view page.

Author: yp05327

templates/projects/view.tmpl

@@ -73,7 +73,7 @@
 	</div>
 	<div class="ui container fluid padded" id="project-board">
 
-		<div class="board">
+		<div class="board {{if .CanWriteProjects}}sortable{{end}}">
 			{{range $board := .Boards}}
 
 			<div class="ui segment board-column" style="background: {{.Color}} !important;" data-id="{{.ID}}" data-sorting="{{.Sorting}}" data-url="{{$.Link}}/{{.ID}}">

web_src/css/features/projects.css

@@ -6,6 +6,10 @@
   margin: 0 0.5em;
 }
 
+.board.sortable .board-card {
+  cursor: move;
+}
+
 .board-column {
   background-color: var(--color-project-board-bg) !important;
   border: 1px solid var(--color-secondary) !important;
@@ -80,7 +84,6 @@
 .board-card {
   margin: 4px 2px !important;
   border-radius: 5px !important;
-  cursor: move;
   width: calc(100% - 4px) !important;
   padding: 0.5rem !important;
   min-height: auto !important;

web_src/js/features/repo-projects.js

@@ -36,7 +36,7 @@ function moveIssue({item, from, to, oldIndex}) {
 }
 
 async function initRepoProjectSortable() {
-  const els = document.querySelectorAll('#project-board > .board');
+  const els = document.querySelectorAll('#project-board > .board.sortable');
   if (!els.length) return;
 
   const {Sortable} = await import(/* webpackChunkName: "sortable" */'sortablejs');