新增合约规划的分栏

src/views/tjt/output-split/index.vue

@@ -71,8 +71,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="8">
+  <SplitPane>
+    <template #left>
       <ContentWrap>
         <div class="mb-12px text-14px font-600">
           {{ currentProject?.projectName || '合约规划列表' }}
@@ -84,7 +84,6 @@
           highlight-current-row
           @current-change="handleCurrentPlanningChange"
         >
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column align="center" label="项目任务包" min-width="180" prop="planningContent" />
           <el-table-column align="center" label="归属类型" min-width="110">
             <template #default="scope">
@@ -100,9 +99,9 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="16">
+    <template #right>
       <ContentWrap>
         <div v-loading="quarterLoading" class="min-h-320px">
           <template v-if="currentPlanning && formData">
@@ -224,8 +223,8 @@
           <el-empty v-else-if="!quarterLoading" description="请选择合约规划后查看分配结果" />
         </div>
       </ContentWrap>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 
   <Dialog v-model="dialogVisible" title="编辑专业及项目总分配比例" width="920">
     <template v-if="editForm">
@@ -288,6 +287,7 @@ import * as ProjectApi from '@/api/tjt/project'
 import * as PlanningApi from '@/api/tjt/planning'
 import * as PlanningQuarterApi from '@/api/tjt/planningQuarter'
 import * as OutputSplitApi from '@/api/tjt/outputSplit'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   formatAmountText,
   fromPercentValue,

src/views/tjt/output/index.vue

@@ -111,8 +111,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="9">
+  <SplitPane>
+    <template #left>
       <ContentWrap>
         <div class="mb-12px flex items-center justify-between">
           <div class="text-14px font-600">
@@ -127,7 +127,6 @@
           highlight-current-row
           @current-change="handleCurrentPlanningChange"
         >
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column
             align="center"
             label="项目任务包"
@@ -163,12 +162,10 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="15">
-      <div v-loading="quarterLoading" class="min-h-320px">
-        <template v-if="currentPlanning">
-      <ContentWrap>
+    <template #right>
+      <ContentWrap v-if="currentPlanning">
         <div class="mb-16px flex items-center justify-between gap-16px">
           <div>
             <div class="text-16px font-600">{{ currentPlanning.planningContent }}</div>
@@ -300,17 +297,19 @@
         </el-descriptions>
       </ContentWrap>
 
-      <ContentWrap>
+      <ContentWrap v-if="currentPlanning">
         <div class="mb-16px flex items-center justify-between gap-16px">
           <div>
             <div class="text-14px font-600">季度分配</div>
+            <div class="mt-4px text-12px text-[var(--el-text-color-secondary)]">
+              总分配、已分配、待分配和提取进度备注属于合约规划的总体分配控制；季度分配表只展示年度、季度和分配比例明细。
+            </div>
           </div>
           <el-button
             v-hasPermi="['tjt:planning:update', 'tjt:planning-quarter:update', 'tjt:planning-quarter:create']"
-            :disabled="guideDetailMode && !historyParentMode && !activeGuideDetail"
             plain
             type="primary"
-            @click="openQuarterDistributionForm(activeGuideDetail?.id)"
+            @click="openQuarterDistributionForm"
           >
             编辑季度分配
           </el-button>
@@ -329,13 +328,7 @@
             <div class="rounded-8px bg-[var(--el-fill-color-light)] px-16px py-12px">
               <div class="text-12px text-[var(--el-text-color-secondary)]">已分配</div>
               <div class="mt-6px text-18px font-600">
-                {{
-                  formatPercentText(
-                    guideDetailMode && activeGuideDetail
-                      ? activeGuideDetail.allocatedAmount
-                      : currentPlanning.allocatedAmount
-                  )
-                }}
+                {{ formatPercentText(currentPlanning.allocatedAmount) }}
               </div>
             </div>
           </el-col>
@@ -343,13 +336,7 @@
             <div class="rounded-8px bg-[var(--el-fill-color-light)] px-16px py-12px">
               <div class="text-12px text-[var(--el-text-color-secondary)]">待分配</div>
               <div class="mt-6px text-18px font-600">
