|
@@ -26,13 +26,13 @@
|
|
|
<div>
|
|
<div>
|
|
|
<span>年度演练计划</span>
|
|
<span>年度演练计划</span>
|
|
|
<span class="exercise-count">{{
|
|
<span class="exercise-count">{{
|
|
|
- exerciseCountList.find((item) => item.drillScope === activeTab)?.drillPlanCount
|
|
|
|
|
|
|
+ exerciseCountList.find((item) => item.drillScope === activeTab)?.drillPlanCount || 0
|
|
|
}}</span>
|
|
}}</span>
|
|
|
</div>
|
|
</div>
|
|
|
<div>
|
|
<div>
|
|
|
<span>已完成演练</span>
|
|
<span>已完成演练</span>
|
|
|
<span class="exercise-count">{{
|
|
<span class="exercise-count">{{
|
|
|
- exerciseCountList.find((item) => item.drillScope === activeTab)?.completedDrillCount
|
|
|
|
|
|
|
+ exerciseCountList.find((item) => item.drillScope === activeTab)?.completedDrillCount || 0
|
|
|
}}</span>
|
|
}}</span>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -40,19 +40,19 @@
|
|
|
<div v-if="exercisesList.length === 0" class="exercise-list-no-data">暂无演练计划</div>
|
|
<div v-if="exercisesList.length === 0" class="exercise-list-no-data">暂无演练计划</div>
|
|
|
<div class="exercise-item" v-for="item in exercisesList" :key="item.id" @click="handleJumpToDetail(item.id)">
|
|
<div class="exercise-item" v-for="item in exercisesList" :key="item.id" @click="handleJumpToDetail(item.id)">
|
|
|
<div class="exercise-info">
|
|
<div class="exercise-info">
|
|
|
- <span class="exercise-title">{{ item.drillContent }}</span>
|
|
|
|
|
|
|
+ <span class="exercise-title" :title="item.drillContent">{{ item.drillContent }}</span>
|
|
|
<div class="exercise-info-content">
|
|
<div class="exercise-info-content">
|
|
|
- <span class="exercise-date">{{
|
|
|
|
|
- item.status === EMERGENCY_DRILL_STATUS.COMPLETE ? item.drillTime : item.dueCompleteTime
|
|
|
|
|
- }}</span>
|
|
|
|
|
|
|
+ <span class="exercise-date">{{ getFormattedTime(item) }}</span>
|
|
|
<div class="exercise-label" v-if="item.status === EMERGENCY_DRILL_STATUS.COMPLETE">
|
|
<div class="exercise-label" v-if="item.status === EMERGENCY_DRILL_STATUS.COMPLETE">
|
|
|
<div class="label-content">已演练</div>
|
|
<div class="label-content">已演练</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="exercise-dept">{{
|
|
|
|
|
- mergeAndFormat(item.responsibleDeptNameList, item.coordinateDeptNameList)
|
|
|
|
|
- }}</div>
|
|
|
|
|
|
|
+ <div
|
|
|
|
|
+ class="exercise-dept"
|
|
|
|
|
+ :title="mergeAndFormat(item.responsibleDeptNameList, item.coordinateDeptNameList)"
|
|
|
|
|
+ >{{ mergeAndFormat(item.responsibleDeptNameList, item.coordinateDeptNameList) }}</div
|
|
|
|
|
+ >
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -94,7 +94,7 @@
|
|
|
yearSelected.value = year;
|
|
yearSelected.value = year;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- function mergeAndFormat(A: string = '', B: string = ''): string {
|
|
|
|
|
|
|
+ function mergeAndFormat(A: string, B: string): string {
|
|
|
if (!A) A = '[]';
|
|
if (!A) A = '[]';
|
|
|
if (!B) B = '[]';
|
|
if (!B) B = '[]';
|
|
|
|
|
|
|
@@ -111,6 +111,20 @@
|
|
|
return [...partsA, ...partsB].join('、');
|
|
return [...partsA, ...partsB].join('、');
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ const getFormattedTime = (data: DrillPlanList): string => {
|
|
|
|
|
+ const dateString = data.status === EMERGENCY_DRILL_STATUS.COMPLETE ? data.drillTime : data.dueCompleteTime;
|
|
|
|
|
+
|
|
|
|
|
+ if (!dateString || typeof dateString !== 'string') {
|
|
|
|
|
+ throw new Error('Invalid input: expected a non-empty string');
|
|
|
|
|
+ }
|
|
|
|
|
+ const match = dateString.match(/^\d{4}-\d{2}-\d{2}/);
|
|
|
|
|
+ if (match) {
|
|
|
|
|
+ return match[0]; // 直接提取日期部分
|
|
|
|
|
+ }
|
|
|
|
|
+ // 或者 fallback 到 split
|
|
|
|
|
+ return dateString.split(' ')[0];
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
const handleJumpToDetail = (id: number) => {
|
|
const handleJumpToDetail = (id: number) => {
|
|
|
router.push({
|
|
router.push({
|
|
|
path: '/emergency-management/emergency-drill/emergency-drill-plan-view',
|
|
path: '/emergency-management/emergency-drill/emergency-drill-plan-view',
|
|
@@ -148,6 +162,7 @@
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
|
.container-title {
|
|
.container-title {
|
|
|
|
|
+ height: 24px;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
@@ -179,7 +194,7 @@
|
|
|
.container-exercise {
|
|
.container-exercise {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: calc(100% - 34px);
|
|
height: calc(100% - 34px);
|
|
|
- margin-top: 10px;
|
|
|
|
|
|
|
+ margin-top: 20px;
|
|
|
|
|
|
|
|
.exercise-tabs {
|
|
.exercise-tabs {
|
|
|
display: flex;
|
|
display: flex;
|
|
@@ -221,7 +236,7 @@
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-around;
|
|
justify-content: space-around;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
- margin: 20px 7px 10px 7px;
|
|
|
|
|
|
|
+ margin: 25px 7px 10px 7px;
|
|
|
padding: 12px 0px;
|
|
padding: 12px 0px;
|
|
|
background: #e7f1ff;
|
|
background: #e7f1ff;
|
|
|
border-radius: 8px;
|
|
border-radius: 8px;
|
|
@@ -238,7 +253,7 @@
|
|
|
.exercise-list {
|
|
.exercise-list {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: calc(100% - 102px - 10px);
|
|
height: calc(100% - 102px - 10px);
|
|
|
- margin-top: 10px;
|
|
|
|
|
|
|
+ margin-top: 20px;
|
|
|
padding: 0 16px;
|
|
padding: 0 16px;
|
|
|
overflow-y: auto;
|
|
overflow-y: auto;
|
|
|
|
|
|
|
@@ -252,11 +267,15 @@
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
position: relative;
|
|
position: relative;
|
|
|
|
|
+ margin-bottom: 8px;
|
|
|
|
|
|
|
|
.exercise-title {
|
|
.exercise-title {
|
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
|
font-size: 16px;
|
|
font-size: 16px;
|
|
|
color: #333333;
|
|
color: #333333;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+ white-space: nowrap;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.exercise-info-content {
|
|
.exercise-info-content {
|
|
@@ -265,6 +284,8 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.exercise-date {
|
|
.exercise-date {
|
|
|
|
|
+ width: 72px;
|
|
|
|
|
+ margin-left: 10px;
|
|
|
font-weight: 400;
|
|
font-weight: 400;
|
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
|
color: #666666;
|
|
color: #666666;
|