UX-2（操作级权限控制）

frontend/src/views/Tasks.vue

@@ -10,7 +10,9 @@
         </el-select>
         <el-input v-model="filters.assignee_id" placeholder="负责人ID" style="width: 180px" @change="loadTasks" />
         <div class="spacer" />
-        <el-button type="primary" v-if="canEdit" @click="openCreate">新增任务</el-button>
+        <PermissionAction action="task.create">
+          <el-button type="primary" @click="openCreate">新增任务</el-button>
+        </PermissionAction>
       </div>
     </el-card>
 
@@ -22,9 +24,11 @@
         <el-table-column prop="priority" label="优先级" width="100" />
         <el-table-column prop="status" label="状态" width="120" />
         <el-table-column prop="due_date" label="截止日期" width="140" />
-        <el-table-column label="操作" width="120" v-if="canEdit">
+        <el-table-column label="操作" width="120">
           <template #default="scope">
-            <el-button type="primary" link size="small" @click="openEdit(scope.row)">编辑</el-button>
+            <PermissionAction action="task.edit">
+              <el-button type="primary" link size="small" @click="openEdit(scope.row)">编辑</el-button>
+            </PermissionAction>
           </template>
         </el-table-column>
       </el-table>
@@ -43,12 +47,14 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, computed } from "vue";
+import { onMounted, ref } from "vue";
 import { ElMessage } from "element-plus";
 import { fetchTasks } from "../api/tasks";
 import { fetchMilestones } from "../api/milestones";
 import { useStudyStore } from "../store/study";
 import { useAuthStore } from "../store/auth";
+import PermissionAction from "../components/PermissionAction.vue";
+import { usePermission } from "../utils/permission";
 import TaskForm from "../components/TaskForm.vue";
 
 const study = useStudyStore();
@@ -72,11 +78,7 @@ const filters = ref({
 const showForm = ref(false);
 const editingTask = ref<any | null>(null);
 
-const canEdit = computed(() => {
-  const role = auth.user?.role;
-  // 简化：ADMIN/PM 可编辑
-  return role === "ADMIN" || role === "PM";
-});
+const { can } = usePermission();
 
 const loadMilestones = async () => {
   if (!study.currentStudy) return;