-                {{
-                  formatPercentText(
-                    guideDetailMode && activeGuideDetail
-                      ? activeGuideDetail.pendingAmount
-                      : currentPlanning.pendingAmount
-                  )
-                }}
+                {{ formatPercentText(currentPlanning.pendingAmount) }}
               </div>
             </div>
           </el-col>
@@ -363,63 +350,7 @@
           </el-col>
         </el-row>
 
-        <template v-if="guideDetailMode && !historyParentMode">
-          <el-empty
-            v-if="!guideDetailRows.length"
-            description="暂无指导价法明细，请先维护指导价法明细"
-          />
-          <template v-else>
-            <el-tabs v-model="activeGuideDetailTab" class="mb-12px" type="card">
-              <el-tab-pane
-                v-for="detail in guideDetailRows"
-                :key="detail.tabKey"
-                :label="`序号 ${detail.sortNo || '-'}`"
-                :name="detail.tabKey"
-              />
-            </el-tabs>
-
-            <el-descriptions
-              v-if="activeGuideDetail"
-              :column="4"
-              border
-              class="mb-12px"
-              size="small"
-            >
-              <el-descriptions-item label="设计部位">
-                {{ getDesignPartLabel(activeGuideDetail.designPart) }}
-              </el-descriptions-item>
-              <el-descriptions-item label="设计内容/设计类型">
-                {{ activeGuideDetail.buildingType || '-' }}
-              </el-descriptions-item>
-              <el-descriptions-item label="设计面积">
-                {{ formatAreaText(activeGuideDetail.designArea) }}
-              </el-descriptions-item>
-              <el-descriptions-item label="考核产值小计">
-                {{ formatAmountText(activeGuideDetail.assessmentOutputValue) }}
-              </el-descriptions-item>
-            </el-descriptions>
-
-            <el-table :data="activeGuideDetailQuarterRows" border>
-              <el-table-column align="center" label="分配年度" width="150" prop="distributionYear" />
-              <el-table-column
-                v-for="quarter in QUARTER_OPTIONS"
-                :key="quarter.value"
-                :label="quarter.label"
-                min-width="220"
-              >
-                <template #default="scope">
-                  <div class="flex flex-col gap-8px">
-                    <div class="rounded-6px bg-[var(--el-fill-color-light)] px-10px py-8px text-12px">
-                      分配比例：{{ formatQuarterRatio(scope.row, quarter.value) }}
-                    </div>
-                  </div>
-                </template>
-              </el-table-column>
-            </el-table>
-          </template>
-        </template>
-
-        <el-table v-else :data="quarterRows" border>
+        <el-table v-loading="quarterLoading" :data="quarterRows" border>
           <el-table-column align="center" label="分配年度" width="150" prop="distributionYear" />
           <el-table-column
             v-for="quarter in QUARTER_OPTIONS"
@@ -437,14 +368,12 @@
           </el-table-column>
         </el-table>
       </ContentWrap>
-        </template>
 
-      <ContentWrap v-else-if="!quarterLoading">
+      <ContentWrap v-else>
         <el-empty description="请选择合约规划后查看测算结果和季度分配" />
       </ContentWrap>
-      </div>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 
   <PlanningOutputForm ref="planningOutputFormRef" @success="handlePlanningOutputFormSuccess" />
   <QuarterDistributionForm
@@ -460,6 +389,7 @@ import * as PlanningApi from '@/api/tjt/planning'
 import * as PlanningQuarterApi from '@/api/tjt/planningQuarter'
 import PlanningOutputForm from './PlanningOutputForm.vue'
 import QuarterDistributionForm from './QuarterDistributionForm.vue'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   CONTRACT_SIGN_OPTIONS,
   QUARTER_OPTIONS,
