Step F7:数据管理

This commit is contained in:
Cheng Zhou
2025-12-16 22:48:05 +08:00
parent abb5b0a107
commit b029be200c
2 changed files with 141 additions and 0 deletions
+131
View File
@@ -0,0 +1,131 @@
<template>
<div class="page">
<el-card class="mb-12">
<div class="filters">
<el-select v-model="filters.level" placeholder="类型" clearable @change="load">
<el-option label="SDV" value="SDV" />
<el-option label="SDR" value="SDR" />
</el-select>
<el-input v-model="filters.site_id" placeholder="中心ID" style="width: 180px" @change="load" />
<div class="spacer" />
</div>
</el-card>
<VerificationTable :verifications="verifications" :can-edit="canEdit" :loading="loading" @edit="openEdit" />
<el-dialog title="更新进度" v-model="showEdit" width="520px">
<el-form :model="editForm" label-width="120px">
<el-form-item label="完成度">
<el-input-number v-model="editForm.percent" :min="0" :max="100" />
</el-form-item>
<el-form-item label="核查日期">
<el-date-picker v-model="editForm.last_verified_at" type="date" value-format="YYYY-MM-DD" />
</el-form-item>
<el-form-item label="备注">
<el-input v-model="editForm.notes" type="textarea" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="showEdit = false">取消</el-button>
<el-button type="primary" :loading="submitting" @click="submitEdit">提交</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { computed, onMounted, ref } from "vue";
import { ElMessage } from "element-plus";
import { fetchVerifications, upsertVerification } from "../api/verifications";
import { useStudyStore } from "../store/study";
import { useAuthStore } from "../store/auth";
import VerificationTable from "../components/VerificationTable.vue";
const study = useStudyStore();
const auth = useAuthStore();
const verifications = ref<any[]>([]);
const loading = ref(false);
const submitting = ref(false);
const showEdit = ref(false);
const editForm = ref<any>({});
const filters = ref({
level: "",
site_id: "",
});
const canEdit = computed(() => {
const role = auth.user?.role;
return role === "ADMIN" || role === "PM" || role === "CRA";
});
const load = async () => {
if (!study.currentStudy) return;
loading.value = true;
try {
const params: Record<string, any> = {};
if (filters.value.level) params.level = filters.value.level;
if (filters.value.site_id) params.site_id = filters.value.site_id;
const { data } = await fetchVerifications(study.currentStudy.id, params);
verifications.value = data.items || data || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || "核查进度加载失败");
} finally {
loading.value = false;
}
};
const openEdit = (row: any) => {
if (!canEdit.value) return;
editForm.value = { ...row };
showEdit.value = true;
};
const submitEdit = async () => {
if (!study.currentStudy) return;
submitting.value = true;
try {
await upsertVerification(study.currentStudy.id, {
subject_id: editForm.value.subject_id,
site_id: editForm.value.site_id,
level: editForm.value.level,
percent: editForm.value.percent,
last_verified_at: editForm.value.last_verified_at,
verifier_id: editForm.value.verifier_id,
notes: editForm.value.notes,
});
ElMessage.success("更新成功");
showEdit.value = false;
load();
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || "更新失败");
} finally {
submitting.value = false;
}
};
onMounted(async () => {
if (!auth.user && auth.token) {
await auth.fetchMe().catch(() => {});
}
load();
});
</script>
<style scoped>
.page {
padding: 16px;
}
.filters {
display: flex;
gap: 8px;
align-items: center;
}
.spacer {
flex: 1;
}
.mb-12 {
margin-bottom: 12px;
}
</style>