立项与伦理-初步优化,新增.env

This commit is contained in:
Cheng Zhou
2026-01-14 15:33:52 +08:00
parent f9ef5c109f
commit 4fc5f0ee9b
13 changed files with 733 additions and 297 deletions
@@ -1,64 +1,122 @@
<template>
<div class="page">
<div class="page-header">
<div class="ctms-page">
<div class="ctms-page-header">
<div>
<h1 class="page-title">{{ TEXT.modules.startupFeasibilityEthics.title }}</h1>
<p class="page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.subtitle }}</p>
<h1 class="ctms-page-title">{{ TEXT.modules.startupFeasibilityEthics.title }}</h1>
<p class="ctms-page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.subtitle }}</p>
</div>
</div>
<el-card>
<el-tabs v-model="activeTab">
<el-card class="ctms-table-card">
<el-tabs v-model="activeTab" class="ctms-tabs">
<el-tab-pane :label="TEXT.modules.startupFeasibilityEthics.feasibilityTab" name="feasibility">
<div class="tab-actions">
<el-button type="primary" @click="goNewFeasibility">{{ TEXT.modules.startupFeasibilityEthics.feasibilityNewTitle }}</el-button>
<div class="ctms-tab-content">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.modules.startupFeasibilityEthics.feasibilityTab }}</div>
<div class="ctms-section-actions">
<el-button type="primary" @click="goNewFeasibility">
<el-icon class="el-icon--left"><Plus /></el-icon>
{{ TEXT.modules.startupFeasibilityEthics.feasibilityNewTitle }}
</el-button>
</div>
</div>
<el-table
:data="feasibilityItems"
v-loading="loadingFeasibility"
class="ctms-table"
@row-click="onFeasibilityRowClick"
row-class-name="clickable-row"
>
<el-table-column :label="TEXT.common.fields.site" width="180">
<template #default="scope">
<span class="font-medium">{{ displaySite(scope.row.site_id) }}</span>
</template>
</el-table-column>
<el-table-column prop="submit_date" :label="TEXT.common.fields.submitDate" width="140">
<template #default="scope">{{ displayDate(scope.row.submit_date) }}</template>
</el-table-column>
<el-table-column prop="accept_date" :label="TEXT.common.fields.acceptDate" width="140">
<template #default="scope">{{ displayDate(scope.row.accept_date) }}</template>
</el-table-column>
<el-table-column prop="approved_date" :label="TEXT.common.fields.approvedDate" width="140">
<template #default="scope">{{ displayDate(scope.row.approved_date) }}</template>
</el-table-column>
<el-table-column :label="TEXT.common.fields.status" width="120">
<template #default="scope">
<el-tag :type="statusTagType(getFeasibilityStatus(scope.row))">
{{ statusLabel(getFeasibilityStatus(scope.row)) }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="project_no" :label="TEXT.common.fields.projectNo" min-width="160">
<template #default="{ row }">
<span class="font-mono text-main">{{ row.project_no }}</span>
</template>
</el-table-column>
<el-table-column :label="TEXT.common.labels.actions" width="120" fixed="right">
<template #default="scope">
<el-button link type="danger" @click.stop="removeFeasibility(scope.row)">{{ TEXT.common.actions.delete }}</el-button>
</template>
</el-table-column>
</el-table>
<StateEmpty v-if="!loadingFeasibility && feasibilityItems.length === 0" :description="TEXT.modules.startupFeasibilityEthics.emptyFeasibility" />
</div>
<el-table :data="feasibilityItems" v-loading="loadingFeasibility" style="width: 100%">
<el-table-column prop="submit_date" :label="TEXT.common.fields.submitDate" width="140">
<template #default="scope">{{ displayDate(scope.row.submit_date) }}</template>
</el-table-column>
<el-table-column prop="accept_date" :label="TEXT.common.fields.acceptDate" width="140">
<template #default="scope">{{ displayDate(scope.row.accept_date) }}</template>
</el-table-column>
<el-table-column prop="approved_date" :label="TEXT.common.fields.approvedDate" width="140">
<template #default="scope">{{ displayDate(scope.row.approved_date) }}</template>
</el-table-column>
<el-table-column prop="project_no" :label="TEXT.common.fields.projectNo" min-width="160" />
<el-table-column :label="TEXT.common.labels.actions" width="200">
<template #default="scope">
<el-button link type="primary" size="small" @click="goFeasibilityDetail(scope.row.id)">{{ TEXT.common.actions.view }}</el-button>
<el-button link type="primary" size="small" @click="goFeasibilityEdit(scope.row.id)">{{ TEXT.common.actions.edit }}</el-button>
</template>
</el-table-column>
</el-table>
<StateEmpty v-if="!loadingFeasibility && feasibilityItems.length === 0" :description="TEXT.modules.startupFeasibilityEthics.emptyFeasibility" />
</el-tab-pane>
<el-tab-pane :label="TEXT.modules.startupFeasibilityEthics.ethicsTab" name="ethics">
<div class="tab-actions">
<el-button type="primary" @click="goNewEthics">{{ TEXT.modules.startupFeasibilityEthics.ethicsNewTitle }}</el-button>
<div class="ctms-tab-content">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.modules.startupFeasibilityEthics.ethicsTab }}</div>
<div class="ctms-section-actions">
<el-button type="primary" @click="goNewEthics">
<el-icon class="el-icon--left"><Plus /></el-icon>
{{ TEXT.modules.startupFeasibilityEthics.ethicsNewTitle }}
</el-button>
</div>
</div>
<el-table
:data="ethicsItems"
v-loading="loadingEthics"
class="ctms-table"
@row-click="onEthicsRowClick"
row-class-name="clickable-row"
>
<el-table-column :label="TEXT.common.fields.site" width="180">
<template #default="scope">
<span class="font-medium">{{ displaySite(scope.row.site_id) }}</span>
</template>
</el-table-column>
<el-table-column prop="submit_date" :label="TEXT.common.fields.submitDate" width="140">
<template #default="scope">{{ displayDate(scope.row.submit_date) }}</template>
</el-table-column>
<el-table-column prop="accept_date" :label="TEXT.common.fields.acceptDate" width="140">
<template #default="scope">{{ displayDate(scope.row.accept_date) }}</template>
</el-table-column>
<el-table-column prop="meeting_date" :label="TEXT.common.fields.meetingDate" width="140">
<template #default="scope">{{ displayDate(scope.row.meeting_date) }}</template>
</el-table-column>
<el-table-column prop="approved_date" :label="TEXT.common.fields.approvedDate" width="140">
<template #default="scope">{{ displayDate(scope.row.approved_date) }}</template>
</el-table-column>
<el-table-column :label="TEXT.common.fields.status" width="120">
<template #default="scope">
<el-tag :type="statusTagType(getEthicsStatus(scope.row))">
{{ statusLabel(getEthicsStatus(scope.row)) }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="approval_no" :label="TEXT.common.fields.approvalNo" min-width="160">
<template #default="{ row }">
<span class="font-mono text-main">{{ row.approval_no }}</span>
</template>
</el-table-column>
<el-table-column :label="TEXT.common.labels.actions" width="120" fixed="right">
<template #default="scope">
<el-button link type="danger" @click.stop="removeEthics(scope.row)">{{ TEXT.common.actions.delete }}</el-button>
</template>
</el-table-column>
</el-table>
<StateEmpty v-if="!loadingEthics && ethicsItems.length === 0" :description="TEXT.modules.startupFeasibilityEthics.emptyEthics" />
</div>
<el-table :data="ethicsItems" v-loading="loadingEthics" style="width: 100%">
<el-table-column prop="submit_date" :label="TEXT.common.fields.submitDate" width="140">
<template #default="scope">{{ displayDate(scope.row.submit_date) }}</template>
</el-table-column>
<el-table-column prop="accept_date" :label="TEXT.common.fields.acceptDate" width="140">
<template #default="scope">{{ displayDate(scope.row.accept_date) }}</template>
</el-table-column>
<el-table-column prop="meeting_date" :label="TEXT.common.fields.meetingDate" width="140">
<template #default="scope">{{ displayDate(scope.row.meeting_date) }}</template>
</el-table-column>
<el-table-column prop="approved_date" :label="TEXT.common.fields.approvedDate" width="140">
<template #default="scope">{{ displayDate(scope.row.approved_date) }}</template>
</el-table-column>
<el-table-column prop="approval_no" :label="TEXT.common.fields.approvalNo" min-width="160" />
<el-table-column :label="TEXT.common.labels.actions" width="200">
<template #default="scope">
<el-button link type="primary" size="small" @click="goEthicsDetail(scope.row.id)">{{ TEXT.common.actions.view }}</el-button>
<el-button link type="primary" size="small" @click="goEthicsEdit(scope.row.id)">{{ TEXT.common.actions.edit }}</el-button>
</template>
</el-table-column>
</el-table>
<StateEmpty v-if="!loadingEthics && ethicsItems.length === 0" :description="TEXT.modules.startupFeasibilityEthics.emptyEthics" />
</el-tab-pane>
</el-tabs>
</el-card>
@@ -66,13 +124,18 @@
</template>
<script setup lang="ts">
import { onMounted, ref } from "vue";
import { computed, onMounted, ref } from "vue";
import { useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ElMessage, ElMessageBox } from "element-plus";
import { Plus } from "@element-plus/icons-vue";
import { useStudyStore } from "../../store/study";
import { listFeasibility, listEthics } from "../../api/startup";
import { listFeasibility, listEthics, deleteFeasibility, deleteEthics } from "../../api/startup";
import { fetchSites } from "../../api/sites";
import type { Site } from "../../types/api";
import { displayDate } from "../../utils/display";
import StateEmpty from "../../components/StateEmpty.vue";
import dayjs from "dayjs";
import type { StageStatus } from "./project-overview/overview.adapter";
import { TEXT } from "../../locales";
const router = useRouter();
@@ -82,6 +145,74 @@ const feasibilityItems = ref<any[]>([]);
const ethicsItems = ref<any[]>([]);
const loadingFeasibility = ref(false);
const loadingEthics = ref(false);
const sites = ref<Site[]>([]);
const siteMap = computed(() => new Map(sites.value.map((site) => [site.id, site.name])));
const displaySite = (siteId?: string) => siteMap.value.get(siteId || "") || TEXT.common.fallback;
const statusLabelMap: Record<StageStatus, string> = {
COMPLETED: "已完成",
IN_PROGRESS: "进行中",
NOT_STARTED: "未开始",
BLOCKED: "阻塞/延期",
};
const statusLabel = (status: StageStatus) => statusLabelMap[status] || "未开始";
const statusTagType = (status: StageStatus) => {
if (status === "COMPLETED") return "success";
if (status === "IN_PROGRESS") return "primary";
if (status === "BLOCKED") return "danger";
return "info";
};
const SUBMIT_TO_ACCEPT_MONTHS =
Number(import.meta.env.VITE_STARTUP_SUBMIT_ACCEPT_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const ACCEPT_TO_APPROVAL_MONTHS =
Number(import.meta.env.VITE_STARTUP_ACCEPT_APPROVAL_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const isBlockedByAcceptDate = (acceptDate?: string, approvedDate?: string) => {
if (!acceptDate || approvedDate) return false;
return dayjs(acceptDate).add(ACCEPT_TO_APPROVAL_MONTHS, "month").isBefore(dayjs());
};
const isBlockedBySubmitDate = (submitDate?: string, acceptDate?: string) => {
if (!submitDate || acceptDate) return false;
return dayjs(submitDate).add(SUBMIT_TO_ACCEPT_MONTHS, "month").isBefore(dayjs());
};
const getStatusByFields = (
row: any,
completedField: string,
acceptField: string,
submitField: string,
progressFields: string[]
): StageStatus => {
if (row?.[completedField]) return "COMPLETED";
if (isBlockedByAcceptDate(row?.[acceptField], row?.[completedField])) return "BLOCKED";
if (isBlockedBySubmitDate(row?.[submitField], row?.[acceptField])) return "BLOCKED";
const hasProgress = progressFields.some((field) => !!row?.[field]);
return hasProgress ? "IN_PROGRESS" : "NOT_STARTED";
};
const getFeasibilityStatus = (row: any) =>
getStatusByFields(row, "approved_date", "accept_date", "submit_date", ["submit_date", "accept_date"]);
const getEthicsStatus = (row: any) =>
getStatusByFields(row, "approved_date", "accept_date", "submit_date", ["submit_date", "accept_date", "meeting_date"]);
const loadSites = async () => {
const studyId = study.currentStudy?.id;
if (!studyId) return;
try {
const { data } = await fetchSites(studyId, { limit: 500 });
sites.value = Array.isArray(data) ? data : data.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
}
};
const loadFeasibility = async () => {
const studyId = study.currentStudy?.id;
@@ -113,46 +244,50 @@ const loadEthics = async () => {
const goNewFeasibility = () => router.push("/startup/feasibility/new");
const goFeasibilityDetail = (id: string) => router.push(`/startup/feasibility/${id}`);
const goFeasibilityEdit = (id: string) => router.push(`/startup/feasibility/${id}/edit`);
const goNewEthics = () => router.push("/startup/ethics/new");
const goEthicsDetail = (id: string) => router.push(`/startup/ethics/${id}`);
const goEthicsEdit = (id: string) => router.push(`/startup/ethics/${id}/edit`);
const onFeasibilityRowClick = (row: any) => goFeasibilityDetail(row.id);
const onEthicsRowClick = (row: any) => goEthicsDetail(row.id);
const removeFeasibility = async (row: any) => {
const studyId = study.currentStudy?.id;
if (!studyId) return;
const ok = await ElMessageBox.confirm(TEXT.common.confirm.delete, TEXT.common.labels.tips).catch(() => null);
if (!ok) return;
try {
await deleteFeasibility(studyId, row.id);
ElMessage.success(TEXT.common.messages.deleteSuccess);
loadFeasibility();
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.deleteFailed);
}
};
const removeEthics = async (row: any) => {
const studyId = study.currentStudy?.id;
if (!studyId) return;
const ok = await ElMessageBox.confirm(TEXT.common.confirm.delete, TEXT.common.labels.tips).catch(() => null);
if (!ok) return;
try {
await deleteEthics(studyId, row.id);
ElMessage.success(TEXT.common.messages.deleteSuccess);
loadEthics();
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.deleteFailed);
}
};
onMounted(() => {
loadSites();
loadFeasibility();
loadEthics();
});
</script>
<style scoped>
.page {
display: flex;
flex-direction: column;
gap: 16px;
.ctms-tab-content {
padding: 16px;
}
.page-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.page-title {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
}
.tab-actions {
display: flex;
justify-content: flex-end;
margin-bottom: 12px;
}
</style>
+94 -45
View File
@@ -1,43 +1,59 @@
<template>
<div class="page">
<div class="page-header">
<div class="ctms-page">
<div class="ctms-page-header">
<div>
<h1 class="page-title">{{ TEXT.modules.startupFeasibilityEthics.ethicsDetailTitle }}</h1>
<p class="page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.ethicsDetailSubtitle }}</p>
<h1 class="ctms-page-title">{{ TEXT.modules.startupFeasibilityEthics.ethicsDetailTitle }}</h1>
<p class="ctms-page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.ethicsDetailSubtitle }}</p>
</div>
<div class="actions">
<div class="ctms-page-actions">
<el-button type="primary" @click="goEdit">{{ TEXT.common.actions.edit }}</el-button>
<el-button @click="goBack">{{ TEXT.common.actions.back }}</el-button>
<el-button @click="goBack">
<el-icon class="el-icon--left"><ArrowLeft /></el-icon>
{{ TEXT.common.actions.back }}
</el-button>
</div>
</div>
<el-card v-loading="loading">
<el-descriptions :column="2" border>
<el-card class="ctms-table-card" v-loading="loading">
<el-descriptions :column="2" border class="ctms-descriptions">
<el-descriptions-item :label="TEXT.common.fields.site">{{ displaySite(detail.site_id) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.approvalNo">{{ detail.approval_no || TEXT.common.fallback }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.submitDate">{{ displayDate(detail.submit_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.acceptDate">{{ displayDate(detail.accept_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.meetingDate">{{ displayDate(detail.meeting_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.approvedDate">{{ displayDate(detail.approved_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.approvalNo">{{ detail.approval_no || TEXT.common.fallback }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.status">
<el-tag :type="statusTagType(status)">{{ statusLabel(status) }}</el-tag>
</el-descriptions-item>
</el-descriptions>
</el-card>
<AttachmentList
v-if="recordId"
:study-id="studyId"
entity-type="startup_ethics"
:entity-id="recordId"
/>
<div class="ctms-section-card" v-if="recordId">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.common.labels.attachments }}</div>
</div>
<AttachmentList
:study-id="studyId"
entity-type="startup_ethics"
:entity-id="recordId"
/>
</div>
</div>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref } from "vue";
import { computed, onMounted, reactive, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ArrowLeft } from "@element-plus/icons-vue";
import dayjs from "dayjs";
import { useStudyStore } from "../../store/study";
import { getEthics } from "../../api/startup";
import { fetchSites } from "../../api/sites";
import type { Site } from "../../types/api";
import { displayDate } from "../../utils/display";
import AttachmentList from "../../components/attachments/AttachmentList.vue";
import type { StageStatus } from "../ia/project-overview/overview.adapter";
import { TEXT } from "../../locales";
const route = useRoute();
@@ -46,8 +62,13 @@ const study = useStudyStore();
const loading = ref(false);
const recordId = route.params.recordId as string;
const studyId = study.currentStudy?.id || "";
const sites = ref<Site[]>([]);
const siteMap = computed(() => new Map(sites.value.map((site) => [site.id, site.name])));
const displaySite = (siteId?: string) => siteMap.value.get(siteId || "") || TEXT.common.fallback;
const detail = reactive<any>({
site_id: "",
submit_date: "",
accept_date: "",
meeting_date: "",
@@ -55,6 +76,58 @@ const detail = reactive<any>({
approval_no: "",
});
const SUBMIT_TO_ACCEPT_MONTHS =
Number(import.meta.env.VITE_STARTUP_SUBMIT_ACCEPT_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const ACCEPT_TO_APPROVAL_MONTHS =
Number(import.meta.env.VITE_STARTUP_ACCEPT_APPROVAL_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const statusLabelMap: Record<StageStatus, string> = {
COMPLETED: "已完成",
IN_PROGRESS: "进行中",
NOT_STARTED: "未开始",
BLOCKED: "阻塞/延期",
};
const statusLabel = (status: StageStatus) => statusLabelMap[status] || "未开始";
const statusTagType = (status: StageStatus) => {
if (status === "COMPLETED") return "success";
if (status === "IN_PROGRESS") return "primary";
if (status === "BLOCKED") return "danger";
return "info";
};
const isBlockedByAcceptDate = (acceptDate?: string, approvedDate?: string) => {
if (!acceptDate || approvedDate) return false;
return dayjs(acceptDate).add(ACCEPT_TO_APPROVAL_MONTHS, "month").isBefore(dayjs());
};
const isBlockedBySubmitDate = (submitDate?: string, acceptDate?: string) => {
if (!submitDate || acceptDate) return false;
return dayjs(submitDate).add(SUBMIT_TO_ACCEPT_MONTHS, "month").isBefore(dayjs());
};
const status = computed<StageStatus>(() => {
if (detail.approved_date) return "COMPLETED";
if (isBlockedByAcceptDate(detail.accept_date, detail.approved_date)) return "BLOCKED";
if (isBlockedBySubmitDate(detail.submit_date, detail.accept_date)) return "BLOCKED";
if (detail.submit_date || detail.accept_date || detail.meeting_date) return "IN_PROGRESS";
return "NOT_STARTED";
});
const loadSites = async () => {
if (!studyId) return;
try {
const { data } = await fetchSites(studyId, { limit: 500 });
sites.value = Array.isArray(data) ? data : data.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
}
};
const load = async () => {
if (!studyId || !recordId) return;
loading.value = true;
@@ -71,36 +144,12 @@ const load = async () => {
const goEdit = () => router.push(`/startup/ethics/${recordId}/edit`);
const goBack = () => router.push("/startup/feasibility-ethics");
onMounted(load);
onMounted(() => {
loadSites();
load();
});
</script>
<style scoped>
.page {
display: flex;
flex-direction: column;
gap: 16px;
}
.page-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.page-title {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
}
.actions {
display: flex;
gap: 8px;
}
/* Scoped styles can be minimized as we rely on global classes */
</style>
+89 -54
View File
@@ -1,43 +1,75 @@
<template>
<div class="page">
<div class="page-header">
<div class="ctms-page">
<div class="ctms-page-header">
<div>
<h1 class="page-title">{{ isEdit ? TEXT.modules.startupFeasibilityEthics.ethicsEditTitle : TEXT.modules.startupFeasibilityEthics.ethicsNewTitle }}</h1>
<p class="page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.ethicsFormSubtitle }}</p>
<h1 class="ctms-page-title">{{ isEdit ? TEXT.modules.startupFeasibilityEthics.ethicsEditTitle : TEXT.modules.startupFeasibilityEthics.ethicsNewTitle }}</h1>
<p class="ctms-page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.ethicsFormSubtitle }}</p>
</div>
<div class="ctms-page-actions">
<el-button @click="goBack">
<el-icon class="el-icon--left"><ArrowLeft /></el-icon>
{{ TEXT.common.actions.back }}
</el-button>
</div>
<el-button @click="goBack">{{ TEXT.common.actions.back }}</el-button>
</div>
<el-card>
<el-form :model="form" label-width="120px">
<el-form-item :label="TEXT.common.fields.submitDate">
<el-date-picker v-model="form.submit_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.acceptDate">
<el-date-picker v-model="form.accept_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.meetingDate">
<el-date-picker v-model="form.meeting_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.approvedDate">
<el-date-picker v-model="form.approved_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.approvalNo">
<el-input v-model="form.approval_no" :placeholder="TEXT.common.placeholders.input + TEXT.common.fields.approvalNo" />
</el-form-item>
<el-form-item>
<el-card class="ctms-form-card">
<el-form :model="form" label-width="140px" class="ctms-form" label-position="top">
<el-row :gutter="24">
<el-col :span="12">
<el-form-item :label="TEXT.common.fields.site">
<el-select v-model="form.site_id" :placeholder="TEXT.common.placeholders.select" clearable style="width: 100%">
<el-option v-for="site in siteOptions" :key="site.value" :label="site.label" :value="site.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="TEXT.common.fields.approvalNo">
<el-input v-model="form.approval_no" :placeholder="TEXT.common.placeholders.input + TEXT.common.fields.approvalNo" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="6">
<el-form-item :label="TEXT.common.fields.submitDate">
<el-date-picker v-model="form.submit_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="TEXT.common.fields.acceptDate">
<el-date-picker v-model="form.accept_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="TEXT.common.fields.meetingDate">
<el-date-picker v-model="form.meeting_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="TEXT.common.fields.approvedDate">
<el-date-picker v-model="form.approved_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
<el-form-item class="form-actions">
<el-button type="primary" :loading="saving" @click="submit">{{ TEXT.common.actions.save }}</el-button>
<el-button @click="goBack">{{ TEXT.common.actions.cancel }}</el-button>
</el-form-item>
</el-form>
</el-card>
<AttachmentList
v-if="isEdit && recordId"
:study-id="studyId"
entity-type="startup_ethics"
:entity-id="recordId"
/>
<div class="ctms-section-card" v-if="isEdit && recordId">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.common.labels.attachments }}</div>
</div>
<AttachmentList
:study-id="studyId"
entity-type="startup_ethics"
:entity-id="recordId"
/>
</div>
<el-card v-else class="hint-card">
<StateEmpty :description="TEXT.modules.startupFeasibilityEthics.ethicsUploadHint" />
</el-card>
@@ -48,8 +80,11 @@
import { computed, onMounted, reactive, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ArrowLeft } from "@element-plus/icons-vue";
import { useStudyStore } from "../../store/study";
import { createEthics, getEthics, updateEthics } from "../../api/startup";
import { fetchSites } from "../../api/sites";
import type { Site } from "../../types/api";
import AttachmentList from "../../components/attachments/AttachmentList.vue";
import StateEmpty from "../../components/StateEmpty.vue";
import { TEXT } from "../../locales";
@@ -62,8 +97,14 @@ const saving = ref(false);
const recordId = computed(() => route.params.recordId as string | undefined);
const isEdit = computed(() => !!recordId.value);
const studyId = computed(() => study.currentStudy?.id || "");
const sites = ref<Site[]>([]);
const siteOptions = computed(() =>
sites.value.map((site) => ({ value: site.id, label: site.name || TEXT.common.fallback }))
);
const form = reactive({
site_id: "",
submit_date: "",
accept_date: "",
meeting_date: "",
@@ -71,11 +112,22 @@ const form = reactive({
approval_no: "",
});
const loadSites = async () => {
if (!studyId.value) return;
try {
const { data } = await fetchSites(studyId.value, { limit: 500 });
sites.value = Array.isArray(data) ? data : data.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
}
};
const load = async () => {
if (!isEdit.value || !studyId.value || !recordId.value) return;
try {
const { data } = await getEthics(studyId.value, recordId.value);
Object.assign(form, {
site_id: data.site_id || "",
submit_date: data.submit_date || "",
accept_date: data.accept_date || "",
meeting_date: data.meeting_date || "",
@@ -92,6 +144,7 @@ const submit = async () => {
saving.value = true;
try {
const payload = {
site_id: form.site_id || null,
submit_date: form.submit_date || null,
accept_date: form.accept_date || null,
meeting_date: form.meeting_date || null,
@@ -116,35 +169,17 @@ const submit = async () => {
const goBack = () => router.push("/startup/feasibility-ethics");
onMounted(load);
onMounted(() => {
loadSites();
load();
});
</script>
<style scoped>
.page {
display: flex;
flex-direction: column;
gap: 16px;
.form-actions {
margin-top: 24px;
}
.page-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.page-title {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
}
.hint-card {
padding: 12px;
margin-top: 16px;
}
</style>
@@ -1,42 +1,58 @@
<template>
<div class="page">
<div class="page-header">
<div class="ctms-page">
<div class="ctms-page-header">
<div>
<h1 class="page-title">{{ TEXT.modules.startupFeasibilityEthics.feasibilityDetailTitle }}</h1>
<p class="page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.feasibilityDetailSubtitle }}</p>
<h1 class="ctms-page-title">{{ TEXT.modules.startupFeasibilityEthics.feasibilityDetailTitle }}</h1>
<p class="ctms-page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.feasibilityDetailSubtitle }}</p>
</div>
<div class="actions">
<div class="ctms-page-actions">
<el-button type="primary" @click="goEdit">{{ TEXT.common.actions.edit }}</el-button>
<el-button @click="goBack">{{ TEXT.common.actions.back }}</el-button>
<el-button @click="goBack">
<el-icon class="el-icon--left"><ArrowLeft /></el-icon>
{{ TEXT.common.actions.back }}
</el-button>
</div>
</div>
<el-card v-loading="loading">
<el-descriptions :column="2" border>
<el-card class="ctms-table-card" v-loading="loading">
<el-descriptions :column="2" border class="ctms-descriptions">
<el-descriptions-item :label="TEXT.common.fields.site">{{ displaySite(detail.site_id) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.projectNo">{{ detail.project_no || TEXT.common.fallback }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.submitDate">{{ displayDate(detail.submit_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.acceptDate">{{ displayDate(detail.accept_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.approvedDate">{{ displayDate(detail.approved_date) }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.projectNo">{{ detail.project_no || TEXT.common.fallback }}</el-descriptions-item>
<el-descriptions-item :label="TEXT.common.fields.status">
<el-tag :type="statusTagType(status)">{{ statusLabel(status) }}</el-tag>
</el-descriptions-item>
</el-descriptions>
</el-card>
<AttachmentList
v-if="recordId"
:study-id="studyId"
entity-type="startup_feasibility"
:entity-id="recordId"
/>
<div class="ctms-section-card" v-if="recordId">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.common.labels.attachments }}</div>
</div>
<AttachmentList
:study-id="studyId"
entity-type="startup_feasibility"
:entity-id="recordId"
/>
</div>
</div>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref } from "vue";
import { computed, onMounted, reactive, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ArrowLeft } from "@element-plus/icons-vue";
import dayjs from "dayjs";
import { useStudyStore } from "../../store/study";
import { getFeasibility } from "../../api/startup";
import { fetchSites } from "../../api/sites";
import type { Site } from "../../types/api";
import { displayDate } from "../../utils/display";
import AttachmentList from "../../components/attachments/AttachmentList.vue";
import type { StageStatus } from "../ia/project-overview/overview.adapter";
import { TEXT } from "../../locales";
const route = useRoute();
@@ -45,14 +61,71 @@ const study = useStudyStore();
const loading = ref(false);
const recordId = route.params.recordId as string;
const studyId = study.currentStudy?.id || "";
const sites = ref<Site[]>([]);
const siteMap = computed(() => new Map(sites.value.map((site) => [site.id, site.name])));
const displaySite = (siteId?: string) => siteMap.value.get(siteId || "") || TEXT.common.fallback;
const detail = reactive<any>({
site_id: "",
submit_date: "",
accept_date: "",
approved_date: "",
project_no: "",
});
const SUBMIT_TO_ACCEPT_MONTHS =
Number(import.meta.env.VITE_STARTUP_SUBMIT_ACCEPT_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const ACCEPT_TO_APPROVAL_MONTHS =
Number(import.meta.env.VITE_STARTUP_ACCEPT_APPROVAL_TIMEOUT_MONTHS) ||
Number(import.meta.env.VITE_STARTUP_ACCEPT_TIMEOUT_MONTHS) ||
1;
const statusLabelMap: Record<StageStatus, string> = {
COMPLETED: "已完成",
IN_PROGRESS: "进行中",
NOT_STARTED: "未开始",
BLOCKED: "阻塞/延期",
};
const statusLabel = (status: StageStatus) => statusLabelMap[status] || "未开始";
const statusTagType = (status: StageStatus) => {
if (status === "COMPLETED") return "success";
if (status === "IN_PROGRESS") return "primary";
if (status === "BLOCKED") return "danger";
return "info";
};
const isBlockedByAcceptDate = (acceptDate?: string, approvedDate?: string) => {
if (!acceptDate || approvedDate) return false;
return dayjs(acceptDate).add(ACCEPT_TO_APPROVAL_MONTHS, "month").isBefore(dayjs());
};
const isBlockedBySubmitDate = (submitDate?: string, acceptDate?: string) => {
if (!submitDate || acceptDate) return false;
return dayjs(submitDate).add(SUBMIT_TO_ACCEPT_MONTHS, "month").isBefore(dayjs());
};
const status = computed<StageStatus>(() => {
if (detail.approved_date) return "COMPLETED";
if (isBlockedByAcceptDate(detail.accept_date, detail.approved_date)) return "BLOCKED";
if (isBlockedBySubmitDate(detail.submit_date, detail.accept_date)) return "BLOCKED";
if (detail.submit_date || detail.accept_date) return "IN_PROGRESS";
return "NOT_STARTED";
});
const loadSites = async () => {
if (!studyId) return;
try {
const { data } = await fetchSites(studyId, { limit: 500 });
sites.value = Array.isArray(data) ? data : data.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
}
};
const load = async () => {
if (!studyId || !recordId) return;
loading.value = true;
@@ -69,36 +142,12 @@ const load = async () => {
const goEdit = () => router.push(`/startup/feasibility/${recordId}/edit`);
const goBack = () => router.push("/startup/feasibility-ethics");
onMounted(load);
onMounted(() => {
loadSites();
load();
});
</script>
<style scoped>
.page {
display: flex;
flex-direction: column;
gap: 16px;
}
.page-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.page-title {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
}
.actions {
display: flex;
gap: 8px;
}
/* Scoped styles can be minimized as we rely on global classes */
</style>
+84 -51
View File
@@ -1,40 +1,70 @@
<template>
<div class="page">
<div class="page-header">
<div class="ctms-page">
<div class="ctms-page-header">
<div>
<h1 class="page-title">{{ isEdit ? TEXT.modules.startupFeasibilityEthics.feasibilityEditTitle : TEXT.modules.startupFeasibilityEthics.feasibilityNewTitle }}</h1>
<p class="page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.feasibilityFormSubtitle }}</p>
<h1 class="ctms-page-title">{{ isEdit ? TEXT.modules.startupFeasibilityEthics.feasibilityEditTitle : TEXT.modules.startupFeasibilityEthics.feasibilityNewTitle }}</h1>
<p class="ctms-page-subtitle">{{ TEXT.modules.startupFeasibilityEthics.feasibilityFormSubtitle }}</p>
</div>
<div class="ctms-page-actions">
<el-button @click="goBack">
<el-icon class="el-icon--left"><ArrowLeft /></el-icon>
{{ TEXT.common.actions.back }}
</el-button>
</div>
<el-button @click="goBack">{{ TEXT.common.actions.back }}</el-button>
</div>
<el-card>
<el-form :model="form" label-width="120px">
<el-form-item :label="TEXT.common.fields.submitDate">
<el-date-picker v-model="form.submit_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.acceptDate">
<el-date-picker v-model="form.accept_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.approvedDate">
<el-date-picker v-model="form.approved_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" />
</el-form-item>
<el-form-item :label="TEXT.common.fields.projectNo">
<el-input v-model="form.project_no" :placeholder="TEXT.common.placeholders.input + TEXT.common.fields.projectNo" />
</el-form-item>
<el-form-item>
<el-card class="ctms-form-card">
<el-form :model="form" label-width="140px" class="ctms-form" label-position="top">
<el-row :gutter="24">
<el-col :span="12">
<el-form-item :label="TEXT.common.fields.site">
<el-select v-model="form.site_id" :placeholder="TEXT.common.placeholders.select" clearable style="width: 100%">
<el-option v-for="site in siteOptions" :key="site.value" :label="site.label" :value="site.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="TEXT.common.fields.projectNo">
<el-input v-model="form.project_no" :placeholder="TEXT.common.placeholders.input + TEXT.common.fields.projectNo" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
<el-form-item :label="TEXT.common.fields.submitDate">
<el-date-picker v-model="form.submit_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="TEXT.common.fields.acceptDate">
<el-date-picker v-model="form.accept_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="TEXT.common.fields.approvedDate">
<el-date-picker v-model="form.approved_date" type="date" value-format="YYYY-MM-DD" :placeholder="TEXT.common.placeholders.select" style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
<el-form-item class="form-actions">
<el-button type="primary" :loading="saving" @click="submit">{{ TEXT.common.actions.save }}</el-button>
<el-button @click="goBack">{{ TEXT.common.actions.cancel }}</el-button>
</el-form-item>
</el-form>
</el-card>
<AttachmentList
v-if="isEdit && recordId"
:study-id="studyId"
entity-type="startup_feasibility"
:entity-id="recordId"
/>
<div class="ctms-section-card" v-if="isEdit && recordId">
<div class="ctms-section-header">
<div class="ctms-section-title">{{ TEXT.common.labels.attachments }}</div>
</div>
<AttachmentList
:study-id="studyId"
entity-type="startup_feasibility"
:entity-id="recordId"
/>
</div>
<el-card v-else class="hint-card">
<StateEmpty :description="TEXT.modules.startupFeasibilityEthics.feasibilityUploadHint" />
</el-card>
@@ -45,8 +75,11 @@
import { computed, onMounted, reactive, ref } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ElMessage } from "element-plus";
import { ArrowLeft } from "@element-plus/icons-vue";
import { useStudyStore } from "../../store/study";
import { createFeasibility, getFeasibility, updateFeasibility } from "../../api/startup";
import { fetchSites } from "../../api/sites";
import type { Site } from "../../types/api";
import AttachmentList from "../../components/attachments/AttachmentList.vue";
import StateEmpty from "../../components/StateEmpty.vue";
import { TEXT } from "../../locales";
@@ -59,19 +92,36 @@ const saving = ref(false);
const recordId = computed(() => route.params.recordId as string | undefined);
const isEdit = computed(() => !!recordId.value);
const studyId = computed(() => study.currentStudy?.id || "");
const sites = ref<Site[]>([]);
const siteOptions = computed(() =>
sites.value.map((site) => ({ value: site.id, label: site.name || TEXT.common.fallback }))
);
const form = reactive({
site_id: "",
submit_date: "",
accept_date: "",
approved_date: "",
project_no: "",
});
const loadSites = async () => {
if (!studyId.value) return;
try {
const { data } = await fetchSites(studyId.value, { limit: 500 });
sites.value = Array.isArray(data) ? data : data.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
}
};
const load = async () => {
if (!isEdit.value || !studyId.value || !recordId.value) return;
try {
const { data } = await getFeasibility(studyId.value, recordId.value);
Object.assign(form, {
site_id: data.site_id || "",
submit_date: data.submit_date || "",
accept_date: data.accept_date || "",
approved_date: data.approved_date || "",
@@ -87,6 +137,7 @@ const submit = async () => {
saving.value = true;
try {
const payload = {
site_id: form.site_id || null,
submit_date: form.submit_date || null,
accept_date: form.accept_date || null,
approved_date: form.approved_date || null,
@@ -110,35 +161,17 @@ const submit = async () => {
const goBack = () => router.push("/startup/feasibility-ethics");
onMounted(load);
onMounted(() => {
loadSites();
load();
});
</script>
<style scoped>
.page {
display: flex;
flex-direction: column;
gap: 16px;
.form-actions {
margin-top: 24px;
}
.page-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.page-title {
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
}
.hint-card {
padding: 12px;
margin-top: 16px;
}
</style>