@@ -468,7 +398,6 @@ import {
   formatPercentText,
   getCalculationMethodLabel,
   getCalculationRatioLabel,
-  getDesignPartLabel,
   getDesignStageLabel,
   getOwnershipTypeLabel,
   getVirtualCalculationMethodLabel,
@@ -486,11 +415,6 @@ interface QuarterYearRow {
   quarters: PlanningQuarterApi.ProjectPlanningQuarterVO[]
 }
 
-interface GuideDetailQuarterRow extends PlanningQuarterApi.ProjectPlanningQuarterGuideDetailVO {
-  tabKey: string
-  quarterRows: QuarterYearRow[]
-}
-
 const message = useMessage()
 
 const loading = ref(false)
@@ -502,10 +426,6 @@ const planningList = ref<PlanningApi.ProjectPlanningVO[]>([])
 const currentProject = ref<ProjectApi.ProjectVO>()
 const currentPlanning = ref<PlanningApi.ProjectPlanningVO>()
 const quarterRows = ref<QuarterYearRow[]>([])
-const guideDetailMode = ref(false)
-const historyParentMode = ref(false)
-const guideDetailRows = ref<GuideDetailQuarterRow[]>([])
-const activeGuideDetailTab = ref('')
 const queryFormRef = ref()
 const projectTableRef = ref()
 const planningTableRef = ref()
@@ -558,13 +478,6 @@ const showParentInternalGuidanceUnitPrice = computed(
     currentPlanning.value?.internalGuidanceUnitPrice !== undefined &&
     currentPlanning.value?.internalGuidanceUnitPrice !== null
 )
-const activeGuideDetail = computed(() => {
-  return (
-    guideDetailRows.value.find((item) => item.tabKey === activeGuideDetailTab.value) ||
-    guideDetailRows.value[0]
-  )
-})
-const activeGuideDetailQuarterRows = computed(() => activeGuideDetail.value?.quarterRows || [])
 
 const formatFactorText = (value?: number, digits = 4) => {
   if (value === undefined || value === null) {
@@ -622,14 +535,6 @@ const buildQuarterRows = (
     }))
 }
 
