zhouchengcheng/ctms
1
1
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

未知（继上次中断）

Browse Source
This commit is contained in:
Cheng Zhou
2026-02-04 10:52:34 +08:00
parent 8e258d21a7
commit 737f84bf54
99 changed files with 5497 additions and 2143 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/ia/DrugShipments.vue
+140 -68
View File
@@ -1,47 +1,53 @@
<template>
<div class="page">
<div class="page-header">
<div>
<h1 class="page-title">{{ TEXT.modules.drugShipments.title }}</h1>
<el-card shadow="never" class="main-content-card">
<div class="filter-container">
<el-form :inline="true" :model="filters" class="filter-form">
<el-form-item label="" class="filter-item">
<el-select v-model="filters.center_id" clearable :placeholder="TEXT.common.fields.site" class="filter-select">
<template #prefix>
<el-icon><Location /></el-icon>
</template>
<el-option
v-for="site in sites"
:key="site.id"
:label="site.name || TEXT.common.fallback"
:value="site.id"
/>
</el-select>
</el-form-item>
<el-form-item label="" class="filter-item">
<el-select v-model="filters.direction" clearable :placeholder="TEXT.common.fields.direction" class="filter-select">
<template #prefix>
<el-icon><Menu /></el-icon>
</template>
<el-option :label="TEXT.enums.shipmentDirection.SEND" value="SEND" />
<el-option :label="TEXT.enums.shipmentDirection.RETURN" value="RETURN" />
</el-select>
</el-form-item>
<el-form-item label="" class="filter-item">
<el-select v-model="filters.status" clearable :placeholder="TEXT.common.fields.status" class="filter-select">
<template #prefix>
<el-icon><CircleCheck /></el-icon>
</template>
<el-option :label="TEXT.enums.shipmentStatus.PENDING" value="PENDING" />
<el-option :label="TEXT.enums.shipmentStatus.IN_TRANSIT" value="IN_TRANSIT" />
<el-option :label="TEXT.enums.shipmentStatus.SIGNED" value="SIGNED" />
<el-option :label="TEXT.enums.shipmentStatus.RETURNED" value="RETURNED" />
<el-option :label="TEXT.enums.shipmentStatus.EXCEPTION" value="EXCEPTION" />
</el-select>
</el-form-item>
<el-form-item class="filter-actions">
<el-button @click="resetFilters">{{ TEXT.common.actions.reset }}</el-button>
</el-form-item>
<div class="filter-spacer"></div>
<el-button type="primary" @click="goNew" class="header-action-btn">
<el-icon class="el-icon--left"><Plus /></el-icon>
{{ TEXT.modules.drugShipments.newTitle }}
</el-button>
</el-form>
</div>
<el-button type="primary" @click="goNew">{{ TEXT.modules.drugShipments.newTitle }}</el-button>
</div>
<el-card class="filter-card">
<el-form :inline="true" :model="filters">
<el-form-item :label="TEXT.common.fields.site">
<el-select v-model="filters.center_id" :placeholder="TEXT.common.placeholders.select" clearable style="width: 200px">
<el-option
v-for="site in sites"
:key="site.id"
:label="site.name || TEXT.common.fallback"
:value="site.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="TEXT.common.fields.direction">
<el-select v-model="filters.direction" :placeholder="TEXT.common.placeholders.select" clearable style="width: 160px">
<el-option :label="TEXT.enums.shipmentDirection.SEND" value="SEND" />
<el-option :label="TEXT.enums.shipmentDirection.RETURN" value="RETURN" />
</el-select>
</el-form-item>
<el-form-item :label="TEXT.common.fields.status">
<el-select v-model="filters.status" :placeholder="TEXT.common.placeholders.select" clearable style="width: 160px">
<el-option :label="TEXT.enums.shipmentStatus.PENDING" value="PENDING" />
<el-option :label="TEXT.enums.shipmentStatus.IN_TRANSIT" value="IN_TRANSIT" />
<el-option :label="TEXT.enums.shipmentStatus.SIGNED" value="SIGNED" />
<el-option :label="TEXT.enums.shipmentStatus.RETURNED" value="RETURNED" />
<el-option :label="TEXT.enums.shipmentStatus.EXCEPTION" value="EXCEPTION" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="load">{{ TEXT.common.actions.search }}</el-button>
<el-button @click="resetFilters">{{ TEXT.common.actions.reset }}</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card>
<el-table
:data="sortedItems"
v-loading="loading"
@@ -52,9 +58,9 @@
<el-table-column prop="site_name" :label="TEXT.common.fields.site" min-width="160">
<template #default="scope">{{ scope.row.site_name || TEXT.common.fallback }}</template>
</el-table-column>
<el-table-column prop="direction" :label="TEXT.common.fields.direction" width="100">
<el-table-column prop="direction" :label="TEXT.common.fields.direction" width="120">
<template #default="scope">
<el-tag :type="scope.row.direction === 'SEND' ? 'primary' : 'warning'" disable-transitions>
<el-tag :class="['type-tag', scope.row.direction === 'SEND' ? 'type-send' : 'type-return']" effect="light">
{{ displayEnum(TEXT.enums.shipmentDirection, scope.row.direction) }}
</el-tag>
</template>
@@ -71,9 +77,9 @@
<el-table-column prop="batch_no" :label="TEXT.common.fields.batchNo" min-width="140">
<template #default="scope">{{ scope.row.batch_no || TEXT.common.fallback }}</template>
</el-table-column>
<el-table-column prop="status" :label="TEXT.common.fields.status" width="120">
<el-table-column prop="status" :label="TEXT.common.fields.status" width="140">
<template #default="scope">
<el-tag :type="statusType(scope.row.status)" disable-transitions>
<el-tag :type="statusType(scope.row.status)" effect="plain" round size="small" class="status-tag">
{{ displayEnum(TEXT.enums.shipmentStatus, scope.row.status) }}
</el-tag>
</template>
@@ -101,9 +107,10 @@
</template>
<script setup lang="ts">
import { computed, onMounted, reactive, ref } from "vue";
import { computed, onMounted, reactive, ref, watch } from "vue";
import { useRouter } from "vue-router";
import { ElMessage, ElMessageBox } from "element-plus";
import { Location, Menu, CircleCheck, Plus } from "@element-plus/icons-vue";
import { useStudyStore } from "../../store/study";
import { listDrugShipments, deleteDrugShipment } from "../../api/drugShipments";
import { fetchSites } from "../../api/sites";
@@ -118,7 +125,7 @@ const items = ref<any[]>([]);
const sites = ref<any[]>([]);
const siteActiveMap = ref<Record<string, boolean>>({});
const filters = reactive({
center_id: "",
center_id: study.currentSite?.id || "",
direction: "",
status: "",
});
@@ -144,12 +151,8 @@ const load = async () => {
if (!studyId) return;
loading.value = true;
try {
const { data } = await listDrugShipments(studyId, {
center_id: filters.center_id || undefined,
direction: filters.direction || undefined,
status: filters.status || undefined,
});
items.value = Array.isArray(data) ? data : data.items || [];
const { data } = await listDrugShipments(studyId, {});
items.value = Array.isArray(data) ? data : data?.items || [];
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || TEXT.common.messages.loadFailed);
} finally {
@@ -161,7 +164,6 @@ const resetFilters = () => {
filters.center_id = "";
filters.direction = "";
filters.status = "";
load();
};
const goNew = () => router.push("/drug/shipments/new");
@@ -173,8 +175,16 @@ const onRowClick = (row: any) => {
const isInactiveSite = (siteId?: string) => !!siteId && siteActiveMap.value[siteId] === false;
const shipmentRowClass = ({ row }: { row: any }) =>
`${row?.id ? "clickable-row" : ""}${isInactiveSite(row?.center_id) ? " row-inactive" : ""}`.trim();
const filteredItems = computed(() =>
items.value.filter((item) => {
if (filters.center_id && item?.center_id !== filters.center_id) return false;
if (filters.direction && item?.direction !== filters.direction) return false;
if (filters.status && item?.status !== filters.status) return false;
return true;
})
);
const sortedItems = computed(() =>
[...items.value].sort((a, b) => Number(isInactiveSite(a?.center_id)) - Number(isInactiveSite(b?.center_id)))
[...filteredItems.value].sort((a, b) => Number(isInactiveSite(a?.center_id)) - Number(isInactiveSite(b?.center_id)))
);
const statusType = (status: string) => {
@@ -212,6 +222,19 @@ const remove = async (row: any) => {
}
};
watch(() => filters.center_id, (val: string) => {
if (val) {
const matched = sites.value.find(s => s.id === val);
if (matched) study.setCurrentSite(matched);
} else {
study.setCurrentSite(null);
}
});
watch(() => study.currentSite, (newSite: any) => {
filters.center_id = newSite?.id || "";
});
onMounted(async () => {
await loadSites();
load();
@@ -222,30 +245,79 @@ onMounted(async () => {
.page {
display: flex;
flex-direction: column;
gap: 16px;
}
.main-content-card :deep(.el-card__body) {
padding: 20px;
}
.page-header {
.filter-container {
margin-bottom: 20px;
}
.filter-form {
display: flex;
justify-content: space-between;
align-items: flex-end;
width: 100%;
gap: 12px;
align-items: center;
}
.page-title {
margin: 0;
font-size: 22px;
.filter-item {
margin-bottom: 0 !important;
margin-right: 0 !important;
}
.filter-actions {
margin-bottom: 0 !important;
margin-right: 0 !important;
}
.filter-actions :deep(.el-form-item__content) {
align-items: center;
}
.filter-actions :deep(.el-button) {
height: 36px;
line-height: 36px;
padding: 0 18px;
border-radius: 8px;
}
.filter-select {
width: 140px;
}
.filter-spacer {
flex: 1;
}
.header-action-btn {
height: 36px;
padding: 0 20px;
border-radius: 8px;
}
.type-tag {
font-weight: 600;
border: none;
}
.page-subtitle {
margin: 6px 0 0;
font-size: 13px;
color: var(--ctms-text-secondary);
.type-send {
background-color: #fff7ed !important;
color: #ea580c !important;
}
.filter-card :deep(.el-form-item) {
margin-bottom: 0;
.type-return {
background-color: #fefce8 !important;
color: #ca8a04 !important;
}
.status-tag {
font-weight: 500;
}
.text-muted {
color: var(--ctms-text-placeholder);
}
</style>