-const resetQuarterDetailState = () => {
-  quarterRows.value = []
-  guideDetailMode.value = false
-  historyParentMode.value = false
-  guideDetailRows.value = []
-  activeGuideDetailTab.value = ''
-}
-
 const getProjectList = async () => {
   loading.value = true
   try {
@@ -640,7 +545,7 @@ const getProjectList = async () => {
       currentProject.value = undefined
       planningList.value = []
       currentPlanning.value = undefined
-      resetQuarterDetailState()
+      quarterRows.value = []
       return
     }
     const targetProjectId = currentProject.value?.id || projectList.value[0].id
@@ -657,7 +562,7 @@ const getPlanningList = async () => {
   if (!currentProject.value?.id) {
     planningList.value = []
     currentPlanning.value = undefined
-    resetQuarterDetailState()
+    quarterRows.value = []
     return
   }
   planningLoading.value = true
@@ -665,7 +570,7 @@ const getPlanningList = async () => {
     planningList.value = await PlanningApi.getProjectPlanningListByProjectId(currentProject.value.id)
     if (!planningList.value.length) {
       currentPlanning.value = undefined
-      resetQuarterDetailState()
+      quarterRows.value = []
       return
     }
     const targetPlanningId = currentPlanning.value?.id || planningList.value[0].id
@@ -679,27 +584,12 @@ const getPlanningList = async () => {
 }
 
 const loadPlanningDetail = async (planningId: number) => {
+  const planning = await PlanningApi.getProjectPlanning(planningId)
+  currentPlanning.value = planning
   quarterLoading.value = true
   try {
-    const detail = await PlanningQuarterApi.getProjectPlanningQuarterPlanningDetail(planningId)
-    currentPlanning.value = detail?.planning
-    guideDetailMode.value = !!detail?.guideDetailMode
-    historyParentMode.value = !!detail?.historyParentMode
-    if (!detail?.planning) {
-      resetQuarterDetailState()
-      return
-    }
-    quarterRows.value = buildQuarterRows(detail.planning, detail.quarters || [])
-    guideDetailRows.value = (detail.guideDetails || []).map((item, index) => ({
-      ...item,
-      tabKey: String(item.id || item.sortNo || index),
-      quarterRows: buildQuarterRows(detail.planning!, item.quarters || [])
-    }))
-    const currentTab = activeGuideDetailTab.value
-    activeGuideDetailTab.value =
-      guideDetailRows.value.find((item) => item.tabKey === currentTab)?.tabKey ||
-      guideDetailRows.value[0]?.tabKey ||
-      ''
+    const quarterList = await PlanningQuarterApi.getProjectPlanningQuarterListByPlanningId(planningId)
+    quarterRows.value = buildQuarterRows(planning, quarterList)
   } finally {
     quarterLoading.value = false
   }
@@ -723,7 +613,7 @@ const handleCurrentProjectChange = async (row?: ProjectApi.ProjectVO) => {
 const handleCurrentPlanningChange = async (row?: PlanningApi.ProjectPlanningVO) => {
   if (!row?.id) {
     currentPlanning.value = undefined
-    resetQuarterDetailState()
+    quarterRows.value = []
     return
   }
   await loadPlanningDetail(row.id)
@@ -740,15 +630,12 @@ const openPlanningOutputForm = () => {
   planningOutputFormRef.value.open(currentPlanning.value.id)
 }
 
-const openQuarterDistributionForm = (guideDetailId?: number) => {
+const openQuarterDistributionForm = () => {
   if (!currentPlanning.value?.id) {
     message.warning('请先选择合约规划')
     return
   }
-  quarterDistributionFormRef.value.open(
-    currentPlanning.value.id,
-    guideDetailMode.value && !historyParentMode.value ? guideDetailId : undefined
-  )
+  quarterDistributionFormRef.value.open(currentPlanning.value.id)
 }
 
 const handlePlanningOutputFormSuccess = async () => {
@@ -759,18 +646,11 @@ const handlePlanningOutputFormSuccess = async () => {
   }
 }
 
-let activatedOnce = false
-
 onMounted(() => {
   getProjectList()
 })
 
 onActivated(() => {
-  // KeepAlive 首次挂载也会触发 onActivated，跳过首轮避免重复请求项目与合约规划列表。
-  if (!activatedOnce) {
-    activatedOnce = true
-    return
-  }
   getProjectList()
 })
 </script>

src/views/tjt/report-budget/index.vue

@@ -111,8 +111,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="8">
+  <SplitPane>
+    <template #left>
       <ContentWrap v-if="currentProject">
         <div class="mb-16px flex items-center justify-between gap-12px">
           <div>
@@ -178,9 +178,9 @@
       <ContentWrap v-else>
         <el-empty description="请选择项目后查看预算导出范围" />
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="16">
+    <template #right>
       <ContentWrap>
         <div class="mb-12px flex items-center justify-between">
           <div class="text-14px font-600">
@@ -189,7 +189,6 @@
           <el-button v-if="currentProject" size="small" @click="getPlanningList">刷新</el-button>
         </div>
         <el-table v-loading="planningLoading" :data="planningList" border>
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column align="center" label="项目任务包" min-width="180" prop="planningContent" />
           <el-table-column align="center" label="归属类型" width="100">
             <template #default="scope">
@@ -215,8 +214,8 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 
   <Dialog v-model="exportDialogVisible" title="导出项目考核产值预算表" width="420">
     <el-form label-width="88px">
@@ -246,6 +245,7 @@ import * as PlanningApi from '@/api/tjt/planning'
 import * as ProjectApi from '@/api/tjt/project'
 import * as ReportApi from '@/api/tjt/report'
 import download from '@/utils/download'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   CONTRACT_SIGN_OPTIONS,
   formatAmountText,

src/views/tjt/report-project-quarter/index.vue

@@ -71,8 +71,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="8">
+  <SplitPane>
+    <template #left>
       <ContentWrap>
         <div class="mb-12px text-14px font-600">
           {{ currentProject?.projectName || '合约规划列表' }}
@@ -84,7 +84,6 @@
           highlight-current-row
           @current-change="handleCurrentPlanningChange"
         >
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column align="center" label="项目任务包" min-width="180" prop="planningContent" />
           <el-table-column align="center" label="归属类型" min-width="110">
             <template #default="scope">
@@ -100,9 +99,9 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="16">
+    <template #right>
       <ContentWrap>
         <div v-loading="quarterLoading" class="min-h-320px">
           <template v-if="currentPlanning && formData">
@@ -219,8 +218,8 @@
           <el-empty v-else-if="!quarterLoading" description="请选择合约规划后查看导出预览" />
         </div>
       </ContentWrap>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 
   <Dialog v-model="exportDialogVisible" :title="exportDialogTitle" width="420">
     <el-form label-width="88px">
@@ -252,6 +251,7 @@ import * as PlanningQuarterApi from '@/api/tjt/planningQuarter'
 import * as ProjectApi from '@/api/tjt/project'
 import * as ReportApi from '@/api/tjt/report'
 import download from '@/utils/download'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   formatAmountText,
   getOwnershipTypeLabel,

src/views/tjt/report-specialty-person/index.vue

@@ -73,8 +73,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="8">
+  <SplitPane>
+    <template #left>
       <ContentWrap>
         <div class="mb-12px text-14px font-600">
           {{ currentProject?.projectName || '合约规划列表' }}
@@ -86,7 +86,6 @@
           highlight-current-row
           @current-change="handleCurrentPlanningChange"
         >
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column align="center" label="项目任务包" min-width="180" prop="planningContent" />
           <el-table-column align="center" label="归属类型" min-width="110">
             <template #default="scope">
@@ -102,9 +101,9 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="16">
+    <template #right>
       <ContentWrap>
         <div v-loading="previewLoading" class="min-h-320px">
           <template v-if="currentPlanning && currentGroup">
@@ -258,8 +257,8 @@
           <el-empty v-else-if="!previewLoading" description="请选择合约规划后查看导出预览" />
         </div>
       </ContentWrap>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 </template>
 
 <script lang="ts" setup>
@@ -267,6 +266,7 @@ import * as PlanningApi from '@/api/tjt/planning'
 import * as ProjectApi from '@/api/tjt/project'
 import * as ReportApi from '@/api/tjt/report'
 import download from '@/utils/download'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   formatAmountText,
   formatPercentText,

src/views/tjt/staff-assignment/index.vue

@@ -73,8 +73,8 @@
     />
   </ContentWrap>
 
-  <el-row :gutter="16">
-    <el-col :span="8">
+  <SplitPane>
+    <template #left>
       <ContentWrap>
         <div class="mb-12px text-14px font-600">
           {{ currentProject?.projectName || '合约规划列表' }}
@@ -86,7 +86,6 @@
           highlight-current-row
           @current-change="handleCurrentPlanningChange"
         >
-          <el-table-column align="center" label="序号" type="index" width="70" />
           <el-table-column align="center" label="项目任务包" min-width="180" prop="planningContent" />
           <el-table-column align="center" label="归属类型" min-width="110">
             <template #default="scope">
@@ -102,9 +101,9 @@
           <el-table-column align="center" label="排序" prop="sortNo" width="80" />
         </el-table>
       </ContentWrap>
-    </el-col>
+    </template>
 
-    <el-col :span="16">
+    <template #right>
       <ContentWrap>
         <div v-loading="roleLoading" class="min-h-320px">
           <template v-if="currentPlanning && currentGroup">
@@ -179,8 +178,8 @@
           <el-empty v-else-if="!roleLoading" description="请选择合约规划后查看人员分配" />
         </div>
       </ContentWrap>
-    </el-col>
-  </el-row>
+    </template>
+  </SplitPane>
 
   <Dialog v-model="dialogVisible" title="编辑专业人员角色分配" width="1180">
     <template v-if="currentEditGroup">
@@ -320,6 +319,7 @@ import * as EmployeeApi from '@/api/tjt/employee'
 import * as ProjectApi from '@/api/tjt/project'
 import * as PlanningApi from '@/api/tjt/planning'
 import * as SpecialtyRoleSplitApi from '@/api/tjt/specialtyRoleSplit'
+import SplitPane from '@/views/tjt/shared/SplitPane.vue'
 import {
   formatAmountText,
   formatPercentText,